Classic editor support

This commit is contained in:
Michael Thomas 2022-01-22 22:17:27 -05:00
parent b986b11441
commit fc2f9df23c
5 changed files with 103 additions and 123 deletions

View File

@ -49,7 +49,7 @@ if ( !class_exists('CognitoFormsPlugin') ) {
add_action($action, array($this, $action));
}
// Registers tinyMCE filters
// Registers plug-in filters
private function addFilters($filters) {
foreach($filters as $filter)
add_filter($filter, array($this, $filter));
@ -60,6 +60,11 @@ if ( !class_exists('CognitoFormsPlugin') ) {
$this->addActions(self::$actions);
}
public function init() {
// Initialize Gutenberg Block
$this->block_init();
}
// Initialize plug-in
public function admin_init() {
if(!current_user_can('edit_posts') && !current_user_can('edit_pages')) return;
@ -77,17 +82,8 @@ if ( !class_exists('CognitoFormsPlugin') ) {
delete_option('cognito_organization');
}
// Add tinyMCE plug-in
if(get_user_option('rich_editing') == 'true') {
$this->addfilters(array(
'mce_buttons',
'mce_external_plugins'
));
}
}
public function init() {
$this->block_init();
// Initialize TinyMCE Plugin
$this->tinymce_init();
}
// Initialize block
@ -131,16 +127,26 @@ if ( !class_exists('CognitoFormsPlugin') ) {
) );
}
// Set up tinyMCE buttons
// Initialize classic editor (TinyMCE)
public function tinymce_init() {
if(get_user_option('rich_editing') == 'true') {
$this->addFilters(array(
'mce_buttons',
'mce_external_plugins'
));
}
}
// Set up TinyMCE buttons
public function mce_buttons($buttons) {
array_push($buttons, '|', 'cognito');
return $buttons;
}
// Initialize tinyMCE plug-in
public function mce_external_plugins($plugins) {
$plugins['cognito'] = plugin_dir_url( __FILE__ ) . 'tinymce/plugin.js';
return $plugins;
// Initialize TinyMCE plug-in
public function mce_external_plugins( $plugin_array ) {
$plugin_array['cognito_mce_plugin'] = plugins_url( '/tinymce/plugin.js', __FILE__ );
return $plugin_array;
}
// Initialize administration menu (left-bar)
@ -162,5 +168,6 @@ if ( !class_exists('CognitoFormsPlugin') ) {
include 'templates/options.php';
}
}
new CognitoFormsPlugin;
}

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.1 KiB

BIN
tinymce/cogicon.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.0 KiB

117
tinymce/dialog.php Executable file → Normal file
View File

@ -15,89 +15,54 @@
* along with this program; if not, write to the Free Software
* Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 USA
*/
?>
?>
<!DOCTYPE html>
<html>
<head>
<style>
body { overflow: hidden; }
button{margin-top:20px;color: #fff !important;text-shadow: 0 1px 1px rgba(0,0,0,.3);outline: none;cursor: pointer;text-align: center;text-decoration: none;font: 14px/100% 'Open Sans Condensed', sans-serif !important;font-weight: 700 !important;padding: 5px 15px 6px;border: solid 1px #95ba14;background: #aed136;}
.clearlooks2 .mceTop .mceLeft, .clearlooks2 .mceTop .mceRight{background:#00B4AC;padding:20px;font-family: 'Open Sans Condensed', Arial, Helvetica, sans-serif;font-size: 18px;font-weight: 700;color: #fff;}
body{padding: 10px 20px!important;font-family: 'Open Sans', Arial, Helvetica, sans-serif;font-size: 14px;font-weight: 400;}
h3 {margin-bottom:20px!important;color:#444!important;}
</style>
<script src="../../../../wp-includes/js/jquery/jquery.js"></script>
<script src="../../../../wp-includes/js/tinymce/tiny_mce_popup.js"></script>
<script src="../../../../wp-includes/js/tinymce/utils/mctabs.js"></script>
<script src="../../../../wp-includes/js/tinymce/utils/form_utils.js"></script>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Cognito Forms</title>
<script>
var titleElements = tinyMCEPopup.getWin().document.querySelectorAll('.mceTop .mceLeft, .mceTop .mceRight, .mce-title');
for (var i = 0; i < titleElements.length; i++) {
titleElements[i].style.background = '#00B4AC';
titleElements[i].style.color = '#fff';
<style>
html, body {
margin: 0;
padding: 0;
height: 100%;
}
#cognito-frame {
width: 100%;
height: 100%;
border: none;
}
</style>
</head>
<body>
<iframe id="cognito-frame" src="https://forms.cognito.test/integrations/cms"></iframe>
<script type="text/javascript">
window.addEventListener('message', handleMessage);
function handleMessage(event) {
var frame = document.getElementById('cognito-frame');
var baseUrl = new URL(frame.getAttribute('src')).origin;
if (event.origin === baseUrl) {
console.log('Message received!');
sendData(event.data);
}
}
var closeElement = tinyMCEPopup.getWin().document.querySelector('.mceClose, .mce-close');
if (closeElement) closeElement.style.color = '#fff';
function sendData(data) {
embedCode = data.embedCodes.Seamless;
console.log(embedCode);
function cognito_submit() {
var formSelect = document.getElementById('formSelect');
var shortcode = '[CognitoForms id="' + formSelect.value + '"]';
if (window.tinyMCE) {
if (window.tinyMCE.execInstanceCommand) {
window.tinyMCE.execInstanceCommand('content', 'mceInsertContent', false, shortcode);
tinyMCEPopup.editor.execCommand('mceRepaint');
}
else if (window.tinyMCE.focusedEditor) {
window.tinyMCE.focusedEditor.insertContent(shortcode);
if (top.tinyMCE && top.tinyMCE.activeEditor) {
top.tinyMCE.activeEditor.insertContent(embedCode);
}
tinyMCEPopup.close();
top.tinymce.activeEditor.windowManager.close();
}
return false;
}
jQuery(function() {
var data = {
action: "get_forms"
};
jQuery.post(tinyMCEPopup.params.ajax_url, data, function(response) {
if (response) {
var forms = JSON.parse(response);
var formSelect = jQuery("#formSelect");
jQuery.each(forms, function() {
formSelect.append(jQuery("<option></option>")
.attr("value", this.Id)
.text(this.Name));
});
jQuery("#form-list").show();
} else {
jQuery("#no-forms").show();
}
});
});
</script>
</head>
<body>
<div id="no-forms" style="display:none;">
<h3>You are not logged into your Cognito Forms account.</h3>
<p>Please click on the "Cognito Forms" link in the menu on the left and log in to register this plug-in with your account.</p>
</div>
<div id="form-list">
<h3>Embed a Form</h3>
<form method="post" action="">
<label for="formSelect">Choose a form</label>
<select id="formSelect">
</select><br/>
<button id="cognito-insert-form" type="button" onclick="cognito_submit();">Insert Form</button>
</form>
</div>
</body>
</body>
</html>

View File

@ -1,24 +1,32 @@
(function(){
tinymce.create('tinymce.plugins.cognito', {
init : function(ed, url) {
ed.addCommand('cognito_embed_window', function() {
ed.windowManager.open({
file : url + '/dialog.php',
width : 400,
height : 160,
inline: 1
}, { plugin_url : url, ajax_url: ajaxurl });
});
( function() {
tinymce.create( 'tinymce.plugins.cognito_mce_plugin', {
getInfo: function() {
return {
longname: 'Cognito Forms',
author: 'cognitoapps',
authorurl: 'https://cognitoforms.com',
infourl: 'https://cognitoforms.com',
version: "2.0",
};
},
init: function( editor, url ) {
editor.addCommand( 'cognito_embed_window', function() {
editor.windowManager.open( {
title: 'Cognito Forms',
url: url + '/dialog.php',
width: 500,
height: 500,
} );
} );
ed.addButton('cognito', {
title : 'Cognito Forms',
cmd : 'cognito_embed_window',
image : url + '/cogicon.ico'
});
}
});
editor.addButton( 'cognito', {
title: 'Cognito Forms',
cmd: 'cognito_embed_window',
image: url + '/cogicon.png',
} );
},
} );
tinymce.PluginManager.add('cognito', tinymce.plugins.cognito);
})()
tinymce.PluginManager.add( 'cognito_mce_plugin', tinymce.plugins.cognito_mce_plugin );
} )();