{% load static %}

{% load i18n%}





<!DOCTYPE html>
<html lang="en">

    <!-- Basic -->

    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">   
   
    <!-- Mobile Metas -->
    <meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
 
     <!-- Site Metas -->
     <title>Institutu Bambu I.P</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <meta name="author" content="">

    <!-- Site Icons -->
    <link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon" />
    <link rel="apple-touch-icon" href="{% static 'vizitor/images/apple-touch-icon.png' %}">
    <link rel="icon" type="image/x-icon" href="{% static '/assets/img/elements/logo.png' %}" />
    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="{% static 'vizitor/css/bootstrap.min.css' %}">
    <!-- Site CSS -->
    <link rel="stylesheet" href="{% static 'vizitor/style.css' %}">
    <!-- Responsive CSS -->
    <link rel="stylesheet" href="{% static 'vizitor/css/responsive.css' %}">
    <!-- Custom CSS -->
    <link rel="stylesheet" href="{% static 'vizitor/css/custom.css' %}">

    <!-- Modernizer for Portfolio -->
	<script src="{% static 'js2/jquery.min.js' %}"></script>

    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
      <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->

</head>
<body>


    
	<div class="top-bar">
		<div class="container-fluid">
			<div class="row">
				<div class="col-md-6 col-sm-6">
					<div class="left-top">
						<div class="email-box">
              <a href="mail:marketingbambootl@gmail.com ">	<i class="fa fa-envelope-o" aria-hidden="true"></i>
                                
                           marketingbambootl@gmail.com </a>
           
						</div>
						<div class="phone-box">
							<a href="tel:77569194"><i class="fa fa-phone" aria-hidden="true"></i>+ 670 77569194 / 75553608 / 77376172</a> 




						</div>


               
                       


					</div>
				</div>
				<div class="col-md-6 col-sm-6">
					<div class="right-top">
						<div class="social-box">
							<ul>
								<li>
                              

                             

                            {% get_current_language as CURRENT_LANGUAGE %}
                            {% get_available_languages as AVAILABLE_LANGUAGES %}
                            {% get_language_info_list for AVAILABLE_LANGUAGES as languages %}
                   
                                {% for language in languages %}
                              
                                    <a     {% if language.code == 'tt' %}  href="/{{ language.code }}/" {% else %}  href='#' data-toggle='modal'  data-target= '#modal_lingua'  {% endif %}

                                    
                                      {% if language.code == CURRENT_LANGUAGE %} class="active"{% endif %}> 

                                      {% if language.code == 'tt' %}
                                      <img src="/media/lingua/tl.png" width="20px"> <font size="3">Tetun</font>  &nbsp; &nbsp; &nbsp;

                                      {% else %}

                                      <img src="/media/lingua/eng.png" width="20px"> <font size="3">{{ language.name_local }}</font> &nbsp;
                                      

                                      {% endif %}
                                      
                                    </a>
                           
                                {% endfor %}


                               
                                </li>
						
							<ul>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
    <header class="header header_style_01" >
        <nav class="megamenu navbar navbar-default">
            <div class="container-fluid">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
                        <span class="sr-only">Toggle navigation</span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>

              
                    <a class="navbar-brand" href="{% url 'vizitor:index' %}"><img src="/media/images/logos/logo3.png" style="width: 60px;" alt="image"></a>
                </div>
                <div id="navbar" class="navbar-collapse collapse">
                    <ul class="nav navbar-nav navbar-right">
                        <li><a class="{{pajina_index}}" href="{% url 'vizitor:index' %}">{% trans "MenuInisiu" %}</a></li>
                

                     <li class="dropdown {{pajina_konabaami}}"  style="right: none;">
                                <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">{% trans "MenuKonaBaAmi" %} <span class="caret" style="position: unset;"></span></a>
                                 <ul class="dropdown-menu"  style="background-color:#fffafa; border-radius: 10px;" role="menu" >
                                    <li ><a href="{% url 'vizitor:konabaami' %}"><font color='black'> {% trans "MenuKonaBaAmi" %} </font></a></li>
                                    <li> <a href="{% url 'vizitor:informasaungrupu' 7 %}"  ><font color='black'>Grupu Viveirus </font></a></li>
                                    <li> <a href="{% url 'vizitor:informasaungrupu' 8 %}"  ><font color='black'>Grupu Pre-Fabrika </font></a></li>
                                    
                                 </ul>
                             </li>

    
                  
                        <li><a class="{{pajina_produtu}}" href="{% url 'vizitor:produtu' %}">{% trans "MenuProdutu" %}</a></li>
                        <li><a class="{{pajina_informasaun}}" href="{% url 'vizitor:informasaun' %}">{% trans "MenuActividade" %}</a></li>
                        <li><a class="{{pajina_mapa}}" href="{% url 'vizitor:mapa' %}">{% trans "MenuMapamentu" %}</a></li>
                       

                           

                             

                     
                    </ul>
                </div>
            </div>
        </nav>
    </header>





    {% block content %}
        
   {% endblock content %}





   <div class="modal fade bd-example-modal-lg" tabindex="-1" id="ingles" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
    <div class="modal-dialog modal-lg">
      <div class="modal-content" style="padding: 30px ;">
     Comming Soon
      </div>
    </div>
  </div>

  

    <!-- <footer class="footer">
        <div class="container">
            <div class="row"> -->
                <!-- <div class="col-md-4 col-sm-4 col-xs-12">
                    <div class="widget clearfix">
                        <div class="widget-title"> -->
                            <!-- <img src="../media/images/logos/logo3.png" width="100" alt="" /> -->
                        <!-- </div>


                        <p> Institutu De bambu</p>
                     
                    </div>
                </div> -->

				<!-- <div class="col-md-4 col-sm-4 col-xs-12">
                    <div class="widget clearfix">
                        <div class="widget-title">
                            <h3>Pages</h3>
                        </div>


        

                        <ul class="footer-links hov">
                            <li></li>
							<li><a href="{% url 'vizitor:konabaami' %}">Kona Ba Ami <span class="icon icon-arrow-right2"></span></a></li>
							<li><a href="{% url 'vizitor:mapa' %}">Mapamentu <span class="icon icon-arrow-right2"></span></a></li>
							<li><a href="{% url 'vizitor:produtu' %}">Produtu <span class="icon icon-arrow-right2"></span></a></li>
						
                        </ul>
                    </div>
                </div> -->
				
                <!-- <div class="col-md-4 col-sm-4 col-xs-12"> -->
                    <!-- <div class="footer-distributed widget clearfix"> -->
                        <!-- <div class="widget-title">
                            <h3>Subscribe</h3>
							<p>There are many variations of passages of Lorem Ipsum available, but the majority have suffered alteration in some form, by injected humour, or randomised words which one know this tricks.</p>
                        </div> -->
						
						<!-- <div class="footer-right"> -->
							<!-- <form method="get" action="#"> -->
								<!-- <input placeholder="Subscribe our newsletter.." name="search">
								<i class="fa fa-envelope-o"></i>
							</form>
						</div>                         -->
                    <!-- </div>end clearfix -->
                <!-- </div> -->




            <!-- </div>
        </div>
    </footer> -->


    
    <div class="copyrights">
        <div class="container">
            <div class="footer-distributed">
                <div class="footer-left">                   
                    <p class="footer-company-name">All Rights Reserved. &copy; 2022 <a href="#">Institutu Bambu I.P.  </a>,   Developed By : <a href="https://www.tic.gov.tl">TIC - TIMOR I.P</a>
                </div>

                
            </div>
        </div><!-- end container -->
    </div><!-- end copyrights -->




    <a href="#" class="dmtop global-radius"><i class="fa fa-angle-up"></i></a>

    <!-- <a href="#"  class="dmtop global-radius"><i class="fa fa-angle-up"></i></a> -->
    <a href="#" id="scroll-to-top" class="dmtop global-radius"><i class="fa fa-angle-up"></i></a>
    <!-- <div class="modal fade bd-example-modal-lg" tabindex="-1" id="modal_detallu" role="dialog" aria-labelledby="myLargeModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-lg">
          <div class="modal-content" style="padding: 30px ;">
            <div class='form_altera_zona'></div>
          </div>
        </div>
      </div> -->






      <div class="modal fade" id="modal_lingua" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
          <div class="modal-content">
     
            <div class="modal-body">
                <h1>Comming soon !!!</h1> 
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>

            </div>
          </div>
        </div>
      </div>


   



      <div class="modal  fade" tabindex="-1" id="modal_detallu" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
        <div class="modal-dialog " role="document">
          <div class="modal-content">
            <div class="modal-header">
           
         
                Detallu 
              <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                <span aria-hidden="true">&times;</span>
              </button>
              
            <div class="modal-body">
              <div id ='loadingkontent'>
                <div class='form_altera_zona'></div>
                </div>

                <div id="loadingprosses">
                  <center> <img src ='http://minio-s3.apps06.tic.gov.tl/bambumedia/pajina/loadingspiner.gif' style="width: 130px ;"></center> 
                  </div>
            </div>
      
          </div>
        </div>
      </div>
      </div>



    <script>
      
        $(document).ready(function(){

          var loadingkontent = document.getElementById("loadingkontent");
          var loadingprosses = document.getElementById("loadingprosses");

          loadingkontent.style.display = "none";
          loadingprosses.style.display = "block";

                    $('#modal_detallu').on('show.bs.modal', function (e) {
                    var rowid = $(e.relatedTarget).data('id');
                    //menggunakan fungsi ajax untuk pengambilan data
                    // alert(rowid);
                    $.ajax({
                        type : 'GET',
                        url : "{% url 'vizitor:detalluprodutu2' %}",
                        data :  'id='+ rowid,
                        success : function(data){
                        $('.form_altera_zona').html(data);//menampilkan data ke dalam modal
                        loadingkontent.style.display = "block";
                        loadingprosses.style.display = "none";
                        }
                    });
                 });
            });
          </script>


    <!-- ALL JS FILES -->
    <script src="{% static 'vizitor/js/all.js' %}"></script>
    <!-- ALL PLUGINS -->
    <script src="{% static 'vizitor/js/custom.js' %}"></script>
    <script src="{% static 'vizitor/js/portfolio.js' %}"></script>
    <script src="{% static 'vizitor/js/hoverdir.js' %}"></script>    

</body>
</html>


