X-Git-Url: http://git.shadowcat.co.uk/gitweb/gitweb.cgi?a=blobdiff_plain;f=root%2Fjs%2Fcomponentload.js;h=24b692b0e32f5d06c1a9cbd375d248914cef9c3c;hb=e4fd6366fd96df7b3076ac8f76e1701e7083342b;hp=378b24e50756b9e17d17f79d17101f8f0b9d54a1;hpb=2c514a6fa0b3eed98e8f978a4b1fa24eb7a7457f;p=scpubgit%2Fstemmaweb.git

diff --git a/root/js/componentload.js b/root/js/componentload.js
index 378b24e..24b692b 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
@@ -83,7 +85,10 @@ function load_textinfo() {
 	$('#textinfo_waitbox').hide();
 	$('#textinfo_load_status').empty();
 	$('#textinfo_container').show();
+	// The tradition name should appear here and should be identical in the
+	// corresponding directory span. In case the name was just changed...
 	$('.texttitle').empty().append( selectedTextInfo.name );
+	$('#' + selectedTextID).empty().append( selectedTextInfo.name );
 	// Witnesses
 	$('#witness_num').empty().append( selectedTextInfo.witnesses.size );
 	$('#witness_list').empty().append( selectedTextInfo.witnesses.join( ', ' ) );
@@ -110,43 +115,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,31 +160,82 @@ function load_stemma( idx, editable ) {
 	}
 }
 
+function switch_stemweb_ui() {
+	if( selectedTextInfo.stemweb_jobid == 0 ) {
+		// We want to run Stemweb.
+		$('#open_stemweb_ui').show();
+		$('#query_stemweb_ui').hide();
+		if( ! $('#stemweb-ui-dialog').dialog('isOpen') ) {
+			$('#call_stemweb').show()
+			$('#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 );
-				}
-				alert( 'You have one or more new stemmata!' );
+		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 {
-				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 );
+			} 
+			// Hide the call dialog no matter how we got here
+			$('#call_stemweb').hide()
+			$('#stemweb_run_button').hide();
+			$('#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( 'warning', '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
+		} else {
+			failureMsg = failureMsg + ' without telling us why.'
+		}
+		$('#stemweb_run_status').empty().append( 
+				_make_message( 'error', failureMsg ) );
+	}
+}
+
+function _make_message( type, msg ) {
+	theMessage = $('<span>').attr( 'class', type );
+	theMessage.append( msg );
+	return theMessage;
 }
 
 // Load the SVG we are given
@@ -217,10 +267,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 ) {
@@ -353,13 +452,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();
@@ -375,7 +477,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) {
@@ -383,7 +486,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' );
 			},
@@ -428,7 +531,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() };
@@ -445,7 +549,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' );
 			},
@@ -484,93 +588,164 @@ $(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.
-					$(evt.target).button("enable");
-					$('#stemma-edit-dialog').dialog('close');
-					// Reload the current stemma to rejigger the buttons
-					load_stemma( selectedStemmaID, true );
+					mybuttons.button("enable");
+					if( 'jobid' in data ) {
+						// There is a pending job.
+						selectedTextInfo.stemweb_jobid = data.jobid;
+						$('#stemweb_run_status').empty().append( 
+							_make_message( 'notification', "Your request has been submitted to Stemweb.\nThe resulting tree will appear in due course." ) );
+						// Reload the current stemma to rejigger the buttons
+						switch_stemweb_ui();
+					} else {
+						// We appear to have an answer; process it.
+						process_stemweb_result( data );
+					}
 				}, 'json' );
+				},
+			},
+			Close: {
+				id: 'stemweb_close_button',
+				text: 'Close',
+				click: function() {
+					$('#stemweb-ui-dialog').dialog('close');
+					switch_stemweb_ui();
+				},
 			},
-			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 = {};
-			$.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 = $('<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').change( function() {
-				var pk = $(this).val();
-				$('#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>') );
+			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
-			$('#stemweb_algorithm').change();
 		},
 		open: function(evt) {
 			$('#stemweb_run_status').empty();
 			$('#stemweb_tradition').attr('value', selectedTextID );
+			if( selectedTextInfo.stemweb_jobid == 0 ) {
+				$('#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 ) {
+    	if( ajaxSettings.url.indexOf( 'stemweb/' ) > -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,