<!DOCTYPE html>
<html lang="{$SelCurrLanguage}" dir="{$languageDirection}">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>{$language.lblFindyourNearestShowroom}</title>
    <meta name="viewport" content="width=device-width"> 
    <link href="{$view_styles}/cms.css" rel="stylesheet" type="text/css" media="screen" />
    {include file='CommonJavaScript.tpl'} 
    {include file='CommonStyles.tpl'} 
    {form->rootpath_script} 
    {form->basepath_script}
    <script>
	fbq('track', 'Contact');
	</script>
</head>
<body ng-controller="SearchCtrl" class="{$languageDirection}">
    <!-- Begin : Outer Pane -->
    <div id="main">
        <!-- Begin : Header Pane-->
        {include file='CommonTop.tpl'}
        <!-- End : Header -->
        <!-- Begin : Content Pane -->
        <div id="content-wrapper" ng-show="!query">
            <nav class="breadcrumb-block" aria-label="breadcrumb">
                <div class="container">
                    <ol class="breadcrumb font-weight-bold font-small mb-0 px-0 py-3">
                        <li class="breadcrumb-item">{html->anchor href="/" caption="{$language.lblHome}"}</li>
                        <li class="breadcrumb-item active font-weight-bold">{$language.lblFindyourNearestShowroom}</li>
                    </ol>
                </div>
            </nav> 

          <div class="nearestshowroom-block">
            <div class="row m-0">
                <div class="col-lg-4 col-md-4 col-sm-12 col-12 p-0">
                    <h4 class="text-dark-grey font-weight-bold px-4 py-4 border-bottom m-0">{$language.lblReachoutdirectly}</h4>
                      {if $listShowRooms|default:array()|count>0}
                            <ul class="nearest-shoroom-listing list-unstyled">
                                {foreach from=$listShowRooms|default:array() item="showroom"}
                                        <li class="px-4 py-3 font-family-secondary font-semibold border-bottom">
                                            <a class="d-block font-weight-light shname" rel="{$showroom['showroomImg']|default:''}" style="cursor:pointer;"><h5 class="d-block font-weight-bold">{$showroom.name}</h5>
                                         {$showroom.address}</a>
                                         <span class="phone d-block my-2" style="direction:ltr"> <i class="icon-phone-receiver text-muted-light mr-2"></i>{$showroom.phone}</span>
                                         <span class="mail d-block"><i class="icon-close-envelope text-muted-light mr-2"></i>{$showroom.email}</span>
                                         <a class="align-items-baseline d-inline-flex mt-2" target="_blank" href="{$showroom.mapLink}"><i class="icon-placeholder">&nbsp;</i>{$language.lblViewOnMap}</a>
                                        </li>
                               {/foreach}                                                     
                           </ul>
                      {/if}
                </div>
                <div class="col-lg-8 col-md-8 col-sm-12 col-12 p-0 p-0"><div class="nearest-map-block">{if $showroomImg|default:'' neq ''}<img src="{$view_public_path}/uploads/showroom/{$showroomImg}" class="img-fluid h-100 nearest-mapimg">{/if}</div></div>
            </div>
        </div>

        </div>
        
        <!-- End : Content Pane -->
        <!-- Begin : Footer	Pane -->
        {include file='CommonBottom.tpl'}
        <!-- End : Footer Pane -->
    </div>
    <!-- End : Outer Pane -->
    {include file='CommonJavaScriptBottom.tpl'} 
    {html->script_group_start name="{$compiled_js_path}/specialoffers.js"} 
    {html->script src="{$common_frontend_js}/offerview.page.js"}   
    {html->script_group_end} 
    {form->validate_script form="formSubscription"} {html->messages_script id="common_message"}
    <script type="text/javascript">
        var publicpathimg = '{$view_public_path}/uploads/showroom/';
        $(".nearest-shoroom-listing").mCustomScrollbar({
         axis:"y",       
});
     $(document).on('click', '.shname', function () {
         
         $(".nearest-mapimg").attr("src",publicpathimg+$(this).attr('rel'));
        
    });
    </script>
</body>

</html>
