Skip to content

Commit

Permalink
Implemented modal & draggable on both "jqueryui" & "default" themes.
Browse files Browse the repository at this point in the history
  • Loading branch information
@Tudmotu
Tudmotu committed May 31, 2011
1 parent c17ae35 commit 2d8ccb5
Show file tree
Hide file tree
Showing 2 changed files with 65 additions and 56 deletions.
4 changes: 2 additions & 2 deletions jquery.wysiwyg.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -77,13 +77,13 @@ box-shadow :inset 0 0 10px rgba(0, 0, 0, 0.4);
background-color:white; padding:0px; margin:0; display:block; width: 100%; }

/* dialog */
.wysiwyg-dialog { position:fixed; top:50px; left:50px; width:450px; height:300px; background:white; font:14px "Helvetic Neue", Helvetica,Arial,sans-serif; z-index:100000; }
.wysiwyg-dialog { position:fixed; top:50px; left:50px; width:450px; height:300px; background:white; font:14px "Helvetic Neue", Helvetica,Arial,sans-serif; }
.wysiwyg-dialog .wysiwyg-dialog-topbar { background:#333; border:1px #111 solid; color:white; padding:10px; position:relative; }
.wysiwyg-dialog .wysiwyg-dialog-topbar .wysiwyg-dialog-close-wrapper .wysiwyg-dialog-close-button { color:white; text-decoration:none; display:block; padding:6px 10px; position:absolute; right:12px; top:50%; height:14px; margin-top:-12px; }
.wysiwyg-dialog .wysiwyg-dialog-topbar .wysiwyg-dialog-close-wrapper a.wysiwyg-dialog-close-button:hover { background:#666; }
.wysiwyg-dialog .wysiwyg-dialog-topbar .wysiwyg-dialog-title { font-size:20px; font-weight:bold; padding:5px; }
.wysiwyg-dialog .wysiwyg-dialog-content { border:1px #ccc solid; border-top:0; padding:15px; background:white; }
.wysiwyg-dialog-modal-div { position:absolute; top:0px; left:0px; width:100%; height:100%; background-color:rgba(0,0,0,0.5);}
.wysiwyg-dialog-modal-div { position:absolute; top:0px; left:0px; width:100%; height:100%; background-color:rgb(255,255,255); background-color:rgba(0,0,0,0.5); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000); -ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000, endColorstr=#99000000)";}
.wysiwyg-dialog-content form.wysiwyg fieldset { border:1px #ccc solid; }
.wysiwyg-dialog-content form.wysiwyg legend { padding:7px; }
.wysiwyg-dialog-content form.wysiwyg .form-row { clear:both; padding:4px 0; }
Expand Down
117 changes: 63 additions & 54 deletions jquery.wysiwyg.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2056,7 +2056,7 @@

this.options = {
"modal": true,
"draggable": false,
"draggable": true,
"title": "Title",
"content": "Content",
"width":"auto",
Expand All @@ -2078,44 +2078,6 @@

$that.trigger("afterOpen", [$dialog]);


// Modal feature:
if (that.options.modal) {
$("<div/>", { "class": "wysiwyg-dialog-modal-div" }).appendTo("body");
}

// Draggable feature:
if (that.options.draggable) {

var mouseDown = false;

obj._$dialog.find("div.wysiwyg-dialog-topbar").bind("mousedown", function (e) {
e.preventDefault();
$(this).css({ "cursor": "move" });
var _dialog = $(this).parents(".wysiwyg-dialog"),
offsetX = (e.pageX - parseInt(_dialog.css("left"))),
offsetY = (e.pageY - parseInt(_dialog.css("top")));
mouseDown = true;
$(this).css({ "cursor": "move" });

$(document).bind("mousemove", function (e) {
e.preventDefault();
if (mouseDown) {
_dialog.css({
"top": (e.pageY - offsetY),
"left": (e.pageX - offsetX)
});
}
}).bind("mouseup", function (e) {
e.preventDefault();
mouseDown = false;
$(this).css({ "cursor": "" });
});

});

}

};

this.show = function () {
Expand Down Expand Up @@ -2150,16 +2112,6 @@

$that.trigger("afterClose", [$dialog]);

// Modal feature:
if (that.options.modal) {
$("body").find("div.wysiwyg-dialog-modal-div").remove();
}

// Draggable feature:
if (that.options.draggable) {
$obj._$dialog.find("div.wysiwyg-dialog-topbar").unbind("mousedown");
}

};

if (this.options.open) {
Expand Down Expand Up @@ -2207,15 +2159,21 @@
} else if(typeof content.toString === 'function') {
content = content.toString();
}
alert(content);
}

that._$dialog = $('<div></div>').attr('title', this.options.title).html(content);

console.log(that._$dialog);
var dialogHeight = this.options.height == 'auto' ? 300 : this.options.height,
dialogWidth = this.options.width == 'auto' ? 450 : this.options.width;

// console.log(that._$dialog);

that._$dialog.dialog({
modal: true,
height: this.options.height,
width: this.options.width,
modal: this.options.modal,
draggable: this.options.draggable,
height: dialogHeight,
width: dialogWidth,
close: function () {
abstractDialog.close();
}
Expand Down Expand Up @@ -2267,7 +2225,7 @@
$link.click(function () {
abstractDialog.close(); // this is important it makes sure that is close from the abstract $.wysiwyg.dialog instace, not just locally
});

$topbar.find('.wysiwyg-dialog-close-wrapper').prepend($link);

var $dcontent = $('<div class="wysiwyg-dialog-content">'+content+'</div>');
Expand All @@ -2291,8 +2249,48 @@
};

this.show = function () {

// Modal feature:
if (this.options.modal) {
that._$dialog.wrap('<div class="wysiwyg-dialog-modal-div"></div>');
}

// Draggable feature:
if (this.options.draggable) {

var mouseDown = false;

that._$dialog.find("div.wysiwyg-dialog-topbar").bind("mousedown", function (e) {
e.preventDefault();
$(this).css({ "cursor": "move" });
var $topbar = $(this),
_dialog = $(this).parents(".wysiwyg-dialog"),
offsetX = (e.pageX - parseInt(_dialog.css("left"))),
offsetY = (e.pageY - parseInt(_dialog.css("top")));
mouseDown = true;
$(this).css({ "cursor": "move" });

$(document).bind("mousemove", function (e) {
e.preventDefault();
if (mouseDown) {
_dialog.css({
"top": (e.pageY - offsetY),
"left": (e.pageX - offsetX)
});
}
}).bind("mouseup", function (e) {
e.preventDefault();
mouseDown = false;
$topbar.css({ "cursor": "auto" });
$(document).unbind("mousemove").unbind("mouseup");
});

});
}

that._$dialog.show();
return that._$dialog;

};

this.hide = function () {
Expand All @@ -2301,6 +2299,17 @@
};

this.destroy = function() {

// Modal feature:
if (this.options.modal) {
that._$dialog.unwrap();
}

// Draggable feature:
if (this.options.draggable) {
that._$dialog.find("div.wysiwyg-dialog-topbar").unbind("mousedown");
}

that._$dialog.remove();
return that._$dialog;
};
Expand Down

0 comments on commit 2d8ccb5

Please sign in to comment.