edit.js

   1 CKEDITOR.plugins.add('inlinesave', {
   2         init: function(editor) {
   3                 editor.addCommand( 'inlinesave', {
   4                         exec: function (editor) {
   5                                 var pagename = window.location.pathname.replace(/\/$/, '/index');
   6                                 var body = editor.getData();
   7                                 body = body.replace(/<br \/>\s*<br \/>/g, '<p>');
   8                                 body = body.replace(/^(\t*).{73,}/mg, function (line, indent) {
   9                                         // wrap long line after each sentence
  10                                         var dots = '(?:.{24,72}|.{73,}?)'; // chars before punctuation
  11                                         var wrap = new RegExp('('+dots+'[.;:!?]) (?=[A-Z(<])', 'g'); // separate lines
  12                                         return line.replace(wrap, '$1\n'+indent+'\t');
  13                                 });
  14                                 var data = 'body='+encodeURIComponent(body);
  15                                 ajaxpost = new XMLHttpRequest();
  16                                 ajaxpost.open('POST', '/edit'+pagename, true);
  17                                 ajaxpost.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  18                                 ajaxpost.onreadystatechange = function () {
  19                                         if (ajaxpost.readyState != 4)
  20                                                 return; // not done yet
  21                                         if (ajaxpost.status != 200)
  22                                                 alert('Foutcode '+ajaxpost.status+' bij opslaan: '+ajaxpost.responseText);
  23                                         else
  24                                                 editor.resetDirty();
  25                                 };
  26                                 ajaxpost.send(data);
  27                         },
  28                 });
  29                 editor.ui.addButton( 'Inlinesave', {
  30                         command: 'inlinesave',
  31                         label: editor.lang.save.toolbar,
  32                         icon: 'save',
  33                 });
  34         }
  35 });
  36
  37 CKEDITOR.on('dialogDefinition', function (event) {
  38         if (event.data.name === 'table') {
  39                 // override initial attribute values
  40                 var infoTab = event.data.definition.getContents('info');
  41                 infoTab.get('txtWidth').default = '';
  42                 infoTab.get('txtBorder').default = '0';
  43                 infoTab.get('txtCellSpace').default = '';
  44                 infoTab.get('txtCellPad').default = '';
  45         }
  46 });
  47
  48 CKEDITOR.on('instanceCreated', function (event) {
  49         var editor = event.editor;
  50         var pastefilter = 'h2 h3 p ul ol li blockquote em i strong b; a[!href]; img[alt,!src]';
  51
  52         editor.on('paste', function (e) {
  53                 var html = e.data.dataValue;
  54                 if (!/<[^>]* style="/.test(html) && !/<font/.test(html)) return;
  55
  56                 // force pasteFilter on contents containing styling attributes
  57                 var filter = new CKEDITOR.filter(pastefilter),
  58                         fragment = CKEDITOR.htmlParser.fragment.fromHtml(html),
  59                         writer = new CKEDITOR.htmlParser.basicWriter();
  60                 filter.applyTo(fragment);
  61                 fragment.writeHtml(writer);
  62                 e.data.dataValue = writer.getHtml();
  63         });
  64
  65         editor.on('configLoaded', function () {
  66                 var config = editor.config;
  67                 config.language = 'nl';
  68                 config.extraPlugins = 'sourcedialog,inlinesave,placeholder';
  69                 config.format_tags = 'h2;h3;h4;p';
  70                 config.allowedContent = true;
  71                 config.entities = false; // keep unicode
  72                 config.filebrowserImageUploadUrl = '/edit?output=ckescript';
  73                 config.pasteFilter = pastefilter;
  74                 config.contentsCss = document.styleSheets[0].href;
  75                 config.toolbar = [
  76                         ['Inlinesave', '-', 'Undo', 'Redo'],
  77                         ['Format', 'BulletedList', 'NumberedList', 'Blockquote'],
  78                         ['Bold', 'Italic', 'Link'],
  79                         ['HorizontalRule', 'Table', 'Image'],
  80                         ['CreatePlaceholder', 'Sourcedialog'],
  81                 ];
  82                 config.toolbarCanCollapse = true;
  83                 config.floatSpacePreferRight = true;
  84                 config.floatSpaceDockedOffsetY = 0;
  85                 config.startupFocus = true;
  86
  87                 config.disableObjectResizing = true;
  88                 document.execCommand('enableObjectResizing', false, false); // workaround in inline mode; ff bug?
  89         });
  90
  91         window.onbeforeunload = function () {
  92                 if (editor.checkDirty()) {
  93                         return 'Pagina verlaten zonder wijzigingen op te slaan?'; // message ignored in modern browsers
  94                 }
  95         };
  96 });
  97
  98         CKEDITOR.disableAutoInline = true;
  99
 100 // add edit link to menu
 101 var pagebody = document.getElementsByClassName('static')[0];
 102 if (pagebody) {
 103         var editlink = document.querySelector('a[href="#edit"]');
 104         editlink.onclick = function (e) {
 105                 editlink.style.fontWeight = 'bold';
 106                 editlink.href = '';
 107                 editlink.onclick = undefined;
 108                 pagebody.setAttribute('contenteditable', true);
 109                 pagebody.innerHTML = pagebody.innerHTML
 110                         .replace(/<!--BLOCK:([^-]*)-->[^]*?<!--\/-->/g, '$1');
 111                 CKEDITOR.inline(pagebody);
 112                 document.body.className = 'edit';
 113                 return false;
 114         };
 115         if (window.location.hash == '#edit') {
 116                 editlink.onclick();
 117         }
 118 }
 119