diff --git a/package/gluon-web-admin/files/lib/gluon/web/view/admin/info.html b/package/gluon-web-admin/files/lib/gluon/web/view/admin/info.html index 4b1f966c3fb0157aaf050cac0670d95ffd166d39..6f593378d4e1aac5e590daac1a2217003b36eaf6 100644 --- a/package/gluon-web-admin/files/lib/gluon/web/view/admin/info.html +++ b/package/gluon-web-admin/files/lib/gluon/web/view/admin/info.html @@ -34,6 +34,6 @@ <h2><%:Information%></h2> <% for _, v in ipairs(values) do %> <div class="gluon-value"> - <div class="gluon-value-title"><%=v[1]%></div><div class="gluon-value-field"><%=pcdata(v[2] or 'n/a')%></div> + <div class="gluon-value-title"><%=v[1]%></div><div class="gluon-value-field-text"><%=pcdata(v[2] or 'n/a')%></div> </div> <% end %> diff --git a/package/gluon-web-admin/files/lib/gluon/web/view/admin/upgrade.html b/package/gluon-web-admin/files/lib/gluon/web/view/admin/upgrade.html index 5ce815f7f4325b96e0e649ee6a55b50ec4acd441..ecafa33f361ea7dd80867a05dbf829504a0b5ee3 100644 --- a/package/gluon-web-admin/files/lib/gluon/web/view/admin/upgrade.html +++ b/package/gluon-web-admin/files/lib/gluon/web/view/admin/upgrade.html @@ -14,37 +14,37 @@ $Id$ <h2><%:Upgrade firmware%></h2> <form method="post" enctype="multipart/form-data" action="<%=url(request)%>"> - <p> - <%:You can manually upgrade your firmware here.%> - </p> - <% if bad_image then %> - <p class="error"><%:The provided firmware image is not valid for this device.%></p> - <% end %> - <div class="gluon-section-node"> - <div class="gluon-value"> - <label class="gluon-value-title"> - <%:Firmware image%> - </label> - <div class="gluon-value-field"> - <input class="gluon-input-file" type="file" name="image" /> - </div> - </div> - - <div class="gluon-value gluon-value-last"> - <label class="gluon-value-title"> - <%:Keep settings%> - </label> - - <div class="gluon-value-field"> - <input id="keepcfg" class="gluon-input-checkbox" type="checkbox" name="keepcfg" value="1" checked="checked" /> - <label for="keepcfg"></label> - </div> - </div> - </div> - - <div class="gluon-page-actions right"> - <input type="hidden" name="step" value="2" /> - <input type="hidden" name="token" value="<%=token%>" /> - <input class="gluon-button gluon-button-submit" type="submit" value="<%:Upload image%>" /> - </div> + <p> + <%:You can manually upgrade your firmware here.%> + </p> + <% if bad_image then %> + <p class="error"><%:The provided firmware image is not valid for this device.%></p> + <% end %> + <div class="gluon-section-node"> + <div class="gluon-value"> + <label class="gluon-value-title"> + <%:Firmware image%> + </label> + <div class="gluon-value-field"> + <input class="gluon-input-file" type="file" name="image" /> + </div> + </div> + + <div class="gluon-value gluon-value-last"> + <label class="gluon-value-title"> + <%:Keep settings%> + </label> + + <div class="gluon-value-field"> + <input id="keepcfg" class="gluon-input-checkbox" type="checkbox" name="keepcfg" value="1" checked="checked" /> + <label for="keepcfg"></label> + </div> + </div> + </div> + + <div class="gluon-page-actions right"> + <input type="hidden" name="step" value="2" /> + <input type="hidden" name="token" value="<%=token%>" /> + <input class="gluon-button gluon-button-submit" type="submit" value="<%:Upload image%>" /> + </div> </form> diff --git a/package/gluon-web-mesh-vpn-fastd/files/lib/gluon/web/view/gluon/model/mesh-vpn-fastd.html b/package/gluon-web-mesh-vpn-fastd/files/lib/gluon/web/view/gluon/model/mesh-vpn-fastd.html index ab5d61bdce061a71929273706de6715a19078f98..50eff069749cf6abee530789e4560068bfe31e05 100644 --- a/package/gluon-web-mesh-vpn-fastd/files/lib/gluon/web/view/gluon/model/mesh-vpn-fastd.html +++ b/package/gluon-web-mesh-vpn-fastd/files/lib/gluon/web/view/gluon/model/mesh-vpn-fastd.html @@ -1,9 +1,10 @@ <div class="gluon-value"> <div class="gluon-value-title"> - <input class="gluon-input-radio" data-update="change" type="radio" value="security"<%= attr("id", id..'1') .. attr("name", id) .. attr("checked", ((self:cfgvalue() or self.default) == "security") and "checked") %> /> + <input class="gluon-input-radio" data-update="change" type="radio" value="security"<%= attr("id", id..'.1') .. attr("name", id) .. attr("checked", ((self:cfgvalue() or self.default) == "security") and "checked") %> /> + <label<%= attr("for", id..'.1')%>></label> </div> <div class="gluon-value-field-long"> - <label<%= attr("for", id..'1') %> class="gluon-value-title"><%:Security mode%></label> + <label<%= attr("for", id..'.1') %> class="gluon-value-title"><%:Security mode%></label> <br /> <%= translate( 'In security mode, the mesh VPN uses an encrypted tunnel to connect to the VPN servers. ' .. @@ -17,10 +18,11 @@ <div class="gluon-value gluon-value-last"> <div class="gluon-value-title"> - <input class="gluon-input-radio" data-update="change" type="radio" value="performance"<%= attr("id", id..'2') .. attr("name", id) .. attr("checked", ((self:cfgvalue() or self.default) == "performance") and "checked") %> /> + <input class="gluon-input-radio" data-update="change" type="radio" value="performance"<%= attr("id", id..'.2') .. attr("name", id) .. attr("checked", ((self:cfgvalue() or self.default) == "performance") and "checked") %> /> + <label<%= attr("for", id..'.2')%>></label> </div> <div class="gluon-value-field-long"> - <label<%= attr("for", id..'2') %> class="gluon-value-title"><%:Performance mode%></label> + <label<%= attr("for", id..'.2') %> class="gluon-value-title"><%:Performance mode%></label> <br /> <%= translate( 'In performance mode, no encryption is used. This usually allows for higher throughput, but the data exchanged over your node is not ' .. diff --git a/package/gluon-web-theme/files/lib/gluon/web/www/static/gluon/cascade.css b/package/gluon-web-theme/files/lib/gluon/web/www/static/gluon/cascade.css index 5739ffc5d24ed5a90ffa492d6d7a7a5a22b3e938..62940baa50e839d8352a69e74b5250b896aa3610 100644 --- a/package/gluon-web-theme/files/lib/gluon/web/www/static/gluon/cascade.css +++ b/package/gluon-web-theme/files/lib/gluon/web/www/static/gluon/cascade.css @@ -1 +1 @@ -.lang_he{direction:RTL;unicode-bidi:embed}.hidden{display:none}html{min-height:100%;height:auto;position:relative}body,input,select,option{font-family:'Open Sans', Arial, sans-serif;font-size:12pt}body{color:#4d4e53;line-height:1.5em;margin:0;display:flex;flex-direction:column;min-height:100vh;background-color:#f3f3f3}a img{border:none;text-decoration:none}.tabmenu1{text-align:center}ul.tabmenu{list-style:none;padding:0;margin:2em 0;display:inline-flex}ul.tabmenu li{white-space:nowrap;margin:0 0.5em;padding:0;text-align:center}ul.tabmenu li a{display:block;text-decoration:none;padding:1em;margin:0;color:#333;border-radius:2em}ul.tabmenu li a:hover{background:#ffe9b3}ul.tabmenu li.active a{font-weight:bold;background:white;color:#333}abbr,acronym{font-style:normal;font-variant:normal}abbr[title],acronym[title]{border-bottom:1px dotted;cursor:help}a:link abbr[title],a:visited abbr[title],a:link acronym[title],a:visited acronym[title]{cursor:pointer}code{font-family:monospace;white-space:pre}#maincontent ul{margin-left:2em}.clear{clear:both}.error{color:#ff0000;background-color:white}#menubar{display:flex;background:#dc0067;color:#ffffff}#menubar a:link.topcat,#menubar a:visited.topcat{position:relative;display:block;padding:0.5em;text-decoration:none;font-size:80%;font-weight:normal;color:white}#menubar a:link.topcat:hover,#menubar a:link.topcat:focus,#menubar a:visited.topcat:hover,#menubar a:visited.topcat:focus{background:#ffb400;color:black}#menubar a:link.topcat.active,#menubar a:visited.topcat.active{background:#ffb400;color:black;font-weight:bold}#menubar div.hostinfo{position:relative;margin:0;padding:0.5em;flex:1;font-weight:bold;font-size:80%}#menubar div.hostinfo a:link,#menubar div.hostinfo a:visited{text-decoration:none;font-weight:bold;color:white}#menubar div.hostinfo a:link:hover,#menubar div.hostinfo a:link:focus,#menubar div.hostinfo a:visited:hover,#menubar div.hostinfo a:visited:focus{text-decoration:underline}#topmenu{list-style:none;margin:0;padding:0}#topmenu li{display:inline-block}#maincontent{padding:0 1em 2em;max-width:60em;min-width:40em;margin:1em auto}#maincontent p{margin-bottom:1em}.gluon-section{margin:0;padding:0;border:none;margin-bottom:1.3em}.gluon-section:last-child{margin-bottom:0.7em}.gluon-section legend{font-size:1.4em;font-weight:bold;position:relative;padding:0;margin-bottom:0.5em}.gluon-section h2{margin:0em 0 0.5em -0.5em !important}.gluon-section h3{text-decoration:none !important;font-weight:bold !important;color:#555555 !important;margin:0.25em !important;font-size:100% !important}.gluon-section-descr{margin-bottom:2em}input:placeholder{color:#aaaaaa}input:-webkit-input-placeholder{color:#aaaaaa}input:-moz-placeholder{color:#aaaaaa}input:-ms-input-placeholder{color:#aaaaaa}input[type=checkbox]{display:none}input[type=checkbox]+label{display:inline-block;width:1em;height:1em;margin:0}input[type=checkbox]:checked+label:after{content:'✔';color:#dc0067;vertical-align:middle;position:absolute;top:50%;left:0;margin-top:-0.5em;width:100%;text-align:center;font-size:1.7em}input[type=submit],input[type=reset],input[type=image],input[type=button]{cursor:pointer}select,input,textarea,input[type=checkbox]+label{color:#003247;border:none;background:#ffe199;border-radius:3pt;padding:0.5em;margin-top:1px;margin-bottom:2px}input[type=image]{border:none}select,input[type=text],input[type=password]{width:20em}input.gluon-button{display:inline-block;zoom:1;line-height:normal;white-space:nowrap;vertical-align:baseline;text-align:center;cursor:pointer;user-select:none;font-size:100%;padding:0.5em 1em;color:rgba(0,0,0,0.8);border:none transparent;background-color:#E6E6E6;text-decoration:none;border-radius:2px;transition:0.1s linear box-shadow;margin-left:0.5em;background-repeat:no-repeat}input.gluon-button::-moz-focus-inner{padding:0;border:0}input.gluon-button:active{box-shadow:0 0 0 1px rgba(0,0,0,0.15) inset,0 0 6px rgba(0,0,0,0.2) inset}input.gluon-button:focus{outline:0}input.gluon-button:hover,input.gluon-button:focus{background-image:linear-gradient(transparent, rgba(0,0,0,0.05) 40%, rgba(0,0,0,0.1))}input.gluon-button[disabled]{border:none;background-image:none;opacity:0.40;cursor:not-allowed;box-shadow:none}input.gluon-button-reset{background-color:#e30;color:#fff}input.gluon-button-submit{background-color:#009ee0;color:#fff}.gluon-input-invalid{background:#e30 !important;color:white}div.gluon-section-remove input{border-bottom:none}textarea{margin-left:-1px;margin-bottom:0.5em}.gluon-section .gluon-rowstyle-1 h3{background-color:#eeeeff;color:#555555}.gluon-rowstyle-2{color:#000000}div.gluon-value{display:flex;flex-direction:row;margin-bottom:0.5em}.gluon-section-node .gluon-value:last-child{margin-bottom:0}.gluon-value-title{flex:2;text-align:right;padding-right:1em;font-weight:bold}div.gluon-value-field{flex:3;position:relative}div.gluon-value-field input,div.gluon-value-field select,div.gluon-value-field input+label{position:relative;top:-0.39em}div.gluon-value-field-long{flex:10;position:relative}div.gluon-value-field-long input,div.gluon-value-field-long select,div.gluon-value-field-long input+label{position:relative;top:-0.39em}div.gluon-value-field-long-after{flex:2}div.gluon-value-description{font-size:8pt}div.gluon-section-create{clear:left;white-space:nowrap;vertical-align:top}div.gluon-section-create .gluon-button{margin:0.25em}input.gluon-section-create-name{margin-right:-0.25em}div.gluon-map-descr{margin-bottom:1em}.gluon-map-descr:empty,.gluon-section-descr:empty{display:none}.gluon-map-descr,.gluon-section-descr,.gluon-page-actions{padding:1em;background:#ececec}.gluon-page-actions{text-align:right;display:flex;flex-flow:row-reverse}div.gluon-optionals{padding:0.25em;border-bottom:1px dotted #bbbbbb}div.gluon-section-remove{float:right}.gluon-section-node{clear:both;position:relative;border:none}.gluon-section-node-tabbed{border-top-left-radius:0}div.gluon-error{font-size:95%;font-weight:bold;color:#ff0000;background-color:#ffffff}.gluon-value-error input,.gluon-value-error select{background-color:#ffcccc}.gluon-section-error{color:red;background-color:white;font-size:95%;border:1px dotted red;margin:3px;padding:3px}.gluon-value-field var{color:#2222FF}.gluon-add:after,.gluon-remove:after{cursor:pointer;display:inline-block;text-align:center;vertical-align:middle;font-size:180%;width:1.2em;height:1em}.gluon-add{color:#008000;position:relative;left:21em}input+.gluon-add{left:0;top:-0.35em}.gluon-add:first-child{top:0.04em;left:-0.08em}.gluon-add:after{content:'+'}.gluon-remove{color:#800000;position:relative;top:-0.42em}.gluon-remove:after{content:'–'}.left{text-align:left !important}.right{text-align:right !important}.inline{display:inline}.error500{border:1px dotted #ff0000;background-color:#ffffff;color:#000000;padding:0.5em}.errorbox{border:1px solid #FF0000;background-color:#FFCCCC;padding:5px;margin-bottom:5px}.errorbox a{color:#000000 !important}.the-key{text-align:left;font-size:1.4em;background:#ffe9b3;border:3pt dashed #dc0067;margin-bottom:0.5em;padding:0.5em} +.lang_he{direction:RTL;unicode-bidi:embed}.hidden{display:none}html{min-height:100%;height:auto;position:relative}body,input,select,option{font-family:'Open Sans', Arial, sans-serif;font-size:12pt}body{color:#4d4e53;line-height:1.5em;margin:0;display:flex;flex-direction:column;min-height:100vh;background-color:#f3f3f3}a img{border:none;text-decoration:none}.tabmenu1{text-align:center}ul.tabmenu{list-style:none;padding:0;margin:2em 0;display:inline-flex}ul.tabmenu li{white-space:nowrap;margin:0 0.5em;padding:0;text-align:center}ul.tabmenu li a{display:block;text-decoration:none;padding:1em;margin:0;color:#333;border-radius:2em}ul.tabmenu li a:hover{background:#ffe9b3}ul.tabmenu li.active a{font-weight:bold;background:white;color:#333}abbr,acronym{font-style:normal;font-variant:normal}abbr[title],acronym[title]{border-bottom:1px dotted;cursor:help}a:link abbr[title],a:visited abbr[title],a:link acronym[title],a:visited acronym[title]{cursor:pointer}code{font-family:monospace;white-space:pre}#maincontent ul{margin-left:2em}.clear{clear:both}.error{color:#ff0000;background-color:white}#menubar{display:flex;background:#dc0067;color:#ffffff}#menubar a:link.topcat,#menubar a:visited.topcat{position:relative;display:block;padding:0.5em;text-decoration:none;font-size:80%;font-weight:normal;color:white}#menubar a:link.topcat:hover,#menubar a:link.topcat:focus,#menubar a:visited.topcat:hover,#menubar a:visited.topcat:focus{background:#ffb400;color:black}#menubar a:link.topcat.active,#menubar a:visited.topcat.active{background:#ffb400;color:black;font-weight:bold}#menubar div.hostinfo{position:relative;margin:0;padding:0.5em;flex:1;font-weight:bold;font-size:80%}#menubar div.hostinfo a:link,#menubar div.hostinfo a:visited{text-decoration:none;font-weight:bold;color:white}#menubar div.hostinfo a:link:hover,#menubar div.hostinfo a:link:focus,#menubar div.hostinfo a:visited:hover,#menubar div.hostinfo a:visited:focus{text-decoration:underline}#topmenu{list-style:none;margin:0;padding:0}#topmenu li{display:inline-block}#maincontent{padding:0 1em 2em;max-width:60em;min-width:40em;margin:1em auto}#maincontent p{margin-bottom:1em}.gluon-section{margin:0;padding:0;border:none;margin-bottom:1.3em}.gluon-section:last-child{margin-bottom:0.7em}.gluon-section legend{font-size:1.4em;font-weight:bold;position:relative;padding:0;margin-bottom:0.5em}.gluon-section h2{margin:0em 0 0.5em -0.5em !important}.gluon-section h3{text-decoration:none !important;font-weight:bold !important;color:#555555 !important;margin:0.25em !important;font-size:100% !important}.gluon-section-descr{margin-bottom:2em}input:placeholder{color:#aaaaaa}input:-webkit-input-placeholder{color:#aaaaaa}input:-moz-placeholder{color:#aaaaaa}input:-ms-input-placeholder{color:#aaaaaa}input[type=checkbox]{display:none}input[type=checkbox]+label{display:inline-block;position:relative;width:1em;height:1em;margin:0}input[type=checkbox]:checked+label:after{content:'✔';color:#dc0067;vertical-align:middle;position:absolute;top:50%;left:0;margin-top:-0.5em;width:100%;text-align:center;font-size:1.7em}input[type=radio]{display:none}input[type=radio]+label{display:inline-block;position:relative;width:0.8em;height:0.8em;padding:0.5em;margin:0.2em 0.2em 0.2em 0.1em;border:none;background:#ffe199;vertical-align:middle;border-radius:50%}input[type=radio]:checked+label:after{content:'•';color:#dc0067;vertical-align:middle;position:absolute;top:50%;left:0;margin-top:-0.4em;width:100%;text-align:center;font-size:2em}input[type=submit],input[type=reset],input[type=image],input[type=button]{cursor:pointer}select,input,textarea,input[type=checkbox]+label{color:#003247;border:none;background:#ffe199;border-radius:3pt;padding:0.5em;margin-top:1px;margin-bottom:2px}input[type=image]{border:none}select,input[type=text],input[type=password]{min-width:20em}input.gluon-button{display:inline-block;zoom:1;line-height:normal;white-space:nowrap;vertical-align:baseline;text-align:center;cursor:pointer;user-select:none;font-size:100%;padding:0.5em 1em;color:rgba(0,0,0,0.8);border:none transparent;background-color:#E6E6E6;text-decoration:none;border-radius:2px;transition:0.1s linear box-shadow;margin-left:0.5em;background-repeat:no-repeat}input.gluon-button::-moz-focus-inner{padding:0;border:0}input.gluon-button:active{box-shadow:0 0 0 1px rgba(0,0,0,0.15) inset,0 0 6px rgba(0,0,0,0.2) inset}input.gluon-button:focus{outline:0}input.gluon-button:hover,input.gluon-button:focus{background-image:linear-gradient(transparent, rgba(0,0,0,0.05) 40%, rgba(0,0,0,0.1))}input.gluon-button[disabled]{border:none;background-image:none;opacity:0.40;cursor:not-allowed;box-shadow:none}input.gluon-button-reset{background-color:#e30;color:#fff}input.gluon-button-submit{background-color:#009ee0;color:#fff}.gluon-input-invalid{background:#e30 !important;color:white}div.gluon-section-remove input{border-bottom:none}textarea{margin-left:-1px;margin-bottom:0.5em}.gluon-section .gluon-rowstyle-1 h3{background-color:#eeeeff;color:#555555}.gluon-rowstyle-2{color:#000000}div.gluon-value{display:flex;flex-direction:row;margin-bottom:0.5em}.gluon-section-node .gluon-value:last-child{margin-bottom:0}.gluon-value-title{flex:2;text-align:right;padding-top:0.39em;padding-right:1em;font-weight:bold}div.gluon-value-field{flex:3;position:relative}div.gluon-value-field input,div.gluon-value-field select,div.gluon-value-field input+label{position:relative}div.gluon-value-field-text{flex:3;padding-top:0.39em}div.gluon-value-field-long{flex:10;position:relative;margin-top:0.65em}div.gluon-value-field-long input,div.gluon-value-field-long select,div.gluon-value-field-long input+label{position:relative}div.gluon-value-field-long-after{flex:2}div.gluon-value-description{font-size:8pt}div.gluon-section-create{clear:left;white-space:nowrap;vertical-align:top}div.gluon-section-create .gluon-button{margin:0.25em}input.gluon-section-create-name{margin-right:-0.25em}div.gluon-map-descr{margin-bottom:1em}.gluon-map-descr:empty,.gluon-section-descr:empty{display:none}.gluon-map-descr,.gluon-section-descr,.gluon-page-actions{padding:1em;background:#ececec}.gluon-page-actions{text-align:right;display:flex;flex-flow:row-reverse}div.gluon-optionals{padding:0.25em;border-bottom:1px dotted #bbbbbb}div.gluon-section-remove{float:right}.gluon-section-node{clear:both;position:relative;border:none}.gluon-section-node-tabbed{border-top-left-radius:0}div.gluon-error{font-size:95%;font-weight:bold;color:#ff0000;background-color:#ffffff}.gluon-value-error input,.gluon-value-error select{background-color:#ffcccc}.gluon-section-error{color:red;background-color:white;font-size:95%;border:1px dotted red;margin:3px;padding:3px}.gluon-value-field var{color:#2222FF}.gluon-add:after,.gluon-remove:after{cursor:pointer;display:inline-block;text-align:center;vertical-align:middle;font-size:180%;width:1.2em;height:1em}.gluon-add{color:#008000;position:relative;left:21em}input+.gluon-add{left:0;top:0.04em}.gluon-add:first-child{top:0.53em;left:-0.08em}.gluon-add:after{content:'+'}.gluon-remove{color:#800000;position:relative;top:-0.03em}.gluon-remove:after{content:'–'}.left{text-align:left !important}.right{text-align:right !important}.inline{display:inline}.error500{border:1px dotted #ff0000;background-color:#ffffff;color:#000000;padding:0.5em}.errorbox{border:1px solid #FF0000;background-color:#FFCCCC;padding:5px;margin-bottom:5px}.errorbox a{color:#000000 !important}.the-key{text-align:left;font-size:1.4em;background:#ffe9b3;border:3pt dashed #dc0067;margin-bottom:0.5em;padding:0.5em} diff --git a/package/gluon-web-theme/sass/cascade.scss b/package/gluon-web-theme/sass/cascade.scss index 8b0d853503d07b44554626d3a34440fd3fec827f..3acd9c83047406babcfe77c625f79f8079603f92 100644 --- a/package/gluon-web-theme/sass/cascade.scss +++ b/package/gluon-web-theme/sass/cascade.scss @@ -305,6 +305,7 @@ input[type=checkbox] { & + label { display: inline-block; + position: relative; width: 1em; height: 1em; margin: 0; @@ -324,6 +325,36 @@ input[type=checkbox] { } } +input[type=radio] { + display: none; + + & + label { + display: inline-block; + position: relative; + width: 0.8em; + height: 0.8em; + padding: 0.5em; + margin: 0.2em 0.2em 0.2em 0.1em; + border: none; + background: lighten($ffyellow, 30); + vertical-align: middle; + border-radius: 50%; + } + + &:checked + label:after { + content: '•'; + color: $ffmagenta; + vertical-align: middle; + position: absolute; + top: 50%; + left: 0; + margin-top: -0.4em; + width: 100%; + text-align: center; + font-size: 2em; + } +} + input[type=submit], input[type=reset], input[type=image], @@ -405,6 +436,7 @@ div.gluon-value { .gluon-value-title { flex: 2; text-align: right; + padding-top: 0.39em; padding-right: 1em; font-weight: bold; } @@ -415,18 +447,21 @@ div.gluon-value-field { input, select, input + label { position: relative; - top: -0.39em; } } +div.gluon-value-field-text { + flex: 3; + padding-top: 0.39em; +} + div.gluon-value-field-long { flex: 10; position: relative; - + margin-top: 0.65em; input, select, input + label { position: relative; - top: -0.39em; } } @@ -533,11 +568,11 @@ div.gluon-error { input + & { left: 0; - top: -0.35em; + top: 0.04em; } &:first-child { - top: 0.04em; + top: 0.53em; left: -0.08em; } @@ -550,7 +585,7 @@ div.gluon-error { color: #800000; position: relative; - top: -0.42em; + top: -0.03em; &:after { content: '–'; diff --git a/package/gluon-web/files/lib/gluon/web/view/model/lvalue.html b/package/gluon-web/files/lib/gluon/web/view/model/lvalue.html index 298c2faacb455c68368d30723ea96cdee7e08630..8cbcc2d77ada9c3779f8adea7ad40cebf142d0dd 100644 --- a/package/gluon-web/files/lib/gluon/web/view/model/lvalue.html +++ b/package/gluon-web/files/lib/gluon/web/view/model/lvalue.html @@ -1,6 +1,5 @@ <% - local i, key - local br = self.orientation == "horizontal" and ' ' or '<br />' + local br = self.orientation == "horizontal" and '   ' or '<br />' %> <% if self.widget == "select" then %> @@ -32,10 +31,10 @@ attr("value", key) .. attr("checked", (self:cfgvalue() == key) and "checked") %> /> - <label<%= attr("for", id.."-"..key)%>></label> + <label<%= attr("for", id.."."..key)%>></label> <%=pcdata(self.vallist[i])%> </label> - <% if i == self.size then write(br) end %> + <% if i ~= #self.keylist then write(br) end %> <% end %> </div> <% end %> diff --git a/package/gluon-web/files/lib/gluon/web/www/static/resources/gluon-web.js b/package/gluon-web/files/lib/gluon/web/www/static/resources/gluon-web.js index 1092176dcbcd8564758eef9c9370e000d28d373a..e572eebd30ff197a97d99234ffc12771d2f9123b 100644 --- a/package/gluon-web/files/lib/gluon/web/www/static/resources/gluon-web.js +++ b/package/gluon-web/files/lib/gluon/web/www/static/resources/gluon-web.js @@ -1 +1 @@ -!function(){var e={};function t(e){return/^-?\d+$/.test(e)?+e:NaN}function n(e){return/^-?\d*\.?\d+?$/.test(e)?+e:NaN}var a={integer:function(){return!isNaN(t(this))},uinteger:function(){return t(this)>=0},float:function(){return!isNaN(n(this))},ufloat:function(){return n(this)>=0},ipaddr:function(){return a.ip4addr.apply(this)||a.ip6addr.apply(this)},ip4addr:function(){var e;return!!(e=this.match(/^(\d{1,3})\.(\d{1,3})\.(\d{1,3})\.(\d{1,3})$/))&&(e[1]>=0&&e[1]<=255&&e[2]>=0&&e[2]<=255&&e[3]>=0&&e[3]<=255&&e[4]>=0&&e[4]<=255)},ip6addr:function(){return this.indexOf("::")<0?null!=this.match(/^(?:[a-f0-9]{1,4}:){7}[a-f0-9]{1,4}$/i):!(this.indexOf(":::")>=0||this.match(/::.+::/)||this.match(/^:[^:]/)||this.match(/[^:]:$/))&&(!!this.match(/^(?:[a-f0-9]{0,4}:){2,7}[a-f0-9]{0,4}$/i)||(!!this.match(/^(?:[a-f0-9]{1,4}:){7}:$/i)||!!this.match(/^:(?::[a-f0-9]{1,4}){7}$/i)))},wpakey:function(){var e=this;return 64==e.length?null!=e.match(/^[a-f0-9]{64}$/i):e.length>=8&&e.length<=63},range:function(e,t){var a=n(this);return a>=+e&&a<=+t},min:function(e){return n(this)>=+e},max:function(e){return n(this)<=+e},irange:function(e,n){var a=t(this);return a>=+e&&a<=+n},imin:function(e){return t(this)>=+e},imax:function(e){return t(this)<=+e},minlength:function(e){return(""+this).length>=+e},maxlength:function(e){return(""+this).length<=+e}};function r(e){for(var t=0;t<e.length;t++){var n=!0;for(var a in e[t])n=n&&(r=a,i=e[t][a],o=void 0,void 0,(d=document.getElementById(r))&&(o="checkbox"==d.type?d.checked:d.value?d.value:""),o==i);if(n)return!0}var r,i,o,d;return!1}function i(){var t=!1;for(var n in e){var a=e[n],o=document.getElementById(n),d=document.getElementById(a.parent);if(o&&o.parentNode&&!r(a.deps))o.parentNode.removeChild(o),t=!0;else if(d&&(!o||!o.parentNode)&&r(a.deps)){var u=void 0;for(u=d.firstChild;u&&!(u.getAttribute&&parseInt(u.getAttribute("data-index"),10)>a.index);u=u.nextSibling);u?d.insertBefore(a.node,u):d.appendChild(a.node),t=!0}d&&d.parentNode&&d.getAttribute("data-optionals")&&(d.parentNode.style.display=d.options.length<=1?"none":"")}t&&i()}function o(e,t,n,a){return e.addEventListener?e.addEventListener(t,n,!!a):e.attachEvent("on"+t,function(){var e=window.event;return!e.target&&e.srcElement&&(e.target=e.srcElement),!!n(e)}),e}function d(e,t){var n=t.prefix;function a(a,l,s){for(var c=[];e.firstChild;){var p=e.firstChild;(f=+p.index)!=s&&("input"==p.nodeName.toLowerCase()?c.push(p.value||""):"select"==p.nodeName.toLowerCase()&&(c[c.length-1]=p.options[p.selectedIndex].value)),e.removeChild(p)}l>=0?(a=l+1,c.splice(l,0,"")):t.optional||0!=c.length||c.push("");for(var f=1;f<=c.length;f++){var v=document.createElement("input");if(v.id=n+"."+f,v.name=n,v.value=c[f-1],v.type="text",v.index=f,v.className="gluon-input-text",t.size&&(v.size=t.size),t.placeholder&&(v.placeholder=t.placeholder),e.appendChild(v),t.type&&u(v,!1,t.type),o(v,"keydown",i),o(v,"keypress",r),f==a)v.focus();else if(-f==a){v.focus();var h=v.value;v.value=" ",v.value=h}if(t.optional||c.length>1)(g=document.createElement("span")).className="gluon-remove",e.appendChild(g),o(g,"click",d(!1)),e.appendChild(document.createElement("br"))}var g;(g=document.createElement("span")).className="gluon-add",e.appendChild(g),o(g,"click",d(!0))}function r(e){var t=(e=e||window.event).target?e.target:e.srcElement;switch(3==t.nodeType&&(t=t.parentNode),e.keyCode){case 8:case 46:return 0!=t.value.length||(e.preventDefault&&e.preventDefault(),!1);case 13:case 38:case 40:return e.preventDefault&&e.preventDefault(),!1}return!0}function i(e){var t,r,i=(e=e||window.event).target?e.target:e.srcElement,o=0;if(i){for(3==i.nodeType&&(i=i.parentNode),o=i.index,t=i.previousSibling;t&&t.name!=n;)t=t.previousSibling;for(r=i.nextSibling;r&&r.name!=n;)r=r.nextSibling}switch(e.keyCode){case 8:case 46:if("select"==i.nodeName.toLowerCase()||0==i.value.length){e.preventDefault&&e.preventDefault();var d=i.index;return 8==e.keyCode&&(d=1-d),a(d,-1,o),!1}break;case 13:a(-1,o,-1);break;case 38:t&&t.focus();break;case 40:r&&r.focus()}return!0}function d(e){return function(t){for(var a=((t=t||window.event).target?t.target:t.srcElement).previousSibling;a&&a.name!=n;)a=a.previousSibling;return e?i({target:a,keyCode:13}):(a.value="",i({target:a,keyCode:8})),!1}}a(NaN,-1,-1)}function u(e,t,n){var r,i,d,u=(d=(r=n).match(/^([^\(]+)\(([^,]+),([^\)]+)\)$/))&&void 0!==(i=a[d[1]])?function(){return i.apply(this,[d[2],d[3]])}:(d=r.match(/^([^\(]+)\(([^,\)]+)\)$/))&&void 0!==(i=a[d[1]])?function(){return i.apply(this,[d[2]])}:a[r];if(u){var l=function(){if(e.form){e.className=e.className.replace(/ gluon-input-invalid/g,"");var n=e.options&&e.options.selectedIndex>-1?e.options[e.options.selectedIndex].value:e.value;0==n.length&&t||u.apply(n)||(e.className+=" gluon-input-invalid")}};o(e,"blur",l),o(e,"keyup",l),"SELECT"==e.nodeName&&(o(e,"change",l),o(e,"click",l)),l()}}!function(){var t,n,a,r,l;t=document.querySelectorAll("[data-depends]");for(var s=0;void 0!==(m=t[s]);s++){var c=parseInt(m.getAttribute("data-index"),10),p=JSON.parse(m.getAttribute("data-depends"));if(!isNaN(c)&&p.length>0)for(var f=0;f<p.length;f++)n=m,a=p[f],r=c,l=void 0,(l=e[n.id])||(l={node:n,parent:n.parentNode.id,deps:[],index:r},e[n.id]=l),l.deps.push(a)}t=document.querySelectorAll("[data-update]");for(s=0;void 0!==(m=t[s]);s++)for(var v,h=m.getAttribute("data-update").split(" "),g=0;void 0!==(v=h[g]);g++)o(m,v,i);t=document.querySelectorAll("[data-type]");for(s=0;void 0!==(m=t[s]);s++)u(m,"true"===m.getAttribute("data-optional"),m.getAttribute("data-type"));t=document.querySelectorAll("[data-dynlist]");var m;for(s=0;void 0!==(m=t[s]);s++){d(m,JSON.parse(m.getAttribute("data-dynlist")))}i()}()}(); \ No newline at end of file +!function(){var e={};function t(e){return/^-?\d+$/.test(e)?+e:NaN}function n(e){return/^-?\d*\.?\d+?$/.test(e)?+e:NaN}var a={integer:function(){return!isNaN(t(this))},uinteger:function(){return t(this)>=0},float:function(){return!isNaN(n(this))},ufloat:function(){return n(this)>=0},ipaddr:function(){return a.ip4addr.apply(this)||a.ip6addr.apply(this)},ip4addr:function(){var e;return!!(e=this.match(/^(\d{1,3})\.(\d{1,3})\.(\d{1,3})\.(\d{1,3})$/))&&(e[1]>=0&&e[1]<=255&&e[2]>=0&&e[2]<=255&&e[3]>=0&&e[3]<=255&&e[4]>=0&&e[4]<=255)},ip6addr:function(){return this.indexOf("::")<0?null!=this.match(/^(?:[a-f0-9]{1,4}:){7}[a-f0-9]{1,4}$/i):!(this.indexOf(":::")>=0||this.match(/::.+::/)||this.match(/^:[^:]/)||this.match(/[^:]:$/))&&(!!this.match(/^(?:[a-f0-9]{0,4}:){2,7}[a-f0-9]{0,4}$/i)||(!!this.match(/^(?:[a-f0-9]{1,4}:){7}:$/i)||!!this.match(/^:(?::[a-f0-9]{1,4}){7}$/i)))},wpakey:function(){var e=this;return 64==e.length?null!=e.match(/^[a-f0-9]{64}$/i):e.length>=8&&e.length<=63},range:function(e,t){var a=n(this);return a>=+e&&a<=+t},min:function(e){return n(this)>=+e},max:function(e){return n(this)<=+e},irange:function(e,n){var a=t(this);return a>=+e&&a<=+n},imin:function(e){return t(this)>=+e},imax:function(e){return t(this)<=+e},minlength:function(e){return(""+this).length>=+e},maxlength:function(e){return(""+this).length<=+e}};function r(e){for(var t=0;t<e.length;t++){var n=!0;for(var a in e[t])n=n&&(r=a,i=e[t][a],o=void 0,(o=document.getElementById(r))?("checkbox"==o.type?o.checked:o.value?o.value:"")==i:"radio"==(o=document.getElementById(r+"."+i)).type&&o.checked);if(n)return!0}var r,i,o;return!1}function i(){var t=!1;for(var n in e){var a=e[n],o=document.getElementById(n),d=document.getElementById(a.parent);if(o&&o.parentNode&&!r(a.deps))o.parentNode.removeChild(o),t=!0;else if(d&&(!o||!o.parentNode)&&r(a.deps)){var u=void 0;for(u=d.firstChild;u&&!(u.getAttribute&&parseInt(u.getAttribute("data-index"),10)>a.index);u=u.nextSibling);u?d.insertBefore(a.node,u):d.appendChild(a.node),t=!0}d&&d.parentNode&&d.getAttribute("data-optionals")&&(d.parentNode.style.display=d.options.length<=1?"none":"")}t&&i()}function o(e,t,n,a){return e.addEventListener?e.addEventListener(t,n,!!a):e.attachEvent("on"+t,function(){var e=window.event;return!e.target&&e.srcElement&&(e.target=e.srcElement),!!n(e)}),e}function d(e,t){var n=t.prefix;function a(a,l,s){for(var c=[];e.firstChild;){var p=e.firstChild;(f=+p.index)!=s&&("input"==p.nodeName.toLowerCase()?c.push(p.value||""):"select"==p.nodeName.toLowerCase()&&(c[c.length-1]=p.options[p.selectedIndex].value)),e.removeChild(p)}l>=0?(a=l+1,c.splice(l,0,"")):t.optional||0!=c.length||c.push("");for(var f=1;f<=c.length;f++){var v=document.createElement("input");if(v.id=n+"."+f,v.name=n,v.value=c[f-1],v.type="text",v.index=f,v.className="gluon-input-text",t.size&&(v.size=t.size),t.placeholder&&(v.placeholder=t.placeholder),e.appendChild(v),t.type&&u(v,!1,t.type),o(v,"keydown",i),o(v,"keypress",r),f==a)v.focus();else if(-f==a){v.focus();var h=v.value;v.value=" ",v.value=h}if(t.optional||c.length>1)(m=document.createElement("span")).className="gluon-remove",e.appendChild(m),o(m,"click",d(!1)),e.appendChild(document.createElement("br"))}var m;(m=document.createElement("span")).className="gluon-add",e.appendChild(m),o(m,"click",d(!0))}function r(e){var t=(e=e||window.event).target?e.target:e.srcElement;switch(3==t.nodeType&&(t=t.parentNode),e.keyCode){case 8:case 46:return 0!=t.value.length||(e.preventDefault&&e.preventDefault(),!1);case 13:case 38:case 40:return e.preventDefault&&e.preventDefault(),!1}return!0}function i(e){var t,r,i=(e=e||window.event).target?e.target:e.srcElement,o=0;if(i){for(3==i.nodeType&&(i=i.parentNode),o=i.index,t=i.previousSibling;t&&t.name!=n;)t=t.previousSibling;for(r=i.nextSibling;r&&r.name!=n;)r=r.nextSibling}switch(e.keyCode){case 8:case 46:if("select"==i.nodeName.toLowerCase()||0==i.value.length){e.preventDefault&&e.preventDefault();var d=i.index;return 8==e.keyCode&&(d=1-d),a(d,-1,o),!1}break;case 13:a(-1,o,-1);break;case 38:t&&t.focus();break;case 40:r&&r.focus()}return!0}function d(e){return function(t){for(var a=((t=t||window.event).target?t.target:t.srcElement).previousSibling;a&&a.name!=n;)a=a.previousSibling;return e?i({target:a,keyCode:13}):(a.value="",i({target:a,keyCode:8})),!1}}a(NaN,-1,-1)}function u(e,t,n){var r,i,d,u=(d=(r=n).match(/^([^\(]+)\(([^,]+),([^\)]+)\)$/))&&void 0!==(i=a[d[1]])?function(){return i.apply(this,[d[2],d[3]])}:(d=r.match(/^([^\(]+)\(([^,\)]+)\)$/))&&void 0!==(i=a[d[1]])?function(){return i.apply(this,[d[2]])}:a[r];if(u){var l=function(){if(e.form){e.className=e.className.replace(/ gluon-input-invalid/g,"");var n=e.options&&e.options.selectedIndex>-1?e.options[e.options.selectedIndex].value:e.value;0==n.length&&t||u.apply(n)||(e.className+=" gluon-input-invalid")}};o(e,"blur",l),o(e,"keyup",l),"SELECT"==e.nodeName&&(o(e,"change",l),o(e,"click",l)),l()}}!function(){var t,n,a,r,l;t=document.querySelectorAll("[data-depends]");for(var s=0;void 0!==(g=t[s]);s++){var c=parseInt(g.getAttribute("data-index"),10),p=JSON.parse(g.getAttribute("data-depends"));if(!isNaN(c)&&p.length>0)for(var f=0;f<p.length;f++)n=g,a=p[f],r=c,l=void 0,(l=e[n.id])||(l={node:n,parent:n.parentNode.id,deps:[],index:r},e[n.id]=l),l.deps.push(a)}t=document.querySelectorAll("[data-update]");for(s=0;void 0!==(g=t[s]);s++)for(var v,h=g.getAttribute("data-update").split(" "),m=0;void 0!==(v=h[m]);m++)o(g,v,i);t=document.querySelectorAll("[data-type]");for(s=0;void 0!==(g=t[s]);s++)u(g,"true"===g.getAttribute("data-optional"),g.getAttribute("data-type"));t=document.querySelectorAll("[data-dynlist]");var g;for(s=0;void 0!==(g=t[s]);s++){d(g,JSON.parse(g.getAttribute("data-dynlist")))}i()}()}(); \ No newline at end of file diff --git a/package/gluon-web/javascript/gluon-web.js b/package/gluon-web/javascript/gluon-web.js index cc5bc21d8d852e65a10d50d223897fe0582b6551..b8989878f27813d997eaf0e0ea60383dd5aab2bc 100644 --- a/package/gluon-web/javascript/gluon-web.js +++ b/package/gluon-web/javascript/gluon-web.js @@ -154,11 +154,16 @@ value = t.value; } else { value = ""; - } + + return (value == ref); + } else { + t = document.getElementById(target + '.' + ref); + return (t.type == "radio" && t.checked); } - return (value == ref) + return false; + } function check(deps) { diff --git a/package/gluon-web/luasrc/usr/lib/lua/gluon/web/model.lua b/package/gluon-web/luasrc/usr/lib/lua/gluon/web/model.lua index 249dddee19638bc107ab40679876c1041a713b9f..e4257930bac22c5a8f13f4957b6bcd35a86d7aa8 100644 --- a/package/gluon-web/luasrc/usr/lib/lua/gluon/web/model.lua +++ b/package/gluon-web/luasrc/usr/lib/lua/gluon/web/model.lua @@ -366,8 +366,6 @@ Value = class(AbstractValue) function Value:__init__(...) AbstractValue.__init__(self, ...) self.subtemplate = "model/value" - self.keylist = {} - self.vallist = {} end