- 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
function theme_admin_post(App $a)
{
- if (!local_user()) {
+ if (!is_site_admin()) {
return;
}
* 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;
+++ /dev/null
-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
+++ /dev/null
-## jQuery plugin to create Range Selector
-
-
-
-[Demo and Documentation](http://nitinhayaran.github.io/jRange/demo/)
\ No newline at end of file
+++ /dev/null
-!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:'<div class="slider-container"> <div class="back-bar"> <div class="selected-bar"></div> <div class="pointer low"></div><div class="pointer-label low">123456</div> <div class="pointer high"></div><div class="pointer-label high">456789</div> <div class="clickable-dummy"></div> </div> <div class="scale"></div> </div>',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.length;o++)s+='<span style="left: '+o*i+'%">'+("|"!=t[o]?"<ins>"+t[o]+"</ins>":"")+"</span>";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
+++ /dev/null
-.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;
-}
+++ /dev/null
-/*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: '<div class="slider-container">\
- <div class="back-bar">\
- <div class="selected-bar"></div>\
- <div class="pointer low"></div><div class="pointer-label low">123456</div>\
- <div class="pointer high"></div><div class="pointer-label high">456789</div>\
- <div class="clickable-dummy"></div>\
- </div>\
- <div class="scale"></div>\
- </div>',
- 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 += '<span style="left: ' + i * prc + '%">' + (s[i] != '|' ? '<ins>' + s[i] + '</ins>' : '') + '</span>';
- }
- 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);
+++ /dev/null
-#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;
- }
- }
-}
+++ /dev/null
-{
- "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 <nitinhayaran@gmail.com>",
- "license": "ISC",
- "bugs": {
- "url": "https://github.com/nitinhayaran/jRange/issues"
- },
- "homepage": "https://github.com/nitinhayaran/jRange#readme"
-}
<div class="form-group field input color">
<label for="id_{{$field.0}}" id="label_{{$field.0}}">{{$field.1}}</label>
<div class="input-group" id="{{$field.0}}">
+ <span class="input-group-addon"><i></i></span>
<input class="form-control color" name="{{$field.0}}" id="id_{{$field.0}}" type="text" value="{{$field.2 nofilter}}" aria-describedby="{{$field.0}}_tip">
{{if $field.4}}<span class="required">{{$field.4}}</span>{{/if}}
- <span class="input-group-addon"><i></i></span>
</div>
{{if $field.3}}
<span class="help-block" id="{{$field.0}}_tip" role="tooltip">{{$field.3 nofilter}}</span>
-
-<link rel="stylesheet" href="{{$baseurl}}/view/theme/frio/frameworks/jRange/jquery.range.css" type="text/css" media="screen" />
<script src="{{$baseurl}}/view/theme/quattro/jquery.tools.min.js"></script>
-<script src="{{$baseurl}}/view/theme/frio/frameworks/jRange/jquery.range.js"></script>
<script type="text/javascript" src="{{$baseurl}}/view/js/ajaxupload.js" ></script>
{{include file="field_select.tpl" field=$scheme}}
{{if $contentbg_transp}}
<div class="form-group field input color">
<label for="id_{{$contentbg_transp.0}}" id="label_{{$contentbg_transp.0}}">{{$contentbg_transp.1}}</label>
- <input type="hidden" class="form-control color slider-input" name="{{$contentbg_transp.0}}" id="{{$contentbg_transp.0}}" type="text" value="{{$contentbg_transp.2}}" aria-describedby="{{$contentbg_transp.0}}_tip">
+
+ <div class="row">
+ <div class="col-xs-9">
+ <input type="range" class="form-control color" id="{{$contentbg_transp.0}}_range" min="0" max="100" step="1" value="{{$contentbg_transp.2}}" onchange="{{$contentbg_transp.0}}.value = this.value" oninput="{{$contentbg_transp.0}}.value = this.value">
+ </div>
+ <div class="col-xs-3">
+ <div class="input-group">
+ <input type="text" class="form-control input-sm" name="{{$contentbg_transp.0}}" id="{{$contentbg_transp.0}}" value="{{$contentbg_transp.2}}" onchange="{{$contentbg_transp.0}}_range.value = this.value" oninput="{{$contentbg_transp.0}}_range.value = this.value" aria-describedby="{{$contentbg_transp.0}}_tip">
+ <span class="input-group-addon image-select">%</span>
+ </div>
+ </div>
+ </div>
+
<span id="{{$contentbg_transp.0}}_tip" class="help-block" role="tooltip">{{$contentbg_transp.3}}</span>
<div id="end_{{$contentbg_transp.0}}" class="field_end"></div>
</div>
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);
- });
-
});
</script>
<button type="submit" value="{{$submit}}" class="settings-submit btn btn-primary" name="frio-settings-submit">{{$submit}}</button>
</div>
<div class="clearfix"></div>
-
-<script type="text/javascript">
- $(".inputRange").rangeinput();
-</script>
projects / friendica.git / commitdiff