Merge pull request #2484 from yglb/rosy-bugsfix

luci-theme-rosy:  Fixed most bugs and modified some interface styles
This commit is contained in:
Jo-Philipp Wich 2019-01-30 08:23:35 +01:00 committed by GitHub
commit 72163ea5ff
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 2432 additions and 2091 deletions

File diff suppressed because it is too large Load diff

View file

@ -16,8 +16,8 @@
* Licensed to the public under the Apache License 2.0
*/
(function ($) {
$(".main > .loading").fadeOut();
(function (win, $) {
$(".loading").fadeOut();
/**
* trim text, Remove spaces, wrap
@ -33,16 +33,17 @@
var mainNodeName = undefined;
var nodeUrl = "";
(function(node){
if (node[0] == "admin"){
(function (node) {
var luciLocation;
if (node[0] == "admin") {
luciLocation = [node[1], node[2]];
}else{
} else {
luciLocation = node;
}
for(var i in luciLocation){
for (var i in luciLocation) {
nodeUrl += luciLocation[i];
if (i != luciLocation.length - 1){
if (i != luciLocation.length - 1) {
nodeUrl += "/";
}
}
@ -59,7 +60,7 @@
return true;
}
$(".main > .main-left .nav > .slide > .menu").each(function () {
$(".main-left .nav > .slide > .menu").each(function () {
var ulNode = $(this);
ulNode.next().find("a").each(function () {
var that = $(this);
@ -91,8 +92,7 @@
enterShow: false
});
}
$(".main > .main-left .nav > .slide > .menu").click(function () {
$(".main-left .nav > .slide > .menu").click(function () {
var ul = $(this).next(".slide-menu");
var menu = $(this);
if (!ul.is(":visible")) {
@ -108,33 +108,32 @@
if ($('.nav').length > 0 && $(window).width() > 992) {
oScroll.setSize(200);
}
setInterval(function(){
if($('.nav').height() < $('.navbar-container').height()){
$('.nav').css('transform', 'translate(0px, 0px)');
setInterval(function () {
if ($('.nav').height() < $('.navbar-container').height()) {
$('.nav').css('transform', 'translate(0px, 0px)');
}
}, 300);
return false;
});
/**
* hook menu click and add the hash
*/
$(".main > .main-left .nav > .slide > .slide-menu > li > a").click(function () {
$(".main-left .nav > .slide > .slide-menu > li > a").click(function () {
if (lastNode != undefined) lastNode.removeClass("active");
$(this).parent().addClass("active");
$(".main > .loading").fadeIn("fast");
$(".loading").fadeIn("fast");
return true;
});
/**
* fix menu click
*/
$(".main > .main-left .nav > .slide > .slide-menu > li").click(function () {
$(".main-left .nav > .slide > .slide-menu > li").click(function () {
if (lastNode != undefined) lastNode.removeClass("active");
$(this).addClass("active");
$(".main > .loading").fadeIn("fast");
window.location = $($(this).find("a")[0]).attr("href");
$(".loading").fadeIn("fast");
win.location = $($(this).find("a")[0]).attr("href");
return false;
});
@ -160,7 +159,7 @@
that.click(function () {
var href = that.attr("href");
if (href.indexOf("#") == -1) {
$(".main > .loading").fadeIn("fast");
$(".loading").fadeIn("fast");
return true;
}
});
@ -171,54 +170,50 @@
* Sidebar expand
*/
var showSide = false;
$(".showSide").click(function () {
if (showSide) {
$(".main-left").stop(true).animate({
right: '100%'
}, "fast");
$(".main-right").css("overflow-y", "auto");
if ($(win).height() == 992) {
$(".showSide").click(function () {
if (showSide) {
$(".darkMask").stop(true).fadeOut("fast");
$(".main-left").stop(true).fadeOut("fast");
$(".main-right").css("overflow-y", "visible");
showSide = false;
} else {
$(".darkMask").stop(true).fadeIn("fast");
$(".main-left").stop(true).animate({
width: "100%"
}, "fast").fadeIn("fast");
$(".main-right").css("overflow-y", "hidden");
showSide = true;
}
});
$(".main-left").click(function(e) {
e.preventDefault();
$(".main-left").stop(true).fadeOut("fast");
showSide = false;
} else {
$(".main-left").stop(true).animate({
right: '0'
}, "fast");
$(".main-right").css("overflow-y", "hidden");
showSide = true;
}
});
});
}
$(".logged-in .main-left").click(function () {
$(".darkMask").click(function () {
if (showSide) {
showSide = false;
$(this).stop(true).fadeOut("fast");
$(".darkMask").stop(true).fadeOut("fast");
$(".main-left").stop(true).animate({
right: '100%'
width: "0"
}, "fast");
$(".main-right").css("overflow-y", "auto");
$(".main-right").css("overflow-y", "visible");
}
});
$(".logged-in .main-left > *").click(function () {
event.stopPropagation();
if ((navigator.userAgent.indexOf('MSIE') >= 0)&& (navigator.userAgent.indexOf('Opera') < 0)){
event.cancelBubble = true;
}else{
event.stopPropagation();
}
});
$(window).resize(function () {
if ($(window).width() > 921) {
$(win).resize(function () {
if ($(win).width() > 921) {
$(".main-left").css("width", "");
$(".darkMask").stop(true);
$(".darkMask").css("display", "none");
showSide = false;
}
if( $(window).width() > 992 ){
$('.logged-in .main-right').width( $(window).width() - $('.logged-in .main-left').width() - 50 );
}
$('body.login').height($(win).height());
});
/**
@ -231,7 +226,7 @@
$(".cbi-section-table-titles, .cbi-section-table-descr, .cbi-section-descr").each(function () {
var that = $(this);
if (that.text().trim() == ""){
if (that.text().trim() == "") {
that.css("display", "none");
}
});
@ -263,53 +258,20 @@
}
}
$('<div class="iconpwd"></div>').appendTo($('.node-main-login form .cbi-value input[type="password"]').parent()[0]);
$('<div class="iconuser"></div>').appendTo($('.node-main-login form .cbi-value input[type="text"]').parent()[0]);
$('<div class="iconeye"></div>').appendTo($('.node-main-login form .cbi-value input[type="password"]').parent()[0]);
var num = true;
$('.cbi-value-field .iconeye').click(function(){
if(num){
$('.node-main-login form .cbi-value-last input[type="password"]').prop('type', 'text');
$('.node-main-login form .cbi-value-field .iconeye').removeClass('opeye').addClass('cleye');
num = false;
}else {
$('.node-main-login form .cbi-value-last input[type="text"]').prop('type', 'password');
$('.node-main-login form .cbi-value-field .iconeye').removeClass('cleye').addClass('opeye');
num = true;
}
$('.lang_enInterfaces .ifacebox-head').each(function () {
$(this).next().css('border-color', $(this).css('background-color'));
});
$('body.logged-in').css('min-height', $(window).height());
$(function(){
if( $(window).width() > 992 ){
$('.logged-in .main-right').outerWidth( $(window).width() - $('.logged-in .main-left').width() - 50 );
$('<div class="eye"></div>').appendTo('.login > .main .cbi-value-last > .cbi-value-field');
$('.login > .main .cbi-value-last > .cbi-value-field .eye').click(function () {
var className = $(this).attr('class');
if (className.indexOf('op-eye') > (-1)) {
$('.login > .main .cbi-value-last > .cbi-value-field').children().prop('type', 'text');
$(this).addClass('eye').removeClass('op-eye');
} else {
$('.login > .main .cbi-value-last > .cbi-value-field').children().prop('type', 'password');
$(this).addClass('op-eye').removeClass('eye');
}
$('.cbi-section .table').each(function () {
var firTr = $(this).children('.tr').get(0);
var firTd = $(firTr).children('.td').get(0);
var th = $(firTr).children('.th').get(0);
var laTr = $(this).children('.tr').get($(this).children('.tr').length - 1);
var laTd = $(laTr).children('.td').get(0);
var a = window.getComputedStyle(firTr, ':before').getPropertyValue('content');
if (th && a != 'none') {
$(th).css('border-top-left-radius', '0');
} else if (firTd && a != 'none') {
$(firTd).css('border-top-left-radius', '0');
}
if (laTd && a != 'none') {
$(laTd).css('border-bottom-left-radius', '0');
}
});
});
$('#iptables').prev().css('margin-top', '10px');
})(jQuery);
})(window, jQuery);

View file

@ -1,4 +1,4 @@
<%#
<%#
Rosy is a theme for LuCI. It is based on luci-theme-bootstrap
luci-theme-rosy
Copyright 2018 Rosy Song <rosysong@rosinson.com>
@ -192,6 +192,26 @@
end
end
end
local function auth_level()
local childs = disp.node_childs(cattree)
if #childs > 0 then
for i, r in ipairs(childs) do
local nnode = cattree.nodes[r]
local grandchildren = disp.node_childs(nnode)
if #grandchildren > 0 then
-- If this value is returned, the current interface is the logged-in data output interface
return "auth"
else
-- If this value is returned, it indicates that the current interface is a data output interface that does not require login.
return "noauth"
end
end
end
-- If this value is returned, the current interface is the login interface
return "login"
end
-%>
<!DOCTYPE html>
<html lang="<%=luci.i18n.context.lang%>">
@ -234,33 +254,33 @@
<script src="<%=media%>/js/ScrollY.js"></script>
</head>
<body class="lang_<%=luci.i18n.context.lang%> <%- if node then %><%= striptags( node.title ) %><%- end %> <% if luci.dispatcher.context.authsession then %>logged-in<% end %>">
<body class="lang_<%=luci.i18n.context.lang%> <%- if node then %><%= striptags( node.title ) %><%- end %> <%- if auth_level() == "auth" then %> logged-in<%- end %> <%- if auth_level() == "noauth" then %> login-info<%- end %> <%- if auth_level() == "login" then %> login<%- end %>">
<header>
<div class="fill">
<div class="container">
<span class="showSide"></span>
<a class="brand" href="#"><%=boardinfo.hostname or "?"%></a>
<div class="btn-con pull-right">
<% render_changes() %>
<span id="xhr_poll_status" style="display:none" onclick="XHR.running() ? XHR.halt() : XHR.run()">
<span class="label success" id="xhr_poll_status_on"><span class="mobile-hide">
<%:Auto Refresh%></span>
<%:on%></span>
<span class="label" id="xhr_poll_status_off" style="display:none"><span class="mobile-hide">
<%:Auto Refresh%></span>
<%:off%></span>
</span>
<% render_logout() %>
</div>
<div class="container">
<span class="showSide"></span>
<a class="brand PC-hide" href="#"><%=boardinfo.hostname or "?"%></a>
<div class="btn-con pull-right">
<% render_changes() %>
<span id="xhr_poll_status" style="display:none" onclick="XHR.running() ? XHR.halt() : XHR.run()">
<span class="label success" id="xhr_poll_status_on"><span class="mobile-hide">
<%:Auto Refresh%></span>
<%:on%></span>
<span class="label" id="xhr_poll_status_off" style="display:none"><span class="mobile-hide">
<%:Auto Refresh%></span>
<%:off%></span>
</span>
<% render_logout() %>
</div>
</div>
</header>
<div style="" class="loading">
<span>
<div class="loading-img">
<img src="<%=media%>/loading.svg">
</div>Loading...
</span>
</div>
<div class="main">
<div style="" class="loading"><span>
<div class="loading-img">
<img src="<%=media%>/loading.svg">
</div>Loading...
</span></div>
<div class="main-left">
<div class="nav-container">
<a class="brand" href="#">