From c1b34fa103bb05ed3cbef458c458a4851de41f78 Mon Sep 17 00:00:00 2001
From: rich <rich>
Date: Mon, 1 Nov 2004 16:05:26 +0000
Subject: [PATCH] Started to fix a bunch of usability problems on the file and
 image upload forms.

---
 MANIFEST                         |  1 +
 html/_js/upload.js               | 21 +++++++++++++++++++++
 scripts/upload_file_form.ml      | 24 +++++++++++++++++++++++-
 scripts/upload_image.ml          |  4 ++--
 scripts/upload_image_form.ml     | 24 +++++++++++++++++++++++-
 templates/files.html             |  2 +-
 templates/images.html            |  2 +-
 templates/upload_file_form.html  | 23 +++++++++++++----------
 templates/upload_image_form.html | 26 +++++++++++++++-----------
 9 files changed, 100 insertions(+), 27 deletions(-)
 create mode 100644 html/_js/upload.js

diff --git a/MANIFEST b/MANIFEST
index cc8a3cf..273860a 100644
--- a/MANIFEST
+++ b/MANIFEST
@@ -55,6 +55,7 @@ html/_graphics/wlh.png
 html/_graphics/xml.png
 html/_js/editor.js
 html/_js/new_page.js
+html/_js/upload.js
 html/_js/visualise_links.js
 html/_js/wz_jsgraphics.js
 html/_static/markup.html
diff --git a/html/_js/upload.js b/html/_js/upload.js
new file mode 100644
index 0000000..ed2f34e
--- /dev/null
+++ b/html/_js/upload.js
@@ -0,0 +1,21 @@
+/* $Id: upload.js,v 1.1 2004/11/01 16:05:27 rich Exp $ */
+
+function set_name ()
+{
+  if (document.f.name.value == "") {
+    var pathname = document.f.file.value;
+    /* Try to get just the filename.  Seems thereis no platform
+     * independent way to do it, so we will just guess.
+     */
+    var i = pathname.lastIndexOf ("/");
+    var j = pathname.lastIndexOf ("\\");
+    i = i > j ? i : j;
+    var filename =
+      i > -1 ? pathname.substring (i+1, pathname.length) : pathname;
+    filename = filename.toLowerCase ();
+    filename = filename.replace (/[^-a-z0-9_.]/g, '_');
+    document.f.name.value = filename;
+    return true;
+  }
+  return false;
+}
diff --git a/scripts/upload_file_form.ml b/scripts/upload_file_form.ml
index 41370e4..13619e4 100644
--- a/scripts/upload_file_form.ml
+++ b/scripts/upload_file_form.ml
@@ -1,7 +1,7 @@
 (* COCANWIKI - a wiki written in Objective CAML.
  * Written by Richard W.M. Jones <rich@merjis.com>.
  * Copyright (C) 2004 Merjis Ltd.
- * $Id: upload_file_form.ml,v 1.7 2004/09/09 12:21:22 rich Exp $
+ * $Id: upload_file_form.ml,v 1.8 2004/11/01 16:05:27 rich Exp $
  *
  * This program is free software; you can redistribute it and/or modify
  * it under the terms of the GNU General Public License as published by
@@ -30,6 +30,28 @@ open Cocanwiki_template
 let run r (q : cgi) (dbh : Dbi.connection) hostid _ _ =
   let template = get_template dbh hostid "upload_file_form.html" in
 
+  (* If called with a 'name' argument, prefill the name field.
+   * If called with an 'id' argument, get the name field from the
+   * database and prefill that field.
+   *)
+  let name =
+    if q#param_exists "name" then q#param "name"
+    else if q#param_exists "id" then (
+      let id = int_of_string (q#param "id") in
+      let sth = dbh#prepare_cached "select coalesce (name, name_deleted)
+                                      from files
+                                     where hostid = ? and id = ?" in
+      sth#execute [`Int hostid; `Int id];
+
+      let name = sth#fetch1string () in
+      name
+    )
+    else "" in
+  template#set "name" name;
+
+  (* Does the user want to replace an existing object? *)
+  template#conditional "replace" (q#param_true "replace");
+
   q#template template
 
 let () =
diff --git a/scripts/upload_image.ml b/scripts/upload_image.ml
index 5b74bb9..5e206a5 100644
--- a/scripts/upload_image.ml
+++ b/scripts/upload_image.ml
@@ -1,7 +1,7 @@
 (* COCANWIKI - a wiki written in Objective CAML.
  * Written by Richard W.M. Jones <rich@merjis.com>.
  * Copyright (C) 2004 Merjis Ltd.
- * $Id: upload_image.ml,v 1.8 2004/10/21 19:54:29 rich Exp $
+ * $Id: upload_image.ml,v 1.9 2004/11/01 16:05:27 rich Exp $
  *
  * This program is free software; you can redistribute it and/or modify
  * it under the terms of the GNU General Public License as published by
@@ -47,7 +47,7 @@ let run r (q : cgi) (dbh : Dbi.connection) hostid { hostname = hostname } user=
   (* See if there was an upload. *)
   let image =
     try
-      let upload = q#upload "image" in
+      let upload = q#upload "file" in
       upload.upload_value
     with
 	Not_found ->
diff --git a/scripts/upload_image_form.ml b/scripts/upload_image_form.ml
index e958090..d654e30 100644
--- a/scripts/upload_image_form.ml
+++ b/scripts/upload_image_form.ml
@@ -1,7 +1,7 @@
 (* COCANWIKI - a wiki written in Objective CAML.
  * Written by Richard W.M. Jones <rich@merjis.com>.
  * Copyright (C) 2004 Merjis Ltd.
- * $Id: upload_image_form.ml,v 1.7 2004/09/09 12:21:22 rich Exp $
+ * $Id: upload_image_form.ml,v 1.8 2004/11/01 16:05:27 rich Exp $
  *
  * This program is free software; you can redistribute it and/or modify
  * it under the terms of the GNU General Public License as published by
@@ -30,6 +30,28 @@ open Cocanwiki_template
 let run r (q : cgi) (dbh : Dbi.connection) hostid _ _ =
   let template = get_template dbh hostid "upload_image_form.html" in
 
+  (* If called with a 'name' argument, prefill the name field.
+   * If called with an 'id' argument, get the name field from the
+   * database and prefill that field.
+   *)
+  let name =
+    if q#param_exists "name" then q#param "name"
+    else if q#param_exists "id" then (
+      let id = int_of_string (q#param "id") in
+      let sth = dbh#prepare_cached "select coalesce (name, name_deleted)
+                                      from images
+                                     where hostid = ? and id = ?" in
+      sth#execute [`Int hostid; `Int id];
+
+      let name = sth#fetch1string () in
+      name
+    )
+    else "" in
+  template#set "name" name;
+
+  (* Does the user want to replace an existing object? *)
+  template#conditional "replace" (q#param_true "replace");
+
   q#template template
 
 let () =
diff --git a/templates/files.html b/templates/files.html
index 8f5c874..9f5f85c 100644
--- a/templates/files.html
+++ b/templates/files.html
@@ -44,7 +44,7 @@ Name: <strong>::name_html::</strong> (size: ::ksize_html:: K) <br/>
 <li class="first"><a href="/_bin/undelete_file_form.cmo?id=::id_url::">Restore</a></li>
 ::else::
 <li class="first"><a href="/_bin/edit_file_form.cmo?id=::id_url::">Edit</a> </li>
-<li><a href="/_bin/upload_file_form.cmo?id=::id_url::">Replace</a> </li>
+<li><a href="/_bin/upload_file_form.cmo?id=::id_url::&replace=1">Replace</a> </li>
 <li><a href="/_bin/delete_file_form.cmo?id=::id_url::">Delete</a></li>
 ::end::
 </ul>
diff --git a/templates/images.html b/templates/images.html
index 2473c1b..7fbb10d 100644
--- a/templates/images.html
+++ b/templates/images.html
@@ -46,7 +46,7 @@ ALT text: ::alt_html:: <br/>
 <li class="first"><a href="/_bin/undelete_image_form.cmo?id=::id_url::">Restore</a></li>
 ::else::
 <li class="first"><a href="/_bin/edit_image_form.cmo?id=::id_url::">Edit</a></li>
-<li><a href="/_bin/upload_image_form.cmo?id=::id_url::">Replace</a></li>
+<li><a href="/_bin/upload_image_form.cmo?id=::id_url::&replace=1">Replace</a></li>
 <li><a href="/_bin/delete_image_form.cmo?id=::id_url::">Delete</a></li>
 ::end::
 </ul>
diff --git a/templates/upload_file_form.html b/templates/upload_file_form.html
index f5fa243..c8694bf 100644
--- a/templates/upload_file_form.html
+++ b/templates/upload_file_form.html
@@ -7,12 +7,19 @@
 <link rel="stylesheet" href="::theme_css_html_tag::" type="text/css" title="Standard"/>
 <link rel="alternate stylesheet" href="/_css/easytoread.css" type="text/css" title="High contrast, big fonts"/>
 <link rel="stylesheet" href="/_css/create.css" type="text/css" title="Standard"/>
+<script src="/_js/upload.js" type="text/javascript"></script>
 </head><body>
 
 <h1><span>Upload file</span></h1>
 
 <form method="post" action="/_bin/upload_file.cmo" enctype="multipart/form-data" name="f">
 <table id="create">
+
+<tr>
+<th>File:</th>
+<td> <input type="file" name="file" value="" size="60" onchange="if (set_name ()) document.f.title.focus ()"/> </td>
+</tr>
+
 <tr>
 <td></td>
 <td class="explanation">
@@ -21,30 +28,26 @@ You need to provide a short name for this file.  Use only lowercase letters, num
 </tr>
 <tr>
 <th>File Name:</th>
-<td> <input name="name" value="new_file.jpg" size="40" maxlength="40" /> </td>
+<td> <input name="name" value="::name_html_tag::" size="40" maxlength="40" /> </td>
 </tr>
 
 <tr>
 <td></td>
 <td class="explanation">
-Upload the file itself.
+The title appears when users hover over a file link with their mouse.  It is not required.
 </td>
 </tr>
 <tr>
-<th>File:</th>
-<td> <input type="file" name="file" value="" /> </td>
+<th>Title:</th>
+<td> <input name="title" value="" size="70" /> </td>
 </tr>
 
 <tr>
 <td></td>
-<td class="explanation">
-The title appears when users hover over a file link with their mouse.  It is not required.
+<td>
+  <input id="replace" type="checkbox" name="replace" value="1" ::if(replace)::checked="checked"::end::/> <label for="replace">Replace any existing file with the same name</label>
 </td>
 </tr>
-<tr>
-<th>Title:</th>
-<td> <input name="title" value="" size="70" /> </td>
-</tr>
 
 <tr>
 <td></td>
diff --git a/templates/upload_image_form.html b/templates/upload_image_form.html
index 7899a5d..1a3dd72 100644
--- a/templates/upload_image_form.html
+++ b/templates/upload_image_form.html
@@ -7,32 +7,29 @@
 <link rel="stylesheet" href="::theme_css_html_tag::" type="text/css" title="Standard"/>
 <link rel="alternate stylesheet" href="/_css/easytoread.css" type="text/css" title="High contrast, big fonts"/>
 <link rel="stylesheet" href="/_css/create.css" type="text/css" title="Standard"/>
+<script src="/_js/upload.js" type="text/javascript"></script>
 </head><body>
 
 <h1><span>Upload image</span></h1>
 
 <form method="post" action="/_bin/upload_image.cmo" enctype="multipart/form-data" name="f">
 <table id="create">
+
 <tr>
-<td></td>
-<td class="explanation">
-You need to provide a short name for this image.  Use only lowercase letters, numbers and underscores ('_').  JPEG images should end in <code>.jpg</code> and GIF images should end in <code>.gif</code>.
-</td>
-</tr>
-<tr>
-<th>Image Name:</th>
-<td> <input name="name" value="new_image.jpg" size="40" maxlength="40" /> </td>
+<th>Image:</th>
+<td> <input type="file" name="file" value="" size="60" onchange="if (set_name ()) document.f.alt.focus ()"/> </td>
 </tr>
 
 <tr>
 <td></td>
 <td class="explanation">
-Upload the image itself.
+You need to provide a short name for this image.  Use only lowercase letters, numbers and underscores ('_').  JPEG images should end in <code>.jpg</code> and GIF images should end in <code>.gif</code>.
 </td>
 </tr>
+
 <tr>
-<th>Image:</th>
-<td> <input type="file" name="image" value="" /> </td>
+<th>Image Name:</th>
+<td> <input name="name" value="::name_html_tag::" size="40" maxlength="40" /> </td>
 </tr>
 
 <tr>
@@ -81,6 +78,13 @@ Class is used with stylesheets.  If in doubt, leave it blank.
 
 <tr>
 <td></td>
+<td>
+  <input id="replace" type="checkbox" name="replace" value="1" ::if(replace)::checked="checked"::end::/> <label for="replace">Replace any existing image with the same name</label>
+</td>
+</tr>
+
+<tr>
+<td></td>
 <td><input type="submit" value="Upload" /></td>
 </tr>
 
-- 
1.8.3.1