X-Git-Url: http://git.shadowcat.co.uk/gitweb/gitweb.cgi?a=blobdiff_plain;f=root%2Fjs%2Fcomponentload.js;h=8be32107415fccce7e11f9be56a532ffaf34ba55;hb=e239d45f9ea50e2a3ee2e4575a6b5ea33eaa7dee;hp=da3ad7f90c29cdeb99901a3a444ffe3b79d865ab;hpb=38627d20c7f0a0f82ec820b716842d69e905d643;p=scpubgit%2Fstemmaweb.git

diff --git a/root/js/componentload.js b/root/js/componentload.js
index da3ad7f..8be3210 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();
@@ -45,12 +47,12 @@ function loadTradition( textid, textname, editable ) {
     // Hide the functionality that is irrelevant
     if( editable ) {
     	$('#open_stemma_add').show();
-    	$('#open_stemma_edit').show();
     	$('#open_textinfo_edit').show();
     	$('#relatebutton_label').text('View collation and edit relationships');
     } else {
     	$('#open_stemma_add').hide();
-    	$('#open_stemma_edit').hide();
+    	$('#open_stemweb_ui').hide();
+    	$('#query_stemweb_ui').hide();
     	$('#open_textinfo_edit').hide();
     	$('#relatebutton_label').text('View collation and relationships');
     }
@@ -62,15 +64,12 @@ function loadTradition( textid, textname, editable ) {
     	// Add the scalar data
     	selectedTextInfo = textdata;
     	load_textinfo();
-     	// Add the stemma(ta) and set up the stexaminer button
+     	// Add the stemma(ta)
     	stemmata = textdata.stemmata;
     	if( stemmata.length ) {
     		selectedStemmaID = 0;
-			$('#run_stexaminer').show();
     	} else {
     		selectedStemmaID = -1;
-			$('#open_stemma_edit').hide();
-			$('#run_stexaminer').hide();
 		}
 		load_stemma( selectedStemmaID );
     	// Set up the relationship mapper button
@@ -118,12 +117,12 @@ function show_stemmapager () {
       $('.pager_right_button').unbind('click').addClass( 'greyed_out' );
       if( selectedStemmaID > 0 ) {
               $('.pager_left_button').click( function () {
-                      load_stemma( selectedStemmaID - 1 );
+                      load_stemma( selectedStemmaID - 1, selectedTextEditable );
               }).removeClass( 'greyed_out' );
       }       
       if( selectedStemmaID + 1 < stemmata.length ) {
               $('.pager_right_button').click( function () {
-                      load_stemma( selectedStemmaID + 1 );
+                      load_stemma( selectedStemmaID + 1, selectedTextEditable );
               }).removeClass( 'greyed_out' );
       }
 }
@@ -132,16 +131,73 @@ function show_stemmapager () {
 function load_stemma( idx ) {
 	// Load the stemma at idx
 	selectedStemmaID = idx;
-	show_stemmapager();
+	show_stemmapager( selectedTextEditable );
+	$('#open_stemma_edit').hide();
+	$('#run_stexaminer').hide();
+	$('#stemma_identifier').empty();
+	// Add the relevant Stemweb functionality
+	if( selectedTextEditable ) {
+		if( selectedTextInfo.stemweb_jobid == 0 ) {
+			$('#open_stemweb_ui').show();
+			$('#query_stemweb_ui').hide();
+		} else {
+			$('#query_stemweb_ui').show();
+			$('#open_stemweb_ui').hide();
+		}
+	}
 	if( idx > -1 ) {
-		loadSVG( stemmata[idx] );
-		// Stexaminer submit action
-		var stexpath = _get_url([ "stexaminer", selectedTextID, idx ]);
-		$('#run_stexaminer').attr( 'action', stexpath );
+		// Load the stemma and its properties
+		var stemmadata = stemmata[idx];
+		if( selectedTextEditable ) {
+			$('#open_stemma_edit').show();
+		}
+		if( stemmadata.directed ) {
+			// Stexaminer submit action
+			var stexpath = _get_url([ "stexaminer", selectedTextID, idx ]);
+			$('#run_stexaminer').attr( 'action', stexpath );
+			$('#run_stexaminer').show();
+		}
+		loadSVG( stemmadata.svg );
+		$('#stemma_identifier').text( stemmadata.name );
         setTimeout( 'start_element_height = $("#stemma_graph .node")[0].getBBox().height;', 500 );
 	}
 }
 
+function query_stemweb_progress() {
+	var requrl = _get_url([ "stemweb", "query", selectedTextInfo.stemweb_jobid ]);
+	$.getJSON( requrl, function (data) {
+		process_stemweb_result( data );
+	});
+}
+
+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 {
+				// 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!' );
+		} 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.' );
+	}
+}
+
 // Load the SVG we are given
 function loadSVG(svgData) {
 	var svgElement = $('#stemma_graph');
@@ -171,10 +227,59 @@ function loadSVG(svgData) {
 			}
 			var topoffset = theSVG.position().top - svgElement.position().top - browseroffset;
 			theSVG.offset({ top: svgoffset.top - topoffset, left: svgoffset.left });
+			set_stemma_interactive( theSVG );
 		}
 	});
 }
 
+function set_stemma_interactive( svg_element ) {
+	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 ) {
@@ -307,13 +412,16 @@ 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
 	if( !!window.FileReader && !!window.File ) {
 		$('#compatibility_check').empty();
 	}
+
+    // hide dialog not yet in use
+    $('#root_tree_dialog').hide();
 	
     // call out to load the directory div
     $('#textinfo_container').hide();
@@ -329,7 +437,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) {
@@ -337,7 +446,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' );
 			},
@@ -382,7 +491,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() };
@@ -393,12 +503,13 @@ $(document).ready( function() {
 					// We received a stemma SVG string in return. 
 					// Update the current stemma sequence number
 					selectedStemmaID = data.stemmaid;
-					// Stash the answer in our SVG array
-					stemmata[selectedStemmaID] = data.stemmasvg;
+					delete data.stemmaid;
+					// Stash the answer in the appropriate spot in our stemma array
+					stemmata[selectedStemmaID] = data;
 					// Display the new stemma
-					load_stemma( selectedStemmaID );
+					load_stemma( selectedStemmaID, true );
 					// Reenable the button and close the form
-					$(evt.target).button("enable");
+					mybuttons.button("enable");
 					$('#stemma-edit-dialog').dialog('close');
 				}, 'json' );
 			},
@@ -413,7 +524,7 @@ $(document).ready( function() {
 				// If we are creating a new stemma, populate the textarea with a
 				// bare digraph.
 				$(evt.target).dialog('option', 'title', 'Add a new stemma')
-				$('#dot_field').val( "digraph stemma {\n\n}" );
+				$('#dot_field').val( "digraph \"NAME STEMMA HERE\" {\n\n}" );
 			} else {
 				// If we are editing a stemma, grab its stemmadot and populate the
 				// textarea with that.
@@ -434,7 +545,156 @@ $(document).ready( function() {
 			display_error( jqXHR, $("#edit_stemma_status") );
     	}
 	});
+
+	$('#stemweb-ui-dialog').dialog({
+		autoOpen: false,
+		height: 'auto',
+		width: 400,
+		modal: true,
+		buttons: {
+			Run: function (evt) {
+				$("#stemweb_run_status").empty();
+			  	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) {
+					mybuttons.button("enable");
+					$('#stemweb-ui-dialog').dialog('close');
+					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() {
+				$('#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 = {};
+			var requrl = _get_url([ "stemweb", "available" ]);
+			$.getJSON( requrl, function( data ) {
+				$.each( data, 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;
+					}
+				});
+				// TODO if it is an empty object, disable Stemweb entirely.
+				if( !jQuery.isEmptyObject( algorithmTypes ) ) {
+					$.each( algorithmTypes, function( pk, fields ) {
+						var algopt = $('<option>').attr( 'value', pk ).append( fields.name );
+						$('#stemweb_algorithm').append( algopt );
+					});
+					// Set up the relevant options for whichever algorithm is chosen.
+					// "key" -> form name, option ID "stemweb_$key_opt"
+					// "name" -> form label
+					$('#stemweb_algorithm_help').click( function() {
+						$('#stemweb_algorithm_desc_text').toggle( 'blind' );
+						});
+					$('#stemweb_algorithm').change( function() {
+						var pk = $(this).val();
+						// Display a link to the popup description, and fill in
+						// the description itself, if we have one.
+						if( 'desc' in algorithmTypes[pk] ) {
+							$('#stemweb_algorithm_desc_text').empty().append( algorithmTypes[pk].desc );
+							$('#stemweb_algorithm_desc').show();
+						} else {
+							$('#stemweb_algorithm_desc').hide();
+						}
+						$('#stemweb_runtime_options').empty();
+						$.each( algorithmTypes[pk].args, function( i, apk ) {
+							var argInfo = algorithmArgs[apk];
+							if( argInfo ) {
+								// Make the element ID
+								var optId = 'stemweb_' + argInfo.key + '_opt';
+								// Make the label
+								var optLabel = $('<label>').attr( 'for', optId )
+									.append( argInfo.name + ": " );
+								var optCtrl;
+								var argType = argInfo.value;
+								if( argType === 'positive_integer' ) {
+									// Make it an input field of smallish size.
+									optCtrl = $('<input>').attr( 'size', 4 );
+								} else if ( argType === 'boolean' ) {
+									// Make it a checkbox.
+									optCtrl = $('<checkbox>');
+								}
+								// Add the name and element ID
+								optCtrl.attr( 'name', argInfo.key ).attr( 'id', optId );
+								// Append the label and the option itself to the form.
+								$('#stemweb_runtime_options').append( optLabel )
+									.append( optCtrl ).append( $('<br>') );
+							}
+						});
+					});
+					$('#stemweb_algorithm').change();
+				}
+			});
+			// Prime the initial options
+		},
+		open: function(evt) {
+			$('#stemweb_run_status').empty();
+			$('#stemweb_tradition').attr('value', selectedTextID );
+			$('#stemweb_merge_reltypes').empty();
+			$.each( selectedTextInfo.reltypes, function( i, r ) {
+				var relation_opt = $('<option>').attr( 'value', r ).append( r );
+				$('#stemweb_merge_reltypes').append( relation_opt );
+			});
+			$('#stemweb_merge_reltypes').multiselect({ 
+				header: false,
+				selectedList: 3
+			});
+		},
+	}).ajaxError( function(event, jqXHR, ajaxSettings, thrownError) {
+		$(event.target).parent().find('.ui-button').button("enable");
+    	if( ajaxSettings.url.indexOf( 'stemweb/request' ) > -1 ) {
+			display_error( jqXHR, $("#stemweb_run_status") );
+    	}
+	});
 		
+	// Set up the download dialog
+	$('#download-dialog').dialog({
+		autoOpen: false,
+		height: 150,
+		width: 300,
+		modal: true,
+		buttons: {
+			Download: function (evt) {
+				var dlurl = _get_url([ "download", $('#download_tradition').val(), $('#download_format').val() ]);
+				window.location = dlurl;
+			},
+			Done: function() {
+				$('#download-dialog').dialog('close');
+			}
+		},
+		open: function() {
+			$('#download_tradition').attr('value', selectedTextID );
+		},
+	}).ajaxError( function(event, jqXHR, ajaxSettings, thrownError) {
+		$(event.target).parent().find('.ui-button').button("enable");
+    	if( ajaxSettings.url.indexOf( 'download' ) > -1 
+    		&& ajaxSettings.type == 'POST' ) {
+			display_error( jqXHR, $("#download_status") );
+    	}
+	});
+
 	$('#upload-collation-dialog').dialog({
 		autoOpen: false,
 		height: 360,