2 * Material is a clean HTML5 theme for LuCI. It is based on luci-theme-bootstrap and MUI
5 * Copyright 2015 Lutty Yang <lutty@wcan.in>
7 * Have a bug? Please create an issue here on GitHub!
8 * https://github.com/LuttyYang/luci-theme-material/issues
10 * luci-theme-bootstrap:
11 * Copyright 2008 Steven Barth <steven@midlink.org>
12 * Copyright 2008 Jo-Philipp Wich <jow@openwrt.org>
13 * Copyright 2012 David Menting <david@nut-bolt.nl>
16 * https://github.com/muicss/mui
18 * Licensed to the public under the Apache License 2.0
21 $(".main > .loading").fadeOut();
24 * trim text, Remove spaces, wrap
28 function trimText(text) {
29 return text.replace(/[ \t\n\r]+/g, " ");
33 var lastNode = undefined;
34 var mainNodeName = undefined;
38 if (node[0] == "admin"){
39 luciLocation = [node[1], node[2]];
44 for(var i in luciLocation){
45 nodeUrl += luciLocation[i];
46 if (i != luciLocation.length - 1){
53 * get the current node by Burl (primary)
54 * @returns {boolean} success?
56 function getCurrentNodeByUrl() {
58 if (!$('body').hasClass('logged-in')) {
59 luciLocation = ["Main", "Login"];
63 $(".main > .main-left > .nav > .slide > .menu").each(function () {
65 ulNode.next().find("a").each(function () {
67 var href = that.attr("href");
69 if (href.indexOf(nodeUrl) != -1) {
71 ulNode.next(".slide-menu").stop(true, true);
72 lastNode = that.parent();
73 lastNode.addClass("active");
85 $(".main > .main-left > .nav > .slide > .menu").click(function () {
86 var ul = $(this).next(".slide-menu");
88 if (!ul.is(":visible")) {
89 menu.addClass("active");
90 ul.addClass("active");
91 ul.stop(true).slideDown("fast");
93 ul.stop(true).slideUp("fast", function () {
94 menu.removeClass("active");
95 ul.removeClass("active");
102 * hook menu click and add the hash
104 $(".main > .main-left > .nav > .slide > .slide-menu > li > a").click(function () {
105 if (lastNode != undefined) lastNode.removeClass("active");
106 $(this).parent().addClass("active");
107 $(".main > .loading").fadeIn("fast");
114 $(".main > .main-left > .nav > .slide > .slide-menu > li").click(function () {
115 if (lastNode != undefined) lastNode.removeClass("active");
116 $(this).addClass("active");
117 $(".main > .loading").fadeIn("fast");
118 window.location = $($(this).find("a")[0]).attr("href");
123 * get current node and open it
125 if (getCurrentNodeByUrl()) {
126 mainNodeName = "node-" + luciLocation[0] + "-" + luciLocation[1];
127 mainNodeName = mainNodeName.replace(/[ \t\n\r\/]+/g, "_").toLowerCase();
128 $("body").addClass(mainNodeName);
130 $(".cbi-button-up").val("");
131 $(".cbi-button-down").val("");
135 * hook other "A Label" and add hash to it.
137 $("#maincontent > .container").find("a").each(function () {
139 var onclick = that.attr("onclick");
140 if (onclick == undefined || onclick == "") {
141 that.click(function () {
142 var href = that.attr("href");
143 if (href.indexOf("#") == -1) {
144 $(".main > .loading").fadeIn("fast");
154 var showSide = false;
155 $(".showSide").click(function () {
157 $(".darkMask").stop(true).fadeOut("fast");
158 $(".main-left").stop(true).animate({
161 $(".main-right").css("overflow-y", "auto");
164 $(".darkMask").stop(true).fadeIn("fast");
165 $(".main-left").stop(true).animate({
168 $(".main-right").css("overflow-y", "hidden");
174 $(".darkMask").click(function () {
177 $(".darkMask").stop(true).fadeOut("fast");
178 $(".main-left").stop(true).animate({
181 $(".main-right").css("overflow-y", "auto");
185 $(window).resize(function () {
186 if ($(window).width() > 921) {
187 $(".main-left").css("width", "");
188 $(".darkMask").stop(true);
189 $(".darkMask").css("display", "none");
195 * fix legend position
197 $("legend").each(function () {
199 that.after("<span class='panel-title'>" + that.text() + "</span>");
202 $(".cbi-section-table-titles, .cbi-section-table-descr, .cbi-section-descr").each(function () {
204 if (that.text().trim() == ""){
205 that.css("display", "none");
210 $(".main-right").focus();
211 $(".main-right").blur();
212 $("input").attr("size", "0");
214 if (mainNodeName != undefined) {
215 console.log(mainNodeName);
216 switch (mainNodeName) {
217 case "node-status-system_log":
218 case "node-status-kernel_log":
219 $("#syslog").focus(function () {
221 $(".main-right").focus();
222 $(".main-right").blur();
225 case "node-status-firewall":
226 var button = $(".node-status-firewall > .main fieldset li > a");
227 button.addClass("cbi-button cbi-button-reset a-to-btn");
229 case "node-system-reboot":
230 var button = $(".node-system-reboot > .main > .main-right p > a");
231 button.addClass("cbi-button cbi-input-reset a-to-btn");