2013-12-12 13:14:28 +01:00
/ * *
* @ license Copyright ( c ) from 2013 , Author : Ian . All rights reserved .
* /
/ * *
2015-12-19 15:58:58 +01:00
* @ fileOverview A Serendipity serendipity _event _ckeditor custom CKEDITOR additional plugin creator file : cke _plugin . js , v . 1.10 , 2015 - 12 - 19
2013-12-12 13:14:28 +01:00
* /
2014-10-13 19:46:57 +02:00
// define array for hooked s9y plugins
var s9ymediabuttons = [ ] ;
var s9ypluginbuttons = [ ] ;
2013-11-20 18:14:30 +01:00
/ *
* Get the instance ready event and set global instance var
* This is read by serendipity _editor . js and in case of serendipity _html _nugget _plugin by below serendipity _imageSelector _addToBody ( )
* /
CKEDITOR . on ( 'instanceReady' , function ( event ) {
event . editor . on ( 'focus' , function ( ) {
isinstance = this ;
} ) ;
} ) ;
/ *
* Create a prototyp foreach array function
* This is faster than using ckeditor . js internal forEach ( ) implementation or even using plain for ( )
* * /
if ( ! Array . prototype . forEach ) {
Array . prototype . forEach = function ( fn , scope ) {
'use strict' ;
var i , len ;
for ( i = 0 , len = this . length ; i < len ; ++ i ) {
if ( i in this ) {
fn . call ( scope , this [ i ] , i , this ) ;
}
}
} ;
}
/ *
* ExecutionCommand string replacement function
* Used in CKEDITOR . plugins . add ( ) , to get ready to execute ( eval ) the button command passed by Serendipity plugins
* @ param string string
* @ return string string
* * /
function ecfit ( str ) {
str = str . replace ( 'function() { ' , '' ) ;
str = str . replace ( ' }' , '' ) ;
2014-10-14 16:25:17 +02:00
str = str . replace ( window . location . protocol + "//" + window . location . host , '' ) ; // amazonchooser only
2013-11-20 18:14:30 +01:00
return str ;
}
/ *
* This was previously a nugget only area , spawned by head ! ( textareas of staticpage nuggets , html nugget plugins , etc . )
* called via Spawnnugget ( ) , set by real plugins like staticpages and cores functions _plugins _admin . inc in case of $ev [ 'skip_nuggets' ] === false
*
* NOW it is used by all textareas !
*
* @ param string $eventData [ 'item' ]
* @ param string $eventData [ 'jsname' ]
* @ param array / object jsEventData / json _encode ( $eventData [ 'buttons' ] )
* * /
2013-12-04 12:30:51 +01:00
function Spawnnuggets ( item , addEP , jsED ) {
if ( ! item ) var item = null ;
if ( ! addEP ) var addEP = null ;
if ( ! jsED ) var jsED = null ;
2013-11-20 18:14:30 +01:00
2015-12-19 15:58:58 +01:00
var $this = ! isNaN ( item ) ? 'nuggets' + item : item ;
2014-10-13 19:46:57 +02:00
var area = item . replace ( 'serendipity[' , '' ) . replace ( ']' , '' ) ;
2015-12-19 15:58:58 +01:00
var $nugID = 'nuggets' + area ; // plugin nugget textareas (eg. staticpages)
2014-10-13 19:46:57 +02:00
var nugget = '' ; // nugget id for hooked s9ypluginbuttons
2015-12-19 15:58:58 +01:00
// global defines
2014-10-13 19:46:57 +02:00
s9ymediabuttons . push ( 's9yML' + area ) ;
// Init CKEDITOR added plugins
// Seperate by comma, no whitespace allowed, and keep last comma, since later on concatenated with Serendipity hooked plugins, eg MediaLibrary!
// codesnippet is an official CKEDITOR plugin.
// Plugin Dependencies: codesnippet Add-on Dependencies: widget
// Plugin Dependencies: widget Add-on Dependencies: Line Utilities and Clipboard
// mediaembed is a fast and simple YouTube code CKEditor-Plugin: v. 0.5+ (https://github.com/frozeman/MediaEmbed, 2013-09-12) to avoid ACF restrictions
// procurator and cheatsheet are S9y only plugins
2015-12-19 15:58:58 +01:00
var name _extraPlugins = ( addEP !== null ) ? addEP : $this ;
2013-11-20 18:14:30 +01:00
var jsEventData = ( jsED !== null ) ? jsED : window . jsEventData ; // global set by 'backend_wysiwyg_finish' hook
2014-11-28 16:26:41 +01:00
var extraPluginACF = ( CKECONFIG _ACF _OFF === true ) ? name _extraPlugins + ',mediaembed,cheatsheet' : name _extraPlugins + ',mediaembed,procurator,cheatsheet' ; // no spaces allowed!
var extraPluginList = ( CKECONFIG _CODE _ON === true ) ? extraPluginACF + ',codesnippet' : extraPluginACF ; // no spaces allowed!
var customConfigPath = CKEDITOR _PLUGPATH + 'serendipity_event_ckeditor/cke_config.js?v=' + CKECONFIG _FORCE _LOAD ;
2015-12-19 15:58:58 +01:00
var useAutoSave = ( CKECONFIG _USEAUTOSAVE === true && Modernizr . indexeddb === true ) ? 'on' : null ;
2014-10-13 19:46:57 +02:00
// case hooked s9ypluginbuttons, since we want the unique id
if ( typeof window . jsEventData !== 'undefined' ) {
var nugget = area ;
jsEventData . forEach ( function ( k , i ) {
s9ypluginbuttons . push ( jsEventData [ i ] . id + nugget ) ;
//console.log(jsEventData[i].id+nugget);
} ) ;
}
2013-11-20 18:14:30 +01:00
2015-12-19 15:58:58 +01:00
if ( document . getElementById ( $this ) ) {
CKEDITOR . replace ( $this , {
2014-11-28 16:26:41 +01:00
toolbar : CKECONFIG _TOOLBAR ,
2015-12-19 15:58:58 +01:00
2013-11-20 18:14:30 +01:00
// Load our specific configuration file.
2014-11-28 16:26:41 +01:00
customConfig : customConfigPath ,
2013-11-20 18:14:30 +01:00
// or do and set
// Reset toolbar Groups settings
// toolbarGroups: null
// or any other configuration option here
// uiColor : '#AADC6E', // light green example
// language: 'fr', // lang set example
// set all plugins at once - no spaces allowed!
extraPlugins : extraPluginList ,
// Set the startup mode view [OK]
// startupMode: 'source',
2014-09-07 10:52:45 +02:00
// listen on load - for mediainsert imageselectorplus plugin galleries
2013-11-20 18:14:30 +01:00
on : {
loaded : function ( evt ) {
var editor = evt . editor ,
rules = {
elements : {
mediainsert : function ( element ) {
2014-11-28 16:26:41 +01:00
if ( CKECONFIG _ACF _OFF !== true ) {
2013-11-20 18:14:30 +01:00
// XHTML output instead of HTML - but this does not react on trailing slash eg <media "blah" />
// editor.dataProcessor.writer.selfClosingEnd = ' />';
//avoid line breaks with special block elements
var tags = [ 'mediainsert' , 'gallery' , 'media' ] ;
for ( var key in tags ) {
editor . dataProcessor . writer . setRules ( tags [ key ] ,
{
// Indicates that this tag causes indentation on line breaks inside of it.
indent : true ,
// Inserts a line break before the element opening tag.
breakBeforeOpen : true ,
// Inserts a line break after the element opening tag.
breakAfterOpen : false ,
// Inserts a line break before the element closing tag.
breakBeforeClose : true ,
// Inserts a line break after the element closing tag.
breakAfterClose : false
} ) ;
}
}
2014-02-11 18:14:28 +01:00
} ,
// Output dimensions of w/h images, since we either need an unchanged MediaLibrary image code for responsive templates or tweak some replacements!
img : function ( element ) {
var style = element . attributes . style ;
if ( style )
{
// Get the height from the style.
var match = /(?:^|\s)height\s*:\s*(\d+)px/i . exec ( style ) ;
var height = match && match [ 1 ] ;
if ( height )
{
element . attributes . style = element . attributes . style . replace ( /(?:^|\s)height\s*:\s*(\d+)px;?/i , '' ) ;
//element.attributes.height = height;
// Do not add to element attribute height, since then the height will be automatically (re-) added to style again by ckeditor or image js
// The current result is now: img alt class src style{width}. That is the only working state to get arround this issue in a relative simple way!
// Remember: Turning ACF OFF, will leave code alone, but still removes the height="" attribute! (workaround in extraAllowedContent added img[height]!)
}
}
2013-11-20 18:14:30 +01:00
}
}
} ;
2014-02-11 18:14:28 +01:00
2013-11-20 18:14:30 +01:00
// It's good to set both filters - dataFilter is used when loading data and htmlFilter when retrieving.
editor . dataProcessor . htmlFilter . addRules ( rules ) ;
editor . dataProcessor . dataFilter . addRules ( rules ) ;
2015-12-19 15:58:58 +01:00
} ,
// allow the Serendipity autosaver refill to work with this plugin instances
instanceReady : function ( ev ) {
//console.log('IS instanceReady');
var iseditor = ev . editor ;
//console.log(iseditor);
if ( useAutoSave ) {
// check for 'nuggetsID' (only) autosaver caches, since these are not defined in Serendipity editor.js
serendipity . getCached ( $this , function ( res ) {
if ( $this === $nugID && res && res !== null && res != 'null' ) {
// don't ever do this with existing nugget entry data!!
if ( iseditor . getData ( ) == '' ) {
iseditor . setData ( res ) ;
}
}
} ) ;
}
2013-11-20 18:14:30 +01:00
}
}
} ) ;
CKEDITOR . plugins . add ( name _extraPlugins , {
init : function ( editor ) {
2014-10-13 19:46:57 +02:00
if ( typeof jsEventData !== 'undefined' ) {
2013-11-20 18:14:30 +01:00
jsEventData . forEach ( function ( k , i ) {
var execcom = ecfit ( jsEventData [ i ] . javascript ) ;
2014-10-13 19:46:57 +02:00
editor . addCommand ( jsEventData [ i ] . id + nugget , {
2013-11-20 18:14:30 +01:00
exec : function ( editor ) {
2014-10-14 15:51:29 +02:00
eval ( execcom ) ;
2013-11-20 18:14:30 +01:00
}
} ) ;
2014-10-13 19:46:57 +02:00
editor . ui . addButton ( jsEventData [ i ] . id + nugget , {
2013-11-20 18:14:30 +01:00
label : jsEventData [ i ] . name ,
title : jsEventData [ i ] . name + ' Plugin' ,
2014-06-24 17:07:18 +02:00
icon : jsEventData [ i ] . img _url ,
2014-10-13 19:46:57 +02:00
iconName : jsEventData [ i ] . id + nugget + '_icon' ,
command : jsEventData [ i ] . id + nugget
2013-11-20 18:14:30 +01:00
} ) ;
} ) ;
}
2014-10-13 19:46:57 +02:00
editor . addCommand ( 's9yML' + area , {
2013-11-20 18:14:30 +01:00
exec : function ( editor ) {
2014-10-14 15:51:29 +02:00
if ( false === S9Y _VERSION _NEW ) {
window . open ( 'serendipity_admin_image_selector.php' , 'ImageSel' , 'width=800,height=600,toolbar=no,scrollbars=1,scrollbars,resize=1,resizable=1' ) ;
} else {
2015-12-19 15:58:58 +01:00
serendipity . openPopup ( 'serendipity_admin.php?serendipity[adminModule]=media&serendipity[noBanner]=true&serendipity[noSidebar]=true&serendipity[noFooter]=true&serendipity[showMediaToolbar]=false&serendipity[showUpload]=true&serendipity[textarea]=' + $this ) ;
2014-10-14 15:51:29 +02:00
}
2013-11-20 18:14:30 +01:00
}
} ) ;
2014-10-13 19:46:57 +02:00
editor . ui . addButton ( 's9yML' + area , {
2013-11-20 18:14:30 +01:00
label : 'S9yMedia' ,
title : 'Serendipity Media Library' ,
2015-01-28 12:55:41 +01:00
icon : CKEDITOR _PLUGPATH + 'serendipity_event_ckeditor/img/mls9y.png' ,
2014-10-13 19:46:57 +02:00
iconName : 's9yML' + area + '_icon' ,
command : 's9yML' + area
2013-11-20 18:14:30 +01:00
} ) ;
}
} ) ;
}
}
/ *
* Clone a serendipity _editor . js function , to avoid a
* TypeError : parent . self . opener . serendipity _imageSelector _addToBody is not a function
* in case of serendipity _html _nugget _plugin textarea ( nuggets3 ) usage in S9y 1.7 Series
* /
function serendipity _imageSelector _addToBody ( str , textarea ) {
var oEditor = isinstance ;
if ( oEditor . mode == "wysiwyg" ) {
oEditor . insertHtml ( str ) ;
}
}
2015-12-19 15:58:58 +01:00
/ *
* Textarea nuggets autosave event listener
* We need to wait for fully available objects ( document . load will be triggered later than document . ready ) .
* We run this on any possible CKEDITOR instance - even on blogentry instances .
* Refill from cache is done per instance inside Spawnnuggets CKEDITOR . replace .
* /
$ ( window ) . load ( function ( ) {
if ( CKECONFIG _USEAUTOSAVE === true && Modernizr . indexeddb === true ) {
nuggets = [ ] ;
for ( var name in CKEDITOR . instances ) {
//console.log(name);
//if (false === (name.indexOf('nuggets') !== -1)) continue; // un-comment, to only use 'nuggetsID' nuggets
nuggets . push ( name ) ;
}
//console.log(nuggets);
if ( nuggets != null ) {
nuggets . forEach ( function ( e ) {
//console.log(e);
var editor = CKEDITOR . instances [ e ] ;
var lastSaveTime = 0 ;
var currentTime = 0 ;
// Set key event per nugget
editor . on ( 'key' , autosave ) ;
function autosave ( ) {
window . setTimeout (
function ( ) {
currentTime = new Date ( ) . getTime ( ) ;
if ( ( currentTime - lastSaveTime ) > 15000 || lastSaveTime == 0 ) {
serendipity . cache ( e , editor . getData ( ) ) ;
console . log ( 'SAVED NUGGET ' + e ) ;
lastSaveTime = new Date ( ) . getTime ( ) ;
}
} ,
15000
) ;
}
} ) ;
}
}
} ) ;