diff --git a/resources/css/app.css b/resources/css/app.css index 3b8cca4..8891b05 100644 --- a/resources/css/app.css +++ b/resources/css/app.css @@ -459,18 +459,18 @@ div#screen canvas#processcanvas { } @-webkit-keyframes pulse { - 0% {opacity: 0;color: #000;} - 25% {opacity: 0.25;} + 0% {opacity: 1;color: #fff;} + 25% {opacity: 0.75;} 50% {opacity: 0.50;} - 75% {opacity: 0.75;} - 100% {opacity: 1;color: #fff;} + 75% {opacity: 0.25;} + 100% {opacity: 0;color: #999;} } .droppable { - -webkit-animation: pulse 1s infinite alternate; + /*-webkit-animation: pulse 1s infinite alternate; -moz-animation: pulse 1s infinite alternate; opacity: 0; - color: #FFF; + color: #FFF;*/ background-color: #4966B1;/* Old browsers */ background: -moz-linear-gradient(top, #6086e5 0%, #6086e5 39%, #4966b1 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#6086e5), color-stop(39%,#6086e5), color-stop(100%,#4966b1)); /* Chrome,Safari4+ */ @@ -499,4 +499,24 @@ div#screen canvas#processcanvas { -webkit-animation: none; -moz-animation: none; opacity: 1; +} + +div.drag-table-item table tr.selected td { + padding-left: 5px; + padding-right: 5px; +} + +.droppable-hover { + -webkit-animation: pulse 1s infinite alternate; + -moz-animation: pulse 1s infinite alternate; + opacity: 0; + color: #FFF; + background-color: #4966B1;/* Old browsers */ + background: -moz-linear-gradient(top, #6086e5 0%, #6086e5 39%, #4966b1 100%); /* FF3.6+ */ + background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#6086e5), color-stop(39%,#6086e5), color-stop(100%,#4966b1)); /* Chrome,Safari4+ */ + background: -webkit-linear-gradient(top, #6086e5 0%,#6086e5 39%,#4966b1 100%); /* Chrome10+,Safari5.1+ */ + background: -o-linear-gradient(top, #6086e5 0%,#6086e5 39%,#4966b1 100%); /* Opera 11.10+ */ + background: -ms-linear-gradient(top, #6086e5 0%,#6086e5 39%,#4966b1 100%); /* IE10+ */ + background: linear-gradient(to bottom, #6086e5 0%,#6086e5 39%,#4966b1 100%); /* W3C */ + filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6086e5', endColorstr='#4966b1',GradientType=0 ); /* IE6-9 */ } \ No newline at end of file diff --git a/resources/js/views/list.js b/resources/js/views/list.js index 1627ef2..76a5d23 100644 --- a/resources/js/views/list.js +++ b/resources/js/views/list.js @@ -359,10 +359,13 @@ console.log(parentWidth, that.$el.innerWidth(), parentHeight, that.$el, parentEl , fnCreatedRow: function(nRow, aData, iDataIndex) { if (that.options.type !== "playlist") { $(nRow).draggable({ - scope: "list-item" - , cursor: "move" - , revert: "invalid" - , containment: "window" + scope: "list-item" + , stack: "droppable" + , cursor: "copy" + , revert: "invalid" + , containment: "window" + , revertDuration: 200 + , scroll: false , start: function(event, ui) { $(this).fadeTo("fast", 0.5); @@ -379,7 +382,7 @@ console.log(parentWidth, that.$el.innerWidth(), parentHeight, that.$el, parentEl $(this) .closest("tr") .clone() - .css($(this).getStyleObject()) + //.css($(this).getStyleObject()) .addClass("selected") ) .parent() diff --git a/resources/js/views/sidebar.js b/resources/js/views/sidebar.js index 8c72e06..11ff109 100644 --- a/resources/js/views/sidebar.js +++ b/resources/js/views/sidebar.js @@ -90,13 +90,13 @@ _ $(event.target).parents("ul:first").find("> li:first-child").addClass("selected"); }, 10); }); -/* -$(TableTools.fnGetInstance("DataTables_Table_0").fnGetSelected()).draggable({scope: "list-item",helper: function () { return $('
').find('table').append($(event.target).closest('tr').clone()).end().insertBefore("body > .ui-layout-west").appendTo("body");}}); - */ + this.$el.find("> ul > li:first > span").droppable({ activeClass: "droppable" + , hoverClass: "droppable-hover" , scope: "list-item" - , tolerance: "touch" // We really need this cause our items are much bigger than the droppable + , tolerance: "touch" // We really need this cause our items + // are much bigger than the droppable , drop: that._addPlaylistItem }); }