{% load static %}
<!-- Main navbar -->
<div>
    <div class="navbar navbar-inverse" style="background-color: #40777c;">
        <div class="navbar-header">
            <a class="navbar-brand" href="{% url 'apps:dashboard' %}">
                <!-- <h3>NationalAddress</h3> -->
                <i class=" icon-location4"></i>
                <b>&nbsp;&nbsp;OKU-GIS</b>
            </a>

            <ul class="nav navbar-nav pull-right visible-xs-block">
                <li><a data-toggle="collapse" data-target="#navbar-mobile"><i class="icon-tree5"></i></a></li>
            </ul>
        </div>
        <div class="navbar-collapse collapse" id="navbar-mobile">

            <p class="navbar-text"><span class="label bg-success-400">Online</span></p>
            <ul class="nav navbar-nav navbar-right">
                <li class="dropdown dropdown-user">
                    <a class="dropdown-toggle" data-toggle="dropdown">
                        <img src="{% static 'img/placeholder.jpg' %}" alt="">
                        <span>{{user.username}}</span>
                        <i class="caret"></i>
                    </a>

                    <ul class="dropdown-menu dropdown-menu-right">
                        <li><a href="#"><i class="icon-user-plus"></i> My profile</a></li>
                        <li><a href="#"><i class="icon-cog5"></i> Account settings</a></li>
                        <li class="divider"></li>

                    </ul>
                </li>
            </ul>
        </div>
    </div>
    <!-- /main navbar -->



    <div>

    </div>

    <div class="fixed-plugin" style="position: absolute;z-index: 999;">
        <div class="dropdown show-dropdown">
            <a href="#" data-toggle="dropdown">
                <i class="fa fa-map-o fa-2x" style="color: #FFFFFF;
                padding: 10px;
                border-radius: 0 0 6px 6px;
                width: auto;"> </i>
            </a>
            <ul class="dropdown-menu" x-placement="bottom-start" style="float: right; position: absolute; margin-left: -757px !important; margin-top: -35px !important;">
                <li class="header-title"> Maps BaseLayer</li>
                <div class="dropdown-content-body">
                    <div class="row text-center">
                        <div class="col-md-3" style="margin-top: 2px;">
                            <ul class="menu-list">
                                <a href="#" data-toggle="collapse" data-target=".navbar-collapse.in" id="OpenStreetMap">
                                    <img src="{% static 'img/maps/osm.PNG' %}" alt="" style="min-width: 180px; min-height:20px;">
                                    <span class="menu-heading">
                                        Google Street</span>
                                </a>
                            </ul>
                        </div>
                        <div class="col-md-3">
                            <ul class="menu-list">
                                <a href="#" data-toggle="collapse" data-target=".navbar-collapse.in" id="WorldImagery">
                                    <img src="{% static 'img/maps/esri.png' %}" alt="" style="min-width: 180px; min-height:20px;">
                                    <span class="menu-heading">
                                            World Imagery</span>
                                </a>
                            </ul>
                        </div>
                        <div class="col-md-3">
                            <ul class="menu-list">
                                <a href="#" data-toggle="collapse" data-target=".navbar-collapse.in" id="BingSatellite">
                                    <img src="{% static 'img/maps/bing.png' %}" alt="" style="min-width: 180px; min-height:20px;">
                                    <span class="menu-heading">
                                        Bing Satellite</span>
                                </a>
                            </ul>
                        </div>
                        <div class="col-md-3">
                            <ul class="menu-list">
                                <a href="#" data-toggle="collapse" data-target=".navbar-collapse.in" id="GoogleSatellite">
                                    <img src="{% static 'img/maps/esri.png' %}" alt="" style="min-width: 180px; min-height:20px;">
                                    <span class="menu-heading">
                                        Google Satellite</span>
                                </a>
                            </ul>
                        </div>
                    </div>
                </div>
            </ul>
        </div>
    </div>

    <div class="fixed-plugin" style="position: absolute;z-index: 999;top: 60px;">
        <div class="dropdown show-dropdown">
            <a href="#" data-toggle="dropdown">
                <i class="fa fa-cog fa-2x"> </i>
            </a>
            <ul class="dropdown-menu" style="float: right; position: absolute; margin-left: -757px !important; margin-top: -34px !important;">
                <li class="header-title"> Sidebar Filters</li>
                <!-- <div id="sidebar" onmouseleave="overll()">
                    <div class="sidebar-wrapper">
                        <div class="panel panel-default" id="features">
                            <div class="panel-body"> -->
                <div class="row">
                    <div class="col-md-6">

                        <div class="checkbox">
                            <label>
                                <input type="checkbox" id="geo_tuplah" onclick="geotuplah()" style="margin-top:2px;">
                                Lahan
                            </label>
                        </div>
                        <div class="checkbox">
                            <label>
                                <input type="checkbox" id="geo_building" onclick="geobangunan()" style="margin-top:2px;">
                                Bangunan
                            </label>
                        </div>

                        <div class="checkbox">
                            <label>
                                <input type="checkbox" id="geo_jalan" onclick="geojalan()" style="margin-top:2px;">
                                Jalan
                            </label>
                        </div>

                        <div class="checkbox">
                            <label>
                                <input type="checkbox" id="geo_sungai" onclick="geosungai()" style="margin-top:2px;">
                                Sungai
                            </label>
                        </div>
                            <div class="ceret">
                                <label>
                                    <input type="checkbox" id="batas_all" onclick="batasall()" style="margin-top:2px;" >
                                    Batas Teritori
                                </label>
                            </div>
                            <ul class="nasted">
                                <div class="checkbox">
                                    <label>
                                        <input type="checkbox" id="batas_kota" onclick="bataskota()" style="margin-top:2px;">
                                        Batas Kabupaten/Kota
                                    </label>
                                </div>

                                <div class="checkbox">
                                    <label>
                                        <input type="checkbox" id="batas_kec" onclick="bataskec()" style="margin-top:2px;">
                                        Batas Kecamatan     
                                    </label>
                                </div>

                                <div class="checkbox">
                                    <label>
                                        <input type="checkbox" id="batas_desa" onclick="batasdesa()" style="margin-top:2px;">
                                        Batas Desa/Kelurahan
                                    </label>
                                </div>
                            </ul>
                    </div>
                    <div class="col-md-6">
                        <div class="ceret">
                            <label>
                                                <input type="checkbox" id="po_all" onclick="gas_all()" value="BLACK" class="checkboxOccInfo" name="checkOccInfo" style="margin-top:2px;">
                                                    Point
                                            </label>
                        </div>

                        <ul class="nasted">
                            <div class="checkbox">
                                <label>
                                    <input type="checkbox" id="knt_adm" onclick="k_adm()" value="BLACK" class="checkboxOccInfo" name="checkOccInfo" style="margin-top:2px;">
                                    Kantor Administrasi
                                </label>
                            </div>

                            <div class="checkbox">
                                <label>
                                    <input type="checkbox" id="lyn_kes" onclick="l_kes()" value="RED" class="checkboxOccInfo" name="checkOccInfo" style="margin-top:2px;">
                                    Layanan Kesehatan     
                                </label>
                            </div>

                            <div class="checkbox">
                                <label>
                                    <input type="checkbox" id="pus" onclick="pks()" value="YELLOW" class="checkboxOccInfo"  name="checkOccInfo" style="margin-top:2px;">
                                    Puskesmas
                                </label>
                            </div>
                            <div class="checkbox">
                                <label>
                                    <input type="checkbox" id="rusak" onclick="rs()" value="YELLOW" class="checkboxOccInfo"  name="checkOccInfo" style="margin-top:2px;">
                                    Rumah Sakit
                                </label>
                            </div>
                            <div class="checkbox">
                                <label>
                                    <input type="checkbox" id="ibdh" onclick="fiksi()" value="YELLOW" class="checkboxOccInfo"  name="checkOccInfo" style="margin-top:2px;">
                                    Sarana Ibadah
                                </label>
                            </div>
                            <div class="checkbox">
                                <label>
                                    <input type="checkbox" id="dididik" onclick="didik()" value="YELLOW" class="checkboxOccInfo"  name="checkOccInfo" style="margin-top:2px;">
                                    Sarana Pendidikan
                                </label>
                            </div>
                            <div class="checkbox">
                                <label>
                                    <input type="checkbox" id="pom_bengsin" onclick="pom_mini()" value="YELLOW" class="checkboxOccInfo"  name="checkOccInfo" style="margin-top:2px;">
                                    SPBU
                                </label>
                            </div>
                            <div class="checkbox">
                                <label>
                                    <input type="checkbox" id="tasiun" onclick="sthall()" value="YELLOW" class="checkboxOccInfo"  name="checkOccInfo" style="margin-top:2px;">
                                    Stasiun
                                </label>
                            </div>
                            <div class="checkbox">
                                <label>
                                    <input type="checkbox" id="caheum" onclick="temanggung()" value="YELLOW" class="checkboxOccInfo"  name="checkOccInfo" style="margin-top:2px;">
                                    Terminal Bus
                                </label>
                            </div>
                            <div class="checkbox">
                                <label>
                                    <input type="checkbox" id="cabud" onclick="cb100()" value="YELLOW" class="checkboxOccInfo"  name="checkOccInfo" style="margin-top:2px;">
                                    Cagar Budaya dan Pariwisata
                                </label>
                            </div>
                            <div class="checkbox">
                                <label>
                                    <input type="checkbox" id="gardu" onclick="gl100()" value="YELLOW" class="checkboxOccInfo"  name="checkOccInfo" style="margin-top:2px;">
                                    Gardu Listrik
                                </label>
                            </div>
                        </ul>
                    </div>
                </div>
            </ul>
        </div>
    </div>

    <!-- Second navbar -->
    <div class="navbar navbar-default" id="navbar-second" style="display: none;">
        <ul class="nav navbar-nav no-border visible-xs-block">
            <li><a class="text-center collapsed" data-toggle="collapse" data-target="#navbar-second-toggle"><i class="icon-menu7"></i></a></li>
        </ul>

        <div class="navbar-collapse collapse" id="navbar-second-toggle">
            <ul class="nav navbar-nav">
                <li class="active"><a href="{% url 'apps:dashboard' %}"><i class="icon-display4 position-left"></i> Dashboard</a></li>
                <li>
                    <div onmouseenter="resse()" onmouseleave="normalse()" id="DataTables_Table_0_filter" class="dataTables_filter" style="margin: 0px 0 0px 20px;padding-top:5px;">
                        <label>
                                <input type="search" class="search_desa" id="search_desa" placeholder="Type to search..." aria-controls="DataTables_Table_0">
                            </label>
                        <ul id="searchResult"></ul>
                    </div>
                </li>

                <li class="hidden-xs" id="jumlah" style="padding-top: 14px;padding-left: 14px;">
                    <!-- <li class="hidden-xs"><a href="#" data-toggle="collapse" data-target=".navbar-collapse.in" id="list-btn"><i class="fa fa-list white"></i>&nbsp;&nbsp;List</a></li> -->
                </li>

                {% block btnlist %} {% endblock btnlist %}


            </ul>

           
        </div>
    </div>

</div>