Fix poor sorting UX on tree view
This should fix the RainLab.Pages plugin sorting UX once and for all 👌
This commit is contained in:
Samuel Georges
parent
f2e129e821
commit
6bae91b411
|
|
@ -285,7 +285,7 @@
|
|||
.control-treeview ol > li > div span.comment{display:block;font-weight:400;color:#95a5a6;font-size:14px;margin-top:2px;overflow:hidden;text-overflow:ellipsis}
|
||||
.control-treeview ol > li > div > span.expand{font:0/0 a;color:transparent;text-shadow:none;background-color:transparent;border:0;display:none;position:absolute;width:20px;height:20px;top:24px;left:2px;cursor:pointer;color:#bdc3c7;-webkit-transition:transform 0.1s ease;transition:transform 0.1s ease}
|
||||
.control-treeview ol > li > div > span.expand:before{font-family:FontAwesome;font-weight:normal;font-style:normal;text-decoration:inherit;-webkit-font-smoothing:antialiased;*margin-right:.3em;content:"\f0da";line-height:100%;font-size:15px;position:relative;left:8px;top:2px}
|
||||
.control-treeview ol > li > div > span.drag-handle{font:0/0 a;color:transparent;text-shadow:none;background-color:transparent;border:0;-webkit-transition:opacity 0.4s;transition:opacity 0.4s;position:absolute;right:18px;bottom:5px;width:18px;height:19px;cursor:move;color:#bdc3c7;opacity:0;filter:alpha(opacity=0)}
|
||||
.control-treeview ol > li > div > span.drag-handle{font:0/0 a;color:transparent;text-shadow:none;background-color:transparent;border:0;-webkit-transition:opacity 0.4s;transition:opacity 0.4s;position:absolute;right:10px;bottom:5px;width:18px;height:19px;cursor:move;color:#bdc3c7;opacity:0;filter:alpha(opacity=0)}
|
||||
.control-treeview ol > li > div > span.drag-handle:before{font-family:FontAwesome;font-weight:normal;font-style:normal;text-decoration:inherit;-webkit-font-smoothing:antialiased;*margin-right:.3em;content:"\f0c9";font-size:18px}
|
||||
.control-treeview ol > li > div span.borders{font-size:0}
|
||||
.control-treeview ol > li > div > ul.submenu{position:absolute;left:20px;bottom:-37px;padding:0;list-style:none;z-index:200;height:37px;display:none;margin-left:15px;background:transparent url(../images/treeview-submenu-tabs.png) repeat-x left -39px}
|
||||
|
|
@ -314,15 +314,13 @@
|
|||
.control-treeview ol > li[data-no-drag-mode] div:hover span.drag-handle{cursor:default !important;opacity:0.3 !important;filter:alpha(opacity=30) !important}
|
||||
.control-treeview ol > li.dragged li.has-subitems > div:before,.control-treeview ol > li.dragged.has-subitems > div:before{background-position:0px -52px}
|
||||
.control-treeview ol > li.dragged div > ul.submenu{display:none !important}
|
||||
.control-treeview ol > li > ol{padding-left:20px}
|
||||
.control-treeview ol > li > ol{padding-left:20px;padding-right:20px}
|
||||
.control-treeview ol > li[data-status=collapsed] > ol{display:none}
|
||||
.control-treeview ol > li.has-subitems > div:before{background-position:0 0;width:23px;height:26px;left:26px}
|
||||
.control-treeview ol > li.has-subitems > div:hover:before,.control-treeview ol > li.has-subitems > div.popover-highlight:before{background-position:0px -52px}
|
||||
.control-treeview ol > li.has-subitems > div span.expand{display:block}
|
||||
.control-treeview ol > li.placeholder{height:0;position:relative;border-bottom:1px dotted #c03f31}
|
||||
.control-treeview ol > li.placeholder:before{font-family:FontAwesome;font-weight:normal;font-style:normal;text-decoration:inherit;-webkit-font-smoothing:antialiased;*margin-right:.3em;content:"\f0da";font-size:23px;color:white;position:absolute;left:-11px;top:-17px;z-index:1900}
|
||||
.control-treeview ol > li.placeholder:after{font-family:FontAwesome;font-weight:normal;font-style:normal;text-decoration:inherit;-webkit-font-smoothing:antialiased;*margin-right:.3em;content:"\f0da";font-size:21px;color:#c03f31;position:absolute;left:-10px;top:-14px;z-index:1901}
|
||||
.control-treeview ol > li.dragged{position:absolute;z-index:2000;opacity:0.5;filter:alpha(opacity=50)}
|
||||
.control-treeview ol > li.placeholder{position:relative;opacity:0.5;filter:alpha(opacity=50)}
|
||||
.control-treeview ol > li.dragged{position:absolute;z-index:2000;opacity:0.25;filter:alpha(opacity=25)}
|
||||
.control-treeview ol > li.dragged > div{-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px}
|
||||
.control-treeview ol > li.drop-target > div{background-color:#2581b8 !important}
|
||||
.control-treeview ol > li.drop-target > div > a{color:#ffffff}
|
||||
|
|
@ -338,43 +336,43 @@
|
|||
.control-treeview ol > li.active > div > span.borders:before{top:-1px}
|
||||
.control-treeview ol > li.active > div > span.borders:after{bottom:-1px}
|
||||
.control-treeview ol > li.no-data{padding:18px 0;margin:0;color:#666666;font-size:14px;text-align:center;font-weight:400}
|
||||
.control-treeview ol > li > ol > li > div{margin-left:-20px;padding-left:71px}
|
||||
.control-treeview ol > li > ol > li > div{margin-left:-20px;margin-right:-20px;padding-left:71px}
|
||||
.control-treeview ol > li > ol > li > div > a{margin-left:-71px;padding-left:71px}
|
||||
.control-treeview ol > li > ol > li > div:before{margin-left:10px}
|
||||
.control-treeview ol > li > ol > li > div > span.expand{left:12px}
|
||||
.control-treeview ol > li > ol > li > ol > li > div{margin-left:-40px;padding-left:81px}
|
||||
.control-treeview ol > li > ol > li > ol > li > div{margin-left:-40px;margin-right:-40px;padding-left:81px}
|
||||
.control-treeview ol > li > ol > li > ol > li > div > a{margin-left:-81px;padding-left:81px}
|
||||
.control-treeview ol > li > ol > li > ol > li > div:before{margin-left:20px}
|
||||
.control-treeview ol > li > ol > li > ol > li > div > span.expand{left:22px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > div{margin-left:-60px;padding-left:91px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > div{margin-left:-60px;margin-right:-60px;padding-left:91px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > div > a{margin-left:-91px;padding-left:91px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > div:before{margin-left:30px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > div > span.expand{left:32px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > div{margin-left:-80px;padding-left:101px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > div{margin-left:-80px;margin-right:-80px;padding-left:101px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > div > a{margin-left:-101px;padding-left:101px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > div:before{margin-left:40px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > div > span.expand{left:42px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div{margin-left:-100px;padding-left:111px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div{margin-left:-100px;margin-right:-100px;padding-left:111px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div > a{margin-left:-111px;padding-left:111px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div:before{margin-left:50px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div > span.expand{left:52px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div{margin-left:-120px;padding-left:121px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div{margin-left:-120px;margin-right:-120px;padding-left:121px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div > a{margin-left:-121px;padding-left:121px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div:before{margin-left:60px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div > span.expand{left:62px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div{margin-left:-140px;padding-left:131px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div{margin-left:-140px;margin-right:-140px;padding-left:131px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div > a{margin-left:-131px;padding-left:131px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div:before{margin-left:70px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div > span.expand{left:72px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div{margin-left:-160px;padding-left:141px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div{margin-left:-160px;margin-right:-160px;padding-left:141px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div > a{margin-left:-141px;padding-left:141px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div:before{margin-left:80px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div > span.expand{left:82px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div{margin-left:-180px;padding-left:151px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div{margin-left:-180px;margin-right:-180px;padding-left:151px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div > a{margin-left:-151px;padding-left:151px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div:before{margin-left:90px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div > span.expand{left:92px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div{margin-left:-200px;padding-left:161px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div{margin-left:-200px;margin-right:-200px;padding-left:161px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div > a{margin-left:-161px;padding-left:161px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div:before{margin-left:100px}
|
||||
.control-treeview ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > ol > li > div > span.expand{left:102px}
|
||||
|
|
@ -396,6 +394,10 @@
|
|||
.control-treeview.light ol > li > div > ul.submenu li p{display:table;height:100%;padding:0;margin:0}
|
||||
.control-treeview.light ol > li > div > ul.submenu li p a{display:table-cell;vertical-align:middle;height:100%;padding:0 20px;font-size:13px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
|
||||
.control-treeview.light ol > li > div > ul.submenu li p a i.control-icon{font-size:22px;margin-right:0}
|
||||
body.dragging .control-treeview ol.dragging,body.dragging .control-treeview ol.dragging ol{background:#ccc;padding-right:20px;-webkit-transition:padding 1s;transition:padding 1s}
|
||||
body.dragging .control-treeview ol.dragging > li > div,body.dragging .control-treeview ol.dragging ol > li > div{margin-right:0;-webkit-transition:margin 1s;transition:margin 1s}
|
||||
body.dragging .control-treeview ol.dragging > li > div .custom-checkbox,body.dragging .control-treeview ol.dragging ol > li > div .custom-checkbox{-webkit-transition:opacity 0.5s;transition:opacity 0.5s;opacity:0;filter:alpha(opacity=0)}
|
||||
body.dragging .control-treeview.light ol.dragging > li > div,body.dragging .control-treeview.light ol.dragging ol > li > div{background-color:#f9f9f9}
|
||||
@media only screen and (-moz-min-device-pixel-ratio:1.5),only screen and (-o-min-device-pixel-ratio:3/2),only screen and (-webkit-min-device-pixel-ratio:1.5),only screen and (min-devicepixel-ratio:1.5),only screen and (min-resolution:1.5dppx){.control-treeview ol > li > div:before{background-position:0px -79px;background-size:21px auto}
|
||||
.control-treeview ol > li.has-subitems > div:before{background-position:0px -52px}
|
||||
.control-treeview ol > li.has-subitems > div:hover:before,.control-treeview ol > li.has-subitems > div.popover-highlight:before{background-position:0px -102px}
|
||||
|
|
|
|||
|
|
@ -963,8 +963,10 @@ $.fn.sidePanelTab.Constructor=SidePanelTab
|
|||
$.fn.sidePanelTab.noConflict=function(){$.fn.sidePanelTab=old
|
||||
return this}
|
||||
$(window).load(function(){$('[data-control=layout-sidepanel]').sidePanelTab()})
|
||||
$(document).ready(function(){if(Modernizr.touch||(typeof(localStorage)!=='undefined'&&localStorage.ocSidePanelFixed==1)){$(document.body).removeClass('side-panel-not-fixed')
|
||||
$(window).trigger('resize')}})}(window.jQuery);+function($){"use strict";var SimpleList=function(element,options){var $el=this.$el=$(element)
|
||||
$(document).ready(function(){if(Modernizr.touch||(typeof(localStorage)!=='undefined')){if(localStorage.ocSidePanelFixed==0){$(document.body).addClass('side-panel-not-fixed')
|
||||
$(window).trigger('resize')}
|
||||
else if(localStorage.ocSidePanelFixed==1){$(document.body).removeClass('side-panel-not-fixed')
|
||||
$(window).trigger('resize')}}})}(window.jQuery);+function($){"use strict";var SimpleList=function(element,options){var $el=this.$el=$(element)
|
||||
this.options=options||{}
|
||||
if($el.hasClass('is-sortable')){var sortableOptions={distance:10}
|
||||
if(this.options.sortableHandle)
|
||||
|
|
|
|||
|
|
@ -208,7 +208,9 @@
|
|||
tweakCursorAdjustment: this.proxy(this.tweakCursorAdjustment),
|
||||
isValidTarget: this.proxy(this.isValidTarget),
|
||||
useAnimation: false,
|
||||
handle: 'span.drag-handle'
|
||||
usePlaceholderClone: true,
|
||||
handle: 'span.drag-handle',
|
||||
tolerance: -20 // Give 20px of carry between containers
|
||||
})
|
||||
|
||||
this.$el.on('move.oc.treelist', this.proxy(this.onNodeMove))
|
||||
|
|
|
|||
|
|
@ -87,7 +87,7 @@
|
|||
.transition(opacity 0.4s);
|
||||
|
||||
position: absolute;
|
||||
right: 18px;
|
||||
right: 10px;
|
||||
bottom: 5px;
|
||||
width: 18px;
|
||||
height: 19px;
|
||||
|
|
@ -229,7 +229,7 @@
|
|||
&[data-no-drag-mode] div:hover {
|
||||
span.drag-handle {
|
||||
cursor: default!important;
|
||||
.opacity(0.3)!important;
|
||||
.opacity(.3)!important;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -247,6 +247,7 @@
|
|||
|
||||
> ol {
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
}
|
||||
|
||||
&[data-status=collapsed] > ol {
|
||||
|
|
@ -263,7 +264,7 @@
|
|||
}
|
||||
|
||||
&:hover, &.popover-highlight {
|
||||
&:before {background-position: 0px -52px;}
|
||||
&:before { background-position: 0px -52px; }
|
||||
}
|
||||
|
||||
span.expand {
|
||||
|
|
@ -273,44 +274,21 @@
|
|||
}
|
||||
|
||||
&.placeholder {
|
||||
height: 0;
|
||||
position: relative;
|
||||
border-bottom: 1px dotted #c03f31;
|
||||
|
||||
&:before {
|
||||
.icon(@caret-right);
|
||||
font-size: 23px;
|
||||
color: white;
|
||||
position: absolute;
|
||||
left: -11px;
|
||||
top: -17px;
|
||||
z-index: 1900;
|
||||
}
|
||||
|
||||
&:after {
|
||||
.icon(@caret-right);
|
||||
font-size: 21px;
|
||||
color: #c03f31;
|
||||
position: absolute;
|
||||
left: -10px;
|
||||
top: -14px;
|
||||
z-index: 1901;
|
||||
}
|
||||
.opacity(.5);
|
||||
}
|
||||
|
||||
&.dragged {
|
||||
position: absolute;
|
||||
z-index: 2000;
|
||||
// width: auto!important;
|
||||
// height: auto!important;
|
||||
.opacity(0.5);
|
||||
.opacity(.25);
|
||||
|
||||
> div {
|
||||
.border-radius(3px);
|
||||
}
|
||||
}
|
||||
|
||||
&.drop-target {
|
||||
&.drop-target {
|
||||
> div {
|
||||
background-color: #2581b8!important;
|
||||
|
||||
|
|
@ -388,6 +366,7 @@
|
|||
> ol {
|
||||
> li > div {
|
||||
margin-left: -20-(@max-level - @level)*20px;
|
||||
margin-right: -20-(@max-level - @level)*20px;
|
||||
padding-left: 61+(@max-level - @level + 1)*10px;
|
||||
|
||||
> a {
|
||||
|
|
@ -536,7 +515,43 @@
|
|||
}
|
||||
}
|
||||
|
||||
// Retina
|
||||
//
|
||||
// Sorting guides
|
||||
//
|
||||
|
||||
body.dragging .control-treeview {
|
||||
ol.dragging, ol.dragging ol {
|
||||
background: #ccc;
|
||||
padding-right: 20px;
|
||||
.transition(padding 1s);
|
||||
|
||||
> li {
|
||||
> div {
|
||||
margin-right: 0;
|
||||
.transition(margin 1s);
|
||||
|
||||
.custom-checkbox {
|
||||
.transition(opacity .5s);
|
||||
.opacity(0);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.light {
|
||||
ol.dragging, ol.dragging ol {
|
||||
> li > div {
|
||||
background-color: #f9f9f9;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
//
|
||||
// Retina
|
||||
//
|
||||
|
||||
@media only screen and (-moz-min-device-pixel-ratio: 1.5), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-devicepixel-ratio: 1.5), only screen and (min-resolution: 1.5dppx) {
|
||||
.control-treeview {
|
||||
ol {
|
||||
|
|
|
|||
|
|
@ -98,6 +98,7 @@
|
|||
|
||||
$item.addClass('dragged')
|
||||
$('body').addClass('dragging')
|
||||
this.$el.addClass('dragging')
|
||||
|
||||
/*
|
||||
* Use animation
|
||||
|
|
@ -112,6 +113,10 @@
|
|||
if (this.options.usePlaceholderClone) {
|
||||
$(container.rootGroup.placeholder).html($item.html())
|
||||
}
|
||||
|
||||
if (!this.options.useDraggingClone) {
|
||||
$item.hide()
|
||||
}
|
||||
}
|
||||
|
||||
Sortable.prototype.onDrag = function ($item, position, _super, event) {
|
||||
|
|
@ -135,6 +140,7 @@
|
|||
Sortable.prototype.onDrop = function ($item, container, _super, event) {
|
||||
$item.removeClass('dragged').removeAttr('style')
|
||||
$('body').removeClass('dragging')
|
||||
this.$el.removeClass('dragging')
|
||||
|
||||
if ($item.data('oc.animated')) {
|
||||
$item
|
||||
|
|
@ -179,6 +185,7 @@
|
|||
Sortable.DEFAULTS = {
|
||||
useAnimation: false,
|
||||
usePlaceholderClone: false,
|
||||
useDraggingClone: true,
|
||||
tweakCursorAdjustment: null
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -3013,14 +3013,18 @@ return result?result:this}
|
|||
$.fn.filterWidget.Constructor=FilterWidget
|
||||
$.fn.filterWidget.noConflict=function(){$.fn.filterWidget=old
|
||||
return this}
|
||||
$(document).render(function(){$('[data-control="filterwidget"]').filterWidget();})}(window.jQuery);+function($){"use strict";var FilterWidget=$.fn.filterWidget.Constructor;var overloaded_init=FilterWidget.prototype.init;FilterWidget.prototype.init=function(){overloaded_init.apply(this);this.initRegion()
|
||||
$(document).render(function(){$('[data-control="filterwidget"]').filterWidget();})}(window.jQuery);+function($){"use strict";var FilterWidget=$.fn.filterWidget.Constructor;var overloaded_init=FilterWidget.prototype.init;FilterWidget.prototype.init=function(){overloaded_init.apply(this)
|
||||
this.initRegion()
|
||||
this.initFilterDate()}
|
||||
FilterWidget.prototype.initFilterDate=function(){var self=this
|
||||
this.$el.on('show.oc.popover','a.filter-scope-date',function(){self.initDatePickers($(this).hasClass('range'))});this.$el.on('hiding.oc.popover','a.filter-scope-date',function(){self.clearDatePickers()});this.$el.on('hide.oc.popover','a.filter-scope-date',function(){var $scope=$(this)
|
||||
this.$el.on('show.oc.popover','a.filter-scope-date',function(){self.initDatePickers($(this).hasClass('range'))})
|
||||
this.$el.on('hiding.oc.popover','a.filter-scope-date',function(){self.clearDatePickers()})
|
||||
this.$el.on('hide.oc.popover','a.filter-scope-date',function(){var $scope=$(this)
|
||||
self.pushOptions(self.activeScopeName)
|
||||
self.activeScopeName=null
|
||||
self.$activeScope=null
|
||||
setTimeout(function(){$scope.removeClass('filter-scope-open')},200)});this.$el.on('click','a.filter-scope-date',function(){var $scope=$(this),scopeName=$scope.data('scope-name')
|
||||
setTimeout(function(){$scope.removeClass('filter-scope-open')},200)})
|
||||
this.$el.on('click','a.filter-scope-date',function(){var $scope=$(this),scopeName=$scope.data('scope-name')
|
||||
if($scope.hasClass('filter-scope-open'))return
|
||||
if(null!==self.activeScopeName)return
|
||||
self.$activeScope=$scope
|
||||
|
|
@ -3028,9 +3032,11 @@ self.activeScopeName=scopeName
|
|||
self.isActiveScopeDirty=false
|
||||
if($scope.hasClass('range')){self.displayPopoverRange($scope)}
|
||||
else{self.displayPopoverDate($scope)}
|
||||
$scope.addClass('filter-scope-open')});$(document).on('click','#controlFilterPopover [data-trigger="filter"]',function(e){e.preventDefault()
|
||||
$scope.addClass('filter-scope-open')})
|
||||
$(document).on('click','#controlFilterPopover [data-trigger="filter"]',function(e){e.preventDefault()
|
||||
e.stopPropagation()
|
||||
self.filterByDate()});$(document).on('click','#controlFilterPopover [data-trigger="clear"]',function(e){e.preventDefault()
|
||||
self.filterByDate()})
|
||||
$(document).on('click','#controlFilterPopover [data-trigger="clear"]',function(e){e.preventDefault()
|
||||
e.stopPropagation()
|
||||
self.filterByDate(true)})}
|
||||
FilterWidget.prototype.getPopoverDateTemplate=function(){return' \
|
||||
|
|
@ -3104,7 +3110,7 @@ FilterWidget.prototype.displayPopoverDate=function($scope){var self=this,scopeNa
|
|||
data=$.extend({},data,{filter_button_text:this.getLang('filter.dates.filter_button_text'),reset_button_text:this.getLang('filter.dates.reset_button_text'),date_placeholder:this.getLang('filter.dates.date_placeholder','Date')})
|
||||
data.scopeName=scopeName
|
||||
$scope.data('oc.popover',null)
|
||||
$scope.ocPopover({content:Mustache.render(this.getPopoverDateTemplate(),data),modal:false,highlightModalTarget:true,closeOnPageClick:true,placement:'bottom',onCheckDocumentClickTarget:function(target){return self.onCheckDocumentClickTargetDatePicker(target);}})}
|
||||
$scope.ocPopover({content:Mustache.render(this.getPopoverDateTemplate(),data),modal:false,highlightModalTarget:true,closeOnPageClick:true,placement:'bottom',onCheckDocumentClickTarget:function(target){return self.onCheckDocumentClickTargetDatePicker(target)}})}
|
||||
FilterWidget.prototype.displayPopoverRange=function($scope){var self=this,scopeName=$scope.data('scope-name'),data=this.scopeValues[scopeName]
|
||||
data=$.extend({},data,{filter_button_text:this.getLang('filter.dates.filter_button_text'),reset_button_text:this.getLang('filter.dates.reset_button_text'),after_placeholder:this.getLang('filter.dates.after_placeholder','After'),before_placeholder:this.getLang('filter.dates.before_placeholder','Before')})
|
||||
data.scopeName=scopeName
|
||||
|
|
@ -3113,21 +3119,26 @@ $scope.ocPopover({content:Mustache.render(this.getPopoverRangeTemplate(),data),m
|
|||
FilterWidget.prototype.initDatePickers=function(isRange){var self=this,scopeData=this.$activeScope.data('scope-data'),$inputs=$('.field-datepicker input','#controlFilterPopover'),data=this.scopeValues[this.activeScopeName]
|
||||
if(!data){data={dates:isRange?(scopeData.dates?scopeData.dates:[]):(scopeData.date?[scopeData.date]:[])}}
|
||||
$inputs.each(function(index,datepicker){var defaultValue='',$datepicker=$(datepicker),defaults={minDate:new Date(scopeData.minDate),maxDate:new Date(scopeData.maxDate),yearRange:10,setDefaultDate:''!==defaultValue?defaultValue.toDate():'',format:self.getDateFormat(),i18n:self.getLang('datepicker')}
|
||||
if(0<=index&&index<data.dates.length){defaultValue=moment.tz(data.dates[index],self.appTimezone).tz(self.timezone)}
|
||||
if(0<=index&&index<data.dates.length){defaultValue=data.dates[index]?moment.tz(data.dates[index],self.appTimezone).tz(self.timezone):''}
|
||||
if(!isRange){defaults.onSelect=function(){self.filterByDate()}}
|
||||
datepicker.value=''!==defaultValue?defaultValue.format(self.getDateFormat()):'';$datepicker.pikaday(defaults)})}
|
||||
FilterWidget.prototype.clearDatePickers=function(){var $inputs=$('.field-datepicker input','#controlFilterPopover')
|
||||
$inputs.each(function(index,datepicker){var $datepicker=$(datepicker)
|
||||
$datepicker.data('pikaday').destroy()})}
|
||||
FilterWidget.prototype.updateScopeDateSetting=function($scope,dates){var $setting=$scope.find('.filter-setting'),dateFormat=this.getDateFormat(),dateRegex=/\d{4}-\d{2}-\d{2} \d{2}:\d{2}:\d{2}/,reset=false
|
||||
if(dates&&dates.length&&dates[0].match(dateRegex)){if(dates.length>1){if(dates[1].match(dateRegex)){var after=moment.tz(dates[0],this.appTimezone).tz(this.timezone).format(dateFormat),before=moment.tz(dates[1],this.appTimezone).tz(this.timezone).format(dateFormat);$setting.text(after+' → '+before)}else{reset=true}}
|
||||
else{$setting.text(moment.tz(dates[0],this.appTimezone).tz(this.timezone).format(dateFormat))}
|
||||
$scope.addClass('active')}
|
||||
if(dates&&dates.length){dates[0]=dates[0]&&dates[0].match(dateRegex)?dates[0]:null
|
||||
if(dates.length>1){dates[1]=dates[1]&&dates[1].match(dateRegex)?dates[1]:null
|
||||
if(dates[0]||dates[1]){var after=dates[0]?moment.tz(dates[0],this.appTimezone).tz(this.timezone).format(dateFormat):'∞',before=dates[1]?moment.tz(dates[1],this.appTimezone).tz(this.timezone).format(dateFormat):'∞'
|
||||
$setting.text(after+' → '+before)}else{reset=true}}
|
||||
else if(dates[0]){$setting.text(moment.tz(dates[0],this.appTimezone).tz(this.timezone).format(dateFormat))}else{reset=true}}
|
||||
else{reset=true}
|
||||
if(reset){$setting.text(this.getLang('filter.dates.all','all'));$scope.removeClass('active')}}
|
||||
if(reset){$setting.text(this.getLang('filter.dates.all','all'));$scope.removeClass('active')}else{$scope.addClass('active')}}
|
||||
FilterWidget.prototype.filterByDate=function(isReset){var self=this,dates=[]
|
||||
if(!isReset){$('.field-datepicker input','#controlFilterPopover').each(function(index,datepicker){var date=$(datepicker).data('pikaday').toString('YYYY-MM-DD');if(index===0){date+='00:00:00'}else if(index===1){date+='23:59:59'}
|
||||
dates.push(moment.tz(date,self.timezone).tz(self.appTimezone).format('YYYY-MM-DD HH:mm:ss'))})}
|
||||
if(!isReset){var datepickers=$('.field-datepicker input','#controlFilterPopover')
|
||||
datepickers.each(function(index,datepicker){var date=$(datepicker).data('pikaday').toString('YYYY-MM-DD')
|
||||
if(date.match(/\d{4}-\d{2}-\d{2}/)){if(index===0){date+=' 00:00:00'}else if(index===1){date+=' 23:59:59'}
|
||||
date=moment.tz(date,self.timezone).tz(self.appTimezone).format('YYYY-MM-DD HH:mm:ss')}else{date=null}
|
||||
dates.push(date)})}
|
||||
this.updateScopeDateSetting(this.$activeScope,dates);this.scopeValues[this.activeScopeName]={dates:dates}
|
||||
this.isActiveScopeDirty=true;this.$activeScope.data('oc.popover').hide()}
|
||||
FilterWidget.prototype.getDateFormat=function(){if(this.locale){return moment().locale(this.locale).localeData().longDateFormat('l')}
|
||||
|
|
@ -3991,12 +4002,15 @@ if(this.options.tweakCursorAdjustment){this.cursorAdjustment=this.options.tweakC
|
|||
$item.css({height:$item.height(),width:$item.width()})
|
||||
$item.addClass('dragged')
|
||||
$('body').addClass('dragging')
|
||||
this.$el.addClass('dragging')
|
||||
if(this.options.useAnimation){$item.data('oc.animated',true)}
|
||||
if(this.options.usePlaceholderClone){$(container.rootGroup.placeholder).html($item.html())}}
|
||||
if(this.options.usePlaceholderClone){$(container.rootGroup.placeholder).html($item.html())}
|
||||
if(!this.options.useDraggingClone){$item.hide()}}
|
||||
Sortable.prototype.onDrag=function($item,position,_super,event){if(this.cursorAdjustment){$item.css({left:position.left-this.cursorAdjustment.left,top:position.top-this.cursorAdjustment.top})}
|
||||
else{$item.css(position)}}
|
||||
Sortable.prototype.onDrop=function($item,container,_super,event){$item.removeClass('dragged').removeAttr('style')
|
||||
$('body').removeClass('dragging')
|
||||
this.$el.removeClass('dragging')
|
||||
if($item.data('oc.animated')){$item.hide().slideDown(200)}}
|
||||
Sortable.prototype.enable=function(){this.$el.jqSortable('enable')}
|
||||
Sortable.prototype.disable=function(){this.$el.jqSortable('disable')}
|
||||
|
|
@ -4005,7 +4019,7 @@ Sortable.prototype.serialize=function(){this.$el.jqSortable('serialize')}
|
|||
Sortable.prototype.destroy=function(){this.dispose()}
|
||||
Sortable.prototype.destroyGroup=function(){var jqSortable=this.$el.data('jqSortable')
|
||||
if(jqSortable.group){jqSortable.group._destroy()}}
|
||||
Sortable.DEFAULTS={useAnimation:false,usePlaceholderClone:false,tweakCursorAdjustment:null}
|
||||
Sortable.DEFAULTS={useAnimation:false,usePlaceholderClone:false,useDraggingClone:true,tweakCursorAdjustment:null}
|
||||
var old=$.fn.sortable
|
||||
$.fn.sortable=function(option){var args=arguments;return this.each(function(){var $this=$(this)
|
||||
var data=$this.data('oc.sortable')
|
||||
|
|
|
|||
Loading…
Reference in New Issue