nucleus/javascript/edit.js

   1 /**
   2   * Nucleus: PHP/MySQL Weblog CMS (http://nucleuscms.org/)
   3   * Copyright (C) 2002-2012 The Nucleus Group
   4   *
   5   * This program is free software; you can redistribute it and/or
   6   * modify it under the terms of the GNU General Public License
   7   * as published by the Free Software Foundation; either version 2
   8   * of the License, or (at your option) any later version.
   9   * (see nucleus/documentation/index.html#license for more info)
  10   *
  11   * This file contains functions to allow adding items from inside the weblog.
  12   * Also contains code to avoid submitting form data twice.
  13   */
  14
  15 var nucleusConvertBreaks = true;
  16 var nucleusMediaPopupURL = '';
  17 var nucleusMediaURL = 'media/';
  18 var nucleusAuthorId = 0;
  19 var scrollTop = -1;
  20
  21 function setConvertBreaks(newval) {     nucleusConvertBreaks = newval; }
  22 function setMediaUrl(url) { nucleusMediaURL = url; }
  23 function setAuthorId(id) { nucleusAuthorId = id; }
  24
  25 function preview(id, value) {
  26         elem = document.getElementById(id);
  27         if (!elem) return;
  28
  29         var preview = nucleusConvertBreaks ? str_replace("\n","<br />",value)+"&#160;" : value+"&#160;";
  30
  31         // expand the media commands (without explicit collection)
  32         preview = preview.replace(/\<\%image\(([^\/\|]*)\|([^\|]*)\|([^\|]*)\|([^)]*)\)\%\>/g,"<img src='"+nucleusMediaURL+nucleusAuthorId+"/$1' width='$2' height='$3' alt=\"$4\" />");
  33
  34         // expand the media commands (with collection)
  35         preview = preview.replace(/\<\%image\(([^\|]*)\|([^\|]*)\|([^\|]*)\|([^)]*)\)\%\>/g,"<img src='"+nucleusMediaURL+"$1' width='$2' height='$3' alt=\"$4\" />");
  36         preview = preview.replace(/\<\%popup\(([^\|]*)\|([^\|]*)\|([^\|]*)\|([^)]*)\)\%\>/g,"<a href='' onclick='if (event &amp;&amp; event.preventDefault) event.preventDefault(); alert(\"popup image\"); return false;' title='popup'>$4</a>");
  37         preview = preview.replace(/\<\%media\(([^\|]*)\|([^)]*)\)\%\>/g,"<a href='' title='media link'>$2</a>");
  38
  39         elem.innerHTML = preview;
  40 }
  41
  42 function showedit() {
  43         prevval = document.getElementById('edit').style.display;
  44         if (prevval == "block")
  45                 newval = "none";
  46         else
  47                 newval = "block";
  48         document.getElementById('edit').style.display = newval;
  49
  50         if (newval == "block")
  51                 updAllPreviews();
  52 }
  53
  54 function updAllPreviews() {
  55         updPreview('title');
  56         updPreview('body');
  57         updPreview('more');
  58 }
  59
  60 function isEditVisible() {
  61         var editform = document.getElementById('edit');
  62         if (!editform) return true;
  63         var prevval = editform.style.display;
  64         return (prevval == "none") ? false : true;
  65 }
  66
  67 function updPreview(id) {
  68         // don't update when preview is hidden
  69         if (!isEditVisible()) return;
  70
  71         var inputField = document.getElementById('input' + id);
  72         if (!inputField) return;
  73         preview('prev' + id, inputField.value);
  74 }
  75
  76 // replace a in s by b (taken from milov.nl)
  77 function str_replace(a, b, s)
  78 {
  79         if (a == b || !s.length || !a.length) return s;
  80         if ((p=s.indexOf(a)) == -1) { return s; }
  81         else { ns = s.substring(0,p) + b + s.substring(p+a.length,s.length); }
  82         return (s.indexOf(a) != -1) ? str_replace(a, b, ns) : ns;
  83 }
  84
  85 function shortCuts() {
  86         if (!event || (event.ctrlKey != true)) return;
  87
  88         switch (event.keyCode) {
  89                 case 1:
  90                         ahrefThis(); break; // ctrl-shift-a
  91                 case 2:
  92                         boldThis(); break; // ctrl-shift-b
  93                 case 9:
  94                         italicThis(); break; // ctrl-shift-i
  95                 case 13:
  96                         addMedia(); break; // ctrl-shift-m
  97                 default:
  98                         return;
  99         }
 100         return;
 101 }
 102
 103 function cutThis() { execAndUpdate('cut'); }
 104 function copyThis() { execAndUpdate('copy'); }
 105 function pasteThis() { execAndUpdate('paste'); }
 106 function boldThis() { insertAroundCaret('<b>','</b>'); }
 107 function italicThis() { insertAroundCaret('<i>','</i>'); }
 108 function leftThis() { insertAroundCaret('<div class="leftbox">','</div>'); }
 109 function rightThis() { insertAroundCaret('<div class="rightbox">','</div>'); }
 110 function alignleftThis() { insertAroundCaret('<div style="text-align: left">','</div>'); }
 111 function alignrightThis() { insertAroundCaret('<div style="text-align: right">','</div>'); }
 112 function aligncenterThis() { insertAroundCaret('<div style="text-align: center">','</div>'); }
 113
 114
 115 function ahrefThis() {
 116         if (document.selection)
 117                 strSelection = document.selection.createRange().text;
 118         else
 119                 strSelection = '';
 120
 121         strHref = prompt("Create a link to:","http://");
 122         if (strHref == null) return;
 123
 124         var textpre = "<a href=\"" + strHref.replace(/&/g,'&amp;') + "\">";
 125         insertAroundCaret(textpre, "</a>");
 126 }
 127
 128 function execAndUpdate(action) {
 129         lastSelected.caretPos.execCommand(action);
 130         updAllPreviews();
 131 }
 132
 133
 134 var nonie_FormType = 'body';
 135
 136 // Add media to new item
 137 function addMedia() {
 138
 139         var mediapopup = window.open(nucleusMediaPopupURL + 'media.php','name',
 140                 'status=yes,toolbar=no,scrollbars=yes,resizable=yes,width=500,height=450,top=0,left=0');
 141
 142         return;
 143 }
 144
 145
 146 function setMediaPopupURL(url) {
 147         nucleusMediaPopupURL = url;
 148 }
 149
 150 function includeImage(collection, filename, type, width, height) {
 151         if (isCaretEmpty()) {
 152                 text = prompt("Text to display ?", filename);
 153         } else {
 154                 text = getCaretText();
 155         }
 156
 157         // add collection name when not private collection (or editing a message that's not your)
 158         var fullName;
 159         if (isNaN(collection) || (nucleusAuthorId != collection)) {
 160                 fullName = collection + '/' + filename;
 161         } else {
 162                 fullName = filename;
 163         }
 164
 165
 166         var replaceBy;
 167         switch(type) {
 168                 case 'popup':
 169                         replaceBy = '<%popup(' +  fullName + '|'+width+'|'+height+'|' + text +')%>';
 170                         break;
 171                 case 'inline':
 172                 default:
 173                         replaceBy = '<%image(' +  fullName + '|'+width+'|'+height+'|' + text +')%>';
 174         }
 175
 176         insertAtCaret(replaceBy);
 177         updAllPreviews();
 178
 179 }
 180
 181
 182 function includeOtherMedia(collection, filename) {
 183         if (isCaretEmpty()) {
 184                 text = prompt("Text to display ?", filename);
 185         } else {
 186                 text = getCaretText();
 187         }
 188
 189         // add collection name when not private collection (or editing a message that's not your)
 190         var fullName;
 191         if (isNaN(collection) || (nucleusAuthorId != collection)) {
 192                 fullName = collection + '/' + filename;
 193         } else {
 194                 fullName = filename;
 195         }
 196
 197         var replaceBy = '<%media(' +  fullName + '|' + text +')%>';
 198
 199         insertAtCaret(replaceBy);
 200         updAllPreviews();
 201 }
 202
 203
 204
 205 // function to prevent submitting form data twice
 206 var submitcount=0;
 207 function checkSubmit() {
 208         if (submitcount == 0) {
 209                 submitcount++;
 210                 return true;
 211         } else {
 212                 return false;
 213         }
 214 }
 215
 216
 217 // code to store the caret (cursor) position of a text field/text area
 218 // taken from javascript.faqts and modified
 219 // http://www.faqts.com/knowledge_base/view.phtml/aid/1052/fid/130
 220
 221 // stores the caret
 222 var lastSelected, lastCaretPos;
 223 function storeCaret (textEl) {
 224
 225         // store caret
 226         if (textEl.createTextRange)
 227                 //textEl.caretPos = document.selection.createRange().duplicate();
 228                 lastCaretPos = document.selection.createRange().duplicate();
 229
 230         // also store lastselectedelement
 231         lastSelected = textEl;
 232
 233         nonie_FormType = textEl.name;
 234
 235         scrollTop = textEl.scrollTop;
 236 }
 237
 238 //var lastSelected;
 239
 240 // inserts text at caret (overwriting selection)
 241 function insertAtCaret (text) {
 242         var textEl = lastSelected;
 243         if (textEl && textEl.createTextRange && lastCaretPos) {
 244                 var caretPos = lastCaretPos;
 245                 caretPos.text = caretPos.text.charAt(caretPos.text.length - 1) == ' ' ? text + ' ' : text;
 246         } else if (!document.all && document.getElementById) {
 247                 mozReplace(document.getElementById('input' + nonie_FormType), text);
 248                 if(scrollTop>-1) {
 249                         document.getElementById('input' + nonie_FormType).scrollTop = scrollTop;
 250                 }
 251         } else if (textEl) {
 252                 textEl.value  += text;
 253         } else {
 254                 document.getElementById('input' + nonie_FormType).value += text;
 255                 if(scrollTop>-1) {
 256                         document.getElementById('input' + nonie_FormType).scrollTop = scrollTop;
 257                 }
 258         }
 259         updAllPreviews();
 260 }
 261
 262 // inserts a tag around the selected text
 263 function insertAroundCaret (textpre, textpost) {
 264         var textEl = lastSelected;
 265
 266         if (textEl && textEl.createTextRange && lastCaretPos) {
 267                 var caretPos = lastCaretPos;
 268                 caretPos.text = textpre + caretPos.text + textpost;
 269         } else if (!document.all && document.getElementById) {
 270                 mozWrap(document.getElementById('input' + nonie_FormType), textpre, textpost);
 271                 if(scrollTop>-1) {
 272                         document.getElementById('input' + nonie_FormType).scrollTop = scrollTop;
 273                 }
 274         } else {
 275                 document.getElementById('input' + nonie_FormType).value += textpre + textpost;
 276                 if(scrollTop>-1) {
 277                         document.getElementById('input' + nonie_FormType).scrollTop = scrollTop;
 278                 }
 279         }
 280
 281         updAllPreviews();
 282 }
 283
 284 /* some methods to get things working in Mozilla as well */
 285 function mozWrap(txtarea, lft, rgt) {
 286         var selLength = txtarea.textLength;
 287         var selStart = txtarea.selectionStart;
 288         var selEnd = txtarea.selectionEnd;
 289         if (selEnd==1 || selEnd==2) selEnd=selLength;
 290         var s1 = (txtarea.value).substring(0,selStart);
 291         var s2 = (txtarea.value).substring(selStart, selEnd)
 292         var s3 = (txtarea.value).substring(selEnd, selLength);
 293         txtarea.value = s1 + lft + s2 + rgt + s3;
 294 }
 295 function mozReplace(txtarea, newText) {
 296         var selLength = txtarea.textLength;
 297         var selStart = txtarea.selectionStart;
 298         var selEnd = txtarea.selectionEnd;
 299         if (selEnd==1 || selEnd==2) selEnd=selLength;
 300         var s1 = (txtarea.value).substring(0,selStart);
 301         var s2 = (txtarea.value).substring(selStart, selEnd)
 302         var s3 = (txtarea.value).substring(selEnd, selLength);
 303         txtarea.value = s1 + newText + s3;
 304 }
 305 function mozSelectedText() {
 306         var txtarea = document.getElementById('input' + nonie_FormType);
 307         var selLength = txtarea.textLength;
 308         var selStart = txtarea.selectionStart;
 309         var selEnd = txtarea.selectionEnd;
 310         if (selEnd==1 || selEnd==2) selEnd=selLength;
 311         return (txtarea.value).substring(selStart, selEnd);
 312 }
 313
 314 function getCaretText() {
 315         if (!document.all && document.getElementById)
 316                 return mozSelectedText();
 317         else
 318                 return lastCaretPos.text;
 319 }
 320
 321 function isCaretEmpty() {
 322         if (lastSelected && lastSelected.createTextRange && lastCaretPos)
 323                 return (lastCaretPos.text == '');
 324         else if (!document.all && document.getElementById)
 325                 return (mozSelectedText() == '');
 326         else
 327                 return true;
 328 }
 329
 330 function BtnHighlight(el) {
 331         with(el.style){
 332                 borderLeft="1px solid gray";
 333                 borderRight="1px solid #e9e9e9";
 334                 borderTop="1px solid gray";
 335                 borderBottom="1px solid #e9e9e9";
 336         }
 337 }
 338
 339 function BtnNormal(el) {
 340         with(el.style){
 341                 padding="3px";
 342                 border="1px solid #dddddd";
 343         }
 344 }
 345