(function($, undefined){
jQuery(document).ready(function(){
// JavaScript Document
(function() {
$(window).on('load', function(){
//old version
$('#content_ifr').contents().on('click','.delerer_block', function () {
$(this).parent().remove();
});
//new wersion
$('#content_ifr').contents().on('click','.delete_X', function () {
$(this).parent().parent().prev().remove();
$(this).parent().parent().remove();
});
//delete demo
$('#content_ifr').contents().on('click','p.delete-demo, span.delete-demo', function () {
//$(this).remove();
$(this).attr('class', '')
$(this).html(' ')
});
$('#content_ifr').contents().on('click','.round_counter .edit_X', function () {
var my_click = $(this).parent().parent()
tinyMCE.activeEditor.windowManager.open( {
title: 'Set the parameters of the CIRCLE Box',
width: 550,
height: 500,
//autoScroll: true,
style: 'overflow: auto; padding-bottom:100px; box-sizing: border-box;',
body: [
{
type : 'container',
name : 'name_box',
label : 'Title:',
html : ''
},
{
type : 'container',
name : 'value_counter',
label : 'Value Counter:',
html : ''
},
{
type : 'container',
name : 'radius',
label : 'Radius:',
html : ''
},
{
type : 'container',
name : 'prima_color',
label : 'Background Color:',
html : ''
},
{
type : 'container',
name : 'prima_color_hover',
label : 'Background Color Hover:',
html : ''
},
{
type : 'container',
name : 'text_color',
label : 'Icon Color:',
html : ''
},
{
type : 'container',
name : 'text_color_circl',
label : 'Text Color:',
html : ''
},
{
type : 'container',
name : 'text_color_circl_hover',
label : 'Text Color Hover:',
html : ''
},
{
type: 'container', // тип listbox = выпадающий список select
name: 'icon',
label: 'Select Icon',
html : '
---- Web Application Icons ----
---- Hand Icons ----
---- Transporatation Icons ----
---- Gender Icons ----
---- File Type Icons ----
---- Spinner Icons ----
---- Form Control Icons ----
---- Payment Icons ----
---- Chart Icons ----
---- Currency Icons ----
---- Text Editor Icons ----
---- Directional Icons ----
---- Video Player Icons ----
---- Brand Icons ----
---- Medical Icons ----
',
},
{
type : 'container',
name : 'insert_animation',
label : 'Animation:',
html : ''
},
{
type : 'container',
name : 'insert_delay',
label : 'Delay:',
html : ''
},
{
type : 'container',
name : 'empty1',
label : ' ',
html : '
'
},
{
type : 'container',
name : 'empty2',
label : ' ',
html : '
'
},
],
onsubmit: function( e ) { // это будет происходить после заполнения полей и нажатии кнопки отправки
var serialize_parametr = '';
$('.mce-container-body.mce-abs-layout input, .mce-container-body.mce-abs-layout select').each(function(index, element) {
serialize_parametr = serialize_parametr + $(this).attr('name') + '="'+$(this).val()+'" '
});
var iconner = $('#iconner .selected').removeClass('selected').attr('class')
serialize_parametr = serialize_parametr + 'insert_icon="' +iconner+ '" '
var value_counter = $('#value_counter').val()
var name_box = $('#name_box').val()
var id_this_td = my_click.attr('id')
var current_style = '';
my_click.prev().remove()
my_click.after(current_style+'
delete
edit
[round_counter '+serialize_parametr+' ]
[demo_block]
'+value_counter+'
'+name_box+'
[/demo_block]
');
my_click.remove()
}
});
$('.mce-container.mce-panel.mce-foot').css({'position' : 'fixed', 'left' : 'auto', 'top' : 'auto'})
$('#iconner').on('click','i', function () {
$('#iconner i').removeClass('selected')
$(this).addClass('selected')
});
$('#iconner '+'.'+my_click.find('.invisible_shortcode').html().split('"')[21].substring(3)).addClass('selected')
$('select#insert_animation [value="'+my_click.find('.invisible_shortcode').html().split('"')[17]+'"]').attr("selected", "");
$('select#insert_delay [value="'+my_click.find('.invisible_shortcode').html().split('"')[19]+'"]').attr("selected", "");
//alert(my_click.find('.invisible_shortcode').html())
//alert(my_click.find('.invisible_shortcode').html().split('"')[13])
//alert('.'+my_click.find('.invisible_shortcode').html().split('"')[17].substring(3))
});
})
tinymce.PluginManager.add('true_mce_button_round_counter', function( editor, url ) { // id кнопки true_mce_button должен быть везде один и тот же
editor.addButton( 'true_mce_button_round_counter', { // id кнопки true_mce_button
icon: ' fa fa-info-circle', // мой собственный CSS класс, благодаря которому я задам иконку кнопки
type: 'menubutton',
title: 'Add Circle Count', // всплывающая подсказка при наведении
menu: [ // тут начинается первый выпадающий список
{ // первый элемент первого выпадающего списка
text: 'Add New Count',
onclick: function() {
editor.windowManager.open( {
title: 'Set the parameters of the CIRCLE Box',
width: 550,
height: 500,
//autoScroll: true,
style: 'overflow: auto; padding-bottom:100px; box-sizing: border-box;',
body: [
{
type : 'container',
name : 'name_box',
label : 'Title:',
html : ''
},
{
type : 'container',
name : 'value_counter',
label : 'Value Counter:',
html : ''
},
{
type : 'container',
name : 'radius',
label : 'Radius:',
html : ''
},
{
type : 'container',
name : 'prima_color',
label : 'Background Color:',
html : ''
},
{
type : 'container',
name : 'prima_color_hover',
label : 'Background Color Hover:',
html : ''
},
{
type : 'container',
name : 'text_color',
label : 'Icon Color:',
html : ''
},
{
type : 'container',
name : 'text_color_circl',
label : 'Text Color:',
html : ''
},
{
type : 'container',
name : 'text_color_circl_hover',
label : 'Text Color Hover:',
html : ''
},
{
type: 'container', // тип listbox = выпадающий список select
name: 'icon',
label: 'Select Icon',
html : '
---- Web Application Icons ----
---- Hand Icons ----
---- Transporatation Icons ----
---- Gender Icons ----
---- File Type Icons ----
---- Spinner Icons ----
---- Form Control Icons ----
---- Payment Icons ----
---- Chart Icons ----
---- Currency Icons ----
---- Text Editor Icons ----
---- Directional Icons ----
---- Video Player Icons ----
---- Brand Icons ----
---- Medical Icons ----
',
},
{
type : 'container',
name : 'insert_animation',
label : 'Animation:',
html : ''
},
{
type : 'container',
name : 'insert_delay',
label : 'Delay:',
html : ''
},
{
type : 'container',
name : 'empty1',
label : ' ',
html : '
'
},
{
type : 'container',
name : 'empty2',
label : ' ',
html : '
'
},
],
onsubmit: function( e ) { // это будет происходить после заполнения полей и нажатии кнопки отправки
var serialize_parametr = '';
$('.mce-container-body.mce-abs-layout input, .mce-container-body.mce-abs-layout select').each(function(index, element) {
serialize_parametr = serialize_parametr + $(this).attr('name') + '="'+$(this).val()+'" '
});
var iconner = $('#iconner .selected').removeClass('selected').attr('class')
serialize_parametr = serialize_parametr + 'insert_icon="' +iconner+ '" '
var value_counter = $('#value_counter').val()
var name_box = $('#name_box').val()
var id_this_td = 'unique_style_' + ( Math.floor(Math.random() * (999999 - 100000 + 1)) + 100000 )
var current_style = '';
editor.insertContent( current_style+'