WYSIWYG EDITOR Variable Picker

WYSIWYG EDITOR variable picker for Output Documents
This commit is contained in:
norahmollo
2012-11-19 20:48:57 +00:00
parent 1448ac728d
commit 21839bd82a
6 changed files with 153 additions and 28 deletions

View File

@@ -0,0 +1,70 @@
/**
* Name: editor_plugin_src.js (for pmVariablePicker tinyMCE plugin)
**/
(function(){
var strPluginURL;
tinymce.create('tinymce.plugins.pmVariablePickerPlugin', {
init: function(ed, url)
{
strPluginURL = url; // store the URL for future use..
ed.addCommand('mcepmVariablePicker', function() {
pmVariablePicker();
});
ed.addButton('pmVariablePicker', {
title: 'pmVariablePicker',
label : ' @#',
cmd: 'mcepmVariablePicker',
image: url + '/img/picker.png'
});
},
createControl: function(n, cm) {
return null;
},
getPluginURL: function() {
return strPluginURL;
}
});
tinymce.PluginManager.add('pmVariablePicker', tinymce.plugins.pmVariablePickerPlugin);
})();
// this function can get called from the plugin inint (above) or from the callback on advlink/advimg plugins..
// in the latter case, win and type will be set.. In the rist case, we will just update the main editor window
// with the path of the uploaded file
function pmVariablePicker(field_name, url, type, win) {
var strPluginPath = tinyMCE.activeEditor.plugins.pmVariablePicker.getPluginURL(); // get the path to the uploader plugin
var strUploaderURL = strPluginPath + "/uploader.php"; // generate the path to the uploader script
var strUploadPath = tinyMCE.activeEditor.getParam('plugin_pmVariablePicker_upload_path'); // get the relative upload path
var strSubstitutePath = tinyMCE.activeEditor.getParam('plugin_pmVariablePicker_upload_substitute_path'); // get the path we'll substitute for the for the upload path (i.e. fully qualified)
if (strUploaderURL.indexOf("?") < 0){ // if we were called without any GET params
strUploaderURL = strUploaderURL + "?type=" + type + "&d=" + strUploadPath + "&subs=" + strSubstitutePath; // add our own params
} else {
strUploaderURL = strUploaderURL + "&type=" + type + "&d=" + strUploadPath + "&subs=" + strSubstitutePath;
}
tinyMCE.activeEditor.windowManager.open({ // open the plugin popup
file : strUploaderURL,
title : 'Upload Variable',
width : 500,
height : 100,
resizable : "yes",
inline : 1, // This parameter only has an effect if you use the inlinepopups plugin!
close_previous : "no"
}, {
window : win,
input : field_name
});
return false;
}
// This function will get called when the uploader is done uploading the file and ready to update
// calling dialog and close the upload popup
// strReturnURL should be the string with the path to the uploaded file
function closePluginPopup(){
tinyMCEPopup.close(); // close popup window
}
function updateEditorContent(serializedHTML){
tinyMCE.activeEditor.execCommand('mceInsertContent', false, serializedHTML);
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 595 B

View File

@@ -0,0 +1,3 @@
tinyMCE.addI18n('en.ccSimpleUploader', {
desc:"Upload File to Server"
});

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.0 KiB

View File

@@ -0,0 +1,63 @@
<head>
<title>Upload an Output Document</title>
<script type="text/javascript" src="../../tiny_mce_popup.js" ></script>
<script type="text/javascript" src="editor_plugin_src.js" ></script>
<base target="_self" />
</head>
<body>
<?php
$Action = isset($_GET["q"]) ? $_GET["q"] : "none";
if($Action =="none"){
displayUploadForm();
}else if($Action=="upload"){
uploadVariablePicker();
}
?>
</body>
</html>
<?php
// displays the upload form
function displayUploadForm()
{
echo '<form action="uploader.php?'.$_SERVER["QUERY_STRING"].'&q=upload" method="post" enctype="multipart/form-data" onsubmit="">'
.'File Name: <br/>'
.'<input type="text" size="10" name="upload_variable" ID="Text1"/><br/>'
.'<input type="submit" name="Variable" value="Variable" style="width: 150px;" onclick="document.getElementById(\'progress_div\').style.visibility=\'visible\';"/>'
.' <div id="progress_div" style="visibility: hidden;"><img src="progress.gif" alt="wait..." style="padding-top: 5px;"></div>'
.'</form>';
}
// uploads the file to the destination path, and returns a link with link path substituted for destination path
function uploadVariablePicker()
{
$StatusMessage = "";
$ActualFileName = "";
$FileObject = $_REQUEST["upload_variable"]; // find data on the file
updateEditorContent(trim($FileObject));
closeWindow();
}
function showPopUp($PopupText)
{
echo "<script type=\"text/javascript\" language=\"javascript\">alert (\"$PopupText\");</script>";
}
function updateEditorContent($serializedHTML)
{
echo "<script type=\"text/javascript\" language=\"javascript\">updateEditorContent(\"".$serializedHTML."\");</script>";
}
function closeWindow()
{
echo '
<script language="javascript" type="text/javascript">
closePluginPopup();
</script>
';
}
?>

View File

@@ -109,38 +109,27 @@ class XmlForm_Field_WYSIWYG_EDITOR extends XmlForm_Field
';
break;
case 'OUTPUT_DOCUMENT':
$editorDefinition = '
$editorDefinition = '
tinyMCE.baseURL = "/js/tinymce/jscripts/tiny_mce"
tinyMCE.init({
theme : "advanced",
plugins : "fullpage, pmSimpleUploader",
mode : "specific_textareas",
editor_selector : "tmceEditor",
width : "770",
height : "305",
theme_advanced_buttons1 : "fontselect,bold,italic,underline,forecolor,backcolor,|,justifyleft,justifycenter,justifyright,justifyfull,|,link,numlist,bullist,|,code,|,pmSimpleUploader",
onchange_callback: function(inst) {
if(inst.isDirty()) {
inst.save();
}
return true;
}/*,
theme_advanced_buttons1 : "pmSimpleUploader",
theme_advanced_buttons2 : "fontselect,bold,italic,underline,forecolor,backcolor,|,justifyleft,justifycenter,justifyright,justifyfull,|,link,numlist,bullist,|,insertfile",
handle_event_callback : function(e) {
if(this.isDirty()) {
this.save();
}
return true;
}*/
});
';
theme : "advanced",
plugins : "fullpage, pmSimpleUploader, pmVariablePicker",
mode : "specific_textareas",
editor_selector : "tmceEditor",
width : "770",
height : "305",
theme_advanced_buttons1 : "fontselect,bold,italic,underline,forecolor,backcolor,|,justifyleft,justifycenter,justifyright,justifyfull,|,link,numlist,bullist,|,code,|,pmSimpleUploader,|,pmVariablePicker",
onchange_callback: function(inst) {
if(inst.isDirty()) {
inst.save();
}
return true;
}
});
';
break;
case 'DYNAFORM_TEMPLATE':
$editorDefinition = '