Incam_IntranetNueva/www/js/plugins/wysiwyg/wysiwyg.cssWrap.js
2012-03-01 19:30:11 +00:00

135 lines
5.0 KiB
JavaScript

/**
* Controls: Element CSS Wrapper plugin
*
* Depends on jWYSIWYG
*
* By Yotam Bar-On (https://github.com/tudmotu)
*/
(function ($) {
if (undefined === $.wysiwyg) {
throw "wysiwyg.cssWrap.js depends on $.wysiwyg";
}
/* For core enhancements #143
$.wysiwyg.ui.addControl("cssWrap", {
visible : false,
groupIndex: 6,
tooltip: "CSS Wrapper",
exec: function () {
$.wysiwyg.controls.cssWrap.init(this);
}
}
*/
if (!$.wysiwyg.controls) {
$.wysiwyg.controls = {};
}
/*
* Wysiwyg namespace: public properties and methods
*/
$.wysiwyg.controls.cssWrap = {
init: function (Wysiwyg) {
var self = this, formWrapHtml, key, translation,
dialogReplacements = {
legend : "Wrap Element",
wrapperType : "Wrapper Type",
ID : "ID",
"class" : "Class",
wrap : "Wrap",
unwrap: "Unwrap",
cancel : "Cancel"
};
formWrapHtml = '<form class="wysiwyg"><fieldset><legend>{legend}</legend>' +
'<div class="wysiwyg-dialogRow"><label>{wrapperType}: &nbsp;<select name="type"><option value="span">Span</option><option value="div">Div</option></select></label></div>' +
'<div class="wysiwyg-dialogRow"><label>{ID}: &nbsp;<input name="id" type="text" /></label></div>' +
'<div class="wysiwyg-dialogRow"><label>{class}: &nbsp;<input name="class" type="text" /></label></div>' +
'<div class="wysiwyg-dialogRow"><input type="button" class="button cssWrap-unwrap" style="display:none;" value="{unwrap}"/></label>' +
'<input type="submit" class="button cssWrap-submit" value="{wrap}"/></label>' +
'<input type="reset" class="button cssWrap-cancel" value="{cancel}"/></div></fieldset></form>';
for (key in dialogReplacements) {
if ($.wysiwyg.i18n) {
translation = $.wysiwyg.i18n.t(dialogReplacements[key]);
if (translation === dialogReplacements[key]) { // if not translated search in dialogs
translation = $.wysiwyg.i18n.t(dialogReplacements[key], "dialogs");
}
dialogReplacements[key] = translation;
}
formWrapHtml = formWrapHtml.replace("{" + key + "}", dialogReplacements[key]);
}
if (!$(".wysiwyg-dialog-wrapper").length) {
$(formWrapHtml).appendTo("body");
$("form.wysiwyg").dialog({
modal: true,
open: function (ev, ui) {
var $this = $(this), range = Wysiwyg.getInternalRange(), common, $nodeName;
// We make sure that there is some selection:
if (range) {
if ($.browser.msie) {
Wysiwyg.ui.focus();
}
common = $(range.commonAncestorContainer);
} else {
alert("You must select some elements before you can wrap them.");
$this.dialog("close");
return 0;
}
$nodeName = range.commonAncestorContainer.nodeName.toLowerCase();
// If the selection is already a .wysiwygCssWrapper, then we want to change it and not double-wrap it.
if (common.parent(".wysiwygCssWrapper").length) {
alert(common.parent(".wysiwygCssWrapper").get(0).nodeName.toLowerCase());
$this.find("select[name=type]").val(common.parent(".wysiwygCssWrapper").get(0).nodeName.toLowerCase());
$this.find("select[name=type]").attr("disabled", "disabled");
$this.find("input[name=id]").val(common.parent(".wysiwygCssWrapper").attr("id"));
$this.find("input[name=class]").val(common.parent(".wysiwygCssWrapper").attr("class").replace('wysiwygCssWrapper ', ''));
// Add the "unwrap" button:
$("form.wysiwyg").find(".cssWrap-unwrap").show();
$("form.wysiwyg").find(".cssWrap-unwrap").click(function (e) {
e.preventDefault();
if ($nodeName !== "body") {
common.unwrap();
}
$this.dialog("close");
return 1;
});
}
// Submit button.
$("form.wysiwyg").find(".cssWrap-submit").click(function (e) {
e.preventDefault();
var $wrapper = $("form.wysiwyg").find("select[name=type]").val(),
$id = $("form.wysiwyg").find("input[name=id]").val(),
$class = $("form.wysiwyg").find("input[name=class]").val();
if ($nodeName !== "body") {
// If the selection is already a .wysiwygCssWrapper, then we want to change it and not double-wrap it.
if (common.parent(".wysiwygCssWrapper").length) {
common.parent(".wysiwygCssWrapper").attr("id", $class);
common.parent(".wysiwygCssWrapper").attr("class", $class);
} else {
common.wrap("<" + $wrapper + " id=\"" + $id + "\" class=\"" + "wysiwygCssWrapper " + $class + "\"/>");
}
} else {
// Currently no implemntation for if $nodeName == 'body'.
}
$this.dialog("close");
});
// Cancel button.
$("form.wysiwyg").find(".cssWrap-cancel").click(function (e) {
e.preventDefault();
$this.dialog("close");
return 1;
});
},
close: function () {
$(this).dialog("destroy");
$(this).remove();
}
});
Wysiwyg.saveContent();
}
$(Wysiwyg.editorDoc).trigger("editorRefresh.wysiwyg");
return 1;
}
};
})(jQuery);