Opened 8 years ago

Last modified 8 years ago

#1453 new enhancement

PATCH: InsertImage selection dropdown for inline attachments [Needs Work]

Reported by: ray Owned by: gogo
Priority: normal Milestone: 0.97
Component: Xinha Core Version: trunk
Severity: normal Keywords:
Cc:

Description (last modified by ray)

From here: http://www.xinha.org/punbb/viewtopic.php?id=2251

Hello,

Some software allows users to upload images as attachments to their posts. The uploaded attachments are usually accessible for viewing via a URL internally generated by the software, but unknown to the user. These attachments should be accessible from the InsertImage? dialog so that users can place what they've uploaded inline.

This patch creates the configuration option 'selectableImages'. This option allows xinha to be passed a list of attached image names and their internal attachment URLs so that they may be used inline during message posting. The creation of the selectableImages array is a task for the coder on the server side via Perl, Php, Python, etc.

The default selectableImages array is empty. A sample array may look like:

xinha_config.selectableImages = [
  ['image_name01', 'image_url01'],
  ['image_name02', 'image_url02'],
];

I've been integrating Xinha into OpenWebMail? and ran into this need.

Thanks,
Alex

P.S.- The file modules/InsertImage/insert_image.html is no longer used and is confusing to have laying around. It would be great if it could be removed.

Index: XinhaCore.js
===================================================================
--- XinhaCore.js	(revision 1190)
+++ XinhaCore.js	(working copy)
@@ -934,6 +934,18 @@
     ["separator","htmlmode","showhelp","about"]
   ];
 
+  /** This array provides a list of filenames and their corresponding URLs, so that those images may be chosen
+   *  via a selection dropdown menu in the InsertImage dialog module. This enables integration with email or blog
+   *  software where users have uploaded images accessable via special URLs provided by those softwares, but not
+   *  immediately apparent to the user. A sample array should look like [['image1','url1'],['image2','url2']].
+   * Default value:
+   *<pre>
+   *xinha_config.selectableImages = [];
+   *</pre>
+   * @type Array
+   */
+  this.selectableImages = [];
+
   /** The fontnames listed in the fontname dropdown
    * Default value:
    *<pre>
Index: modules/InsertImage/insert_image.js
===================================================================
--- modules/InsertImage/insert_image.js	(revision 1190)
+++ modules/InsertImage/insert_image.js	(working copy)
@@ -71,20 +71,47 @@
 	// Connect the OK and Cancel buttons
 	dialog.getElementById('ok').onclick = function() {self.apply();}
 
-	dialog.getElementById('cancel').onclick = function() { self.dialog.hide()};
+	dialog.getElementById('cancel').onclick = function() {
+          dialog.getElementById('f_selectable').options.selectedIndex = 0;
+          dialog.getElementById('f_url').value = '';
+          dialog.getElementById('ipreview').src = '';
+          self.dialog.hide();
+        }
 
-	dialog.getElementById('preview').onclick = function() { 
-	  var f_url = dialog.getElementById("f_url");
+	dialog.getElementById('f_selectable').onchange = function() {
+          var f_url = dialog.getElementById('f_url');
+
+          if (dialog.getElementById('f_selectable').options.selectedIndex > 0) {
+             var f_selectable = dialog.getElementById('f_selectable').options[dialog.getElementById('f_selectable').options.selectedIndex];
+             f_url.value = f_selectable.value;
+          } else {
+             f_url.value = '';
+             dialog.getElementById('ipreview').src = '';
+          }
+        }
+
+        // Populate the f_selectable selection list
+        for (var i=0; i<editor.config.selectableImages.length; i++) {
+          var text = editor.config.selectableImages[i][0];
+          var value = editor.config.selectableImages[i][1];
+          // preserve option 0 of the select list (the nothing selected option)
+          dialog.getElementById('f_selectable').options[i+1] = new Option(text, value);
+        }
+
+	dialog.getElementById('preview').onclick = function() {
+	  var f_url = dialog.getElementById('f_url');
 	  var url = f_url.value;
 
 	  if (!url) {
 	    alert(dialog._lc("You must enter the URL"));
 	    f_url.focus();
-        return false;
-      }
-	  dialog.getElementById('ipreview').src = url;
+            return false;
+          }
+
+          dialog.getElementById('ipreview').src = url;
 	  return false;
 	}
+
 	this.dialog.onresize = function ()
   {
 		var newHeightForPreview = 
Index: modules/InsertImage/dialog.html
===================================================================
--- modules/InsertImage/dialog.html	(revision 1190)
+++ modules/InsertImage/dialog.html	(working copy)
@@ -5,6 +5,14 @@
   <tbody>
 
   <tr>
+    <td style="width: 7em; text-align: right"><l10n>Attachments:</l10n></td>
+    <td>
+      <select size="1" name="[f_selectable]" id="[f_selectable]" style="width:75%" title="_(Select an attached image here)" />
+        <option value="0"><l10n>-- no attachments are selected --</l10n></option>
+      </select>
+    </td>
+  </tr>
+  <tr>
     <td style="width: 7em; text-align: right"><l10n>Image URL:</l10n></td>
     <td><input type="text" name="[f_url]" id="[f_url]" style="width:75%"
       title="_(Enter the image URL here)" />
@@ -80,4 +88,4 @@
 <div class="buttons" id="[buttons]">
   <input type="button" id="[ok]"     value="_(OK)"     />
   <input type="button" id="[cancel]" value="_(Cancel)" />
-</div>
\ No newline at end of file
+</div>

Change History (2)

comment:1 Changed 8 years ago by ray

  • Description modified (diff)
  • Milestone changed from 0.96 to 0.97
  • Type changed from defect to enhancement

    

comment:2 Changed 8 years ago by gogo

  • Summary changed from PATCH: InsertImage selection dropdown for inline attachments to PATCH: InsertImage selection dropdown for inline attachments [Needs Work]

Sounds a useful idea but needs work,

  • Configuration should not be in the main Xinha config, should be moved into the plugin.
  • If there are no selectable images the selector should not be shown.
  • Not sure about the wording "Attachments", it would be better to be more generic.
Note: See TracTickets for help on using tickets.