Project

General

Profile

1
/**
2
 *  @module         ckeditor
3
 *  @version        see info.php of this module
4
 *  @authors        Michael Tenschert, Dietrich Roland Pehlke, Dietmar Wöllbrink, Marmot, Luisehahne
5
 *  @copyright      Frederico Knabben
6
 *  @license        GNU General Public License
7
 *  @license terms  see info.php of this module
8
 *  @platform       see info.php of this module
9
 *  @requirements   PHP 5.2.x and higher
10
 */
11

    
12
/*
13
* WARNING: Clear the cache of your browser cache after you modify this file!
14
* If you don't do this, you may notice that your browser is ignoring all your changes.
15
*
16
* --------------------------------------------------
17
*
18
* Note: Some CKEditor configs are set in _yourwb_/modules/ckeditor/include.php
19
*
20
* Example: "$ckeditor->config['toolbar']" is PHP code in include.php. The very same here in the
21
* wb_ckconfig.js would be: "config.toolbar" inside CKEDITOR.editorConfig = function( config ).
22
*
23
* Please read "readme-faq.txt" in the wb_config folder for more information about customizing.
24
*
25
*/
26

    
27
CKEDITOR.editorConfig = function( config )
28
{
29
    // Define changes to default configuration here.
30
    // For complete reference see:
31
    // http://docs.ckeditor.com/#!/api/CKEDITOR.config
32

    
33
  // Different Toolbars. Remove, add or move 'SomeButton', with the quotes and following comma
34
    config.toolbar_Full =
35
    [
36
        { name: 'document',  items : [ 'Source','-','Save','NewPage','DocProps','Preview','Print','-','Templates' ] },
37
        { name: 'clipboard', items : [ 'Cut','Copy','Paste','PasteText','PasteFromWord','-','Undo','Redo' ] },
38
        { name: 'editing',   items : [ 'Find','Replace','-','SelectAll','-','SpellChecker', 'Scayt' ] },
39
        { name: 'forms',     items : [ 'Form', 'Checkbox', 'Radio', 'TextField', 'Textarea', 'Select', 'Button', 'ImageButton', 'HiddenField' ] },
40
        '/',
41
        { name: 'basicstyles', items : [ 'Bold','Italic','Underline','Strike','Subscript','Superscript','-','RemoveFormat' ] },
42
        { name: 'paragraph',   items : [ 'NumberedList','BulletedList','-','Outdent','Indent','-','Blockquote','CreateDiv','-','JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock','-','BidiLtr','BidiRtl' ] },
43
        { name: 'links',       items : [ 'Link','Unlink','Anchor' ] },
44
        { name: 'insert',      items : [ 'Image','Flash','Table','HorizontalRule','Smiley','SpecialChar','PageBreak','Iframe' ] },
45
        '/',
46
        { name: 'styles', items : [ 'Styles','Format','Font','FontSize' ] },
47
        { name: 'colors', items : [ 'TextColor','BGColor' ] },
48
        { name: 'tools',  items : [ 'Maximize', 'ShowBlocks','-','About' ] }
49
    ];
50

    
51
  config.toolbar_WB_Mini = [
52
            ['Source','Cut','Copy'],['PasteText','PasteFromWord'],['Undo','Redo','-','RemoveFormat'],['Wbdroplets','Wblink','Unlink','Anchor'],
53
            ['TextColor','BGColor'],['Bold','Italic','Underline','Strike'],['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'],
54
            ['Styles','Format','Font','FontSize'],['NumberedList','BulletedList','-','Blockquote','CreateDiv'],['About']];
55

    
56
  config.toolbar_WB_Basic = [
57
            ['Source','Preview'],['Cut','Copy','Paste','PasteText','PasteFromWord'],['Image','Flash','Table','HorizontalRule'],['Wbdroplets','Wblink','Unlink','Anchor'],['Undo','Redo','-','SelectAll','RemoveFormat'],['Maximize','ShowBlocks','-','Code','About'],'/',
58
            ['Styles','Format','Font','FontSize'],['TextColor','BGColor'],['Bold','Italic','Underline','Strike'],['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'],['NumberedList','BulletedList','-','Outdent','Indent','Blockquote','CreateDiv']];
59

    
60
    // see http://docs.cksource.com/CKEditor_3.x/Developers_Guide/Toolbar
61
    config.toolbar_WB_Full =
62
    [
63
        { name: 'document', items : [ 'Source','-','Save','Print','-','DocProps','Preview','NewPage','-','Templates' ] },
64
        { name: 'clipboard', items : [ 'Cut','Copy','Paste','PasteText','PasteFromWord','-','Undo','Redo' ] },
65
        { name: 'editing', items : [ 'Find','Replace','-','SelectAll','-','SpellChecker', 'Scayt' ] },
66
        { name: 'colors', items : [ 'TextColor','BGColor' ] },
67
        { name: 'tools', items : [ 'Maximize', 'ShowBlocks','Code','-','About' ] },
68
        '/',
69
        { name: 'basicstyles', items : [ 'Bold','Italic','Underline','Strike','Subscript','Superscript','Shy','-','RemoveFormat' ] },
70
        { name: 'paragraph', items : [ 'NumberedList','BulletedList','-','Outdent','Indent','-','Blockquote','CreateDiv','-','JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock','-','BidiLtr','BidiRtl' ] },
71
         { name: 'forms', items : [ 'Form', 'Checkbox', 'Radio', 'TextField', 'Textarea', 'Select', 'Button', 'ImageButton','HiddenField' ] },
72
        '/',
73
        { name: 'styles', items : [ 'Styles','Format','Font','FontSize' ] },
74
        { name: 'links', items : [ 'Link','Unlink','Anchor','Wbdroplets','Wblink' ] },
75
        { name: 'insert', items : [ 'Image','Flash','Table','HorizontalRule','Smiley','SpecialChar','PageBreak','Iframe' ] }
76

    
77
    ];
78

    
79
    config.toolbar_WB_Default =
80
    [
81
        { name: 'mode', items : [ 'Source','autoFormat','CommentSelectedRange','UncommentSelectedRange' ] },
82
        { name: 'document', items : [ 'Save','wbSave','Print','-','Preview','NewPage','-','Templates' ] },
83
        { name: 'clipboard', items : [ 'Cut','Copy','Paste','PasteText','PasteFromWord','-','Undo','Redo','Backup' ] },
84
        { name: 'editing', items : [ 'Find','Replace','-','SelectAll','-','SpellChecker', 'Scayt' ] },
85
        '/',
86
        { name: 'basicstyles', items : [ 'Bold','Italic','Underline','Strike','Subscript','Superscript','Shy','-','RemoveFormat' ] },
87
        { name: 'paragraph', items : [ 'NumberedList','BulletedList','-','Outdent','Indent','-','Blockquote','CreateDiv','-','JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock','-','BidiLtr','BidiRtl' ] },
88
        { name: 'links', items : [ 'Wbdroplets','Wblink','Unlink','Anchor' ] },
89
        { name: 'insert', items : [ 'Image','Flash','Table','HorizontalRule','Smiley','SpecialChar','Iframe','Youtube','oembed', 'slideshow' ] },
90
        '/',
91
        { name: 'styles', items : [ 'Styles','Format','Font','FontSize' ] },
92
        { name: 'colors', items : [ 'TextColor','BGColor' ] },
93
        { name: 'tools',  items : [ 'Maximize', 'ShowBlocks','Syntaxhighlight','CreatePlaceholder','-','About' ] }
94

    
95
    ];
96

    
97
    config.toolbar_Basic = [['Bold','Italic','-','NumberedList','BulletedList','-','Link','Unlink','-','Code','About']];
98
    config.toolbar_WB_Simple = [['Bold','Italic','-','NumberedList','BulletedList','-','Wbdroplets','Wblink','Unlink','-','Scayt','-','Code','About']];
99

    
100
    // The default toolbar. Default: WB_Default
101
  config.toolbar = 'WB_Default';
102

    
103
  // The standard color of CKEditor. Can be changed in any hexadecimal color you like. Use the
104
  // UIColor Plugin in your CKEditor to pick the right color.
105
    config.uiColor = '#BFD7EB';
106

    
107
    config.browserContextMenuOnCtrl = true;
108

    
109
    config.ModulVersion  = '';
110
    config.WBrevision    = '';
111
    config.WBversion     = '2.8.3 SP6';
112

    
113
    config.fullPage = false;
114

    
115
    config.format_tags = 'p;div;h1;h2;h3;h4;h5;h6;pre;address';
116

    
117
    config.autoParagraph = true;
118

    
119
    /* The skin to load. It may be the name of the skin folder inside the editor installation path,
120
    * or the name and the path separated by a comma.
121
    * Available skins: moono, moonocolor*/
122
    config.skin = 'moonocolor';
123

    
124
  // Define all extra CKEditor plugins in _yourwb_/modules/ckeditor/ckeditor/plugins here
125
  //config.extraPlugins = 'timestamp';
126
    config.extraPlugins  = 'justify,find,flash,colorbutton,colordialog,dialogadvtab'
127
                         + ',div,font,forms,iframe,indentblock,language,bidi,liststyle,pagebreak,save'
128
                         + ',selectall,showblocks,smiley,templates,codemirror,autogrow,filebrowser'
129
                         + ',wblink,wbdroplets,youtube,oembed,backup,wbrelation,wbabout';
130

    
131
    config.removePlugins = 'wsc,link,save,newpage,print,shybutton,syntaxhighlight,preview,alphamanager'
132
                         + ',sourcearea,sourcedialog,imageresponsive,image2,wbsave,youtube,language,flash,placeholder';
133

    
134
    config.browserContextMenuOnCtrl = true;
135

    
136
    config.entities = false;
137

    
138
    config.scayt_autoStartup = false;
139

    
140
    // The standard height and width of CKEditor in pixels.
141
    config.height           = '350';
142
    config.width            = '100%';
143
    config.toolbarLocation  = 'top';
144

    
145
    config.autoGrow_minHeight = 100;
146
    config.autoGrow_maxHeight = 350;
147
    config.autoGrow_bottomSpace = 50;
148
    config.autoGrow_onStartup = false;
149
    // Define possibilities of automatic resizing in pixels. Set config.resize_enabled to false to
150
    // deactivate resizing.
151
    config.resize_enabled   = true;
152
    config.resize_minWidth  = 500;
153
    config.resize_maxWidth  = 1500;
154
    config.resize_minHeight = 100;
155
    config.resize_maxHeight = 1678;
156
    config.resize_dir = 'both';
157

    
158
  config.docType           = '<!DOCTYPE html>';
159

    
160
  config.image_previewText = 'WebsiteBaker helps you to create the website you want: A free, easy and secure, flexible and extensible open source content management system (CMS). Create new templates within minutes - powered by (X)HTML, CSS and jQuery. With WebsiteBaker it\'s quite natural your site is W3C-valid, SEO-friendly and accessible - there are no limitations at all. Use droplets - the new and revolutionary way of inserting PHP code - everywhere you want. In addition to that, WebsiteBaker and the community are offering lots of extensions: Just download, install with two clicks and use them. That is not enough? You want more? No problem, build your own modules! The WebsiteBaker API gives many opportunities you can rely on.';
161

    
162
  // Both options are for XHTML 1.0 strict compatibility
163
  // config.indentClasses = [ 'indent1', 'indent2', 'indent3', 'indent4' ];
164
  // [ Left, Center, Right, Justified ]
165
  // config.justifyClasses = [ 'left', 'center', 'right', 'justify' ];
166

    
167
  config.templates_replaceContent =   false;
168

    
169
  config.syntaxhighlight_lang = 'js', 'jscript', 'javascript', 'perl', 'Perl', 'pl', 'php', 'text', 'plain', 'sass', 'scss', 'scala', 'sql', 'xml', 'xhtml', 'xslt', 'html';
170

    
171
  // Explanation: _P: new <p> paragraphs are created; _BR: lines are broken with <br> elements;
172
  //              _DIV: new <div> blocks are created.
173
  // Sets the behavior for the ENTER key. Default is _P allowed tags: _P | _BR | _DIV
174
  config.enterMode = CKEDITOR.ENTER_P;
175

    
176
  // Sets the behavior for the Shift + ENTER keys. allowed tags: _P | _BR | _DIV
177
  config.shiftEnterMode = CKEDITOR.ENTER_BR;
178

    
179
  /* Allows to force CKEditor not to localize the editor to the user language.
180
  * Default: Empty (''); Example: ('fr') for French.
181
  * Note: Language configuration is based on the backend language of WebsiteBaker.
182
  * It's defined in include.php
183
  * config.language         = ''; */
184
  // The language to be used if config.language is empty and it's not possible to localize the editor to the user language.
185
  config.defaultLanguage   = 'en';
186

    
187
    /* Protect PHP code tags (<?...?>) so CKEditor will not break them when switching from Source to WYSIWYG.
188
    *  Uncommenting this line doesn't mean the user will not be able to type PHP code in the source.
189
    *  This kind of prevention must be done in the server side, so just leave this line as is. */
190
    config.protectedSource.push(/<\?[\s\S]*?\?>/g); // PHP Code
191
//    config.protectedSource.push(/\[\[[\s\S]*?\]\]/g); //  droplets
192
//    config.protectedSource.push( /<i[\s\S]*?\>/g ); //allows beginning <i> tag
193
//    config.protectedSource.push( /<\/i[\s\S]*?\>/g ); //allows ending </i> tag
194
//    config.protectedSource.push( /<span[\s\S]*?\>/g ); //allows beginning <span> tag
195
//    config.protectedSource.push( /<\/span[\s\S]*?\>/g ); //allows ending </span> tag
196
    //disable ckes Advanced Content Filter (ACF) to avoid wblinks to be filtered?
197
    config.allowedContent = true;
198

    
199
    config.jsplus_image_editor_init_tool = 'text';
200

    
201
    // Simplify the dialog windows.
202
//    config.removeDialogTabs = 'image:advanced;link:advanced';
203

    
204
    config.filebrowserWindowWidth = '80%';
205
    config.filebrowserWindowHeight = '70%';
206

    
207
};
208

    
209
CKEDITOR.on( 'instanceReady', function( ev )
210
{
211
    var writer = ev.editor.dataProcessor.writer;
212
    // The character sequence to use for every indentation step.
213
    writer.indentationChars = '\t';
214
    // The way to close self closing tags, like <br />.
215
    writer.selfClosingEnd   = ' />';
216
    // The character sequence to be used for line breaks.
217
    writer.lineBreakChars   = '\n';
218
    // Setting rules for several HTML tags.
219

    
220
    var dtd = CKEDITOR.dtd;
221
    for (var e in CKEDITOR.tools.extend( {}, dtd.$block ))
222
    {
223
        writer.setRules( e,
224
        {
225
            // Indicates that this tag causes indentation on line breaks inside of it.
226
            indent : false,
227
            // Insert a line break before the <h1> tag.
228
            breakBeforeOpen : true,
229
            // Insert a line break after the <h1> tag.
230
            breakAfterOpen : false,
231
            // Insert a line break before the </h1> closing tag.
232
            breakBeforeClose : false,
233
            // Insert a line break after the </h1> closing tag.
234
            breakAfterClose : true
235
        });
236
    };
237
    writer.setRules( 'p',
238
    {
239
        // Indicates that this tag causes indentation on line breaks inside of it.
240
        indent : false,
241
        // Insert a line break before the <p> tag.
242
        breakBeforeOpen : true,
243
        // Insert a line break after the <p> tag.
244
        breakAfterOpen : false,
245
        // Insert a line break before the </p> closing tag.
246
        breakBeforeClose : false,
247
        // Insert a line break after the </p> closing tag.
248
        breakAfterClose : true
249
    });
250
    writer.setRules( 'br',
251
    {
252
        // Indicates that this tag causes indentation on line breaks inside of it.
253
        indent : false,
254
        // Insert a line break before the <br /> tag.
255
        breakBeforeOpen : false,
256
        // Insert a line break after the <br /> tag.
257
        breakAfterOpen : true
258
    });
259
    writer.setRules( 'a',
260
    {
261
        // Indicates that this tag causes indentation on line breaks inside of it.
262
        indent : false,
263
        // Insert a line break before the <a> tag.
264
        breakBeforeOpen : true,
265
        // Insert a line break after the <a> tag.
266
        breakAfterOpen : false,
267
        // Insert a line break before the </a> closing tag.
268
        breakBeforeClose : false,
269
        // Insert a line break after the </a> closing tag.
270
        breakAfterClose : false
271
    });
272
    writer.setRules( 'div',
273
    {
274
        // Indicates that this tag causes indentation on line breaks inside of it.
275
        indent : false,
276
        // Insert a line break before the <div> tag.
277
        breakBeforeOpen : true,
278
        // Insert a line break after the <div> tag.
279
        breakAfterOpen : false,
280
        // Insert a line break before the </div> closing tag.
281
        breakBeforeClose : true,
282
        // Insert a line break after the </div> closing tag.
283
        breakAfterClose : false
284
    });
285
    writer.setRules( 'img',
286
    {
287
        // Indicates that this tag causes indentation on line breaks inside of it.
288
        indent : false,
289
        // Insert a line break before the <img> tag.
290
        breakBeforeOpen : true,
291
        // Insert a line break after the <img> tag.
292
        breakAfterOpen : false,
293
        // Insert a line break before the </img>> closing tag.
294
        breakBeforeClose : false,
295
        // Insert a line break after the </img> closing tag.
296
        breakAfterClose : false
297
    });
298
/*
299
*/
300
    ev.editor.dataProcessor.htmlFilter.addRules(
301
    {
302
        elements:
303
        {
304
            $: function (element) {
305
                // Output dimensions of images as width and height
306
                if (element.name == 'img') {
307
                    var style = element.attributes.style;
308
                    if (style) {
309
                        // Get the width from the style.
310
                        var match = /(?:^|\s)width\s*:\s*(\d+)px/i.exec(style),
311
                            width = match && match[1];
312

    
313
                        // Get the height from the style.
314
                        match = /(?:^|\s)height\s*:\s*(\d+)px/i.exec(style);
315
                        var height = match && match[1];
316
console.log( element );
317

    
318
                        if (width) {
319
                            element.attributes.style = element.attributes.style.replace(/(?:^|\s)width\s*:\s*(\d+)px;?/i, '');
320
                            element.attributes.width = width;
321
                        }
322

    
323
                        if (height) {
324
                            element.attributes.style = element.attributes.style.replace(/(?:^|\s)height\s*:\s*(\d+)px;?/i, '');
325
                            element.attributes.height = height;
326
                        }
327
                    }
328
                }
329
/**
330
 *
331
                if (!element.attributes.style)
332
                    delete element.attributes.style;
333
 */
334

    
335
                return element;
336
            }
337
        }
338
    });
339

    
340
});
341

    
342
CKEDITOR.on( 'dialogDefinition', function( ev )
343
{
344
        // Take the dialog name and its definition from the event data.
345
        var editor = ev.editor;
346
        var dialogName = ev.data.name;
347
        var dialogDefinition = ev.data.definition;
348

    
349
        // Check if the definition is from the dialog window you are interested in (the "Link" dialog window).
350
        if ( dialogName == 'image' )
351
        {
352
            // Get a reference to the "Link Info" tab.
353
            var linkTab = dialogDefinition.getContents('Link');
354
        }
355
        // Check if the definition is from the dialog window you are interested in (the "Link" dialog window).
356
        if ( dialogName == 'wblink' )
357
        {
358
            // Get a reference to the "Link Info" tab.
359
            var infoTab = dialogDefinition.getContents( 'info' );
360
            // Set the default value for the URL field.
361
            var urlField = infoTab.get( 'url' );
362
            urlField['default'] = 'www.example.com';
363
        }
364

    
365
    }); // dialogDefinition
(5-5/5)