Adding some fixes to the pmGrids tinyMCE plugin
This commit is contained in:
@@ -1,66 +0,0 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
|
||||
<html xmlns="http://www.w3.org/1999/xhtml">
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
||||
<script type="text/javascript" src="../../tiny_mce_popup.js"></script>
|
||||
|
||||
</head>
|
||||
|
||||
<form action="uploader.php?'.$_SERVER["QUERY_STRING"].'&q=upload" method="post" enctype="multipart/form-data" onsubmit="">'
|
||||
<div id="d_variables">
|
||||
<table width="80%">
|
||||
<tr>
|
||||
<td width="33%"><label for="type_label">Type Variable</label></td>
|
||||
<td width="33%"><label for="prefix_label">Prefix</label></td>
|
||||
<td width="33%"><label for="variables_label">Variables</label></td>
|
||||
</tr>
|
||||
|
||||
<tr>
|
||||
<td width="33%">
|
||||
<select name="type_variables">
|
||||
<option value="all">All Variables</option>
|
||||
<option value="system">System Variables</option>
|
||||
<option value="process">Process Variables</option>
|
||||
</select>
|
||||
</td>
|
||||
<td width="33%">
|
||||
<select name="prefix">
|
||||
<option value="quotes">@#</option>
|
||||
<option value="float">@@</option>
|
||||
<option value="encoding">@?</option>
|
||||
</select>
|
||||
</td>
|
||||
<td width="33%">
|
||||
<select name="variables">
|
||||
<option value="quotes">@@SYS_SYS</option>
|
||||
<option value="float">@@SYS_LANG</option>
|
||||
<option value="encoding">@@SYS_SKIN</option>
|
||||
</select>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<br>
|
||||
|
||||
<div id="desc_variables">
|
||||
<table border="1" width="100%">
|
||||
<tr width="40%">
|
||||
<td>Result</td>
|
||||
<td>@#SYS_LANG</td>
|
||||
</tr>
|
||||
<tr width="60%">
|
||||
<td>Description</td>
|
||||
<td>Description @#SYS_LANG</td>
|
||||
</tr>
|
||||
</table>
|
||||
</div>
|
||||
|
||||
<br>
|
||||
|
||||
<div id="desc_variables">
|
||||
<label for="desc_prefix">* @# Replace de value in quotes</label>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
</html>
|
||||
@@ -13,7 +13,7 @@
|
||||
});
|
||||
ed.addButton('pmGrids', {
|
||||
title: 'pmGrids',
|
||||
label : ' @# Grids',
|
||||
label : ' @#',
|
||||
cmd: 'mcepmGrids',
|
||||
image: url + '/img/grids.png'
|
||||
});
|
||||
@@ -33,11 +33,14 @@
|
||||
// with the path of the uploaded file
|
||||
function pmGrids(field_name, url, type, win) {
|
||||
//tinyMCE.activeEditor.anyVariable='path/to/ProcessMaker'
|
||||
tinyMCE.activeEditor.windowManager.open({ // open the plugin popup
|
||||
file : '/js/tinymce/jscripts/tiny_mce/plugins/pmGrids/pmGrids.html',
|
||||
title : '',
|
||||
var strPluginPath = tinyMCE.activeEditor.plugins.pmGrids.getPluginURL(); // get the path to the uploader plugin
|
||||
var strScriptURL = strPluginPath + "/pmGrids.html";
|
||||
|
||||
tinyMCE.activeEditor.windowManager.open({ // open the plugin popup
|
||||
file : strScriptURL,
|
||||
title : 'ProcessMaker Grid Wizard',
|
||||
width : '600px',
|
||||
height : '330px',
|
||||
height : '230px',
|
||||
resizable : "yes",
|
||||
scrollbars : "no",
|
||||
overflow : false,
|
||||
|
||||
@@ -13,7 +13,7 @@
|
||||
});
|
||||
ed.addButton('pmGrids', {
|
||||
title: 'pmGrids',
|
||||
label : ' @# Grids',
|
||||
label : ' @#',
|
||||
cmd: 'mcepmGrids',
|
||||
image: url + '/img/grids.png'
|
||||
});
|
||||
@@ -33,11 +33,14 @@
|
||||
// with the path of the uploaded file
|
||||
function pmGrids(field_name, url, type, win) {
|
||||
//tinyMCE.activeEditor.anyVariable='path/to/ProcessMaker'
|
||||
var strPluginPath = tinyMCE.activeEditor.plugins.pmGrids.getPluginURL(); // get the path to the uploader plugin
|
||||
var strScriptURL = strPluginPath + "/pmGrids.html";
|
||||
|
||||
tinyMCE.activeEditor.windowManager.open({ // open the plugin popup
|
||||
file : '/js/tinymce/jscripts/tiny_mce/plugins/pmGrids/pmGrids.html',
|
||||
title : '',
|
||||
file : strScriptURL,
|
||||
title : 'ProcessMaker Grid Wizard',
|
||||
width : '600px',
|
||||
height : '330px',
|
||||
height : '230px',
|
||||
resizable : "yes",
|
||||
scrollbars : "no",
|
||||
overflow : false,
|
||||
|
||||
@@ -10,33 +10,29 @@ and open the template in the editor.
|
||||
<script src="/js/jquery/jquery-1.7.1.min.js" type="text/javascript"></script>
|
||||
<script type="text/javascript" src="../../tiny_mce_popup.js"></script>
|
||||
<script src="editor_plugin_src.js"></script>
|
||||
<script type="text/javascript">
|
||||
$(document).ready(function () {
|
||||
alert(tinyMCE.baseURL);
|
||||
/*$.ajax({
|
||||
url: "/processes/processes_Ajax",
|
||||
type: "POST",
|
||||
data: {action : 'getDynagridList', PRO_UID: tinyMCE.activeEditor.processID},
|
||||
dataType: "html",
|
||||
success: function(){
|
||||
|
||||
}
|
||||
});*/
|
||||
});
|
||||
</script>
|
||||
<script src="pmGrids.js"></script>
|
||||
<style type="text/css">
|
||||
|
||||
body {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
left: 45%;
|
||||
margin-left: -70px;
|
||||
}
|
||||
#container {
|
||||
|
||||
display: table;
|
||||
}
|
||||
#row {
|
||||
display: table-row;
|
||||
}
|
||||
#left, #right, #middle {
|
||||
#left, #right, #middle, .gridCell {
|
||||
display: table-cell;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="container">
|
||||
<div id="row">
|
||||
<div id="left">
|
||||
@@ -44,7 +40,9 @@ and open the template in the editor.
|
||||
</div>
|
||||
<div id="middle">
|
||||
<div id="gridDropdown">
|
||||
|
||||
<select id="gridList">
|
||||
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -53,8 +51,11 @@ and open the template in the editor.
|
||||
Prefix
|
||||
</div>
|
||||
<div id="middle">
|
||||
<div id="gridDropdown">
|
||||
|
||||
<div id="prefixDropdown">
|
||||
<select name="prefixList" id="prefixList">
|
||||
<option value="@#">@#</option>
|
||||
<option value="@@">@@</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -63,7 +64,7 @@ and open the template in the editor.
|
||||
|
||||
</div>
|
||||
<div id="middle">
|
||||
<div id="gridDropdown">
|
||||
<div id="borderCheckBox">
|
||||
<input type="checkbox"> Border
|
||||
</div>
|
||||
</div>
|
||||
@@ -73,15 +74,32 @@ and open the template in the editor.
|
||||
|
||||
</div>
|
||||
<div id="middle">
|
||||
<div id="gridDropdown">
|
||||
<div id="headersCheckBox">
|
||||
<input type="checkbox"> Headers
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div id="list-container">
|
||||
|
||||
</div>
|
||||
<center>
|
||||
<table id="listContainer" border="1" cellspacing="0" cellpadding="3">
|
||||
</table>
|
||||
<div id="container">
|
||||
<div id="row">
|
||||
<div id="left">
|
||||
</div>
|
||||
<div id="middle">
|
||||
<button id="addButton" style="width: 100px">
|
||||
Add
|
||||
</button>
|
||||
<button id="cancelButton" style="width: 100px">
|
||||
Cancel
|
||||
</button>
|
||||
</div>
|
||||
<div id="right">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</center>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
125
gulliver/js/tinymce/jscripts/tiny_mce/plugins/pmGrids/pmGrids.js
vendored
Normal file
125
gulliver/js/tinymce/jscripts/tiny_mce/plugins/pmGrids/pmGrids.js
vendored
Normal file
@@ -0,0 +1,125 @@
|
||||
$(document).ready(function () {
|
||||
|
||||
var getGridList = function(){
|
||||
var responseData
|
||||
responseData = '[{"id":"grid_01","name":"grid_01"},{"id":"grid_02","name":"grid_02"}]';
|
||||
/*$.ajax({
|
||||
url : "/processes/processes_Ajax",
|
||||
type: "POST",
|
||||
data: {action : 'getDynagridList', PRO_UID: tinyMCE.activeEditor.processID},
|
||||
dataType: "html",
|
||||
|
||||
success: function (data) {
|
||||
|
||||
$.each(data, function(index, element) {
|
||||
$('#listContainer').append($('<div class="gridCell">', {
|
||||
text: element.name
|
||||
}));
|
||||
});
|
||||
},
|
||||
failure: function(){
|
||||
// responseData = '[{"id":"1","name":"grid_01"},{"id":"2","name":"grid_02"}]';
|
||||
}
|
||||
});*/
|
||||
responseData = eval ("(" +responseData+ ")");
|
||||
return responseData;
|
||||
}
|
||||
|
||||
var getGridFieldList = function (gridUid){
|
||||
var responseData
|
||||
if (gridUid=='1'||gridUid==1){
|
||||
responseData = eval ('([{"id":"1","name":"field01"},{"id":"2","name":"field02"}])');
|
||||
} else {
|
||||
responseData = eval ('([{"id":"3","name":"field03"},{"id":"4","name":"field04"}])');
|
||||
}
|
||||
/*$.ajax({
|
||||
url: "/processes/processes_Ajax",
|
||||
type: "POST",
|
||||
data: {action : 'getGridFieldList', PRO_UID: tinyMCE.activeEditor.processID, DYN_UID: gridUid},
|
||||
dataType: "json",
|
||||
success: function (data) {
|
||||
$.each(responseData, function(index, element) {
|
||||
$('#listContainer').append($('<div class="gridCell">', {
|
||||
text: element.name
|
||||
}));
|
||||
});
|
||||
}
|
||||
});*/
|
||||
|
||||
$('#listContainer').html('');
|
||||
var divHeader = '<tr>';
|
||||
var divCell = '<tr>';
|
||||
$.each(responseData, function(index, element){
|
||||
divHeader += "<td><input type='checkbox' class='headerField' name='headerField' value='"+element.name+"'/><input type='text' style='width:100px;' name='dynafield' class='dynaField' value='"+element.name+"' id='"+element.name+"'></td>";
|
||||
divCell += "<td align='center'><input type='hidden' id='field_"+element.name+"' value='"+element.name+"'>"+element.name+"</td>";
|
||||
});
|
||||
divHeader += "</tr>";
|
||||
divCell += "</tr>";
|
||||
|
||||
$('#listContainer').append(divHeader+divCell);
|
||||
|
||||
}
|
||||
|
||||
var generateListValues = function(){
|
||||
var list = getGridList();
|
||||
var combo = document.getElementById("gridList");
|
||||
var option = document.createElement('option');
|
||||
for(i=(combo.length-1); i>=0; i--)
|
||||
{
|
||||
var aDelete = combo.options[i];
|
||||
aDelete.parentNode.removeChild(aDelete);
|
||||
}
|
||||
|
||||
if(list.length>0){
|
||||
for(i=0; i<list.length; i++)
|
||||
{
|
||||
option = document.createElement("OPTION");
|
||||
option.value = list[i].id;
|
||||
option.text = list[i].name;
|
||||
combo.add(option);
|
||||
}
|
||||
} else {
|
||||
option = document.createElement("OPTION");
|
||||
option.value = 0;
|
||||
option.text = 'No Grids';
|
||||
combo.add(option);
|
||||
}
|
||||
}
|
||||
|
||||
var insertFormatedGrid = function(){
|
||||
var gridName = $("#gridList").val();
|
||||
var tableCode = "<table>"
|
||||
var gridCode = "<!--"+gridName+"@>-->";
|
||||
var headerCode = "<tr>";
|
||||
var fieldCode = "<tr>";
|
||||
|
||||
$('#listContainer .headerField').each(function(i){
|
||||
if (this.checked == true) {
|
||||
headerCode += "<td>"+$('#'+this.value).val()+"</td>";
|
||||
fieldCode += "<td>"+$('#prefixList').val()+$('#field_'+this.value).val()+"</td>";
|
||||
}
|
||||
});
|
||||
headerCode += "</tr>";
|
||||
fieldCode += "</tr>";
|
||||
|
||||
gridCode += fieldCode+"<!--@<"+gridName+"-->";
|
||||
tableCode += gridCode+"</table>"
|
||||
updateEditorContent (tableCode);
|
||||
closePluginPopup();
|
||||
}
|
||||
|
||||
$('#gridList').change(function(){
|
||||
getGridFieldList($(this).val());
|
||||
});
|
||||
|
||||
$('#addButton').click(function(){
|
||||
insertFormatedGrid();
|
||||
});
|
||||
|
||||
$('#cancelButton').click(function(){
|
||||
closePluginPopup();
|
||||
});
|
||||
|
||||
generateListValues();
|
||||
getGridFieldList($("#gridList").val());
|
||||
});
|
||||
@@ -1,128 +0,0 @@
|
||||
<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="">'
|
||||
//.'Variable Name: <br/>'
|
||||
.'<div id="d_variables">'
|
||||
.'<table width="80%">'
|
||||
|
||||
.'<tr>'
|
||||
.'<td width="33%">'
|
||||
.'<label for="type_label">Type Variable</label>'
|
||||
.'</td>'
|
||||
|
||||
.'<td width="33%">'
|
||||
.'<label for="prefix_label">Prefix</label>'
|
||||
.'</td>'
|
||||
|
||||
.'<td width="33%">'
|
||||
.'<label for="variables_label">Variables</label>'
|
||||
.'</td>'
|
||||
.'</tr>'
|
||||
|
||||
.'<tr>'
|
||||
.'<td>'
|
||||
.'<select name="type_variables">'
|
||||
.'<option value="all">All Variables</option>'
|
||||
.'<option value="system">System Variables</option>'
|
||||
.'<option value="process">Process Variables</option>'
|
||||
.'</select> '
|
||||
.'</td>'
|
||||
|
||||
.'<td width="33%">'
|
||||
.'<select name="prefix">'
|
||||
.'<option value="quotes">@#</option>'
|
||||
.'<option value="float">@@</option>'
|
||||
.'<option value="encoding">@?</option>'
|
||||
.'</select> '
|
||||
.'</td>'
|
||||
|
||||
.'<td width="33%">'
|
||||
.'<select name="variables">'
|
||||
.'<option value="quotes">@@SYS_SYS</option>'
|
||||
.'<option value="float">@@SYS_LANG</option>'
|
||||
.'<option value="encoding">@@SYS_SKIN</option>'
|
||||
.'</select>'
|
||||
.'</td>'
|
||||
.'</tr>'
|
||||
.'</table>'
|
||||
.'</div>'
|
||||
|
||||
.'<br>'
|
||||
.'<div id="desc_variables">'
|
||||
.'<table border="1" width="100%">'
|
||||
.'<tr width="40%">'
|
||||
.'<td>Result</td>'
|
||||
.'<td>@#SYS_LANG</td>'
|
||||
.'</tr>'
|
||||
.'<tr width="60%">'
|
||||
.'<td>Description</td>'
|
||||
.'<td>Description @#SYS_LANG</td>'
|
||||
.'</tr>'
|
||||
.'</table>'
|
||||
.'</div>'
|
||||
|
||||
.'<br>'
|
||||
.'<div id="desc_variables">'
|
||||
.'<label for="desc_prefix">* @# Replace de value in quotes</label>'
|
||||
.'</div>'
|
||||
|
||||
//.'<br/><input type="text" size="20" name="upload_variable" ID="Text1"/>'
|
||||
// .'<input type="submit" name="Variable" value="Variable" style="width: 100px;" 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>
|
||||
';
|
||||
}
|
||||
?>
|
||||
|
||||
@@ -123,8 +123,8 @@ class XmlForm_Field_WYSIWYG_EDITOR extends XmlForm_Field
|
||||
editor_selector : "tmceEditor",
|
||||
width : "770",
|
||||
height : "305",
|
||||
|
||||
theme_advanced_buttons1 : "pmSimpleUploader,|,pmVariablePicker,|,bold,italic,underline,|,justifyleft,justifycenter,justifyright,justifyfull,|,fontselect,fontsizeselect,|,cut,copy,paste,|,bullist,numlist,|,outdent,indent,blockquote",
|
||||
verify_html : false,
|
||||
theme_advanced_buttons1 : "pmSimpleUploader,|,pmVariablePicker,|,pmGrids,|,bold,italic,underline,|,justifyleft,justifycenter,justifyright,justifyfull,|,fontselect,fontsizeselect,|,cut,copy,paste,|,bullist,numlist,|,outdent,indent,blockquote",
|
||||
theme_advanced_buttons2 : "tablecontrols,|,undo,redo,|,link,unlink,image,|,forecolor,backcolor,|,hr,removeformat,visualaid,|,sub,sup,|,ltr,rtl,|,code",
|
||||
oninit: function (){
|
||||
tinyMCE.activeEditor.processID=formProcessID;
|
||||
|
||||
@@ -109,9 +109,13 @@ var setVariablePickerJS = function(){
|
||||
}
|
||||
}
|
||||
}
|
||||
// check wether the document has been already loaded or not,
|
||||
// whatever the state is this condition ensures that the events are always loaded
|
||||
if (document.readyState == 'complete'){
|
||||
// if completed load the functions and events
|
||||
setVariablePickerJS();
|
||||
} else {
|
||||
// if not set the function call in the body onload event
|
||||
document.body.onload = setVariablePickerJS;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user