DokuWiki

It's better when it's simple

User Tools

Site Tools


plugin:supa

SUPA Plugin

Compatible with DokuWiki

2010-11-07a, 2011-05-25

plugin Easy upload of images from the clipboard (e.g. screenshots) to the media library

Last updated on
2011-12-04
Provides
Helper, Action
Repository
Source

This extension has not been updated in over 2 years. It may no longer be maintained or supported and may have compatibility issues.

Similar to jcapture

Tagged with applet, images, java, media, upload

SUPA - Screenshot UPload Applet

Project site: http://www.sourceforge.net/projects/supa

Download and Installation

Search and install the plugin using the Extension Manager or manually with the download from the SourceForge Mirror. Refer to Plugins on how to install plugins manually.

Old Versions of this plugin can be obtained from http://sourceforge.net/projects/supa/files/dokuwiki-plugin/.

If you are targeting a public or secure environment please consider signing the Java code with your own certificate.

Since plugin version 0.6 (2011-04-20), no manual setup steps are required.

Known issues

SUPA icon missing after image upload

After uploading an image using the SUPA plugin, the media manager refreshes but the SUPA icon ist not there anymore. Just click on the namespace-tree on the left of the media manager to get the icon back.

JAR download shows login dialog

If you use Active Directory (Kerberos) SSO authentication in your DokuWiki, download of Supa.jar will show a login dialog because the download is performed by java, not the browser. One workaround is to move Supa.jar to a URL without Kerberos authentication (i e not handled by DokuWiki) and change the archive URL in …/lib/plugins/supa/scripts.js, example:

--- script.js.org	2011-12-04 03:05:22.000000000 +0100
+++ script.js	2012-02-11 06:08:55.424200533 +0100
@@ -193,7 +193,7 @@
         html += "  <button id='supa__pastebutton' type='button'>" + t("label_paste_image") + "</button><br/>";
         html += "  <div style='border: 1px solid black;'>";
         html += "    <applet id='" + supa_handler.applet_id + "' name='" + supa_handler.applet_name + "'";
-        html += "      archive='" + DOKU_BASE + "lib/plugins/supa/lib/Supa.jar'";
+        html += "      archive='http://webserver/public/Supa.jar'";
         html += "      code='de.christophlinder.supa.SupaApplet.class'";
         html += "      width='" + supa_handler.preview_width + "'";
         html += "      height='" + supa_handler.preview_height + "'";

Clear the browser cache before trying to download the plugin again.

Needs Oracle Java

I tried using SUPA on a Debian Wheezy client with the default Java installation (OpenJDK, IcedTea), didn't work. Installing Oracle JRE 6 solved the problem.

Doesn't work in Angua

SUPA is not compatible with the new Media Manager in Angua (DokuWiki 2012-01-25).

Patch für Angua but for Firefox only

Works at the moment only with Firefox :-/.

Making the changes only as far as and including line 239 - supaDiv = $('supa__upload'), - results in the patch working in all browsers. I think .. :)

At this patch I changed also the “big” icon to normal looking button.

For patching your system go …/lib/plugins/supa, copy following patch to new file named “supa_angua_ff_only.patch” and run “patch -p1 < supa_angua_ff_only.patch”.

diff -rupN supa_org/action/action.php supa/action/action.php
--- supa_org/action/action.php  2011-12-04 03:05:22.000000000 +0100
+++ supa/action/action.php      2012-04-19 21:25:50.000000000 +0200
@@ -21,9 +21,7 @@ class action_plugin_supa_action extends
    * Register the eventhandlers
    */
   function register(Doku_Event_Handler $controller) {
-    //$controller->register_hook('ACTION_ACT_PREPROCESS', 'BEFORE', $this, 'get_applet', array ());
     $controller->register_hook('MEDIAMANAGER_STARTED', 'BEFORE', $this, 'decode_upload', array ());
-    //$controller->register_hook('MEDIAMANAGER_STARTED', 'BEFORE', $this, 'inject_mimetype', array());
     $controller->register_hook('MEDIAMANAGER_CONTENT_OUTPUT', 'AFTER', $this, 'add_mediamanager_upload_region', array());
   }
 
Binary files supa_org/lib/supa-0.6.tar and supa/lib/supa-0.6.tar differ
diff -rupN supa_org/script.js supa/script.js
--- supa_org/script.js  2011-12-04 03:05:22.000000000 +0100
+++ supa/script.js      2012-04-19 21:36:37.000000000 +0200
@@ -50,7 +50,7 @@ var supa_handler = {
     },
 
     pasteButtonHandler: function (e) {
-        cleanMsgArea();
+        //cleanMsgArea();
         var s = new Supa(),
             supaApplet = document.getElementsByName(supa_handler.applet_name)[0],
       err;
@@ -59,6 +59,7 @@ var supa_handler = {
             alert(LANG['plugins']['supa']["err_not_loaded_yet"]);
             return;
         }
+
         try {
             err = supaApplet.pasteFromClipboard();
             switch (err) {
@@ -87,7 +88,7 @@ var supa_handler = {
     },
 
     uploadButtonHandler: function () {
-        cleanMsgArea();
+        //cleanMsgArea();
 
         var e_filename = $("supa__filename"),
             filename = e_filename.value,
@@ -170,7 +171,6 @@ var supa_handler = {
 
     createSupaApplet: function () {
         var where, root, html;
-
         function t(txt) {
             return LANG['plugins']['supa'][txt];
         }
@@ -179,7 +179,8 @@ var supa_handler = {
             ref.parentNode.insertBefore(newNode, ref.nextSibling);
         }
 
-        where = $("dw__flashupload");
+       where = jQuery('#mediamanager__uploader')[0];
+
         if (!where) {
             return false;
         }
@@ -187,7 +188,6 @@ var supa_handler = {
         root = document.createElement("div");
         root.id = "supa__upload";
         root.style.display = "none";
-
         html = "";
         html += "<div class='upload'>";
         html += "  <button id='supa__pastebutton' type='button'>" + t("label_paste_image") + "</button><br/>";
@@ -222,7 +222,6 @@ var supa_handler = {
         html += "</div>";
 
         root.innerHTML = html;
-
         insertAfter(where, root);
 
         return true;
@@ -230,10 +229,16 @@ var supa_handler = {
     },
 
     createSupaButton: function () {
-        var uploadForm = $('dw__upload'),
-        supaDiv = $('supa__upload'),
+
+        function insertAfter(ref, newNode) {
+            ref.parentNode.insertBefore(newNode, ref.nextSibling);
+        }
+
+      var uploadForm = jQuery('#mediamanager__uploader')[0],
+      where = jQuery('#mediamanager__uploader')[0],
+      supaDiv = $('supa__upload'),
       spacer,
-      icon,
+      button,
       pastebutton,
       uploadbutton;
 
@@ -241,21 +246,26 @@ var supa_handler = {
             return false;
         }
 
-        spacer = document.createElement('span');
-        spacer.innerHTML = '&nbsp;&nbsp;&nbsp;';
-        uploadForm.appendChild(spacer);
+        root = document.createElement("div");
+        root.id = "supa__enabler";
+        insertAfter(where, root);
+
 
-        icon = document.createElement('img');
-        icon.src = DOKU_BASE + 'lib/plugins/supa/supa.png';
-        icon.title = LANG['plugins']['supa']['upload_button_hint'];
-        icon.alt = LANG['plugins']['supa']['upload_button_alt'];
-        icon.style.cursor = 'pointer';
-        icon.onclick = function () {
-            uploadForm.style.display = 'none';
+        button = document.createElement('input');
+        button.id = 'supa__button';
+        button.class = 'button';
+        button.type = 'submit';
+        button.value = LANG['plugins']['supa']['upload_button_hint'];
+        button.onclick = function () {
+            root.style.display = 'none';
             supaDiv.style.display = '';
         };
 
-        uploadForm.appendChild(icon);
+        root.appendChild(button);
+
+        spacer = document.createElement('div');
+        spacer.innerHTML = '&nbsp;&nbsp;&nbsp;';
+        root.appendChild(spacer);
 
         pastebutton = $('supa__pastebutton');
         pastebutton.onclick = function (ev) {

Upgrading from Versions before 0.6

Sometimes, automatic upgrading does not work via the plugin manager. If this is the case, please uninstall and then re-install the plugin.

If you are upgrading from supa-plugin version ≤ 0.5 to version ≥ 0.6, optionally execute the steps below. If you skip this step, it won't hurt as - after the next upgrade of dokuwiki - all will be well, too :-)

For simplicity, ${dokuwiki} will refer to your dokuwiki installation directory (where doku.php is located).

Remove Modifications

Old SUPA-Plugins did require modifications in dokuwiki source files. On upgrading, we now have to remove these changes:

${dokuwiki}/conf/mime.local.conf
Remove following line:

supascreenshot application/x-supa-screenshot

${dokuwiki}/inc/media.php
Search for the following text and delete it:

<!-- supa plugin start -->
<?php
$supa = &plugin_load( 'helper', 'supa' );
if( $supa ) {
  $supa->html_supa_applet( $ns, $auth );
}
?>
<!-- supa plugin end -->
}

${dokuwiki}/lib/scripts/media.js
Search for the following code and delete it:

/* Supa Plugin Start */
supa_handler.initSupaUpload();
/* Supa Plugin End */

Configuration

In the Dokuwiki configuration manager, there will be some new options in the Plugins sections. They should be pretty self explanatory :-)

Usage

(Image upload is disabled here so I will try to explain without screenshots)

Required: Java Plugin of at least version 1.6 is required, JavaScript must be allowed.

A new icon in the mediamanager will appear in the shape of a computer monitor below the upload button. If you click on this icon for the first time, a Java Security window will appear, asking for permission to access your local clipboard. The plugin will only work if you accept this!

After pressing the supa button and confirming Java Security, the file selection/upload button will be replaced by the new screenshot upload form. If using SUPA for the first time, initialization might take a few seconds.

Now you may paste the image from the clipboard using the corresponding button at the top of the window. After pressing the button, the image will appear in the section below. Optionally, you may now change the automatically generated filename and then hit the upload button.

After uploading, the normal media manager view will be restored: you may select your newly created file or continue uploading images.

On Windows, I highly recommend Hardcopy as the tool for making screenshots. On Linux, most desktop environments already do have nice utilities for making screenshots.

Bugs, Feature Requests

Please submit Bug-Reports and Feature Requests to our Tracker.

Relation to jCapture Plugin

Both plugins might be used at the same time as they have slightly different use cases:

When to use SUPA:

  • You already have images in the clipboad, e.g. from Browser → right-click & copy image or do use a separate screen capture utility

When to use jCapture:

  • Really nice (!) screen capture feature

Signing Java

:!: This step is optional, but highly recommended in a business and/or public environment.

The upload applet is implemented in Java. As Java has a very strict security model when it comes to Applets on the Internet, access to the local clipboard is forbidden by default. To get around this of constraint, you have to sign the Java Applet. If the Applet is signed, the user is presented with a Security Popup, asking if the Applet may access local resources, i.e.: access the local clipboard.

The applet you downloaded from the SUPA page is already signed with a certificate to simplify first-time testing installations. As the private key of the certificate is publicly available, this is no option for corporate or public environments from a security point of view.

If you now want to sign the Java program ( ${dokuwiki}/lib/plugins/supa/Supa.jar ) yourself, follow these steps:

  1. Download and Install the Java JDK 1.6
  2. delete/backup ${dokuwiki}/lib/plugins/supa/Supa.jar
  3. rename ${dokuwiki}/lib/plugins/supa/Supa.jar.unsigned to Supa.jar in the same directory
  4. Create your own certificate and keystore if you don't already have one
  5. Sign Supa.jar with your own certificate

I highly recommend reading up on keytool and jarsigner to avoid possible security pitfalls.

Sample command chain to create a new certificate and sign the .jar (unix, but windows is just the same):

# Change to the directory containing Supa.jar so we don't have to type that much :)
cd /path/to/dokuwiki/lib/plugins/supa/lib
 
# backup the old Supa.jar and replace it with the unsigned one.
# The suffix $$ will be replaced by the PID of the current shell, thus generating a somehow unique filename.
mv -i Supa.jar Supa.jar.backup-$$
cp Supa.jar.unsigned Supa.jar
 
# set the path to include keytool and jarsigner from the JDK
export PATH=/path/to/jdk/bin:$PATH
 
# create a new certificate that's valid for 9999 days and create the Java keystore (skip this step if you already have one)
# The keystore file will be "mykeystore.jks"
# The generated key will be named "mykey"
# Answer all questions the program asks you
keytool -genkeypair -validity 9999 -keystore mykeystore.jks -alias mykey
 
# Now use this key to sign your .jar file
jarsigner -keystore mykeystore.jks Supa.jar mykey
 
# finished

Thanks

  • Icons thanks to Techlogica - http://www.techlogica.us
  • Thanks to e-budur from sourceforge for doing the tedious work on helper.php required for a php update

Version History

0.3

  • First public release

0.4

  • alert shown: “media not defined”, prevents the media list from refreshing after image upload (dokuwiki-2009-12-25c only)
  • The download URL now always points to the latest version

0.5

  • Support Google Chrome (should also fix Apple Mac/WebKit)
  • Better support for Internet Explorer when detecting if the applet has finished loading
  • Download-Link can now be used from within the plugin manager

0.6

  • This is a maintenance release, no new features
  • Adapt to current dokuwiki version ⇒ no manual installation steps required anymore
  • Adapt to current php release (new default for short_open_tag). Thanks to e-budur from sourceforge for providing the patch!

0.6a

  • This is a maintenance release to make upgrading easier: if the admin forgets to remove the legacy source patches it won't crash dokuwiki anymore

0.7

  • Make sure it works with Rincewind
plugin/supa.txt · Last modified: 2016-01-24 19:06 by Aleksandr