From d6a5274bb92fb0f8174cdf5e6121d319a6995fba Mon Sep 17 00:00:00 2001 From: Hypolite Petovan Date: Thu, 25 Apr 2019 22:17:04 -0400 Subject: [PATCH] [frio] Update theme settings form for use in embed mode - Replace jRange with native slider to prevent overflowing on the right in embed mode - Move color swatch to the left of colorinput fields to prevent overflowing on the right in embed mode --- view/theme/frio/config.php | 2 +- view/theme/frio/css/style.css | 47 -- view/theme/frio/frameworks/jRange/LICENSE | 21 - view/theme/frio/frameworks/jRange/README.md | 5 - .../frameworks/jRange/jquery.range-min.js | 1 - .../frio/frameworks/jRange/jquery.range.css | 173 -------- .../frio/frameworks/jRange/jquery.range.js | 401 ------------------ .../frio/frameworks/jRange/jquery.range.less | 198 --------- .../theme/frio/frameworks/jRange/package.json | 23 - .../theme/frio/templates/field_colorinput.tpl | 2 +- view/theme/frio/templates/theme_settings.tpl | 40 +- 11 files changed, 15 insertions(+), 898 deletions(-) delete mode 100644 view/theme/frio/frameworks/jRange/LICENSE delete mode 100644 view/theme/frio/frameworks/jRange/README.md delete mode 100644 view/theme/frio/frameworks/jRange/jquery.range-min.js delete mode 100644 view/theme/frio/frameworks/jRange/jquery.range.css delete mode 100644 view/theme/frio/frameworks/jRange/jquery.range.js delete mode 100644 view/theme/frio/frameworks/jRange/jquery.range.less delete mode 100644 view/theme/frio/frameworks/jRange/package.json diff --git a/view/theme/frio/config.php b/view/theme/frio/config.php index 7ac7f489e..cd4d7b894 100644 --- a/view/theme/frio/config.php +++ b/view/theme/frio/config.php @@ -30,7 +30,7 @@ function theme_post(App $a) function theme_admin_post(App $a) { - if (!local_user()) { + if (!is_site_admin()) { return; } diff --git a/view/theme/frio/css/style.css b/view/theme/frio/css/style.css index 968e1dd7b..e6b42e52e 100644 --- a/view/theme/frio/css/style.css +++ b/view/theme/frio/css/style.css @@ -3236,53 +3236,6 @@ main .nav-tabs>li.active>a:hover { * Framework overwrite */ -/* jRange */ -.theme-frio .back-bar { - height: 5px !important; - border-radius: 2px; - background-color: #eeeeee; - background-color: #e7e7e7; - background-image: -moz-linear-gradient(top, #eeeeee, #dddddd); - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#eeeeee), to(#dddddd)); - background-image: -webkit-linear-gradient(top, #eeeeee, #dddddd); - background-image: -o-linear-gradient(top, #eeeeee, #dddddd); - background-image: linear-gradient(to bottom, #eeeeee, #dddddd); - background-repeat: repeat-x; - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffeeeeee', endColorstr='#ffdddddd', GradientType=0); -} -.theme-frio .back-bar .selected-bar { - border-radius: 2px; - background-color: $link_color; -/* background-image: -moz-linear-gradient(top, #bdfade, #76fabc); - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#bdfade), to(#76fabc)); - background-image: -webkit-linear-gradient(top, #bdfade, #76fabc); - background-image: -o-linear-gradient(top, #bdfade, #76fabc); - background-image: linear-gradient(to bottom, #bdfade, #76fabc); - background-repeat: repeat-x; - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffbdfade', endColorstr='#ff76fabc', GradientType=0);*/ -} -.theme-frio .back-bar .pointer { - width: 14px !important; - height: 14px !important; - top: -5px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - border-radius: 10px; - border: 1px solid #AAA; - background-color: #e7e7e7 !important; - background-image: -moz-linear-gradient(top, #eeeeee, #dddddd); - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#eeeeee), to(#dddddd)); - background-image: -webkit-linear-gradient(top, #eeeeee, #dddddd); - background-image: -o-linear-gradient(top, #eeeeee, #dddddd); - background-image: linear-gradient(to bottom, #eeeeee, #dddddd); - background-repeat: repeat-x; - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffeeeeee', endColorstr='#ffdddddd', GradientType=0); -} -.theme-frio .back-bar .pointer-label { - color: #999; -} - /* textcomplete for contact filtering*/ #contact-list ul.dropdown-menu.textcomplete-dropdown.media-list { position: relative !important; diff --git a/view/theme/frio/frameworks/jRange/LICENSE b/view/theme/frio/frameworks/jRange/LICENSE deleted file mode 100644 index 8f47b9a63..000000000 --- a/view/theme/frio/frameworks/jRange/LICENSE +++ /dev/null @@ -1,21 +0,0 @@ -The MIT License (MIT) - -Copyright (c) 2014 Nitin Hayaran - -Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal -in the Software without restriction, including without limitation the rights -to use, copy, modify, merge, publish, distribute, sublicense, and/or sell -copies of the Software, and to permit persons to whom the Software is -furnished to do so, subject to the following conditions: - -The above copyright notice and this permission notice shall be included in all -copies or substantial portions of the Software. - -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR -IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, -FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE -AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER -LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, -OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE -SOFTWARE. \ No newline at end of file diff --git a/view/theme/frio/frameworks/jRange/README.md b/view/theme/frio/frameworks/jRange/README.md deleted file mode 100644 index 5cbfe6aa8..000000000 --- a/view/theme/frio/frameworks/jRange/README.md +++ /dev/null @@ -1,5 +0,0 @@ -## jQuery plugin to create Range Selector - -![jRange Preview](http://i.imgur.com/da8uZwx.png) - -[Demo and Documentation](http://nitinhayaran.github.io/jRange/demo/) \ No newline at end of file diff --git a/view/theme/frio/frameworks/jRange/jquery.range-min.js b/view/theme/frio/frameworks/jRange/jquery.range-min.js deleted file mode 100644 index 2bf854e23..000000000 --- a/view/theme/frio/frameworks/jRange/jquery.range-min.js +++ /dev/null @@ -1 +0,0 @@ -!function($,t,i,s){"use strict";var o=function(){return this.init.apply(this,arguments)};o.prototype={defaults:{onstatechange:function(){},ondragend:function(){},onbarclicked:function(){},isRange:!1,showLabels:!0,showScale:!0,step:1,format:"%s",theme:"theme-green",width:300,disable:!1,snap:!1},template:'
123456
456789
',init:function(t,i){this.options=$.extend({},this.defaults,i),this.inputNode=$(t),this.options.value=this.inputNode.val()||(this.options.isRange?this.options.from+","+this.options.from:this.options.from),this.domNode=$(this.template),this.domNode.addClass(this.options.theme),this.inputNode.after(this.domNode),this.domNode.on("change",this.onChange),this.pointers=$(".pointer",this.domNode),this.lowPointer=this.pointers.first(),this.highPointer=this.pointers.last(),this.labels=$(".pointer-label",this.domNode),this.lowLabel=this.labels.first(),this.highLabel=this.labels.last(),this.scale=$(".scale",this.domNode),this.bar=$(".selected-bar",this.domNode),this.clickableBar=this.domNode.find(".clickable-dummy"),this.interval=this.options.to-this.options.from,this.render()},render:function(){return 0!==this.inputNode.width()||this.options.width?(this.options.width=this.options.width||this.inputNode.width(),this.domNode.width(this.options.width),this.inputNode.hide(),this.isSingle()&&(this.lowPointer.hide(),this.lowLabel.hide()),this.options.showLabels||this.labels.hide(),this.attachEvents(),this.options.showScale&&this.renderScale(),void this.setValue(this.options.value)):void console.log("jRange : no width found, returning")},isSingle:function(){return"number"==typeof this.options.value?!0:-1!==this.options.value.indexOf(",")||this.options.isRange?!1:!0},attachEvents:function(){this.clickableBar.click($.proxy(this.barClicked,this)),this.pointers.on("mousedown touchstart",$.proxy(this.onDragStart,this)),this.pointers.bind("dragstart",function(t){t.preventDefault()})},onDragStart:function(t){if(!(this.options.disable||"mousedown"===t.type&&1!==t.which)){t.stopPropagation(),t.preventDefault();var s=$(t.target);this.pointers.removeClass("last-active"),s.addClass("focused last-active"),this[(s.hasClass("low")?"low":"high")+"Label"].addClass("focused"),$(i).on("mousemove.slider touchmove.slider",$.proxy(this.onDrag,this,s)),$(i).on("mouseup.slider touchend.slider touchcancel.slider",$.proxy(this.onDragEnd,this))}},onDrag:function(t,i){i.stopPropagation(),i.preventDefault(),i.originalEvent.touches&&i.originalEvent.touches.length?i=i.originalEvent.touches[0]:i.originalEvent.changedTouches&&i.originalEvent.changedTouches.length&&(i=i.originalEvent.changedTouches[0]);var s=i.clientX-this.domNode.offset().left;this.domNode.trigger("change",[this,t,s])},onDragEnd:function(t){this.pointers.removeClass("focused").trigger("rangeslideend"),this.labels.removeClass("focused"),$(i).off(".slider"),this.options.ondragend.call(this,this.options.value)},barClicked:function(t){if(!this.options.disable){var i=t.pageX-this.clickableBar.offset().left;if(this.isSingle())this.setPosition(this.pointers.last(),i,!0,!0);else{var s=Math.abs(parseFloat(this.pointers.first().css("left"),10)),o=this.pointers.first().width()/2,e=Math.abs(parseFloat(this.pointers.last().css("left"),10)),n=this.pointers.first().width()/2,a=Math.abs(s-i+o),h=Math.abs(e-i+n),l;l=a==h?s>i?this.pointers.first():this.pointers.last():h>a?this.pointers.first():this.pointers.last(),this.setPosition(l,i,!0,!0),this.options.onbarclicked.call(this,this.options.value)}}},onChange:function(t,i,s,o){var e,n;e=0,n=i.domNode.width(),i.isSingle()||(e=s.hasClass("high")?parseFloat(i.lowPointer.css("left"))+i.lowPointer.width()/2:0,n=s.hasClass("low")?parseFloat(i.highPointer.css("left"))+i.highPointer.width()/2:i.domNode.width());var a=Math.min(Math.max(o,e),n);i.setPosition(s,a,!0)},setPosition:function(t,i,s,o){var e,n,a=parseFloat(this.lowPointer.css("left")),h=parseFloat(this.highPointer.css("left"))||0,l=this.highPointer.width()/2;if(s||(i=this.prcToPx(i)),this.options.snap){var r=this.correctPositionForSnap(i);if(-1===r)return;i=r}t[0]===this.highPointer[0]?h=Math.round(i-l):a=Math.round(i-l),t[o?"animate":"css"]({left:Math.round(i-l)}),this.isSingle()?e=0:(e=a+l,n=h+l);var d=Math.round(h+l-e);this.bar[o?"animate":"css"]({width:Math.abs(d),left:d>0?e:e+d}),this.showPointerValue(t,i,o),this.isReadonly()},correctPositionForSnap:function(t){var i=this.positionToValue(t)-this.options.from,s=this.options.width/(this.interval/this.options.step),o=i/this.options.step*s;return o+s/2>=t&&t>=o-s/2?o:-1},setValue:function(t){var i=t.toString().split(",");i[0]=Math.min(Math.max(i[0],this.options.from),this.options.to)+"",i.length>1&&(i[1]=Math.min(Math.max(i[1],this.options.from),this.options.to)+""),this.options.value=t;var s=this.valuesToPrc(2===i.length?i:[0,i[0]]);this.isSingle()?this.setPosition(this.highPointer,s[1]):(this.setPosition(this.lowPointer,s[0]),this.setPosition(this.highPointer,s[1]))},renderScale:function(){for(var t=this.options.scale||[this.options.from,this.options.to],i=Math.round(100/(t.length-1)*10)/10,s="",o=0;o'+("|"!=t[o]?""+t[o]+"":"")+"";this.scale.html(s),$("ins",this.scale).each(function(){$(this).css({marginLeft:-$(this).outerWidth()/2})})},getBarWidth:function(){var t=this.options.value.split(",");return t.length>1?parseFloat(t[1])-parseFloat(t[0]):parseFloat(t[0])},showPointerValue:function(t,i,o){var e=$(".pointer-label",this.domNode)[t.hasClass("low")?"first":"last"](),n,a=this.positionToValue(i);if($.isFunction(this.options.format)){var h=this.isSingle()?s:t.hasClass("low")?"low":"high";n=this.options.format(a,h)}else n=this.options.format.replace("%s",a);var l=e.html(n).width(),r=i-l/2;r=Math.min(Math.max(r,0),this.options.width-l),e[o?"animate":"css"]({left:r}),this.setInputValue(t,a)},valuesToPrc:function(t){var i=100*(parseFloat(t[0])-parseFloat(this.options.from))/this.interval,s=100*(parseFloat(t[1])-parseFloat(this.options.from))/this.interval;return[i,s]},prcToPx:function(t){return this.domNode.width()*t/100},isDecimal:function(){return-1===(this.options.value+this.options.from+this.options.to).indexOf(".")?!1:!0},positionToValue:function(t){var i=t/this.domNode.width()*this.interval;if(i=parseFloat(i,10)+parseFloat(this.options.from,10),this.isDecimal()){var s=Math.round(Math.round(i/this.options.step)*this.options.step*100)/100;if(0!==s)for(s=""+s,-1===s.indexOf(".")&&(s+=".");s.length-s.indexOf(".")<3;)s+="0";else s="0.00";return s}return Math.round(i/this.options.step)*this.options.step},setInputValue:function(t,i){if(this.isSingle())this.options.value=i.toString();else{var s=this.options.value.split(",");t.hasClass("low")?this.options.value=i+","+s[1]:this.options.value=s[0]+","+i}this.inputNode.val()!==this.options.value&&(this.inputNode.val(this.options.value).trigger("change"),this.options.onstatechange.call(this,this.options.value))},getValue:function(){return this.options.value},getOptions:function(){return this.options},getRange:function(){return this.options.from+","+this.options.to},isReadonly:function(){this.domNode.toggleClass("slider-readonly",this.options.disable)},disable:function(){this.options.disable=!0,this.isReadonly()},enable:function(){this.options.disable=!1,this.isReadonly()},toggleDisable:function(){this.options.disable=!this.options.disable,this.isReadonly()},updateRange:function(t,i){var s=t.toString().split(",");this.interval=parseInt(s[1])-parseInt(s[0]),i?this.setValue(i):this.setValue(this.getValue())}};var e="jRange";$.fn[e]=function(i){var s=arguments,n;return this.each(function(){var a=$(this),h=$.data(this,"plugin_"+e),l="object"==typeof i&&i;h||(a.data("plugin_"+e,h=new o(this,l)),$(t).resize(function(){h.setValue(h.getValue())})),"string"==typeof i&&(n=h[i].apply(h,Array.prototype.slice.call(s,1)))}),n||this}}(jQuery,window,document); \ No newline at end of file diff --git a/view/theme/frio/frameworks/jRange/jquery.range.css b/view/theme/frio/frameworks/jRange/jquery.range.css deleted file mode 100644 index 62dc15b4f..000000000 --- a/view/theme/frio/frameworks/jRange/jquery.range.css +++ /dev/null @@ -1,173 +0,0 @@ -.slider-container { - width: 300px; - font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; -} -.slider-container .back-bar { - height: 10px; - position: relative; -} -.slider-container .back-bar .selected-bar { - position: absolute; - height: 100%; -} -.slider-container .back-bar .pointer { - position: absolute; - width: 10px; - height: 10px; - background-color: red; - cursor: col-resize; - opacity: 1; - z-index: 2; -} -.slider-container .back-bar .pointer.last-active { - z-index: 3; -} -.slider-container .back-bar .pointer-label { - position: absolute; - top: -17px; - font-size: 8px; - background: white; - white-space: nowrap; - line-height: 1; -} -.slider-container .back-bar .focused { - z-index: 10; -} -.slider-container .clickable-dummy { - cursor: pointer; - position: absolute; - width: 100%; - height: 100%; - z-index: 1; -} -.slider-container .scale { - top: 2px; - position: relative; -} -.slider-container .scale span { - position: absolute; - height: 5px; - border-left: 1px solid #999; - font-size: 0; -} -.slider-container .scale ins { - font-size: 9px; - text-decoration: none; - position: absolute; - left: 0; - top: 5px; - color: #999; - line-height: 1; -} -.slider-container.slider-readonly .clickable-dummy, -.slider-container.slider-readonly .pointer { - cursor: auto; -} -.theme-green .back-bar { - height: 5px; - border-radius: 2px; - background-color: #eeeeee; - background-color: #e7e7e7; - background-image: -moz-linear-gradient(top, #eeeeee, #dddddd); - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#eeeeee), to(#dddddd)); - background-image: -webkit-linear-gradient(top, #eeeeee, #dddddd); - background-image: -o-linear-gradient(top, #eeeeee, #dddddd); - background-image: linear-gradient(to bottom, #eeeeee, #dddddd); - background-repeat: repeat-x; - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffeeeeee', endColorstr='#ffdddddd', GradientType=0); -} -.theme-green .back-bar .selected-bar { - border-radius: 2px; - background-color: #a1fad0; - background-image: -moz-linear-gradient(top, #bdfade, #76fabc); - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#bdfade), to(#76fabc)); - background-image: -webkit-linear-gradient(top, #bdfade, #76fabc); - background-image: -o-linear-gradient(top, #bdfade, #76fabc); - background-image: linear-gradient(to bottom, #bdfade, #76fabc); - background-repeat: repeat-x; - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffbdfade', endColorstr='#ff76fabc', GradientType=0); -} -.theme-green .back-bar .pointer { - width: 14px; - height: 14px; - top: -5px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - border-radius: 10px; - border: 1px solid #AAA; - background-color: #e7e7e7; - background-image: -moz-linear-gradient(top, #eeeeee, #dddddd); - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#eeeeee), to(#dddddd)); - background-image: -webkit-linear-gradient(top, #eeeeee, #dddddd); - background-image: -o-linear-gradient(top, #eeeeee, #dddddd); - background-image: linear-gradient(to bottom, #eeeeee, #dddddd); - background-repeat: repeat-x; - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffeeeeee', endColorstr='#ffdddddd', GradientType=0); -} -.theme-green .back-bar .pointer-label { - color: #999; -} -.theme-green .back-bar .focused { - color: #333; -} -.theme-green .scale span { - border-left: 1px solid #e5e5e5; -} -.theme-green .scale ins { - color: #999; -} -.theme-blue .back-bar { - height: 5px; - border-radius: 2px; - background-color: #eeeeee; - background-color: #e7e7e7; - background-image: -moz-linear-gradient(top, #eeeeee, #dddddd); - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#eeeeee), to(#dddddd)); - background-image: -webkit-linear-gradient(top, #eeeeee, #dddddd); - background-image: -o-linear-gradient(top, #eeeeee, #dddddd); - background-image: linear-gradient(to bottom, #eeeeee, #dddddd); - background-repeat: repeat-x; - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffeeeeee', endColorstr='#ffdddddd', GradientType=0); -} -.theme-blue .back-bar .selected-bar { - border-radius: 2px; - background-color: #92c1f9; - background-image: -moz-linear-gradient(top, #b1d1f9, #64a8f9); - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#b1d1f9), to(#64a8f9)); - background-image: -webkit-linear-gradient(top, #b1d1f9, #64a8f9); - background-image: -o-linear-gradient(top, #b1d1f9, #64a8f9); - background-image: linear-gradient(to bottom, #b1d1f9, #64a8f9); - background-repeat: repeat-x; - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffb1d1f9', endColorstr='#ff64a8f9', GradientType=0); -} -.theme-blue .back-bar .pointer { - width: 14px; - height: 14px; - top: -5px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - border-radius: 10px; - border: 1px solid #AAA; - background-color: #e7e7e7; - background-image: -moz-linear-gradient(top, #eeeeee, #dddddd); - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#eeeeee), to(#dddddd)); - background-image: -webkit-linear-gradient(top, #eeeeee, #dddddd); - background-image: -o-linear-gradient(top, #eeeeee, #dddddd); - background-image: linear-gradient(to bottom, #eeeeee, #dddddd); - background-repeat: repeat-x; - filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffeeeeee', endColorstr='#ffdddddd', GradientType=0); -} -.theme-blue .back-bar .pointer-label { - color: #999; -} -.theme-blue .back-bar .focused { - color: #333; -} -.theme-blue .scale span { - border-left: 1px solid #e5e5e5; -} -.theme-blue .scale ins { - color: #999; -} diff --git a/view/theme/frio/frameworks/jRange/jquery.range.js b/view/theme/frio/frameworks/jRange/jquery.range.js deleted file mode 100644 index 188ee749d..000000000 --- a/view/theme/frio/frameworks/jRange/jquery.range.js +++ /dev/null @@ -1,401 +0,0 @@ -/*jshint multistr:true, curly: false */ -/*global jQuery:false, define: false */ -/** - * jRange - Awesome range control - * - * Written by - * ---------- - * Nitin Hayaran (nitinhayaran@gmail.com) - * - * Licensed under the MIT (MIT-LICENSE.txt). - * - * @author Nitin Hayaran - * @version 0.1-RELEASE - * - * Dependencies - * ------------ - * jQuery (http://jquery.com) - * - **/ -; -(function($, window, document, undefined) { - 'use strict'; - - var jRange = function() { - return this.init.apply(this, arguments); - }; - jRange.prototype = { - defaults: { - onstatechange: function() {}, - ondragend: function() {}, - onbarclicked: function() {}, - isRange: false, - showLabels: true, - showScale: true, - step: 1, - format: '%s', - theme: 'theme-green', - width: 300, - disable: false, - snap: false - }, - template: '
\ -
\ -
\ -
123456
\ -
456789
\ -
\ -
\ -
\ -
', - init: function(node, options) { - this.options = $.extend({}, this.defaults, options); - this.inputNode = $(node); - this.options.value = this.inputNode.val() || (this.options.isRange ? this.options.from + ',' + this.options.from : this.options.from); - this.domNode = $(this.template); - this.domNode.addClass(this.options.theme); - this.inputNode.after(this.domNode); - this.domNode.on('change', this.onChange); - this.pointers = $('.pointer', this.domNode); - this.lowPointer = this.pointers.first(); - this.highPointer = this.pointers.last(); - this.labels = $('.pointer-label', this.domNode); - this.lowLabel = this.labels.first(); - this.highLabel = this.labels.last(); - this.scale = $('.scale', this.domNode); - this.bar = $('.selected-bar', this.domNode); - this.clickableBar = this.domNode.find('.clickable-dummy'); - this.interval = this.options.to - this.options.from; - this.render(); - }, - render: function() { - // Check if inputNode is visible, and have some width, so that we can set slider width accordingly. - if (this.inputNode.width() === 0 && !this.options.width) { - console.log('jRange : no width found, returning'); - return; - } else { - this.options.width = this.options.width || this.inputNode.width(); - this.domNode.width(this.options.width); - this.inputNode.hide(); - } - - if (this.isSingle()) { - this.lowPointer.hide(); - this.lowLabel.hide(); - } - if (!this.options.showLabels) { - this.labels.hide(); - } - this.attachEvents(); - if (this.options.showScale) { - this.renderScale(); - } - this.setValue(this.options.value); - }, - isSingle: function() { - if (typeof(this.options.value) === 'number') { - return true; - } - return (this.options.value.indexOf(',') !== -1 || this.options.isRange) ? - false : true; - }, - attachEvents: function() { - this.clickableBar.click($.proxy(this.barClicked, this)); - this.pointers.on('mousedown touchstart', $.proxy(this.onDragStart, this)); - this.pointers.bind('dragstart', function(event) { - event.preventDefault(); - }); - }, - onDragStart: function(e) { - if ( this.options.disable || (e.type === 'mousedown' && e.which !== 1)) { - return; - } - e.stopPropagation(); - e.preventDefault(); - var pointer = $(e.target); - this.pointers.removeClass('last-active'); - pointer.addClass('focused last-active'); - this[(pointer.hasClass('low') ? 'low' : 'high') + 'Label'].addClass('focused'); - $(document).on('mousemove.slider touchmove.slider', $.proxy(this.onDrag, this, pointer)); - $(document).on('mouseup.slider touchend.slider touchcancel.slider', $.proxy(this.onDragEnd, this)); - }, - onDrag: function(pointer, e) { - e.stopPropagation(); - e.preventDefault(); - - if (e.originalEvent.touches && e.originalEvent.touches.length) { - e = e.originalEvent.touches[0]; - } else if (e.originalEvent.changedTouches && e.originalEvent.changedTouches.length) { - e = e.originalEvent.changedTouches[0]; - } - - var position = e.clientX - this.domNode.offset().left; - this.domNode.trigger('change', [this, pointer, position]); - }, - onDragEnd: function(e) { - this.pointers.removeClass('focused') - .trigger('rangeslideend'); - this.labels.removeClass('focused'); - $(document).off('.slider'); - this.options.ondragend.call(this, this.options.value); - }, - barClicked: function(e) { - if(this.options.disable) return; - var x = e.pageX - this.clickableBar.offset().left; - if (this.isSingle()) - this.setPosition(this.pointers.last(), x, true, true); - else { - var firstLeft = Math.abs(parseFloat(this.pointers.first().css('left'), 10)), - firstHalfWidth = this.pointers.first().width() / 2, - lastLeft = Math.abs(parseFloat(this.pointers.last().css('left'), 10)), - lastHalfWidth = this.pointers.first().width() / 2, - leftSide = Math.abs(firstLeft - x + firstHalfWidth), - rightSide = Math.abs(lastLeft - x + lastHalfWidth), - pointer; - - if(leftSide == rightSide) { - pointer = x < firstLeft ? this.pointers.first() : this.pointers.last(); - } else { - pointer = leftSide < rightSide ? this.pointers.first() : this.pointers.last(); - } - this.setPosition(pointer, x, true, true); - } - this.options.onbarclicked.call(this, this.options.value); - }, - onChange: function(e, self, pointer, position) { - var min, max; - min = 0; - max = self.domNode.width(); - - if (!self.isSingle()) { - min = pointer.hasClass('high') ? parseFloat(self.lowPointer.css("left")) + (self.lowPointer.width() / 2) : 0; - max = pointer.hasClass('low') ? parseFloat(self.highPointer.css("left")) + (self.highPointer.width() / 2) : self.domNode.width(); - } - - var value = Math.min(Math.max(position, min), max); - self.setPosition(pointer, value, true); - }, - setPosition: function(pointer, position, isPx, animate) { - var leftPos, rightPos, - lowPos = parseFloat(this.lowPointer.css("left")), - highPos = parseFloat(this.highPointer.css("left")) || 0, - circleWidth = this.highPointer.width() / 2; - if (!isPx) { - position = this.prcToPx(position); - } - if(this.options.snap){ - var expPos = this.correctPositionForSnap(position); - if(expPos === -1){ - return; - }else{ - position = expPos; - } - } - if (pointer[0] === this.highPointer[0]) { - highPos = Math.round(position - circleWidth); - } else { - lowPos = Math.round(position - circleWidth); - } - pointer[animate ? 'animate' : 'css']({ - 'left': Math.round(position - circleWidth) - }); - if (this.isSingle()) { - leftPos = 0; - } else { - leftPos = lowPos + circleWidth; - rightPos = highPos + circleWidth; - } - var w = Math.round(highPos + circleWidth - leftPos); - this.bar[animate ? 'animate' : 'css']({ - 'width': Math.abs(w), - 'left': (w>0) ? leftPos : leftPos + w - }); - this.showPointerValue(pointer, position, animate); - this.isReadonly(); - }, - correctPositionForSnap: function(position){ - var currentValue = this.positionToValue(position) - this.options.from; - var diff = this.options.width / (this.interval / this.options.step), - expectedPosition = (currentValue / this.options.step) * diff; - if( position <= expectedPosition + diff / 2 && position >= expectedPosition - diff / 2){ - return expectedPosition; - }else{ - return -1; - } - }, - // will be called from outside - setValue: function(value) { - var values = value.toString().split(','); - values[0] = Math.min(Math.max(values[0], this.options.from), this.options.to) + ''; - if (values.length > 1){ - values[1] = Math.min(Math.max(values[1], this.options.from), this.options.to) + ''; - } - this.options.value = value; - var prc = this.valuesToPrc(values.length === 2 ? values : [0, values[0]]); - if (this.isSingle()) { - this.setPosition(this.highPointer, prc[1]); - } else { - this.setPosition(this.lowPointer, prc[0]); - this.setPosition(this.highPointer, prc[1]); - } - }, - renderScale: function() { - var s = this.options.scale || [this.options.from, this.options.to]; - var prc = Math.round((100 / (s.length - 1)) * 10) / 10; - var str = ''; - for (var i = 0; i < s.length; i++) { - str += '' + (s[i] != '|' ? '' + s[i] + '' : '') + ''; - } - this.scale.html(str); - - $('ins', this.scale).each(function() { - $(this).css({ - marginLeft: -$(this).outerWidth() / 2 - }); - }); - }, - getBarWidth: function() { - var values = this.options.value.split(','); - if (values.length > 1) { - return parseFloat(values[1]) - parseFloat(values[0]); - } else { - return parseFloat(values[0]); - } - }, - showPointerValue: function(pointer, position, animate) { - var label = $('.pointer-label', this.domNode)[pointer.hasClass('low') ? 'first' : 'last'](); - var text; - var value = this.positionToValue(position); - // Is it higer or lower than it should be? - - if ($.isFunction(this.options.format)) { - var type = this.isSingle() ? undefined : (pointer.hasClass('low') ? 'low' : 'high'); - text = this.options.format(value, type); - } else { - text = this.options.format.replace('%s', value); - } - - var width = label.html(text).width(), - left = position - width / 2; - left = Math.min(Math.max(left, 0), this.options.width - width); - label[animate ? 'animate' : 'css']({ - left: left - }); - this.setInputValue(pointer, value); - }, - valuesToPrc: function(values) { - var lowPrc = ((parseFloat(values[0]) - parseFloat(this.options.from)) * 100 / this.interval), - highPrc = ((parseFloat(values[1]) - parseFloat(this.options.from)) * 100 / this.interval); - return [lowPrc, highPrc]; - }, - prcToPx: function(prc) { - return (this.domNode.width() * prc) / 100; - }, - isDecimal: function() { - return ((this.options.value + this.options.from + this.options.to).indexOf(".")===-1) ? false : true; - }, - positionToValue: function(pos) { - var value = (pos / this.domNode.width()) * this.interval; - value = parseFloat(value, 10) + parseFloat(this.options.from, 10); - if (this.isDecimal()) { - var final = Math.round(Math.round(value / this.options.step) * this.options.step *100)/100; - if (final!==0.0) { - final = '' + final; - if (final.indexOf(".")===-1) { - final = final + "."; - } - while (final.length - final.indexOf('.')<3) { - final = final + "0"; - } - } else { - final = "0.00"; - } - return final; - } else { - return Math.round(value / this.options.step) * this.options.step; - } - }, - setInputValue: function(pointer, v) { - // if(!isChanged) return; - if (this.isSingle()) { - this.options.value = v.toString(); - } else { - var values = this.options.value.split(','); - if (pointer.hasClass('low')) { - this.options.value = v + ',' + values[1]; - } else { - this.options.value = values[0] + ',' + v; - } - } - if (this.inputNode.val() !== this.options.value) { - this.inputNode.val(this.options.value) - .trigger('change'); - this.options.onstatechange.call(this, this.options.value); - } - }, - getValue: function() { - return this.options.value; - }, - getOptions: function() { - return this.options; - }, - getRange: function() { - return this.options.from + "," + this.options.to; - }, - isReadonly: function(){ - this.domNode.toggleClass('slider-readonly', this.options.disable); - }, - disable: function(){ - this.options.disable = true; - this.isReadonly(); - }, - enable: function(){ - this.options.disable = false; - this.isReadonly(); - }, - toggleDisable: function(){ - this.options.disable = !this.options.disable; - this.isReadonly(); - }, - updateRange: function(range, value) { - var values = range.toString().split(','); - this.interval = parseInt(values[1]) - parseInt(values[0]); - if(value){ - this.setValue(value); - }else{ - this.setValue(this.getValue()); - } - } - }; - - var pluginName = 'jRange'; - // A really lightweight plugin wrapper around the constructor, - // preventing against multiple instantiations - $.fn[pluginName] = function(option) { - var args = arguments, - result; - - this.each(function() { - var $this = $(this), - data = $.data(this, 'plugin_' + pluginName), - options = typeof option === 'object' && option; - if (!data) { - $this.data('plugin_' + pluginName, (data = new jRange(this, options))); - $(window).resize(function() { - data.setValue(data.getValue()); - }); // Update slider position when window is resized to keep it in sync with scale - } - // if first argument is a string, call silimarly named function - // this gives flexibility to call functions of the plugin e.g. - // - $('.dial').plugin('destroy'); - // - $('.dial').plugin('render', $('.new-child')); - if (typeof option === 'string') { - result = data[option].apply(data, Array.prototype.slice.call(args, 1)); - } - }); - - // To enable plugin returns values - return result || this; - }; - -})(jQuery, window, document); diff --git a/view/theme/frio/frameworks/jRange/jquery.range.less b/view/theme/frio/frameworks/jRange/jquery.range.less deleted file mode 100644 index 4034bdd66..000000000 --- a/view/theme/frio/frameworks/jRange/jquery.range.less +++ /dev/null @@ -1,198 +0,0 @@ -#gradient { - .horizontal(@startColor: #555, @endColor: #333) { - background-color: @endColor; - background-image: -moz-linear-gradient(left, @startColor, @endColor); // FF 3.6+ - background-image: -webkit-gradient(linear, 0 0, 100% 0, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+ - background-image: -webkit-linear-gradient(left, @startColor, @endColor); // Safari 5.1+, Chrome 10+ - background-image: -o-linear-gradient(left, @startColor, @endColor); // Opera 11.10 - background-image: linear-gradient(to right, @startColor, @endColor); // Standard, IE10 - background-repeat: repeat-x; - filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)",argb(@startColor),argb(@endColor))); // IE9 and down - } - .vertical(@startColor: #555, @endColor: #333) { - background-color: mix(@startColor, @endColor, 60%); - background-image: -moz-linear-gradient(top, @startColor, @endColor); // FF 3.6+ - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), to(@endColor)); // Safari 4+, Chrome 2+ - background-image: -webkit-linear-gradient(top, @startColor, @endColor); // Safari 5.1+, Chrome 10+ - background-image: -o-linear-gradient(top, @startColor, @endColor); // Opera 11.10 - background-image: linear-gradient(to bottom, @startColor, @endColor); // Standard, IE10 - background-repeat: repeat-x; - filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@startColor),argb(@endColor))); // IE9 and down - } - .directional(@startColor: #555, @endColor: #333, @deg: 45deg) { - background-color: @endColor; - background-repeat: repeat-x; - background-image: -moz-linear-gradient(@deg, @startColor, @endColor); // FF 3.6+ - background-image: -webkit-linear-gradient(@deg, @startColor, @endColor); // Safari 5.1+, Chrome 10+ - background-image: -o-linear-gradient(@deg, @startColor, @endColor); // Opera 11.10 - background-image: linear-gradient(@deg, @startColor, @endColor); // Standard, IE10 - } - .vertical-three-colors(@startColor: #00b3ee, @midColor: #7a43b6, @colorStop: 50%, @endColor: #c3325f) { - background-color: mix(@midColor, @endColor, 80%); - background-image: -webkit-gradient(linear, 0 0, 0 100%, from(@startColor), color-stop(@colorStop, @midColor), to(@endColor)); - background-image: -webkit-linear-gradient(@startColor, @midColor @colorStop, @endColor); - background-image: -moz-linear-gradient(top, @startColor, @midColor @colorStop, @endColor); - background-image: -o-linear-gradient(@startColor, @midColor @colorStop, @endColor); - background-image: linear-gradient(@startColor, @midColor @colorStop, @endColor); - background-repeat: no-repeat; - filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)",argb(@startColor),argb(@endColor))); // IE9 and down, gets no color-stop at all for proper fallback - } - .radial(@innerColor: #555, @outerColor: #333) { - background-color: @outerColor; - background-image: -webkit-gradient(radial, center center, 0, center center, 460, from(@innerColor), to(@outerColor)); - background-image: -webkit-radial-gradient(circle, @innerColor, @outerColor); - background-image: -moz-radial-gradient(circle, @innerColor, @outerColor); - background-image: -o-radial-gradient(circle, @innerColor, @outerColor); - background-repeat: no-repeat; - } - .striped(@color: #555, @angle: 45deg) { - background-color: @color; - background-image: -webkit-gradient(linear, 0 100%, 100% 0, color-stop(.25, rgba(255,255,255,.15)), color-stop(.25, transparent), color-stop(.5, transparent), color-stop(.5, rgba(255,255,255,.15)), color-stop(.75, rgba(255,255,255,.15)), color-stop(.75, transparent), to(transparent)); - background-image: -webkit-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent); - background-image: -moz-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent); - background-image: -o-linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent); - background-image: linear-gradient(@angle, rgba(255,255,255,.15) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.15) 50%, rgba(255,255,255,.15) 75%, transparent 75%, transparent); - } -} - -.slider-container { - width: 300px; - font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; - .back-bar { - height: 10px; - position: relative; - .selected-bar { - position: absolute; - height: 100%; - } - .pointer { - position: absolute; - width: 10px; - height: 10px; - background-color: red; - cursor: col-resize; - opacity: 1; - z-index: 2; - &.last-active{ - z-index: 3; - } - } - .pointer-label { - position: absolute; - top: -17px; - font-size: 8px; - background: white; - white-space: nowrap; - line-height: 1; - } - .focused { - z-index: 10; - } - } - .clickable-dummy { - cursor: pointer; - position: absolute; - width: 100%; - height: 100%; - z-index: 1; - } - .scale { - top: 2px; - position: relative; - span { - position: absolute; - height: 5px; - border-left: 1px solid #999; - font-size: 0; - } - ins { - font-size: 9px; - text-decoration: none; - position: absolute; - left: 0; - top: 5px; - color: #999; - line-height: 1; - } - } - &.slider-readonly{ - .clickable-dummy, .pointer { - cursor: auto; - } - } -} -.theme-green { - .back-bar { - height: 5px; - border-radius: 2px; - background-color: #eeeeee; - #gradient > .vertical(#eeeeee, #dddddd); - .selected-bar { - border-radius: 2px; - #gradient > .vertical(#bdfade, #76fabc); - } - .pointer { - width: 14px; - height: 14px; - top: -5px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - border-radius: 10px; - border: 1px solid #AAA; - #gradient > .vertical(#eeeeee, #dddddd); - } - .pointer-label { - color: #999; - } - .focused { - color: #333; - } - } - .scale { - span { - border-left: 1px solid #e5e5e5; - } - ins { - color: #999; - } - } -} - -.theme-blue { - .back-bar { - height: 5px; - border-radius: 2px; - background-color: #eeeeee; - #gradient > .vertical(#eeeeee, #dddddd); - .selected-bar { - border-radius: 2px; - #gradient > .vertical(#b1d1f9, #64a8f9); - } - .pointer { - width: 14px; - height: 14px; - top: -5px; - -webkit-box-sizing: border-box; - -moz-box-sizing: border-box; - box-sizing: border-box; - border-radius: 10px; - border: 1px solid #AAA; - #gradient > .vertical(#eeeeee, #dddddd); - } - .pointer-label { - color: #999; - } - .focused { - color: #333; - } - } - .scale { - span { - border-left: 1px solid #e5e5e5; - } - ins { - color: #999; - } - } -} diff --git a/view/theme/frio/frameworks/jRange/package.json b/view/theme/frio/frameworks/jRange/package.json deleted file mode 100644 index 25d0cd3d9..000000000 --- a/view/theme/frio/frameworks/jRange/package.json +++ /dev/null @@ -1,23 +0,0 @@ -{ - "name": "jquery-range", - "version": "1.0.0", - "description": "jQuery plugin to create range selector", - "main": "jquery.range-min.js", - "scripts": { - "test": "echo \"Error: no test specified\" && exit 1" - }, - "repository": { - "type": "git", - "url": "git+https://github.com/nitinhayaran/jRange.git" - }, - "keywords": [ - "jquery", - "range" - ], - "author": "Nitin Hayaran ", - "license": "ISC", - "bugs": { - "url": "https://github.com/nitinhayaran/jRange/issues" - }, - "homepage": "https://github.com/nitinhayaran/jRange#readme" -} diff --git a/view/theme/frio/templates/field_colorinput.tpl b/view/theme/frio/templates/field_colorinput.tpl index 285501ef3..c4affb7ee 100644 --- a/view/theme/frio/templates/field_colorinput.tpl +++ b/view/theme/frio/templates/field_colorinput.tpl @@ -2,9 +2,9 @@
+ {{if $field.4}}{{$field.4}}{{/if}} -
{{if $field.3}} {{$field.3 nofilter}} diff --git a/view/theme/frio/templates/theme_settings.tpl b/view/theme/frio/templates/theme_settings.tpl index b84f5f28a..3ac6282ca 100644 --- a/view/theme/frio/templates/theme_settings.tpl +++ b/view/theme/frio/templates/theme_settings.tpl @@ -1,7 +1,4 @@ - - - {{include file="field_select.tpl" field=$scheme}} @@ -17,7 +14,19 @@ {{if $contentbg_transp}}
- + +
+
+ +
+
+
+ + % +
+
+
+ {{$contentbg_transp.3}}
@@ -171,25 +180,6 @@ if($("#id_frio_background_image").val().length != 0) { $("#frio_bg_image_options").show(); } - - $('.slider-input').jRange({ - from: 0, - to: 100, - step: 1, - scale: [0,10,20,30,40,50,60,70,80,90,100], - format: '%s', - width: '100%', - showLabels: true, - theme: 'theme-frio', - }); - - // The position of the slider is wrong calculated on hidden elements. - // So set an event listener toggle and update the jRange value. - $(document).on('click', '#custom-settings-title a', function() { - var bgTransp = $('#frio_contentbg_transp').val(); - $('.slider-input').jRange('setValue', bgTransp); - }); - }); @@ -197,7 +187,3 @@
- -