X-Git-Url: http://git.shadowcat.co.uk/gitweb/gitweb.cgi?a=blobdiff_plain;f=root%2Fjs%2Fcomponentload.js;h=57ddb17350287a3f93b0494169b5f56e7f5bcc82;hb=509e94bc8086be4f2e2029d6c707c7dc541a762a;hp=07fb93da8d35dfd9f018d0c91364d520ea938413;hpb=b63f3a770f4f22d83dc77c88b0299d22ae07efcc;p=scpubgit%2Fstemmaweb.git diff --git a/root/js/componentload.js b/root/js/componentload.js index 07fb93d..57ddb17 100644 --- a/root/js/componentload.js +++ b/root/js/componentload.js @@ -1,6 +1,7 @@ // Global state variables var selectedTextID; var selectedTextInfo; +var selectedTextEditable; var selectedStemmaID = -1; var stemmata = []; @@ -29,6 +30,7 @@ function refreshDirectory () { // view pane. Calls load_textinfo. function loadTradition( textid, textname, editable ) { selectedTextID = textid; + selectedTextEditable = editable; // First insert the placeholder image and register an error handler $('#textinfo_load_status').empty(); $('#stemma_graph').empty(); @@ -69,7 +71,7 @@ function loadTradition( textid, textname, editable ) { } else { selectedStemmaID = -1; } - load_stemma( selectedStemmaID, editable ); + load_stemma( selectedStemmaID ); // Set up the relationship mapper button $('#run_relater').attr( 'action', _get_url([ "relation", textid ]) ); // Set up the download button @@ -110,43 +112,37 @@ function load_textinfo() { } // Enable / disable the appropriate buttons for paging through the stemma. -function show_stemmapager ( editable ) { +function show_stemmapager () { $('.pager_left_button').unbind('click').addClass( 'greyed_out' ); $('.pager_right_button').unbind('click').addClass( 'greyed_out' ); if( selectedStemmaID > 0 ) { $('.pager_left_button').click( function () { - load_stemma( selectedStemmaID - 1, editable ); + load_stemma( selectedStemmaID - 1, selectedTextEditable ); }).removeClass( 'greyed_out' ); } if( selectedStemmaID + 1 < stemmata.length ) { $('.pager_right_button').click( function () { - load_stemma( selectedStemmaID + 1, editable ); + load_stemma( selectedStemmaID + 1, selectedTextEditable ); }).removeClass( 'greyed_out' ); } } // Load a given stemma SVG into the stemmagraph box. -function load_stemma( idx, editable ) { +function load_stemma( idx ) { // Load the stemma at idx selectedStemmaID = idx; - show_stemmapager( editable ); + show_stemmapager( selectedTextEditable ); $('#open_stemma_edit').hide(); $('#run_stexaminer').hide(); $('#stemma_identifier').empty(); // Add the relevant Stemweb functionality - if( editable ) { - if( selectedTextInfo.stemweb_jobid == 0 ) { - $('#open_stemweb_ui').show(); - $('#query_stemweb_ui').hide(); - } else { - $('#query_stemweb_ui').show(); - $('#open_stemweb_ui').hide(); - } + if( selectedTextEditable ) { + switch_stemweb_ui(); } if( idx > -1 ) { // Load the stemma and its properties var stemmadata = stemmata[idx]; - if( editable ) { + if( selectedTextEditable ) { $('#open_stemma_edit').show(); } if( stemmadata.directed ) { @@ -161,35 +157,77 @@ function load_stemma( idx, editable ) { } } +function switch_stemweb_ui() { + if( selectedTextInfo.stemweb_jobid == 0 ) { + // We want to run Stemweb. + $('#open_stemweb_ui').show(); + $('#call_stemweb').show() + $('#query_stemweb_ui').hide(); + $('#stemweb_run_button').show(); + } else { + $('#query_stemweb_ui').show(); + $('#open_stemweb_ui').hide(); + $('#call_stemweb').hide(); + $('#stemweb_run_button').hide(); + } +} + function query_stemweb_progress() { var requrl = _get_url([ "stemweb", "query", selectedTextInfo.stemweb_jobid ]); + $('#stemweb-ui-dialog').dialog('open'); + $('#stemweb_run_status').empty().append( + _make_message( 'notification', 'Querying Stemweb for calculation progress...') ); $.getJSON( requrl, function (data) { - // Look for a status message, either success, running, or notfound. - if( data.status === 'success' ) { - // Add the new stemmata to the textinfo and tell the user. - selectedTextInfo.stemweb_jobid = 0; - if( data.stemmata.length > 0 ) { - stemmata = stemmata.concat( data.stemmata ); - if( selectedStemmaID == -1 ) { - // We have a stemma for the first time; load the first one. - load_stemma( 0, true ); - } else { - // Move to the index of the first added stemma. - var newIdx = stemmata.length - data.stemmata.length; - load_stemma( newIdx, true ); - } - alert( 'You have one or more new stemmata!' ); + process_stemweb_result( data ); + }); + // TODO need an error handler +} + +function process_stemweb_result(data) { + // Look for a status message, either success, running, or notfound. + if( data.status === 'success' ) { + // Add the new stemmata to the textinfo and tell the user. + selectedTextInfo.stemweb_jobid = 0; + if( data.stemmata.length > 0 ) { + stemmata = stemmata.concat( data.stemmata ); + if( selectedStemmaID == -1 ) { + // We have a stemma for the first time; load the first one. + load_stemma( 0, true ); } else { - alert( 'Stemweb run finished with no stemmata...huh?!' ); - } - } else if( data.status === 'running' ) { - // Just tell the user. - alert( 'Your Stemweb query is still running!' ); - } else if( data.status === 'notfound' ) { - // Ask the user to refresh, for now. - alert( 'Your Stemweb query probably finished and reported back. Please reload to check.' ); + // Move to the index of the first added stemma. + var newIdx = stemmata.length - data.stemmata.length; + load_stemma( newIdx, true ); + } + $('#stemweb_run_status').empty().append( + _make_message( 'notification', 'You have one or more new stemmata!' ) ); + } else { + $('#stemweb_run_status').empty().append( + _make_message( 'warning', 'Stemweb run finished with no stemmata...huh?!' ) ); } - }); + } else if( data.status === 'running' ) { + // Just tell the user. + $('#stemweb_run_status').empty().append( + _make_message( 'notification', 'Your Stemweb query is still running!' ) ); + } else if( data.status === 'notfound' ) { + // Ask the user to refresh, for now. + $('#stemweb_run_status').empty().append( + _make_message( 'warning', 'Your Stemweb query probably finished and reported back. Please reload to check.' ) ); + } else if( data.status === 'failed' ) { + selectedTextInfo.stemweb_jobid = 0; + failureMsg = 'Your stemweb query failed'; + if( data.message ) { + failureMsg = failureMsg + ' with the following message: ' + data.message + } + $('#stemweb_run_status').empty().append( + _make_message( 'error', failuremsg + '.' ) ); + } + switch_stemweb_ui(); +} + +function _make_message( type, msg ) { + theMessage = $('').attr( 'class', type ); + theMessage.append( msg ); + return theMessage; } // Load the SVG we are given @@ -227,20 +265,53 @@ function loadSVG(svgData) { } function set_stemma_interactive( svg_element ) { - $( "#root_tree_dialog_button_ok" ).click( function() { - // AJAX call goes here - } ); - $.each( $( 'ellipse', svg_element ), function(index) { - $(this).click( function(evt) { - var dialog = $( '#root_tree_dialog' ); - dialog.css( 'top', evt.pageY ); - dialog.css( 'left', evt.pageX ); - dialog.show(); - root_tree_dialog_timeout = setTimeout( function() { $( '#root_tree_dialog' ).hide() }, 3000 ); - } ); - $(this).hover( function() { $(this).addClass( 'stemma_node_highlight' ) }, function() { $(this).removeClass( 'stemma_node_highlight' ) } ); - } ); + if( selectedTextEditable ) { + $( "#root_tree_dialog_button_ok" ).click( function() { + var requrl = _get_url([ "stemmaroot", selectedTextID, selectedStemmaID ]); + var targetnode = $('#root_tree_dialog').data( 'selectedNode' ); + $.post( requrl, { root: targetnode }, function (data) { + // Reload the new stemma + stemmata[selectedStemmaID] = data; + load_stemma( selectedStemmaID ); + // Put away the dialog + $('#root_tree_dialog').data( 'selectedNode', null ).hide(); + } ); + } ).ajaxError( function(event, jqXHR, ajaxSettings, thrownError) { + if( ajaxSettings.url.indexOf( 'stemmaroot' ) > -1 + && ajaxSettings.type == 'POST' ) { + display_error( jqXHR, $("#stemma_load_status") ); + } + } ); + // TODO Clear error at some appropriate point + $.each( $( 'ellipse', svg_element ), function(index) { + var ellipse = $(this); + var g = ellipse.parent( 'g' ); + g.click( function(evt) { + if( typeof root_tree_dialog_timeout !== 'undefined' ) { clearTimeout( root_tree_dialog_timeout ) }; + g.unbind( 'mouseleave' ); + var dialog = $( '#root_tree_dialog' ); + // Note which node triggered the dialog + dialog.data( 'selectedNode', g.attr('id') ); + // Position the dialog + dialog.hide(); + dialog.css( 'top', evt.pageY + 3 ); + dialog.css( 'left', evt.pageX + 3 ); + dialog.show(); + root_tree_dialog_timeout = setTimeout( function() { + $( '#root_tree_dialog' ).data( 'selectedNode', null ).hide(); + ellipse.removeClass( 'stemma_node_highlight' ); + g.mouseleave( function() { ellipse.removeClass( 'stemma_node_highlight' ) } ); + }, 3000 ); + } ); + g.mouseenter( function() { + $( 'ellipse.stemma_node_highlight' ).removeClass( 'stemma_node_highlight' ); + ellipse.addClass( 'stemma_node_highlight' ) + } ); + g.mouseleave( function() { ellipse.removeClass( 'stemma_node_highlight' ) } ); + } ); + } } + // General-purpose error-handling function. // TODO make sure this gets used throughout, where appropriate. function display_error( jqXHR, el ) { @@ -373,7 +444,7 @@ function _get_url( els ) { return basepath + els.join('/'); } - +// TODO Attach unified ajaxError handler to document $(document).ready( function() { // See if we have the browser functionality we need // TODO Also think of a test for SVG readiness @@ -398,7 +469,8 @@ $(document).ready( function() { buttons: { Save: function (evt) { $("#edit_textinfo_status").empty(); - $(evt.target).button("disable"); + var mybuttons = $(evt.target).closest('button').parent().find('button'); + mybuttons.button( 'disable' ); var requrl = _get_url([ "textinfo", selectedTextID ]); var reqparam = $('#edit_textinfo').serialize(); $.post( requrl, reqparam, function (data) { @@ -406,7 +478,7 @@ $(document).ready( function() { selectedTextInfo = data; load_textinfo(); // Reenable the button and close the form - $(evt.target).button("enable"); + mybuttons.button("enable"); $('#textinfo-edit-dialog').dialog('close'); }, 'json' ); }, @@ -451,7 +523,8 @@ $(document).ready( function() { buttons: { Save: function (evt) { $("#edit_stemma_status").empty(); - $(evt.target).button("disable"); + var mybuttons = $(evt.target).closest('button').parent().find('button'); + mybuttons.button( 'disable' ); var stemmaseq = $('#stemmaseq').val(); var requrl = _get_url([ "stemma", selectedTextID, stemmaseq ]); var reqparam = { 'dot': $('#dot_field').val() }; @@ -468,7 +541,7 @@ $(document).ready( function() { // Display the new stemma load_stemma( selectedStemmaID, true ); // Reenable the button and close the form - $(evt.target).button("enable"); + mybuttons.button("enable"); $('#stemma-edit-dialog').dialog('close'); }, 'json' ); }, @@ -507,94 +580,163 @@ $(document).ready( function() { $('#stemweb-ui-dialog').dialog({ autoOpen: false, - height: 160, - width: 225, + height: 'auto', + width: 520, modal: true, buttons: { - Run: function (evt) { + Run: { + id: 'stemweb_run_button', + text: 'Run', + click: function (evt) { $("#stemweb_run_status").empty(); - $(evt.target).button("disable"); + var mybuttons = $(evt.target).closest('button').parent().find('button'); + mybuttons.button( 'disable' ); var requrl = _get_url([ "stemweb", "request" ]); var reqparam = $('#call_stemweb').serialize(); // TODO We need to stash the literal SVG string in stemmata // somehow. Implement accept header on server side to decide // whether to send application/json or application/xml? $.getJSON( requrl, reqparam, function (data) { - // Job ID is in data.jobid. TODO do something with it. - selectedTextInfo.stemweb_jobid = data.jobid; - $(evt.target).button("enable"); + mybuttons.button("enable"); $('#stemweb-ui-dialog').dialog('close'); - // Reload the current stemma to rejigger the buttons - load_stemma( selectedStemmaID, true ); + if( 'jobid' in data ) { + // There is a pending job. + selectedTextInfo.stemweb_jobid = data.jobid; + alert("Your request has been submitted to Stemweb.\nThe resulting tree will appear in due course."); + // Reload the current stemma to rejigger the buttons + load_stemma( selectedStemmaID, true ); + } else { + // We appear to have an answer; process it. + process_stemweb_result( data ); + } }, 'json' ); + }, }, - Cancel: function() { + Close: { + id: 'stemweb_close_button', + text: 'Close', + click: function() { $('#stemweb-ui-dialog').dialog('close'); - } + }, + }, }, create: function(evt) { // Call out to Stemweb to get the algorithm options, with which we // populate the form. var algorithmTypes = {}; var algorithmArgs = {}; - $.each( stemwebAlgorithms, function( i, o ) { - if( o.model === 'algorithms.algorithm' ) { - // it's an algorithm. - algorithmTypes[ o.pk ] = o.fields; - } else if( o.model == 'algorithms.algorithmarg' && o.fields.external ) { - // it's an option for an algorithm that we should display. - algorithmArgs[ o.pk ] = o.fields; - } - }); - $.each( algorithmTypes, function( pk, fields ) { - var algopt = $('