handle file upload server responses
Tara L Andrews [Fri, 31 Aug 2012 21:29:18 +0000 (23:29 +0200)]
root/css/style.css
root/js/componentload.js
root/js/uploader.js
root/src/index.tt

index ab699a6..ed3b262 100644 (file)
@@ -79,6 +79,9 @@ div.button:hover span {
        padding-left: 10px;
        padding-right: 10px;
 }
+#loading_message {
+       display: none;
+}
 #directory {
        height: 360px;
        margin-left: 10px;
index 9c9c848..02cd0fc 100644 (file)
@@ -5,6 +5,7 @@ function loadTradition( textid, textname, editable ) {
     if( basepath.lastIndexOf('/') == basepath.length - 1 ) { 
        basepath = basepath.slice( 0, basepath.length - 1) 
     };
+    $('#textinfo_load_status').empty();
     $('#stemma_graph').empty();
     $('#textinfo_waitbox').show();
     $('#textinfo_container').ajaxError( 
@@ -14,7 +15,7 @@ function loadTradition( textid, textname, editable ) {
                                var msg = "An error occurred: ";
                                var msghtml = $('<span>').attr('class', 'error').text(
                                        msg + jqxhr.status + " " + jqxhr.statusText);
-                               $("#textinfo_container").append( msghtml ).show();
+                               $("#textinfo_load_status").append( msghtml ).show();
                        } 
        }
     );
index a4d470c..102b9f1 100644 (file)
@@ -12,6 +12,12 @@ function limitFiles( up, files ) {
     $('#upload_button').button('enable');
 }
 
+// Utility function to pull the JSON out of the <pre>-wrapped HTML that
+// plupload irritatingly returns.
+function parseResponse( resp ) {
+       return $.parseJSON($(resp).text() );
+}
+
 function create_uploader(upload_url) {
         uploader = new plupload.Uploader({
         runtimes : 'html4',
@@ -44,10 +50,24 @@ function create_uploader(upload_url) {
     uploader.bind('UploadProgress', function(up, file) {
         $upl(file.id).getElementsByTagName('b')[0].innerHTML = '<span>' + file.percent + "%</span>";
     });
+    
+    uploader.bind('Error', function( up, args ) {
+       $('#upload_status').empty().append(
+               $('<span>').attr('class', 'error').append( 'A server error occurred' ) );
+    });
+    
 
     uploader.bind('FileUploaded', function(up, file, ret) {
-                   //token = ret.response;
-                   $('#upload-collation-dialog').dialog( 'option', 'buttons').cancel();
+               var result = parseResponse( ret.response );
+               if( result.id ) {
+                       $('#upload-collation-dialog').dialog( 'option', 'buttons').cancel();
+                       refreshDirectory();
+                       loadTradition( result.id, result.name, 1 );
+               } else if( result.error ) {
+                       file.status = plupload.FAILED;
+                       $('#upload_status').empty().append( 
+                               $('<span>').attr('class', 'error').append( result.error ) );
+               }
     });
             
     uploader.init();
index 8256b0a..539ab3b 100644 (file)
@@ -8,6 +8,8 @@ var selectedStemmaID = -1;
 var stemmata = [];
 
 function refreshDirectory () {
+       var lmesg = $('#loading_message').clone();
+       $('#directory').empty().append( lmesg.contents() );
     $('#directory').load( "[% c.uri_for( 'directory' ) %]", 
        function(response, status, xhr) {
                        if (status == "error") {
@@ -70,10 +72,7 @@ $(document).ready( function() {
     </div>
     <div id="directory_container">
       <h2>Text directory</h2>
-      <div id="directory">
-       <h3>Loading texts, please wait...</h3>
-       <img src="[% c.uri_for( 'images', 'ajax-loader.gif' ) %]" />
-      </div>
+      <div id="directory"></div>
 [% IF c.user_exists -%]
          <div class="button" id="new_trad_button" onClick="start_upload_dialog();">
            <span>Add a new text tradition</span>
@@ -84,6 +83,7 @@ $(document).ready( function() {
        <img src="[% c.uri_for( 'images', 'ajax-loader.gif' ) %]" alt="Loading tradition info..."/>
     </div>
     <div id="textinfo_container">
+      <div id="textinfo_load_status"></div>
       <h2>Text <span class="texttitle"></span></h2>
       <ul>
              <li>has <span id="witness_num"></span> witnesses: <span id="witness_list"></span></li>
@@ -112,6 +112,11 @@ $(document).ready( function() {
       <div id="stemma_graph"></div>
     </div>
 
+    <!-- Interim 'loading' message for directory box -->
+    <div id="loading_message">
+       <h3>Loading texts, please wait...</h3>
+       <img src="[% c.uri_for( 'images', 'ajax-loader.gif' ) %]" />
+    </div>
 
     <!-- File upload dialog box -->
     <div id="upload-collation-dialog" title="Upload a collation">