default.volt 9.13 KB
Newer Older
1 2 3 4
<!doctype html>
<!--[if IE 8 ]><html lang="en-US" class="ie ie8 lte9 lte8 no-js"><![endif]-->
<!--[if IE 9 ]><html lang="en-US" class="ie ie9 lte9 no-js"><![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--><html lang="en-US" class="no-js"><!--<![endif]-->
5
	<head>
6 7 8 9 10 11 12 13 14 15

		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

		<meta name="robots" content="index, follow, noodp, noydir" />
		<meta name="keywords" content="" />
		<meta name="description" content="" />
		<meta name="copyright" content="" />
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />

16
		<title>{{title|default("OPNsense") }}</title>
17

18
        <!-- include (theme) style -->
19
		<link href="/ui/themes/{{ui_theme|default('opnsense')}}/build/css/main.css" media="screen, projection" rel="stylesheet">
20

21 22 23 24 25 26 27 28 29
		<!-- TODO: move to theme style -->
		<style>
			.menu-level-3-item {
				font-size: 90%;
				padding-left: 54px !important;
			}

		</style>

30
		<!-- Favicon -->
31
		<link href="/ui/themes/{{ui_theme|default('opnsense')}}/build/images/favicon.png" rel="shortcut icon">
32 33

        <!-- Stylesheet for fancy select/dropdown -->
34 35 36 37
        <link rel="stylesheet" type="text/css" href="/ui/themes/{{ui_theme|default('opnsense')}}/build/css/bootstrap-select.css">

		<!-- bootstrap dialog -->
		<link href="/ui/themes/{{ui_theme|default('opnsense')}}/build/css/bootstrap-dialog.css" rel="stylesheet" type="text/css" />
38 39 40

        <!-- Font awesome -->
        <link rel="stylesheet" href="/ui/css/font-awesome.min.css">
41

Ad Schellevis's avatar
Ad Schellevis committed
42 43
		<!-- JQuery -->
		<script type="text/javascript" src="/ui/js/jquery-1.11.2.min.js"></script>
44
		<script type="text/javascript">
45 46 47 48 49 50 51 52 53 54
            // setup default scripting after page loading.
            $( document ).ready(function() {
                // hook into jquery ajax requests to ensure csrf handling.
                $.ajaxSetup({
                    'beforeSend': function(xhr) {
                        xhr.setRequestHeader("X-CSRFToken", "{{ csrf_token }}" );
                        xhr.setRequestHeader("X-CSRFTokenKey", "{{ csrf_tokenKey }}" );
                    }
                });

55
                // hide empty menu items
56 57 58 59 60 61 62 63 64 65
                $('#mainmenu > div > .collapse').each(function () {
                    // cleanup empty second level menu containers
                    $(this).find("div.collapse").each(function () {
                        if ($(this).children().length == 0) {
                            $("#mainmenu").find('[href="#' + $(this).attr('id') + '"]').remove();
                            $(this).remove();
                        }
                    });

                    // cleanup empty first level menu items
66
                    if ($(this).children().length == 0) {
67
                        $("#mainmenu").find('[href="#' + $(this).attr('id') + '"]').remove();
68 69
                    }
                });
70 71
                // hide submenu items
                $('#mainmenu .list-group-item').click(function(){
72 73 74 75 76 77 78
                    if($(this).attr('href').substring(0,1) == '#') {
                        $('#mainmenu .list-group-item').each(function(){
                            if ($(this).attr('aria-expanded') == 'true'  && $(this).data('parent') != '#mainmenu') {
                                $("#"+$(this).attr('href').substring(1,999)).collapse('hide');
                            }
                        });
                    }
79
                });
80

81 82 83 84
                initFormHelpUI();
                initFormAdvancedUI();
                addMultiSelectClearUI();

85 86 87 88 89 90 91 92 93 94 95 96 97 98 99
                // hook in live menu search
                $.ajax("/api/core/menu/search/", {
                    type: 'get',
                    cache: false,
                    dataType: "json",
                    data: {},
                    success: function (data) {
                        var menusearch_items = [];
                        $.each(data,function(idx, menu_item){
                            if (menu_item.Url != "") {
                                menusearch_items.push({id:menu_item.Url, name:menu_item.breadcrumb});
                            }
                        });
                        $("#menu_search_box").typeahead({
                            source: menusearch_items,
100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116
                            matcher: function (item) {
                                var ar = this.query.trim()
                                if (ar == "") {
                                    return false;
                                }
                                ar = ar.toLowerCase().split(/\s+/);
                                if (ar.length == 0) {
                                    return false;
                                }
                                var it = this.displayText(item).toLowerCase();
                                for (var i = 0; i < ar.length; i++) {
                                    if (it.indexOf(ar[i]) == -1) {
                                        return false;
                                    }
                                }
                                return true;
                            },
117 118 119 120 121 122 123 124 125
                            afterSelect: function(item){
                                window.location.href = item.id;
                            }
                        });
                    }
                });



126
            });
127
        </script>
128

129

130 131 132 133
        <!-- JQuery Tokenize (http://zellerda.com/projects/tokenize) -->
        <script type="text/javascript" src="/ui/js/jquery.tokenize.js"></script>
        <link rel="stylesheet" type="text/css" href="/ui/css/jquery.tokenize.css" />

134 135
        <!-- Bootgrind (grid system from http://www.jquery-bootgrid.com/ )  -->
        <link rel="stylesheet" type="text/css" href="/ui/css/jquery.bootgrid.css"/>
136
        <script type="text/javascript" src="/ui/js/jquery.bootgrid.js"></script>
137

138
        <!-- Bootstrap type ahead -->
139
        <script type="text/javascript" src="/ui/js/bootstrap3-typeahead.min.js"></script>
140

141 142
        <!-- OPNsense standard toolkit -->
        <script type="text/javascript" src="/ui/js/opnsense.js"></script>
143
        <script type="text/javascript" src="/ui/js/opnsense_ui.js"></script>
144
        <script type="text/javascript" src="/ui/js/opnsense_bootgrid_plugin.js"></script>
145

146 147
	</head>
	<body>
148 149 150 151 152
	<header class="page-head">
		<nav class="navbar navbar-default" role="navigation">
			<div class="container-fluid">
				<div class="navbar-header">
					<a class="navbar-brand" href="/">
153 154
						<img class="brand-logo" src="/ui/themes/{{ui_theme|default('opnsense')}}/build/images/default-logo.png" height="30"/>
						<img class="brand-icon" src="/ui/themes/{{ui_theme|default('opnsense')}}/build/images/icon-logo.png" height="30"/>
155 156 157 158 159 160 161 162 163 164
					</a>
					<button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navigation">
						<span class="sr-only">Toggle navigation</span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
						<span class="icon-bar"></span>
					</button>
				</div>
				<div class="collapse navbar-collapse">
					<ul class="nav navbar-nav navbar-right">
165 166 167
						<li>
							<form class="navbar-form" role="search">
								<div class="input-group">
168
									<input type="text" style="width: 250px;" class="form-control" tabindex="1" placeholder="{{ lang._('Search') }}" data-provide="typeahead" id="menu_search_box">
169 170 171 172 173 174
									<div class="input-group-btn">
										<button class="btn btn-default" type="button"><i class="glyphicon glyphicon-search"></i></button>
									</div>
								</div>
							</form>
						</li>
175
						<li id="menu_messages"><a href="#">{{session_username}}@{{system_hostname}}.{{system_domain}}</a></li>
176 177 178 179 180 181 182 183 184 185 186 187
					</ul>
				</div>
			</div>
		</nav>
	</header>

	<main class="page-content col-sm-10 col-sm-push-2 ">

		<!-- menu system -->
		{{ partial("layout_partials/base_menu_system") }}

		<div class="row">
188
            <!-- page header -->
189 190 191
			<header class="page-content-head">
				<div class="container-fluid">
						<ul class="list-inline">
192
							<li class="__mb"><h1>{{title | default("")}}</h1></li>
193

194 195
							<li class="btn-group-container" id="service_status_container">
                                <!-- placeholder for service status buttons -->
196 197 198 199
							</li>
						</ul>
				</div>
			</header>
200
            <!-- page content -->
201 202
			<section class="page-content-main">
				<div class="container-fluid">
203 204 205 206 207 208
                    <div class="row">
                        <section class="col-xs-12">
                            <div id="messageregion"></div>
                                {{ content() }}
                        </section>
                    </div>
209 210 211 212 213
				</div>
			</section>

		</div>

214
        <!-- page footer -->
215 216
		<footer class="page-foot col-sm-push-2">
			<div class="container-fluid">
217
				<a target="_blank" href="https://opnsense.org/" class="redlnk">OPNsense</a> (c) 2014-2016 <a href="https://www.deciso.com" class="tblnk">Deciso B.V.</a>
218 219 220 221 222
			</div>
		</footer>

	</main>

223
    <!-- bootstrap script -->
224
	<script type="text/javascript" src="/ui/js/bootstrap.min.js"></script>
Ad Schellevis's avatar
Ad Schellevis committed
225
	<script type="text/javascript" src="/ui/js/bootstrap-select.min.js"></script>
226
    <!-- bootstrap dialog -->
Ad Schellevis's avatar
Ad Schellevis committed
227
    <script src="/ui/js/bootstrap-dialog.min.js"></script>
228
    </body>
229
</html>