d402728e55f4cebe2200d948f5a857a64964b93a
[project/luci.git] / themes / luci-theme-material / htdocs / luci-static / material / js / script.js
1 /**
2  *  Material is a clean HTML5 theme for LuCI. It is based on luci-theme-bootstrap and MUI
3  *
4  *  luci-theme-material
5  *      Copyright 2015 Lutty Yang <lutty@wcan.in>
6  *
7  *  Have a bug? Please create an issue here on GitHub!
8  *      https://github.com/LuttyYang/luci-theme-material/issues
9  *
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>
14  *
15  *  MUI:
16  *      https://github.com/muicss/mui
17  *
18  *  Licensed to the public under the Apache License 2.0
19  */
20 (function ($) {
21     $(".main > .loading").fadeOut();
22
23     /**
24      * trim text, Remove spaces, wrap
25      * @param text
26      * @returns {string}
27      */
28     function trimText(text) {
29         return text.replace(/[ \t\n\r]+/g, " ");
30     }
31
32
33     var lastNode = undefined;
34     var mainNodeName = undefined;
35
36     var nodeUrl = "";
37     (function(node){
38         if (node[0] == "admin"){
39             luciLocation = [node[1], node[2]];
40         }else{
41             luciLocation = node;
42         }
43
44         for(var i in luciLocation){
45             nodeUrl += luciLocation[i];
46             if (i != luciLocation.length - 1){
47                 nodeUrl += "/";
48             }
49         }
50     })(luciLocation);
51
52     /**
53      * get the current node by Burl (primary)
54      * @returns {boolean} success?
55      */
56     function getCurrentNodeByUrl() {
57         var ret = false;
58         if (!$('body').hasClass('logged-in')) {
59             luciLocation = ["Main", "Login"];
60             return false;
61         }
62
63         $(".main > .main-left > .nav > .slide > .menu").each(function () {
64             var ulNode = $(this);
65             ulNode.next().find("a").each(function () {
66                 var that = $(this);
67                 var href = that.attr("href");
68
69                 if (href.indexOf(nodeUrl) != -1) {
70                     ulNode.click();
71                     ulNode.next(".slide-menu").stop(true, true);
72                     lastNode = that.parent();
73                     lastNode.addClass("active");
74                     ret = true;
75                     return true;
76                 }
77             });
78         });
79         return ret;
80     }
81
82     /**
83      * menu click
84      */
85     $(".main > .main-left > .nav > .slide > .menu").click(function () {
86         var ul = $(this).next(".slide-menu");
87         var menu = $(this);
88         if (!ul.is(":visible")) {
89             menu.addClass("active");
90             ul.addClass("active");
91             ul.stop(true).slideDown("fast");
92         } else {
93             ul.stop(true).slideUp("fast", function () {
94                 menu.removeClass("active");
95                 ul.removeClass("active");
96             });
97         }
98     });
99
100     /**
101      * hook menu click and add the hash
102      */
103     $(".main > .main-left > .nav > .slide > .slide-menu > li > a").click(function () {
104         if (lastNode != undefined) lastNode.removeClass("active");
105         $(this).parent().addClass("active");
106         $(".main > .loading").fadeIn("fast");
107         return true;
108     });
109
110     /**
111      * fix menu click
112      */
113     $(".main > .main-left > .nav > .slide > .slide-menu > li").click(function () {
114         if (lastNode != undefined) lastNode.removeClass("active");
115         $(this).addClass("active");
116         $(".main > .loading").fadeIn("fast");
117         window.location = $($(this).find("a")[0]).attr("href");
118         return;
119     });
120
121     /**
122      * get current node and open it
123      */
124     if (getCurrentNodeByUrl()) {
125         mainNodeName = "node-" + luciLocation[0] + "-" + luciLocation[1];
126         mainNodeName = mainNodeName.replace(/[ \t\n\r\/]+/g, "_").toLowerCase();
127         $("body").addClass(mainNodeName);
128     }
129     $(".cbi-button-up").val("");
130     $(".cbi-button-down").val("");
131
132
133     /**
134      * hook other "A Label" and add hash to it.
135      */
136     $("#maincontent > .container").find("a").each(function () {
137         var that = $(this);
138         var onclick = that.attr("onclick");
139         if (onclick == undefined || onclick == "") {
140             that.click(function () {
141                 var href = that.attr("href");
142                 if (href.indexOf("#") == -1) {
143                     $(".main > .loading").fadeIn("fast");
144                     return true;
145                 }
146             });
147         }
148     });
149
150     /**
151      * Sidebar expand
152      */
153     var showSide = false;
154     $(".showSide").click(function () {
155         if (showSide) {
156             $(".darkMask").stop(true).fadeOut("fast");
157             $(".main-left").stop(true).animate({
158                 width: "0"
159             }, "fast");
160             $(".main-right").css("overflow-y", "auto");
161             showSide = false;
162         } else {
163             $(".darkMask").stop(true).fadeIn("fast");
164             $(".main-left").stop(true).animate({
165                 width: "15rem"
166             }, "fast");
167             $(".main-right").css("overflow-y", "hidden");
168             showSide = true;
169         }
170     });
171
172
173     $(".darkMask").click(function () {
174         if (showSide) {
175             showSide = false;
176             $(".darkMask").stop(true).fadeOut("fast");
177             $(".main-left").stop(true).animate({
178                 width: "0"
179             }, "fast");
180             $(".main-right").css("overflow-y", "auto");
181         }
182     });
183
184     $(window).resize(function () {
185         if ($(window).width() > 921) {
186             $(".main-left").css("width", "");
187             $(".darkMask").stop(true);
188             $(".darkMask").css("display", "none");
189             showSide = false;
190         }
191     });
192
193     /**
194      * fix legend position
195      */
196     $("legend").each(function () {
197         var that = $(this);
198         that.after("<span class='panel-title'>" + that.text() + "</span>");
199     });
200
201
202     $(".main-right").focus();
203     $(".main-right").blur();
204     $("input").attr("size", "0");
205
206     if (mainNodeName != undefined) {
207         console.log(mainNodeName);
208         switch (mainNodeName) {
209             case "node-status-system_log":
210             case "node-status-kernel_log":
211                 $("#syslog").focus(function () {
212                     $("#syslog").blur();
213                     $(".main-right").focus();
214                     $(".main-right").blur();
215                 });
216                 break;
217             case "node-status-firewall":
218                 var button = $(".node-status-firewall > .main fieldset li > a");
219                 button.addClass("cbi-button cbi-button-reset a-to-btn");
220                 break;
221             case "node-system-reboot":
222                 var button = $(".node-system-reboot > .main > .main-right p > a");
223                 button.addClass("cbi-button cbi-input-reset a-to-btn");
224                 break;
225         }
226     }
227
228 })(jQuery);