Merge pull request #8 from liquibyte/master

merging admin.widgets.js

admin/panels/widgets/admin.widgets.js

@@ -3,6 +3,161 @@
  * Based on original flatpress' code
  * Require jQuery and jQuery UI (Core, Draggable, Droppable and Effects Core)
  * Coded by Piero VDFN <vogliadifarniente@gmail.com>
+<<<<<<< HEAD
+ * Re-Coded by liquibyte <liquibyte@gmail.com>
+ *     Colors weren't resetting on mouseout and position:absolute didn't work.
+ *     Position:absolute changed to position:fixed.  I also changed the
+ *     hardcoded values to a variable that is stored and recalled so that the
+ *     users stylesheet is used for styling.  Colors were hardcoded so I fixed
+ *     this to be styled from the users admin.css.  Available widgets now
+ *     accepts drag and drop from installed widgets to remove.
+ * Released under GNU GPL v2
+ */
+var FlatPress = {
+	winstancedrag : function() {
+		$('.widget-class').draggable({
+			'scroll' : true,
+			'helper' : function(event) {
+				return $(this).clone().appendTo('body').removeClass('widget-class').css({
+					'position': 'fixed',
+					'cursor' : 'move',
+					'list-style-type' : 'none',
+					'margin' : '0',
+					'padding' : '0',
+					'width' : $(this).width(),
+					'height' : $(this).height()
+					})
+				.addClass('widget-available');
+			}
+		});
+		$('.widget-instance').draggable({
+			'scroll' : true,
+			'helper' : function(event) {
+				return $(this).clone().appendTo('body').removeClass('widget-instance').css({
+					'position': 'fixed',
+					'cursor' : 'move',
+					'list-style-type' : 'none',
+					'width' : $(this).width(),
+					'height' : $(this).height()
+					})
+				.addClass('widget-installed');
+			}
+		});
+	},
+	wplaceholder : function() {
+		$('.widget-placeholder').droppable({
+			'accept' : '.widget-class, .widget-instance',
+			'activeClass' : 'ui-state-highlight',
+			'over' : function(event, ui) {
+				$(this).effect("highlight", { 'color' : $('.widget-installed, .widget-available').css('background-color') }, 1000);
+			},
+			'drop' : function(event, ui) {
+				var parent = ui.draggable.parent();
+				var where = $(this).parent().attr('id').split('-')[1];
+				var replace = null;
+				if (ui.draggable.hasClass('widget-instance')) {
+					replace = ui.draggable;
+				}
+				else {
+					replace = $('<li class="' + ui.draggable.attr('class') + '"></li>').append(ui.draggable.children().clone());
+					replace.removeClass('widget-class').addClass('widget-instance');
+				}
+				replace.children('input').attr('name', 'widgets[' + where + '][]');
+				$(this).replaceWith(replace);
+
+				if (parent.children().length < 1) {
+					parent.append('<li class="widget-placeholder">Drop here</li>');
+				}
+				FlatPress.wreload();
+			}
+		});
+	},
+	winstancedrop : function() {
+		$('.widget-instance').droppable({
+			'accept' : '.widget-class, .widget-instance',
+			'activeClass' : 'ui-state-highlight',
+			'over' : function(event, ui) {
+				$(this).effect("highlight", { 'color' : $('.widget-available, .widget-installed').css('background-color') }, 1000);
+			},
+			'drop' : function(event, ui) {
+				var parent = ui.draggable.parent();
+				var where = $(this).parent().attr('id').split('-')[1];
+				var replace = null;
+				if (ui.draggable.hasClass('widget-instance')) {
+					replace = ui.draggable;
+				}
+				else {
+					replace = $('<li class="' + ui.draggable.attr('class') + '"></li>').append(ui.draggable.children().clone());
+					replace.removeClass('widget-class').addClass('widget-instance');
+				}
+				replace.children('input').attr('name', 'widgets[' + where + '][]');
+				$(this).after(replace);
+				if (parent.children().length < 1) {
+					parent.append('<li class="widget-placeholder">Drop here</li>');
+				}
+				FlatPress.wreload();
+			}
+		});
+	},
+	wtrash : function() {
+		$('#widget-trashcan').droppable({
+			'accept' : '.widget-instance',
+			'activeClass' : 'ui-state-highlight',
+			'over' : function(event, ui) {
+				$(this).fadeTo('slow', 0.2).fadeTo('slow', 1.0);
+			},
+			'drop' : function(event, ui) {
+				var parent = ui.draggable.parent();
+				var draggable = $(ui.draggable);
+				// we can't remove() draggable here, because of a bug with jquery UI + IE8
+				// we'll defer it
+				$('.widget-installed').remove();
+				// last element has not been removed, 
+				// so there is still one in the list, soon to be deleted '
+				if(parent.children().length < 2) {
+					parent.append('<li class="widget-placeholder">Drop here</li>');
+				}
+				// deferred removal takes place here
+				setTimeout(function() {
+					draggable.remove();
+				});
+				FlatPress.wreload();
+			}
+		});
+		$('.widget-class').droppable({
+			'accept' : '.widget-instance',
+			'activeClass' : 'ui-state-highlight',
+			'over' : function(event, ui) {
+				$(this).effect("highlight", { 'color' : $('#widget-trashcan').css('background-color') }, 1000);
+			},
+			'drop' : function(event, ui) {
+				var parent = ui.draggable.parent();
+				var draggable = $(ui.draggable);
+				// we can't remove() draggable here, because of a bug with jquery UI + IE8
+				// we'll defer it
+				$('.widget-installed').remove();
+				// last element has not been removed, 
+				// so there is still one in the list, soon to be deleted
+				if(parent.children().length < 2) {
+					parent.append('<li class="widget-placeholder">Drop here</li>');
+				}
+				// deferred removal takes place here
+				setTimeout(function() {
+					draggable.remove();
+				});
+				FlatPress.wreload();
+			}
+		});
+
+	},
+	wreload : function(){
+		this.winstancedrag();
+		this.winstancedrop();
+		this.wplaceholder();
+	}
+}
+FlatPress.wreload();FlatPress.wtrash();
+=======
  * Released under GNU GPL v2
  */
 
@@ -141,3 +296,4 @@ wreload: function(){
 //$(document).ready(wreload);
 FlatPress.wreload();FlatPress.wtrash();
 
+>>>>>>> 109664842ba0aaec1b8e462a3fdcee470110a499

fp-interface/themes/leggero/flatmaas-rev/res/admin.css

@@ -485,8 +485,13 @@ li.admin-widgetset {
 	text-align: left;
 }
 
+<<<<<<< HEAD
+#widget-trashcan { /*colors for trashcan/uninstall widgets while dragging*/
+	background-color: rgba(170, 34, 34, 0.7);
+=======
 #widget-trashcan {
 	background-color: #a22;
+>>>>>>> 109664842ba0aaec1b8e462a3fdcee470110a499
 	color: #ddd;
 	font-size: 120%;
 	font-weight: bold;
@@ -496,6 +501,24 @@ li.admin-widgetset {
 	margin: 2em;
 }
 
+<<<<<<< HEAD
+.widget-available { /*colors for available widgets while dragging*/
+	cursor: move;
+	color: #fff;
+	background-color: rgba(34, 102, 0, 0.7);
+	border: 2px solid #2f0;
+	z-index: 2000;
+}
+
+.widget-installed { /*colors for installed widgets while dragging*/
+	cursor: move;
+	color: #fff;
+	background-color: rgba(0, 34, 102, 0.7);
+	border: 2px solid #00f;
+	z-index: 2000;
+}
+=======
+>>>>>>> 109664842ba0aaec1b8e462a3fdcee470110a499
 #available-widgets ul, .admin-widgetset ul {
 	padding-left: 0;
 	margin-left: 0;

fp-interface/themes/leggero/leggero/res/admin.css

@@ -14,7 +14,10 @@ Module: admin.css
 @import url(common.css);
 @import url(globals.css);
 
+<<<<<<< HEAD
+=======
 
+>>>>>>> 109664842ba0aaec1b8e462a3fdcee470110a499
 /* ===== VARIOUS ===== */
 .buttonbar input {
 	padding: .3em;
@@ -378,8 +381,13 @@ li.admin-widgetset {
 	text-align: left;
 }
 
+<<<<<<< HEAD
+#widget-trashcan { /*colors for trashcan/uninstall widgets while dragging*/
+	background-color: rgba(170, 34, 34, 0.7);
+=======
 #widget-trashcan {
 	background-color: #a22;
+>>>>>>> 109664842ba0aaec1b8e462a3fdcee470110a499
 	color: #ddd;
 	font-size: 120%;
 	font-weight: bold;
@@ -389,6 +397,25 @@ li.admin-widgetset {
 	margin: 2em;
 }
 
+<<<<<<< HEAD
+.widget-available { /*colors for available widgets while dragging*/
+	cursor: move;
+	color: #fff;
+	background-color: rgba(34, 102, 0, 0.7);
+	border: 2px solid #2f0;
+	z-index: 2000;
+}
+
+.widget-installed { /*colors for installed widgets while dragging*/
+	cursor: move;
+	color: #fff;
+	background-color: rgba(0, 34, 102, 0.7);
+	border: 2px solid #00f;
+	z-index: 2000;
+}
+
+=======
+>>>>>>> 109664842ba0aaec1b8e462a3fdcee470110a499
 #available-widgets ul, .admin-widgetset ul {
 	padding-left: 0;
 	margin-left: 0;