Index: /gs3-installations/mars/trunk/sites/mars/collect/amc-essentia/etc/collectionConfig.xml
===================================================================
--- /gs3-installations/mars/trunk/sites/mars/collect/amc-essentia/etc/collectionConfig.xml	(revision 37028)
+++ /gs3-installations/mars/trunk/sites/mars/collect/amc-essentia/etc/collectionConfig.xml	(revision 37029)
@@ -157,5 +157,5 @@
 	    <xsl:otherwise>
 	      <td valign="top">
-		<gsf:link type="document">
+		<gsf:link type="document" extraLinkArgs="renderWave=0">
 		  <gsf:icon type="document"/>
 		</gsf:link>
@@ -163,5 +163,5 @@
 	      <td>
 	      
-		<gsf:link type="document">
+		<gsf:link type="document" extraLinkArgs="renderWave=0">
 	      	  <gsf:metadata name="amc.title"/>
 		  by <gsf:metadata name="amc.artist"/>
@@ -326,5 +326,5 @@
 			<gsf:template match="documentNode">
 				<td valign="top">
-					<gsf:link type="document">
+					<gsf:link type="document" extraLinkArgs="renderWave=0">
 						<gsf:icon type="document"/>
 					</gsf:link>
@@ -339,5 +339,5 @@
 				</td>
 				<td valign="top">
-				  <gsf:link type="document">
+				  <gsf:link type="document" extraLinkArgs="renderWave=0">
 				        <gsf:choose-metadata>
 					  <gsf:metadata name="dc.Title"/>
@@ -550,5 +550,5 @@
 			  <gsf:script src="{$httpCollection}/js/av_document.js"/>
 
-			  <div id="metadata-documenttext" class="documenttext" style="padding-bottom: 20px; width:100%;">
+			  <div id="metadata-documenttext" class="documenttext" style="padding-bottom: 35px; width:100%;">
 			    <style>
 			      .doc-metadata td { padding: 7px; }
@@ -588,8 +588,30 @@
 			    <div id="ajax-loaded-assocfilepath" style="display: none;"><gsf:metadata name="assocfilepath" pos="first"/></div>
 
+			    <style>
+			      #hide-av-chart {
+			      display: none;
+			      }
+			      
+			      span.display-view-modes, a.display-view-modes {
+			        padding: 5px;
+			      }
+				
+			      .display-view-modes:hover {
+			        background-color: #b0b0b0;
+			      }			      
+			    </style>
 			    
-			    <div style="position: absolute; right: 24px; top: -18px; z-index: 1000; font-size: 90%; font-style:italic">
-			      <a id="switch-to-waveform"    stylexx="display: none;" href="">Switch to Waveform</a>
-			      <a id="switch-to-spectrogram" stylexx="display: none;" href="">Switch to Spectrogram</a>
+			    <div style="position: absolute; right: 24px; top: -23px; z-index: 1000; font-size: 90%; font-styleXX:italic">
+			      <span style="display: inline-block">
+				<a id="switch-to-waveform"    class="display-view-modes" stylexx="display: none;" href="">Switch to Waveform</a>
+				<a id="switch-to-spectrogram" class="display-view-modes" stylexx="display: none;" href="">Switch to Spectrogram</a>
+			      </span>
+			      <span style="display: inline-block; width: 140px;">
+				| <span id="show-av-chart" class="display-view-modes" onclick="return showAVChart();">Display AV Chart</span>
+				  <span id="hide-av-chart" class="display-view-modes" onclick="return hideAVChart();">Hide AV Chart</span>
+			      </span>
+			      <span style="display: inline-block">
+				| <span class="display-view-modes" onclick="alert('To be implemented')">&#x23fa; Record <i>your</i> AV experience</span>
+			      </span>
 			    </div>
 
@@ -669,4 +691,25 @@
 	    
         </div>
+
+
+	<div id="av-chart-outerdiv" style="display: none;">
+	  <hr/>
+	  <div style="width: 500px; margin: auto;">
+	    <div id="av-chart-div" style="position: relative; height: 325px; width: 300px; margin: auto">
+	      <div style="position: absolute; top: 0; left: 0; width: 300px; height: 300px; pointer-events: none;">
+		<canvas id="av-chart-canvas" style="XXwidth: 100%; height: 300px;">
+		  Your browser does not support the canvas element
+		</canvas>
+	      </div>
+	      <img id="av-chart-img" width="300"
+		   style="cursor: crosshair; background-colorXX: #fefefe;"
+		   src="{$library_name}/sites/{$site_name}/collect/{$collName}/images/av-diagram-bw.svg" />
+	      <div>
+		<i>Click inside the Arousal-Valence visualisation above to initiate an AV-based recommendation.</i>
+	      </div>
+	      
+	    </div>
+	  </div>
+	</div>
 	
 	<gsf:variable name="mp3url"><xsl:value-of select="$httpCollection"/>/index/assoc/<xsl:value-of select="$assocFilePath"/>/audio.mp3</gsf:variable>
@@ -762,4 +805,5 @@
 			  </form>
 			  <div>
+			    <!--
 			    <div id="av-chart-div" style="position: relative; height: 325px; width: 300px; float: right; display: none;">
 			      <div style="position: absolute; top: 0; left: 0; width: 300px; height: 300px; pointer-events: none;">
@@ -776,4 +820,5 @@
 
 			    </div>
+			    -->
 			    <div id="resultsAreaDiv" style="padding-top: 1rem; min-height: 325px; display: none;">
 			      <xsl:text> </xsl:text>
Index: /gs3-installations/mars/trunk/sites/mars/collect/amc-essentia/js/av_document.js
===================================================================
--- /gs3-installations/mars/trunk/sites/mars/collect/amc-essentia/js/av_document.js	(revision 37028)
+++ /gs3-installations/mars/trunk/sites/mars/collect/amc-essentia/js/av_document.js	(revision 37029)
@@ -67,5 +67,6 @@
     */
     
-function preSubmit(form) 
+
+function displayClampedCurrentTimeAndAV()
 {
     // Note, the Arousal and Valence feature window values used is:
@@ -75,17 +76,43 @@
     
     // clamp to ensure >= 6.0 secs 
+
     var current_time = Math.max(6.0,wavesurfer.getCurrentTime());
     var current_time_1dp = current_time.toFixed(1);
-    AVEnsurePaused();
-    
-    weka_segment = Math.round(current_time/3) * 3;
-    form.elements["s1.offset"].value = weka_segment;
     
     var arousal_val = parseFloat($('#arousal-val').text());
     var valence_val = parseFloat($('#valence-val').text());
 
-    $('#makeRecommendationFrom-AV').html(`(@${current_time_1dp} secs: arousal=${arousal_val}, valence=${valence_val})`);
-
-    return submitAVRecommendation(form, arousal_val,valence_val, current_time);
+    var arousal_val_str = (arousal_val>0) ? "+"+arousal_val : ""+arousal_val;
+    var valence_val_str = (valence_val>0) ? "+"+valence_val : ""+valence_val;
+    
+    $('#makeRecommendationFrom-AV').html(`(@${current_time_1dp} secs: arousal = ${arousal_val_str}, valence = ${valence_val_str})`);
+
+    return current_time;
+}
+
+function preSubmit(form) 
+{
+    // Note, the Arousal and Valence feature window values used is:
+    //   6 secs + 50% overlap
+    // So the Weka computed AV values are spaced out:
+    //   6s, 9s, 12s, ...
+    
+    // clamp to ensure >= 6.0 secs 
+    //var current_time = Math.max(6.0,wavesurfer.getCurrentTime());
+    //var current_time_1dp = current_time.toFixed(1);
+
+    var clamped_current_time = displayClampedCurrentTimeAndAV();
+    
+    AVEnsurePaused();
+    
+    weka_segment = Math.round(clamped_current_time/3) * 3;
+    form.elements["s1.offset"].value = weka_segment;
+    
+    var arousal_val = parseFloat($('#arousal-val').text());
+    var valence_val = parseFloat($('#valence-val').text());
+
+    //$('#makeRecommendationFrom-AV').html(`(@${current_time_1dp} secs: arousal=${arousal_val}, valence=${valence_val})`);
+
+    return submitAVRecommendation(form, arousal_val,valence_val, clamped_current_time);
 }
 
@@ -176,6 +203,28 @@
 	var new_doc_playervisual_url = new_doc_url_parts[0] + "&excerptid=playervisual-documenttext#" + new_doc_url_parts[1];
 
-	console.log("new doc metadata url = " + new_doc_metadata_url);
-	console.log("new doc playervisual url = " + new_doc_playervisual_url);
+	//console.log("new doc metadata url = " + new_doc_metadata_url);
+	//console.log("new doc playervisual url = " + new_doc_playervisual_url);
+
+
+	// current URL ends with  collect/amc-essentia/document/ds_51017_15513?p.frameOffset=...
+	// Need to remove old '/document/ds_...' and replace with new doc
+	
+	const current_doc_url_str = window.location.href;
+	
+	console.log(current_doc_url_str);
+	var push_doc_url_str = current_doc_url_str.replace(/document\/\w+\?/,"document/"+doc_id+"?");
+	console.log("new doc url str = " + push_doc_url_str);
+	const push_doc_url = new URL(push_doc_url_str);
+	
+	var frameOffset = $av_recommendation.data("frameoffset");		
+	push_doc_url.searchParams.set('p.frameOffset', frameOffset);
+	push_doc_url.searchParams.set('d', doc_id);		
+	window.history.pushState({}, '', push_doc_url);
+	//window.history.replaceState({}, '', push_doc_url);
+
+
+	
+	$('#metadata-documenttext').css("cursor","wait");
+	$('#playervisual-documenttext').css("cursor","wait");
 
 	$.ajax({
@@ -183,4 +232,8 @@
 	    url: new_doc_metadata_url,
 	})
+	    .always(function() {
+		$('#metadata-documenttext').css("cursor","revert");
+	    })
+
 	    .fail(function(jqXHR,textStatus) {
 		console.error( "metadata-documenttext ajax request failed: " + textStatus);
@@ -195,23 +248,11 @@
 	    url: new_doc_playervisual_url,
 	})
+	    .always(function() {
+		$('#playervisual-documenttext').css("cursor","revert");
+	    })
 	    .fail(function(jqXHR,textStatus) {
 		console.error( "playervisual-documenttext equest failed: " + textStatus);
 	    })
 	    .done(function(html_result) {
-		// current URL ends with  collect/amc-essentia/document/ds_51017_15513?p.frameOffset=...
-		// Need to remove old '/document/ds_...' and replace with new doc
-		
-		const current_doc_url_str = window.location.href;
-
-		console.log(current_doc_url_str);
-		var new_doc_url_str = current_doc_url_str.replace(/document\/\w+\?/,"document/"+doc_id+"?");
-		console.log("new doc url str = " + new_doc_url_str);
-		const new_doc_url = new URL(new_doc_url_str);
-		
-		var frameOffset = $av_recommendation.data("frameoffset");		
-		new_doc_url.searchParams.set('p.frameOffset', frameOffset);
-		new_doc_url.searchParams.set('d', doc_id);		
-		window.history.pushState({}, '', new_doc_url);
-		//window.history.replaceState({}, '', new_doc_url);
 		
 		$('#playervisual-documenttext').replaceWith(html_result);
@@ -223,4 +264,6 @@
 		initWavesurferPlayer();
 
+		wavesurfer.seekTo(frameOffset/AMC_SONG_DURATION);
+		
 		postInitWavesurfer(wavesurfer);
 
@@ -229,5 +272,5 @@
 
 	
-	
+	$resultsTable_tr1.slideUp();
 	
 	//var arousal_val = $av_recommendation.data("arousalval");
@@ -341,4 +384,5 @@
 	    recommendFromPos();
 	}
+	displayClampedCurrentTimeAndAV();
     });
 
@@ -353,9 +397,15 @@
 	    //console.log("**** setting play seek @ " + frameOffset);
 	    wavesurfer.seekTo(frameOffset/AMC_SONG_DURATION);
-
-	    console.log("av_document.js keeping 'currentPosRunup' at 0");
+	    recommendFromPos();
+	    displayClampedCurrentTimeAndAV();
+	    
+	    console.log("av_document.js: **** Keeping 'currentPosRunup' at 0 for now!");
 	    /*if (frameOffset>1.0) {
 		currentPosRunup = 1.0; // 1 second
-	    }*/
+		}*/
+	}
+	else {
+	    recommendFromStart();
+	    displayClampedCurrentTimeAndAV();
 	}
     });
@@ -502,4 +552,22 @@
 }
 
+function showAVChart()
+{
+    $('#av-chart-outerdiv').slideDown();
+    $('#show-av-chart').hide();
+    $('#hide-av-chart').show();
+
+    return false;
+}
+
+function hideAVChart()
+{
+    $('#av-chart-outerdiv').slideUp();
+    $('#hide-av-chart').hide();
+    $('#show-av-chart').show();
+
+    return false;
+}
+
 $(document).ready(function() {
 
