[php-blog-cvs] serendipity serendipity_functions.inc.php,1.50,1.51 serendipity_editor.js,1.1.1.1,1.2

[<tom...@us...>]

Update of /cvsroot/php-blog/serendipity
In directory sc8-pr-cvs1:/tmp/cvs-serv26233

Modified Files:
	serendipity_functions.inc.php serendipity_editor.js 
Log Message:
This is the new non-WYSIWYG editor.
Since it is only working in Mozilla and IE, we have a small regular-based condition to only show it, if the UA contains "Mozilla" or "IE",
If you know of any other browsers which can handle this new non-WYSIWYG editor, let me know.

It has much better handling of positioning of inserted text and can also work with selections etc.
You can now select some text and wrap it with links or apply text-formating to the selection.

Please test it as much as you can, and report back.
The old non-WYSIWYG editor is still active to anyone who does not have Mozilla or IE


Index: serendipity_functions.inc.php
===================================================================
RCS file: /cvsroot/php-blog/serendipity/serendipity_functions.inc.php,v
retrieving revision 1.50
retrieving revision 1.51
diff -u -d -r1.50 -r1.51
--- serendipity_functions.inc.php	24 May 2003 20:35:08 -0000	1.50
+++ serendipity_functions.inc.php	24 May 2003 22:04:22 -0000	1.51
@@ -485,7 +485,7 @@
     $name = serendipity_db_escape_string($commentInfo['name']);
     $url = serendipity_db_escape_string($commentInfo['url']);
     $email = serendipity_db_escape_string($commentInfo['email']);
-    
+
     $t = time();
     $query = "INSERT INTO {$serendipity['dbPrefix']}comments (entry_id, author, email, url, body, type, timestamp, title)";
     $query .= " VALUES ('$id', '$name', '$email', '$url', '$commentsFixed', '$type', '$t', '$title')";
@@ -1207,6 +1207,7 @@
 function serendipity_printEntryForm($targetURL, $hiddens = array(), $entry = array(), $errMsg = "") {
 	global $serendipity;
 
+	$serendipity['EditorBrowsers'] = "(IE|Mozilla)";
 	$cats = serendipity_fetchCategories();
 
 	$cat_list = "<select name=\"serendipity[categoryid]\"><option value=\"0\">[".NO_CATEGORY."]</option>\n";
@@ -1236,42 +1237,43 @@
 		echo '<input type="hidden" name="serendipity[id]" value="'.$entry["id"]."\">\n";
 		echo '<input type="hidden" name="serendipity[timestamp]" value="'.$entry["timestamp"]."\">\n";
             ?>
-			<tr>
-				<td align="left">
-                	<input type="text" name="serendipity[title]" value="<?=$entry["title"]?>" size=30>
+	<tr>
+		<td align="left">
+                	<input type="text" name="serendipity[title]" value="<?=$entry["title"]?>" size="30">
+                	<input type="submit" value="- <?=SAVE?> -" style="font-weight: bold;">
                 </td>
 				<td><?=Category?> <?= $cat_list ?></td>
-    		</tr>
-            <tr>
+	</tr>
+	<tr>
                 <td colspan="2"><?=ENTRY_BODY?></td>
-            </tr>
-    		<tr>
-				<td colspan="2">
+        </tr>
+    	<tr>
+		<td colspan="2">
                 	<textarea name="serendipity[body]" id="serendipity[body]" cols=80 rows=20><?=$entry["body"]?></textarea>
                 </td>
-    		</tr>
-            <tr>
+    	</tr>
+        <tr>
                 <td colspan="2"><?=EXTENDED_BODY?></td>
-            </tr>
-    		<tr>
-				<td colspan="2">
+        </tr>
+    	<tr>
+		<td colspan="2">
                 	<textarea name="serendipity[extended]" id="serendipity[extended]" cols=80 rows=20><?=htmlentities($entry["extended"])?></textarea>
                 </td>
-    		</tr>
-            <tr>
+    	</tr>
+        <tr>
             	<td colspan="2" align="right">
-                	<input type="submit" value="save">
+                	<input type="submit" value="- <?=SAVE?> -" style="font-weight: bold;">
                 </td>
-            </tr>
-            </form>
+        </tr>
+        </form>
     	</table>
-    <?php
+<?php
 		serendipity_emit_htmlarea_code("document.forms['serendipityEntry']['serendipity[body]']");
 		serendipity_emit_htmlarea_code("document.forms['serendipityEntry']['serendipity[extended]']");
 	}
 	else
 	{
-	?>
+?>
 	<script language="JavaScript" src="serendipity_editor.js"></script>
    	<font color="#ff0000"><?=$errMsg?></font>
     	<table class='serendipityEntryEdit'>
@@ -1283,39 +1285,59 @@
 		echo '<input type="hidden" name="serendipity[id]" value="'.$entry["id"]."\">\n";
 		echo '<input type="hidden" name="serendipity[timestamp]" value="'.$entry["timestamp"]."\">\n";
             ?>
-			<tr>
-				<td align="left" valign="top">
-                	<input type="text" name="serendipity[title]" value="<?=htmlentities($entry["title"])?>" size=30>
-                </td>
-                <td nowrap="nowrap" align="right" valign="top">
-					<?=CATEGORY?> <?= $cat_list ?></td><tr><td align="left">
-                	<input type="button" value=" B " onClick="serendipity_insBasic(document.forms['serendipityEntry']['serendipity[body]'], 'b')">
-                    <input type="button" value=" U " onClick="serendipity_insBasic(document.forms['serendipityEntry']['serendipity[body]'], 'u')">
-                    <input type="button" value=" I " onClick="serendipity_insBasic(document.forms['serendipityEntry']['serendipity[body]'], 'i')">
-					<input type="button" value="<img>" onClick="serendipity_insImage(document.forms['serendipityEntry']['serendipity[body]'])">
-                    <input type="button" value="<?=IMAGE?>" onClick="window.open('serendipity_admin_image_selector.php', 'ImageSel', 'width=800,height=600,toolbar=no');">
-                    <input type="button" value="Link" onClick="serendipity_insLink(document.forms['serendipityEntry']['serendipity[body]'])">
-		    </td><td align="right">
-		    <input type="submit" value="<?=SAVE?>">
+	<tr>
+		<td align="left" colspan="2">
+                	<input type="text" name="serendipity[title]" value="<?=htmlentities($entry["title"])?>" size="80">
+                	<input type="submit" value="- <?=SAVE?> -" style="font-weight: bold;">
                 </td>
-    		</tr>
-            <tr>
-                <td colspan="2"><?=ENTRY_BODY?></td>
-            </tr>
-    		<tr>
-				<td colspan="2">
+	</tr>
+	<tr>
+		<td>
+			<?=CATEGORY?> <?= $cat_list ?>
+        	</td>
+		<td align="right">
+		<?php
+		// Since the user has WYSIWYG editor disabled, we want to check if we should use the "better" non-WYSIWYG editor
+		if ( eregi($serendipity['EditorBrowsers'], $_SERVER['HTTP_USER_AGENT']) ) {
+		?>
+			<input type="button" name="insI" value="I" accesskey="i" style="font-style: italic" onClick="wrapSelection(document.forms['serendipityEntry']['serendipity[body]'],'<i>','</i>')">
+			<input type="button" name="insB" value="B" accesskey="i" style="font-weight: bold" onClick="wrapSelection(document.forms['serendipityEntry']['serendipity[body]'],'<b>','</b>')">
+			<input type="button" name="insU" value="U" accesskey="u" style="text-decoration: underline;" onClick="wrapSelection(document.forms['serendipityEntry']['serendipity[body]'],'<u>','</u>')">
+			<input type="button" name="insJ" value="img" accesskey="j" onClick="wrapInsImage(document.forms['serendipityEntry']['serendipity[body]'])">
+			<input type="button" name="insImage" value="<?= IMAGE ?>" style="" onClick="window.open('serendipity_admin_image_selector.php', 'ImageSel', 'width=800, height=600, toolbar=no');">
+			<input type="button" name="insU" value="URL" accesskey="l" style="color: blue; text-decoration: underline;" onClick="wrapSelectionWithLink(document.forms['serendipityEntry']['serendipity[body]'])">
+		<? } else { ?>
+			<input type="button" value=" B " onClick="serendipity_insBasic(document.forms['serendipityEntry']['serendipity[body]'], 'b')">
+		        <input type="button" value=" U " onClick="serendipity_insBasic(document.forms['serendipityEntry']['serendipity[body]'], 'u')">
+			<input type="button" value=" I " onClick="serendipity_insBasic(document.forms['serendipityEntry']['serendipity[body]'], 'i')">
+			<input type="button" value="<img>" onClick="serendipity_insImage(document.forms['serendipityEntry']['serendipity[body]'])">
+			<input type="button" value="<?=IMAGE?>" onClick="window.open('serendipity_admin_image_selector.php', 'ImageSel', 'width=800,height=600,toolbar=no');">
+			<input type="button" value="Link" onClick="serendipity_insLink(document.forms['serendipityEntry']['serendipity[body]'])">
+		<? } ?>
+		</td>
+    	</tr>
+        <tr>
+        	<td colspan="2"><?=ENTRY_BODY?></td>
+        </tr>
+    	<tr>
+		<td colspan="2">
                 	<textarea name="serendipity[body]" cols=80 rows=20><?=htmlentities($entry["body"])?></textarea>
                 </td>
-    		</tr>
-            <tr>
+    	</tr>
+        <tr>
                 <td colspan="2"><?=EXTENDED_BODY?></td>
-            </tr>
-    		<tr>
-				<td colspan="2">
+        </tr>
+    	<tr>
+		<td colspan="2">
                 	<textarea name="serendipity[extended]" cols=80 rows=20><?=htmlentities($entry["extended"])?></textarea>
                 </td>
-    		</tr>
-            </form>
+    	</tr>
+    	<tr>
+    	        <td colspan="2" align="right">
+                	<input type="submit" value="- <?=SAVE?> -" style="font-weight: bold;">
+                </td>
+        </tr>
+        </form>
     	</table>
 		<?php
  	}

Index: serendipity_editor.js
===================================================================
RCS file: /cvsroot/php-blog/serendipity/serendipity_editor.js,v
retrieving revision 1.1.1.1
retrieving revision 1.2
diff -u -d -r1.1.1.1 -r1.2
--- serendipity_editor.js	28 Mar 2003 20:05:24 -0000	1.1.1.1
+++ serendipity_editor.js	24 May 2003 22:04:22 -0000	1.2
@@ -1,4 +1,88 @@
 <!-- // Hide from older browsers
+
+/*
+	Written by chris wetherell
+	http://www.massless.org
+	chris [THE AT SIGN] massless.org
+	
+	warning: it only works for IE4+/Win and Moz1.1+
+	feel free to take it for your site
+	if there are any problems, let chris know.
+*/
+	
+var thisForm;
+
+function getMozSelection(txtarea) {
+	var selLength = txtarea.textLength;
+	var selStart = txtarea.selectionStart;
+	var selEnd = txtarea.selectionEnd;
+	if (selEnd==1 || selEnd==2) selEnd=selLength;
+	return (txtarea.value).substring(selStart, selEnd);
+}
+
+function mozWrap(txtarea, lft, rgt) {
+	var selLength = txtarea.textLength;
+	var selStart = txtarea.selectionStart;
+	var selEnd = txtarea.selectionEnd;
+	if (selEnd==1 || selEnd==2) selEnd=selLength;
+	var s1 = (txtarea.value).substring(0,selStart);
+	var s2 = (txtarea.value).substring(selStart, selEnd)
+	var s3 = (txtarea.value).substring(selEnd, selLength);
+	txtarea.value = s1 + lft + s2 + rgt + s3;
+}
+
+function IEWrap(lft, rgt) {
+	strSelection = document.selection.createRange().text;
+	if (strSelection!="") {
+	document.selection.createRange().text = lft + strSelection + rgt;
+	}
+}
+
+function wrapSelection(txtarea, lft, rgt) {
+	if (document.all) {IEWrap(lft, rgt);}
+	else if (document.getElementById) {mozWrap(txtarea, lft, rgt);}
+}
+
+function wrapSelectionWithLink(txtarea) {
+	var my_link = prompt("Enter URL:","http://");
+	if (getMozSelection(txtarea) == "") {
+		var my_desc = prompt("Enter Description");
+	}
+	if (my_link != null) {
+		lft = "<a href=\"" + my_link + "\">";
+		if (my_desc != null && my_desc != "") {
+			rgt = my_desc +"</a>";
+		} else {
+			rgt = "</a>";
+		}
+		wrapSelection(txtarea, lft, rgt);
+	}
+	return;
+}	
+/* end chris w. script */
+
+function mozInsert(txtarea, str) {
+	var selLength = txtarea.textLength;
+	var selStart = txtarea.selectionStart;
+	var selEnd = txtarea.selectionEnd;
+	if (selEnd==1 || selEnd==2) selEnd=selLength;
+	var s1 = (txtarea.value).substring(0,selStart);
+	var s2 = (txtarea.value).substring(selStart, selEnd)
+	var s3 = (txtarea.value).substring(selEnd, selLength);
+	txtarea.value = s1 + str + s2 + s3;
+}
+
+function wrapInsImage (area) 
+{
+    var loc = prompt('Enter the Image Location: ');
+    if (!loc) {
+        return;
+    }
+ 	mozInsert(area,'<img src="'+ loc + '" />');
+}
+
+/* end Better-Editor functions */
+
 function serendipity_insImage (area) 
 {
     var loc = prompt('Enter the Image Location: ');
@@ -11,6 +95,12 @@
     area.focus();
 }
 
+function serendipity_insBasic (area, tag)
+{
+    area.value = area.value + "<" + tag + "></" + tag + ">";
+    area.focus();
+}
+
 function serendipity_insLink (area)
 {
     var loc = prompt('Enter Location: ');
@@ -25,12 +115,6 @@
     area.focus();
 }
 
-function serendipity_insBasic (area, tag)
-{
-    area.value = area.value + "<" + tag + "></" + tag + ">";
-    area.focus();
-}
-
 function serendipity_imageSelector_addToBody (str)
 {
     document.forms['serendipityEntry']['serendipity[body]'].value += str;
@@ -39,6 +123,7 @@
 
 function serendipity_imageSelector_done() 
 {
+
 	var insert = '';
 	var img = '';
     var src = '';