<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
		<meta name="keywords" content="Djoedes by enambelasapp.my.id">
		<meta name="author" content="Suroto">
		<meta name="description" content="Djoedes by enambelasapp.my.id">
		<meta name="viewport" content="width=device-width initial-scale=1.0 maximum-scale=1.0 user-scalable=yes" />

		<title>Menu</title>
		<link href="<?php echo base_url().'assets/img/logo.png'?>" rel="shortcut icon" type="image/x-icon">

		<link type="text/css" rel="stylesheet" href="<?php echo base_url().'mobile/css/jquery.mmenu.all.css'?>" />
		<link type="text/css" rel="stylesheet" href="<?php echo base_url().'mobile/css/style.css'?>" />
		<link type="text/css" rel="stylesheet" href="<?php echo base_url().'mobile/css/jquery.mobile-1.0rc2.min.css'?>" />
		<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">

		<link rel="apple-touch-icon" href="<?php echo base_url().'mobile/img/apple-touch-icon.png'?>">
		<link rel="apple-touch-startup-image" href="<?php echo base_url().'mobile/img/apple-touch-startup-image.png'?>">
		
		<script type="text/javascript" src="<?php echo base_url().'mobile/js/jquery.min.js'?>"></script>
		<script type="text/javascript" src="<?php echo base_url().'mobile/js/jquery.mmenu.min.all.js'?>"></script>
		<script type="text/javascript" src="<?php echo base_url().'mobile/js/jquery.easy-pie-chart.js'?>"></script>
		<script type="text/javascript" src="<?php echo base_url().'mobile/js/o-script.js'?>"></script>
		<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
		<script type="text/javascript" src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"></script>
		<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css'>
        <link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.2/animate.min.css'>
        <link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.min.css'>
	
	
	</head>
	
	<body >
	    
		<div id="page">
			<div id="header">
				<div class="header-content">
					<a href="#menu" class="p-link-home"><i class="fa fa-bars"></i></a>
					<a href="javascript:history.back();" class="p-link-back"><i class="fa fa-arrow-left"></i></a>
				</div>
			</div>
			<div class="bannerPane banner-bg">
				<div class="overlay"></div>
				<div class="s-banner-content">
					<?php echo $judul;?>
				</div>
			</div>	
			
			<div id="gradient2">
		       <div  style="background-color: red; border:1px white;width:95%px;height:65px;overflow-x:scroll;">
		            <table   >	
			
				<tr>
				    <td  class='buttons' style="height:35px;">
						<form  class="form-inline" action="<?php echo base_url('mobile/menu/makanan/') ?>" method="post">
							<input type='hidden' name="jenis"  id="jenis" value="J01">
							<button class="btn-hover color-2" style="width:100px;height:30px;" type="submit"><font color='black' size='2' ><b>Mie Ori</b></font></button>
						</form>
				</td>
				<td >
						<form  action="<?php echo base_url('mobile/menu/makanana/') ?>" method="post">
							<input type='hidden' name="jenis"  id="jenis" value="J08">
							<button class="btn-hover color-2" style="width:100px;height:30px;" type="submit"><font color='black' size='2' ><b>Mie Ori Topping</b></font></button>
						</form>
				</td>
				<td>
						<form  action="<?php echo base_url('mobile/menu/makanan1/') ?>" method="post">
							<input type='hidden' name="jenis"  id="jenis" value="J07" >
							<button class="btn-hover color-2" style="width:100px;height:30px;" type="submit"><font color='black' size='2' ><b>Gokil</b></font></button>
							</form>
					</td>
					<td >
						<form  action="<?php echo base_url('mobile/menu/makanan1a/') ?>" method="post">
							<input type='hidden' name="jenis"  id="jenis" value="J09" >
							<button class="btn-hover color-2" style="width:100px;height:30px;" type="submit"><font color='black' size='2' ><b>Gokil+Topping</b></font></button>
							</form>
					</td>
				<td >
						<form  action="<?php echo base_url('mobile/menu/makanan3') ?>" method="post">
							<input type='hidden' name="jenis"  id="jenis" value="J02">
							<button class="btn-hover color-2" style="width:100px;height:30px;" type="submit"><font color='black' size='2' ><b>Snack</b></font></button>
						</form>
				</td>
				<td >
						<form  action="<?php echo base_url('mobile/menu/makanan2') ?>" method="post">
							<input type='hidden' name="jenis"  id="jenis" value="J03">
							<button class="btn-hover color-2" style="width:100px;height:30px;" type="submit"><font color='black' size='2' ><b>Topping</b></font></button>
						</form>
					</td>
				<td >
						<form action="<?php echo base_url('mobile/menu/minuman') ?>" method="post">
							<input type='hidden' name="jenis"  id="jenis" value="J04">
							<button class="btn-hover color-2" style="width:100px;height:30px;" type="submit"><font color='black' size='2' ><b>Minuman</b></font></button>
						</form>
					</td>	
				</tr>
				</table>
				
		    </div>
	     
		</div>
		
		
		
		
		
			<div style="background-color: red; overflow:auto; width:100%px; height:510px; padding:5px; ">	
			<div id="content">
				<?php 
				foreach ($data->result_array() as $a) {
					$id=$a['menu_id'];
					$nama=$a['menu_nama'];	
					$deskripsi=$a['menu_deskripsi'];
					$harga_lama=$a['menu_harga_lama'];
					$harga_baru=$a['menu_harga_baru'];
					$harlam=$a['harga_lama'];
					$harbar=$a['harga_baru'];
					$like=$a['menu_likes'];
					$kat_id=$a['menu_kategori_id'];
					$kat_nama=$a['menu_kategori_nama'];
					$gambar=$a['menu_gambar'];

				?>
				<table>
				<article style="width:100%px;height:130px;">
				    
					<a href="<?php echo base_url().'mobile/menu/detail_menu/'.$id;?>">
						<div  class="article-img-pane">
							<img align='left' src="<?php echo base_url().'assets/images/'.$gambar;?>" />
						</div>
						<div >
						<h2 align='left'><?php echo $nama;?></h2>
						</div>
						  <div class="flexbox">
                                <span>
                                  <center>
                                    <button class="btn btn-xs btn-square btn-gold btn-minus-list" type="button" style="padding: 3px 5px 5px;border-radius: 6px;" data-productid="20000186" data-soldout="0"><i class="fa fa-minus"></i></button>
                                  </center>
                                </span>
                                <span>
                                   <center><h5 class="text-center fw-500 total-cart-list">0</h5></center>
                                   <input type="hidden" class="totalCartList" value="0">
                                </span>
                                <span>
                                    <center>
                                      <button class="btn btn-xs btn-square btn-gold btn-plus-list" type="button" style="padding: 3px 5px 5px;border-radius: 6px;" data-productid="20000186" data-soldout="0" ><i class="fa fa-plus"></i></button>
                                    </center>
                                </span>
                                <span style="width:40%">
                                      <button class="btn btn-xs btn-square btn-gold link-product pull-right" type="button" style="padding: 3px 5px 5px;border-radius: 6px;" data-productid="20000186"><i class="fa fa-pencil"></i></button>
                                      <!-- <button class="btn btn-xs btn-round link-product" type="button" style="padding: 3px 20px 5px;" data-productid="20000186" ><i class="ti-pencil-alt"></i> Catatan</button> -->
                                </span>
                            </div>
						<div class="prod-pricePane ">
							<?php if(empty($harga_lama)):?>
								<span class="current-price pull-right"><?php echo $harbar.'K';?></span>
							<?php else:?>
								<span class="current-price pull-right"><?php echo $harbar.'K';?></span>
								
							<?php endif;?>
						</div>
					</a>
					<div class="a-meta" align='center'>
						<span><i class="fa fa-thumbs-up"></i> <?php echo $like;?></span> 
						
						<div class="products-ratings">
							<i class="fa fa-star"></i>
							<i class="fa fa-star"></i>
							<i class="fa fa-star"></i>
							<i class="fa fa-star"></i>
							<i class="fa fa-star-half-empty"></i>
						</div>
					</div>
					
				</article>
				
				 <?php }?>

			</div>
			</div>
		
			
			<!-- Menu navigation -->
			<nav id="menu" >
				<ul>
					<li class="Selected">
						<a href="#close">
							<i class="fa fa-times-circle"></i>
						</a>
					</li>
					<li>
						<a href="<?php echo base_url().'mobile/home'?>">
							<i class="fa fa-home"></i>Home
						</a>
					</li>
					<li>
						<a href="<?php echo base_url().'mobile/menu/cart'?>">
							<i class="fa fa-shopping-cart"></i>Keranjang Belanja (<?=$this->cart->total_items();?>)
						</a>
					</li>
				
					
					<li>
						<a href="<?php echo base_url().'mobile/tracker'?>">
							<i class="fa fa-crosshairs"></i>Tracker
						</a>
					</li>
					<li>
						<a href="<?php echo base_url().'mobile/member/register'?>">
							<i class="fa fa-user"></i>Mendaftar
						</a>
					</li>
				
					<?php if($this->session->userdata('online') == TRUE):?>
					<li>
						<a href="<?php echo base_url().'mobile/konfirmasi'?>">
							<i class="fa fa-exchange"></i>Konfirmasi
						</a>
					</li>
					
					<li>
						<a href="<?php echo base_url().'mobile/myfood'?>">
							<i class="fa fa-cutlery"></i>My Food
						</a>
					</li>

					<li>
						<a href="<?php echo base_url().'mobile/member/logout'?>">
							<i class="fa fa-sign-out"></i>Logout
						</a>
					</li>
					<?php else:?>
					<li>
						<a href="<?php echo base_url().'mobile/member'?>">
							<i class="fa fa-sign-in"></i>Login
						</a>
					</li>
					<?php endif;?>
				</ul>
					
			</nav>
			
		</div>
->
<script type="text/javascript">
  var isBusy = false;
  $(document).ready(function(){
    document.body.scrollTop = 0;
    document.documentElement.scrollTop = 0;
    if(0 > 0){
        $("#button-show-cart").show();
    }else{
        $("#button-show-cart").css("display", "none");
    }
    $('#tabAll').on('click',function(e){
      e.preventDefault();
      $('#tabAll').parent().addClass('active');  
      $('.tab-pane').addClass('active in show');  
      $('[data-toggle="tab"]').parent().removeClass('active');
    });

    // $('.nav-link:not(.active):not(#tabAll)').click(function(e){
    $('#scroller .nav-link:not(#tabAll)').click(function(e){
      $('.tab-pane').removeClass('active in show');
      $('.btn-next').addClass('d-none');
      return true;
    });

    $('#scroller #tabAll').click(function(e){
      $('.btn-next').removeClass('d-none');
    });

    if ($('#scroller .nav-link.active').length == 0) $('#tabAll').click();

    $('#scroller .nav-link').click(function(e){
      $($(this).attr('href')).addClass('active in show');
    });

    $('#scroller .nav-link').click(function(){
      var lastChar = location.href.substr(location.href.length - 1);
      var locationHref = location.href;
      var lastSegmentLink = locationHref.substring(locationHref.lastIndexOf('/') + 1);
      var newlink = '';
      var href = $(this).attr('href').substring($(this).attr('href').lastIndexOf("-") + 1);

      if (lastSegmentLink == 'view' && lastChar != '/'){
        newlink = locationHref + '/' + href;
      }else if (lastSegmentLink == 'view' && lastChar == '/'){
        newlink = locationHref + href;
      }else if (lastSegmentLink == ''){
        newlink = locationHref + href;
      }else if ($(this).attr('href') == '#all'){
        newlink = locationHref.replace(lastSegmentLink, '');
      }else{
        newlink = locationHref.replace(lastSegmentLink, href);
      }
      
      history.replaceState({}, $('head title').html(), newlink);
      $('')
    });

    function initBtn(){
      $('.tab-pane .btn-next').off('click').click(function(){
        var catId = $(this).data('catid');
        var page = $(this).data('nextpage');
        loadProduct(catId, page, function(){
          $('.tab-pane .btn-next[data-catid="'+catId+'"]').removeClass('d-none');
        });
      });

      $('.link-product').off('click').click(function(e){
        showLoader();
        var epId = $(this).data('productid');
        // console.log(epId);
        $.ajax({
          type : 'post',
          url : 'https://eorder.solariaresto.co.id/product/detail/'+epId+'?ascomponent=1',
          dataType : 'html',
          success: function(contentHtml){
            $('#modal-detail-product .modal-dialog').html(contentHtml).promise().then(function(){
              hideLoader();
              $('#modal-detail-product').modal('show');
            });
          }, 
          error: function(){
            hideLoader();
          }
        });
      });

      //submit plus minus button
      function submitProduct(epId, total, callbackSuccess, callbackError){
        showLoader();
        $.ajax({
          type: 'post',
          url: 'https://eorder.solariaresto.co.id/cart/add',
          dataType: 'json',
          data: {
            totalCart : total,
            modifier : [],
            epId : epId,
            freetextmodifier : ''
          },
          success: function(r){
            if (r && r.status){
              $('#total-item-cart').html(r.total_item);
              $('#total-item-basket').html(r.total_item);
                if(r.total_item > 0){
                    $("#button-show-cart").show();
                }else{
                    $("#button-show-cart").css("display", "none");
                }
            }
            hideLoader();
            if (typeof callbackSuccess == 'function') callbackSuccess(r);
          },
          error: function(r){
            hideLoader();
            app.toast('Terjadi kesalahan, coba ulangi kembali');
            if (typeof callbackError == 'function') callbackError();
          }
        });
      }

      $('.btn-plus-list:not([data-soldout="1"])').off('click').click(function(e){
        e.preventDefault();
        var $this = $(this);
        var epId = $this.data('productid');
        $('.btn-plus-list, .btn-minus-list').attr('disabled', 'disabled');
        submitProduct(epId, '+1', function(r){
          $('.btn-plus-list:not([data-soldout="1"]), .btn-minus-list').removeAttr('disabled');
          $this.closest('.flexbox').find('.totalCartList').val(r.total_item_list);
          $this.closest('.flexbox').find('.total-cart-list').html(r.total_item_list);
        });
      });

      $('.btn-minus-list').off('click').click(function(e){
        e.preventDefault();
        var $this = $(this);
        var epId = $this.data('productid');
        $('.btn-plus-list, .btn-minus-list').attr('disabled', 'disabled');
        submitProduct(epId, '-1', function(r){
          $('.btn-plus-list:not([data-soldout="1"]), .btn-minus-list').removeAttr('disabled');
          $this.closest('.flexbox').find('.totalCartList').val(r.total_item_list);
          $this.closest('.flexbox').find('.total-cart-list').html(r.total_item_list);
        });
      });

    }

    initBtn();    

    function loadProduct(catId, page, callback){
      if (isBusy) return true;

      isBusy = true;
      showLoader();
      $.ajax({
        type : 'post',
        url : 'https://eorder.solariaresto.co.id/product/next?ascomponent=1',
        dataType : 'html',
        data : {
          catId : catId,
          page : page
        },
        success : function(contentHtml){
          $('.tab-pane.active .btn-next[data-catid="'+catId+'"]').replaceWith(contentHtml).promise().then(function(){
            hideLoader();
            isBusy = false;
            initBtn();
            if (typeof callback == 'function') callback();
          });
        },
        error : function(e){
          hideLoader();
          isBusy = false;
        }
      });
    }

    // $(window).endlessScroll({
    //   // pagesToKeep: 10,
    //   inflowPixels: 10,
    //   fireOnce: false,
    //   // fireDelay: false,
    //   fireDelay: 2000,
    //   content: function(i, p, d) {
    //     if (d == 'next' && $('#tabAll.active').length == 0 && $('.tab-pane.active .btn-next').length && isBusy == false){
    //       // console.log(i, p, d);
    //       var catId = $('.tab-pane.active .btn-next').data('catid');
    //       var page = $('.tab-pane.active .btn-next').data('nextpage');
    //       loadProduct(catId, page);

    //     }
    //   },
    //   // ceaseFire: function(fireSequence, pageSequence, scrollDirection){
    //   //   if (fireSequence >= 10) {
    //   //     return true;
    //   //   }
    //   // }
    // });

    //Infinite scroll
    $(window).off('scroll').on("scroll", function() {
      var scrollHeight = $(document).height();
      var scrollPos = $(window).height() + $(window).scrollTop();
      // console.log(scrollHeight+' - '+scrollPos+' = '+(scrollHeight - scrollPos));
      if ((scrollHeight - scrollPos) <= 100 && $('#tabAll.active').length == 0 && $('.tab-pane.active .btn-next').length && isBusy == false){
        var catId = $('.tab-pane.active .btn-next').data('catid');
        var page = $('.tab-pane.active .btn-next').data('nextpage');
        loadProduct(catId, page);
      }
    });

    //navigation btn
    $('#btn-home').addClass('d-none');
    $('.text-search').removeClass('d-none');
    $('#btn-back').removeClass('d-none').off('click').attr('href', 'https://eorder.solariaresto.co.id/home');

    //auto scroll to active tab
    if ($('#scroller .nav-link.active').position() !== undefined){
      $('#scroller').animate({
        scrollLeft : 0
      }, {
        complete: function() {
          $('#scroller').animate({
            scrollLeft : $('#tabAll.active').length == 0 ? $('#scroller .nav-link.active').position().left - 100 : $('#scroller .nav-link.active').position().left - 15
          });
        }
      });
    }

  });
</script>   

  <script src="https://eorder.solariaresto.co.id/assets/js/core.min.js"></script>
        <script src="https://eorder.solariaresto.co.id/assets/js/app.min.js"></script>
        <script src="https://eorder.solariaresto.co.id/assets/js/script.min.js"></script>
        <script type="text/javascript" src="https://eorder.solariaresto.co.id/assets/plugin/endless-scroll/jquery.endless-scroll.js"></script>
		<script type="text/javascript">
		initAjaxClick();
        

      function beforeAjaxLoadInit(){
        // remove all event delete
        $(document).unbind('click', 'a.btn-delete');
        $(document).off('click', 'a.btn-delete');
      }

      function showLoader(){
        $('#ajax-preloader').fadeIn('slow');
        $('.modal').modal('hide');
      }

      function hideLoader(){
        $('#ajax-preloader').fadeOut('fast');
      }

      function clickAjax(selector, type){
        var $this = selector;
        var classes = $this.attr('class').split(' ');
        var destContainer = 'ajax-page-container';
        var $destContainer = $('#ajax-page-container');
        var link = $this.attr('href');
        var originalLink = $this.attr('href');
        $this.unbind('click');

        if ($this.attr('href').indexOf('ascomponent') < 0 && $this.attr('href').indexOf('?') < 0){
            link += '?ascomponent=1';
        }else
        if ($this.attr('href').indexOf('ascomponent') < 0){
            link += '&ascomponent=1';
        }

        var _html = '<div id=\"'+destContainer+'\">\n';

        // show preloader
        showLoader();

        $.ajax({
            url : link,
            type : 'GET',
            dataType : type,
            success : function(htmlResponse){
                // hide preloader
                hideLoader();
                beforeAjaxLoadInit();

                if (type != 'json' && htmlResponse.indexOf('{') == 0){
                    htmlResponse = JSON.parse(htmlResponse);
                    $.get(htmlResponse.url, {}, function(resp){
                        _html += resp+'\n';
                        _html += '</div>';
                        $destContainer.replaceWith(_html).promise().done(function(){
                            var _url = htmlResponse.url.replace('?ascomponent=1', '');
                            _url = _url.replace('&ascomponent=1', '');
                            history.pushState({}, $('head title').html(), _url);
                        });
                    });
                }else
                if (type == 'json' && htmlResponse.url){
                    $.get(htmlResponse.url, {}, function(resp){
                        _html += resp+'\n';
                        _html += '</div>';
                        $destContainer.replaceWith(_html).promise().done(function(){});
                    });
                }else{
                    _html += htmlResponse+'\n';
                    _html += '</div>';
                    $destContainer.replaceWith(_html).promise().done(function(){
                        // $('html, body').animate({
                        //     scrollTop: $(destContainer).offset().top - 100
                        // }, 0);
                        // init_altair();
                    });
                    history.pushState({}, $('head title').html(), originalLink);
                }
            },
            error : function(err, htmlResponse){
                // hide preloader
                hideLoader();
                beforeAjaxLoadInit();
                // $(destContainer).html(htmlResponse);
                _html += htmlResponse+'\n';
                _html += '</div>';
                $destContainer.replaceWith(_html).promise().done(function(){
                    // $('html, body').animate({
                    //     scrollTop: $(destContainer).offset().top - 100
                    // }, 0);
                    // init_altair();
                });
                history.pushState({}, $('head title').html(), originalLink);
            }
        });

        $(".dropdown").removeClass('show');
        $(".dropdown-menu").removeClass('show');
        $(".topbar-btn").attr("aria-expanded",  "false"); 
      }

      function submitAjax(selector){
        var $this = selector;
        var classes = $this.attr('class').split(' ');
        var destContainer = 'ajax-page-container';
        var $destContainer = $('#ajax-page-container');
        var link = $this.attr('action');
        var originalLink = $this.attr('action');

        if ($this.attr('action').indexOf('ascomponent') < 0 && $this.attr('action').indexOf('?') < 0){
            link += '?ascomponent=1';
        }else
        if ($this.attr('action').indexOf('ascomponent') < 0){
            link += '&ascomponent=1';
        }

        var _html = '<div id=\"'+destContainer+'\">\n';

        // check validator
        if ($this.find('.is-invalid').length > 0){
            return false;
        }
        // show preloader
        showLoader();
        $.ajax({
            url : link,
            type : $this.attr('method'),
            data : $this.serialize(),
            dataType : 'html',
            success : function(response){
                // hide preloader
                hideLoader();
                // remove all event delete
                beforeAjaxLoadInit();

                if (response.indexOf('{') == 0){
                    var jsonResponse = JSON.parse(response);
                    if (jsonResponse.exec) eval(jsonResponse.exec);

                    if (jsonResponse.url){
                        $.get(jsonResponse.url, {}, function(resp){
                            _html += resp+'\n';
                            _html += '</div>';
                            $destContainer.replaceWith(_html).promise().done(function(){
                                // $('html, body').animate({
                                //     scrollTop: $(destContainer).offset().top - 100
                                // }, 0);
                            });
                            var _url = jsonResponse.url.replace('?ascomponent=1', '');
                            history.pushState({}, $('head title').html(), _url);
                        });
                    }
                }else{
                    _html += response+'\n';
                    _html += '</div>';
                    $destContainer.replaceWith(_html).promise().done(function(){
                        // $('html, body').animate({
                        //     scrollTop: $destContainer.offset().top - 100
                        // }, 0);
                    });
                }
            },
            error : function(err, htmlResponse){
                // hide preloader
                hideLoader();
                // altair_helpers.content_preloader_hide();
                $destContainer.html(htmlResponse);
            }
        });
      }

      function submitAjaxFormUpload(selector){
        var $this = selector;
        var classes = $this.attr('class').split(' ');
        var destContainer = 'ajax-page-container';
        var $destContainer = $('#ajax-page-container');
        var link = $this.attr('action');
        var originalLink = $this.attr('action');
        var data = new FormData($this[0]);
        /*append file*/
        $this.find('[type=file]').each((i, v)=>{
            if ($(v)[0].hasOwnProperty('file')){
                data.append($(v).attr('name'), $(v)[0].file);
            }
        });

        if ($this.attr('action').indexOf('ascomponent') < 0 && $this.attr('action').indexOf('?') < 0){
            link += '?ascomponent=1';
        }else
        if ($this.attr('action').indexOf('ascomponent') < 0){
            link += '&ascomponent=1';
        }

        var _html = '<div id=\"'+destContainer+'\">\n';

        // check validator
        if ($this.find('.is-invalid').length > 0){
            return false;
        }
        // show preloader
        showLoader();
        $.ajax({
            url: link,
            data: data,
            cache: false,
            contentType: false,
            processData: false,
            method: $this.attr('method'),
            type: $this.attr('method'), // For jQuery < 1.9
            success : function(response){
                // hide preloader
                hideLoader();
                // remove all event delete
                beforeAjaxLoadInit();

                if (response.indexOf('{') == 0){
                    var jsonResponse = JSON.parse(response);
                    if (jsonResponse.exec) eval(jsonResponse.exec);

                    if (jsonResponse.url){
                        $.get(jsonResponse.url, {}, function(resp){
                            _html += resp+'\n';
                            _html += '</div>';
                            $destContainer.replaceWith(_html).promise().done(function(){
                                // $('html, body').animate({
                                //     scrollTop: $(destContainer).offset().top - 100
                                // }, 0);
                            });
                            var _url = jsonResponse.url.replace('?ascomponent=1', '');
                            history.pushState({}, $('head title').html(), _url);
                        });
                    }
                }else{
                    _html += response+'\n';
                    _html += '</div>';
                    $destContainer.replaceWith(_html).promise().done(function(){
                        // $('html, body').animate({
                        //     scrollTop: $destContainer.offset().top - 100
                        // }, 0);
                    });
                }
            },
            error : function(err, htmlResponse){
                // hide preloader
                hideLoader();
                // altair_helpers.content_preloader_hide();
                $destContainer.html(htmlResponse);
            }
        });
      }

      function initAjaxClick(){
        $('a.ajax').off('click');
        // $('form.ajax:not([enctype="multipart/form-data"])').off('submit');
        $('form.ajax').off('submit');

        $(document).on('click', 'a.ajax:not(.btn-delete)', function(e){
            // console.log('a clicked');
            e.preventDefault();
            e.stopImmediatePropagation();

            var $this = $(this);

            clickAjax($this, 'html');
            return false;
        });

        // $(document).on('submit','form.ajax:not([enctype="multipart/form-data"])', function(e){
        $(document).on('submit','form.ajax', function(e){
            // console.log('form submitted');
            e.preventDefault();
            e.stopImmediatePropagation();
            var $this = $(this);
            var functions = [];
            if ($(this).attr('onsubmit') && $(this).attr('onsubmit') != ''){
                functions = $(this).attr('onsubmit').split(';');
            }
            if (functions.length){
                for (var i = 0; i < functions.length; i++) {
                    if (functions[i] == ''){
                        continue;
                    }
                    functions[i] = functions[i].replace('return ', '');
                    eval('var f = '+functions[i]+';');
                    if (f === false){
                        break;
                    }
                }
                if (f !== false){
                    if ($('.md-fab-wrapper').length){
                        $('.md-fab-wrapper').remove();
                    }
                    if ($this.attr('enctype') && $this.attr('enctype').toLowerCase() == "multipart/form-data"){
                        submitAjaxFormUpload($this);
                    }else{
                        submitAjax($this);
                    }
                }
            }else{
                if ($('.md-fab-wrapper').length){
                    $('.md-fab-wrapper').remove();
                }
                if ($this.attr('enctype') && $this.attr('enctype').toLowerCase() == "multipart/form-data"){
                    submitAjaxFormUpload($this);
                }else{
                    submitAjax($this);
                }
            }

            return false;
        });
      }

      window.onpopstate = function(event) {
        // console.log('history popped');
        // console.log(event.state);
        var link = document.location.href.replace(/\&_uniqid.*/,'');
        var originalLink = document.location.href;

        if (link.indexOf('ascomponent') < 0 && link.indexOf('?') < 0){
            link += '?ascomponent=1';
        }else
        if (link.indexOf('ascomponent') < 0){
            link += '&ascomponent=1';
        }

        if (originalLink.indexOf('#') !== (originalLink.length - 1)){
            // show preloader
            showLoader();
            $.ajax({
                url : link,
                type : 'GET',
                dataType : 'html',
                success : function(htmlResponse){
                    // hide preloader
                    hideLoader();
                    // altair_helpers.content_preloader_hide();
                    // remove all event delete
                    // beforeAjaxLoadInit();

                    var _html = '<div id="ajax-page-container">\n';
                        _html += htmlResponse+'\n';
                        _html += '</div>\n';
                    $('#ajax-page-container').replaceWith(_html).promise().done(function(){});
                },
                error : function(err, htmlResponse){
                    // hide preloader
                    hideLoader();
                    // altair_helpers.content_preloader_hide();

                    // remove all event delete
                    // beforeAjaxLoadInit();

                    var _html = '<div id="ajax-page-container">\n';
                        _html += htmlResponse+'\n';
                        _html += '</div>\n';
                    $('#ajax-page-container').replaceWith(_html).promise().done(function(){});
                }
            });
        }else{
            return false;
        }
      };

        window.onhashchange = function(event){
            var originalLink = document.location.href;
            if (originalLink.indexOf('#') === (originalLink.length - 1)){
                history.replaceState({}, $('head title').html(), originalLink.substring(0, (originalLink.length - 1)));
            }
        };
		</script>
        <script type="text/javascript">
            $(document).trigger('ready');
        </script>
        <script type="text/javascript" src="https://eorder.solariaresto.co.id/assets/vendor/easyautocomplete/dist/jquery.easy-autocomplete.js"></script>
        <script type="text/javascript">
            function showProduct(epId){
                showLoader();
                // console.log(epId);
                var backto = location.href.indexOf('/cart/view') >= 0 ? '&backto=cart' : '';
                $.ajax({
                    type : 'post',
                    url : 'https://eorder.solariaresto.co.id/product/detail/'+epId+'?ascomponent=1'+backto,
                    dataType : 'html',
                    success: function(contentHtml){
                      $('#modal-detail-product .modal-dialog').html(contentHtml).promise().then(function(){
                        hideLoader();
                        $('#modal-detail-product').modal('show');
                        $('.non-searching').removeClass('d-none');
                      });
                    }, 
                    error: function(){
                      hideLoader();
                      $('.non-searching').removeClass('d-none');
                    }
                });
            }
            $(document).ready(function(){
                $("input[name=search]").off();
                var options = {
                  url: function(phrase) {
                      return "https://eorder.solariaresto.co.id/product/search/";
                  },
                  getValue: "name",
                  adjustWidth: false,
                  ajaxSettings: {
                    dataType: "json",
                    method: "POST",
                    data: {
                      dataType: "json"
                    }
                  },
                  template: {
                    type: "custom",
                    method: function(value, item) {
                        return '<label>'+item.epName+'</label> <br>'+item.eppgPrice;
                    }
                  },
                  list: {
                    onClickEvent: function() {
                      var value = $("input[name=search]").getSelectedItemData();
                      if (value.epId != '') showProduct(value.epId);
                    },
                    onKeyEnterEvent: function(){
                      return false;
                    }
                  },
                  preparePostData: function(data, inputPhrase) {
                    data.phrase = $("#search-autocomplete").val();
                    return data;
                  },
                  requestDelay: 400
                };
                $("#search-autocomplete").easyAutocomplete(options).focus(function(){
                    $('.non-searching').addClass('d-none');
                }).blur(function(){
                    if (!$('#search-autocomplete').closest('.easy-autocomplete').find('.easy-autocomplete-container > ul[style*="display: block"]').length){
                        $('.non-searching').removeClass('d-none');
                    }                    
                });
            });
        </script>

<style>
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.buttons {
    margin: 10%;
    text-align: center;
}

.btn-hover {
    width: 80px;
    font-size: 16px;
    font-weight: 600;
    color: #fff;
    cursor: pointer;
    margin: 5px;
    height: 55px;
    text-align:center;
    border: none;
    background-size: 300% 100%;

    border-radius: 25px;
    moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

.btn-hover:hover {
    background-position: 100% 0;
    moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

.btn-hover:focus {
    outline: none;
}

.btn-hover.color-1 {
    background-image: linear-gradient(to right, #25aae1, #40e495, #30dd8a, #2bb673);
    box-shadow: 0 4px 15px 0 rgba(49, 196, 190, 0.75);
}
.btn-hover.color-2 {
    background-image: linear-gradient(to right, #f5ce62, #e43603, #fa7199, #e85a19);
    box-shadow: 0 4px 15px 0 rgba(229, 66, 10, 0.75);
}
.btn-hover.color-3 {
    background-image: linear-gradient(to right, #667eea, #764ba2, #6B8DD6, #8E37D7);
    box-shadow: 0 4px 15px 0 rgba(116, 79, 168, 0.75);
}
.btn-hover.color-4 {
    background-image: linear-gradient(to right, #fc6076, #ff9a44, #ef9d43, #e75516);
    box-shadow: 0 4px 15px 0 rgba(252, 104, 110, 0.75);
}
.btn-hover.color-5 {
    background-image: linear-gradient(to right, #0ba360, #3cba92, #30dd8a, #2bb673);
    box-shadow: 0 4px 15px 0 rgba(23, 168, 108, 0.75);
}
.btn-hover.color-6 {
    background-image: linear-gradient(to right, #009245, #FCEE21, #00A8C5, #D9E021);
    box-shadow: 0 4px 15px 0 rgba(83, 176, 57, 0.75);
}
.btn-hover.color-7 {
    background-image: linear-gradient(to right, #6253e1, #852D91, #A3A1FF, #F24645);
    box-shadow: 0 4px 15px 0 rgba(126, 52, 161, 0.75);
}
.btn-hover.color-8 {
    background-image: linear-gradient(to right, #29323c, #485563, #2b5876, #4e4376);
    box-shadow: 0 4px 15px 0 rgba(45, 54, 65, 0.75);
}
.btn-hover.color-9 {
    background-image: linear-gradient(to right, #25aae1, #4481eb, #04befe, #3f86ed);
    box-shadow: 0 4px 15px 0 rgba(65, 132, 234, 0.75);
}
.btn-hover.color-10 {
        background-image: linear-gradient(to right, #ed6ea0, #ec8c69, #f7186a , #FBB03B);
    box-shadow: 0 4px 15px 0 rgba(236, 116, 149, 0.75);
}
.btn-hover.color-11 {
       background-image: linear-gradient(to right, #eb3941, #f15e64, #e14e53, #e2373f);  box-shadow: 0 5px 15px rgba(242, 97, 103, .4);
}


</style>	
<style type="text/css">
	#gradient2 {
	  background-image: linear-gradient(to right, #4682B4, #00FFFF, #00FA9A);
	}
</style>
		
	</body>
</html>