source: main/trunk/model-sites-dev/multimodal-mdl/collect/salami-ground-truth/transform/pages/document.xsl@ 28747

Last change on this file since 28747 was 28747, checked in by davidb, 10 years ago

Mime type change to help with future diffs. Could be some other changes, but until the svn property is set, hard to see what they might be
  • Property svn:executable set to *
  • Property svn:mime-type set to text/plain
File size: 30.7 KB
Line 
1<?xml version="1.0" encoding="UTF-8"?>
2<xsl:stylesheet version="1.0"
3 xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
4 xmlns:java="http://xml.apache.org/xslt/java"
5 xmlns:util="xalan://org.greenstone.gsdl3.util.XSLTUtil"
6 xmlns:gslib="http://www.greenstone.org/skinning"
7 xmlns:gsf="http://www.greenstone.org/greenstone3/schema/ConfigFormat"
8 xmlns:xlink="http://www.w3.org/1999/xlink"
9 extension-element-prefixes="java util"
10 exclude-result-prefixes="java util gsf">
11
12
13 <!-- *** -->
14 <!-- Document header -->
15 <!-- *** -->
16
17 <xsl:template name="soundmanager2-header">
18
19 <!-- soundManager2 API -->
20 <gsf:style src="ext/sound-manager2/css/flashblock.css" />
21 <gsf:script src="ext/sound-manager2/script/soundmanager2-nodebug.js"/>
22
23 <!-- The Page player (variant of SoundManger) main script -->
24 <gsf:script src="ext/sound-manager2/script/page-player.js"/>
25 <gsf:style src="ext/sound-manager2/css/page-player.css" />
26
27 <!-- optional: annotations/sub-tracks/notes, and alternate themes -->
28 <gsf:style src="ext/sound-manager2/css/optional-annotations.css" />
29 <gsf:style src="ext/sound-manager2/css/optional-themes.css" />
30
31 <!-- optional: Metadata UI prototype (not needed unless you want the bottom-most demo bits) -->
32 <gsf:script src="ext/sound-manager2/script/optional-page-player-metadata.js"/>
33
34 <gsf:style>
35 ul.playlist li .comment {font-size:0.65em;opacity:0.5}
36 </gsf:style>
37
38 <!-- Customization of page-player for this collection -->
39
40 <gsf:script>
41
42 soundManager.flashVersion = 9;
43 soundManager.preferFlash = true; /* for visualization effects */
44 soundManager.useHighPerformance = true; /* keep flash on screen, boost performance */
45 soundManager.wmode = "transparent"; /* transparent SWF, if possible */
46 soundManager.useFastPolling = true; /* increased JS callback frequency */
47 soundManager.url = "ext/sound-manager2/swf/";
48
49 /* custom page player configuration */
50
51 var PP_CONFIG = {
52 autoStart: false, /* begin playing first sound when page loads */
53 playNext: false, /* stop after one sound, or play through list until end */
54 useThrottling: false, /* try to rate-limit potentially-expensive calls (eg. dragging position around) */
55 usePeakData: true, /* [Flash 9 only] whether or not to show peak data (left/right channel values) - nor noticable on CPU */
56 useWaveformData: false, /* [Flash 9 only] show raw waveform data - WARNING: LIKELY VERY CPU-HEAVY */
57 useEQData: false, /* [Flash 9 only] show EQ (frequency spectrum) data */
58 useFavIcon: false, /* try to apply peakData to address bar (Firefox + Opera) - performance note: appears to make Firefox 3 do some temporary, heavy disk access/swapping/garbage collection at first(?) - may be too heavy on CPU */
59 useMovieStar: true /* Flash 9.0r115+ only: Support for a subset of MPEG4 formats. */
60 }
61 </gsf:script>
62 </xsl:template>
63
64
65 <!-- CAA = Content Analysis Algorithm -->
66 <xsl:variable name="cgiargCAAlgorithm">
67 <xsl:choose>
68 <xsl:when test="/page/pageRequest/paramList/param[@name='p.caAlgorithm']/@value != ''"><xsl:value-of select="/page/pageRequest/paramList/param[@name='p.caAlgorithm']/@value"/></xsl:when>
69 <xsl:otherwise>1</xsl:otherwise>
70 </xsl:choose>
71 </xsl:variable>
72
73 <!-- *** -->
74 <!-- The Javascript DSP files for computing chroma features in the browser -->
75 <!-- *** -->
76
77 <xsl:template name="javascript-dsp-header">
78 <gsf:script src="ext/js-dsp/dsp-custom.js"/>
79 <gsf:script src="ext/js-dsp/chroma-transform.js"/>
80 <gsf:script src="ext/js-dsp/frequency-plotter.js"/>
81 <gsf:script src="ext/js-dsp/frequency-player.js"/>
82
83
84 <gsf:script src="ext/js-dsp/component/crockford-inheritance.js"/>
85 <gsf:script src="ext/js-dsp/component/workflow-core.js"/>
86 <gsf:script src="ext/js-dsp/component/audio-mixer.js"/>
87 <gsf:script src="ext/js-dsp/component/wf-freq-spectrum.js"/>
88 <gsf:script src="ext/js-dsp/component/wf-filter-bank.js"/>
89 <gsf:script src="ext/js-dsp/component/wf-chroma-transform.js"/>
90 <gsf:script src="ext/js-dsp/component/active-workflow.js"/>
91
92 </xsl:template>
93
94 <xsl:template name="processingPopup">
95 <div>
96 <style type="text/css">
97 #processing {
98 width: 100%;
99 height: 100%;
100 position: absolute;
101 z-index: 10;
102 left: 0px;
103 top: 0px;
104 background-color: rgba(255,255,255,0.75);
105 opacity: 1;
106 display: none;
107 }
108
109 #processingMessage {
110 position: absolute;
111 padding: 10px;
112 border-radius: 10px;
113 margin-left: 50%;
114 width: 380px;
115 height: 105px;
116 left: -250px; top: 200px;
117 background-color: rgba(255,255,255,1);
118 box-shadow: 0px 0px 30px rgba(0,0,0,0.8);
119 }
120
121 #processingMessage p {
122 font-size: 18px;
123 text-align: center;
124 font-family:
125 sans-serif;
126 font-weight: bold;
127 color: #666;
128 }
129 </style>
130
131 <div id="processing">
132 <div id="processingMessage">
133 <h2 id="processingTitle" class="ui-state-default ui-corner-all" style="padding: 8px; font-size: 110%; width: auto;">
134 Heading
135 </h2>
136 <p id="processingText">text</p>
137 </div>
138 </div>
139 </div>
140
141 </xsl:template>
142
143 <!-- *** -->
144 <!-- * Discovery -->
145 <!-- *** -->
146
147 <xsl:template name="discovery-block">
148
149 <div id="fingerprint-turnstyle">
150
151 <div style="background-image: none; background-color: rgb(80%,80%,20%);">
152 Discovery: <xsl:call-template name="choose-title"/>
153 </div>
154
155 <div class="documenttext" style="display: none;">
156 <xsl:call-template name="fingerprintMetadataBlock" />
157 </div>
158
159 </div>
160
161 <script>
162 <xsl:text disable-output-escaping="yes">
163 $(function(){
164 transformToTurnstyleBlock("fingerprint");
165 });
166 </xsl:text>
167 </script>
168
169 </xsl:template>
170
171 <xsl:template name="fingerprintMetadataBlock">
172
173 <xsl:variable name="httpCollection"><xsl:value-of select="/page/pageResponse/collection/metadataList/metadata[@name='httpPath']"/></xsl:variable>
174 <xsl:variable name="assocFilePath"><gsf:metadata name="assocfilepath" select="root"/></xsl:variable>
175
176
177 <xsl:variable name="musicbrainzsongid">
178 <gsf:metadata name="dc.Identifier.musicbrainzsongid"/>
179 </xsl:variable>
180
181 <xsl:variable name="musicbrainzalbumid">
182 <gsf:metadata name="dc.Source.musicbrainzalbumid"/>
183 </xsl:variable>
184
185 <xsl:variable name="musicbrainzartistid">
186 <gsf:metadata name="dc.Creator.musicbrainzartistid"/>
187 </xsl:variable>
188
189 <xsl:variable name="lastfmtrackurl">
190 <gsf:metadata name="dc.Identifier.lastfmtrackurl"/>
191 </xsl:variable>
192
193 <xsl:variable name="echonestsongid">
194 <gsf:metadata name="dc.Identifier.echonestsongid"/>
195 </xsl:variable>
196
197 <table class="metadata-stripes">
198 <tbody>
199 <tr>
200 <td>
201 Title
202 </td>
203 <td>
204 <gsf:metadata name="dc.Title"/>
205 </td>
206 </tr>
207
208 <tr>
209 <td>Album Title</td>
210 <td><gsf:metadata name="dc.Title.albumtitle"/></td>
211 </tr>
212
213 <tr>
214 <td>Artist</td>
215 <td><gsf:metadata name="dc.Creator"/></td>
216 </tr>
217
218 <tr valign="top">
219 <td>Artist Summary</td>
220 <td>
221 <i>
222 <gsf:script>
223 var summary = gs.documentMetadata["LastFM_LastFMArtistWikiSummary"];
224
225 document.write(summary.replace("\n","&lt;br /&gt;"));
226 </gsf:script>
227 </i>
228 </td>
229
230 </tr>
231
232<!--
233dc.Identifier.echonestsongid
234dc.Identifier.echonestartistid
235
236dc.Identifier.lastfmtrackurl
237dc.Identifier.lastfmalbumurl
238dc.Identifier.lastfmartisturl
239
240//dc.Identifier
241dc.Identifier.musicbrainzalbumid
242dc.Identifier.musicbrainzartistid
243dc.Identifier.musicbrainzsongid
244dc.Identifier.playmeartistid
245
246-->
247
248 <tr>
249 <td colspan="2">
250
251 <xsl:for-each select="/page/pageResponse/document/metadataList/metadata[@name = 'dc.Relation.artistrelatedimage']">
252 <xsl:if test="position() &lt;= 6">
253 <a target="_blank">
254 <xsl:attribute name='href'>
255 <xsl:value-of disable-output-escaping="yes" select="."/>
256 </xsl:attribute>
257
258 <img width="150">
259 <xsl:attribute name='src'>
260 <xsl:value-of disable-output-escaping="yes" select="."/>
261 </xsl:attribute>
262 </img>
263 </a>
264 </xsl:if>
265 </xsl:for-each>
266 </td>
267 </tr>
268
269 <tr>
270 <td>Linked Data</td>
271 <td>
272 <!--
273 <gsf:metadata name="dc.Identifier"/><br />
274 -->
275
276 <table style="width: 100%;">
277 <tr>
278 <td style="width: 200px;">
279 MusicBrainz song id:
280 </td>
281 <td>
282 <a href="http://dbtune.org/musicbrainz/resource/track/{$musicbrainzsongid}" target="#musicbrainz" class="external">
283 <xsl:copy-of select="$musicbrainzsongid"/>
284 </a>
285 </td>
286 </tr>
287
288 <tr>
289 <td>
290 MusicBrainz album id:
291 </td>
292 <td>
293 <a href="http://dbtune.org/musicbrainz/resource/record/{$musicbrainzalbumid}" target="#musicbrainz" class="external">
294 <xsl:copy-of select="$musicbrainzalbumid"/>
295 </a>
296 </td>
297 </tr>
298
299 <tr>
300 <td>
301 MusicBrainz artist id:
302 </td>
303 <td>
304 <a href="http://dbtune.org/musicbrainz/page/artist/{$musicbrainzartistid}" target="#musicbrainz" class="external">
305 <xsl:copy-of select="$musicbrainzartistid"/>
306 </a>
307 </td>
308 </tr>
309 <tr>
310 <td>
311 EchoNest song id:
312 </td>
313 <td>
314 <a href="http://developer.echonest.com/api/v4/song/profile?api_key=8WNR9XTGCODO9G4YG&amp;format=xml&amp;id={$echonestsongid}" target="#echonestsongid" class="external">
315
316
317
318 <xsl:copy-of select="$echonestsongid"/>
319 </a>
320 </td>
321 </tr>
322 <tr>
323 <td colspan="2">
324 <i>
325 <a href="{$lastfmtrackurl}" target="#lastfm" class="external">
326 <xsl:copy-of select="$lastfmtrackurl"/>
327 </a>
328 </i>
329 </td>
330 </tr>
331 </table>
332
333 </td>
334 </tr>
335
336
337 </tbody>
338 </table>
339 </xsl:template>
340
341
342
343 <!-- *** -->
344 <!-- * Audio Player -->
345 <!-- *** -->
346
347
348 <xsl:template name="js-mad-header">
349
350 <gsf:script src="ext/js-mad/script/mad.js"/>
351 <gsf:script src="ext/js-mad/script/rq_table.js"/>
352 <gsf:script src="ext/js-mad/script/imdct_s.js"/>
353 <gsf:script src="ext/js-mad/script/huffman.js"/>
354 <gsf:script src="ext/js-mad/script/bit.js"/>
355 <gsf:script src="ext/js-mad/script/stream.js"/>
356 <gsf:script src="ext/js-mad/script/layer3.js"/>
357 <gsf:script src="ext/js-mad/script/frame.js"/>
358 <gsf:script src="ext/js-mad/script/synth.js"/>
359
360 <gsf:script src="ext/js-mad/script/arraybuffer/bytestream.js"/>
361 <gsf:script src="ext/js-mad/script/arraybuffer/filestream.js"/>
362 <gsf:script src="ext/js-mad/script/arraybuffer/substream.js"/>
363 <gsf:script src="ext/js-mad/script/arraybuffer/arraystream.js"/>
364 <gsf:script src="ext/js-mad/script/arraybuffer/ajaxstream.js"/>
365
366 <gsf:script src="ext/js-mad/script/binarystring/bytestream.js"/>
367 <gsf:script src="ext/js-mad/script/binarystring/filestream.js"/>
368 <gsf:script src="ext/js-mad/script/binarystring/substream.js"/>
369 <gsf:script src="ext/js-mad/script/binarystring/stringstream.js"/>
370 <gsf:script src="ext/js-mad/script/binarystring/ajaxstream.js"/>
371
372 <gsf:script src="ext/js-mad/script/id3v22stream.js"/>
373 <gsf:script src="ext/js-mad/script/id3v23stream.js"/>
374 <gsf:script src="ext/js-mad/script/mp3file.js"/>
375
376<!--
377 <gsf:script src="ext/js-mad/script/player.js"/>
378-->
379
380 <gsf:script src="ext/js-mad/script/sink.min.js"/>
381
382<!--
383 <gsf:script src="ext/js-mad/script/require.js"/>
384-->
385<!--
386 <gsf:script src="ext/js-mad/script/sink-light.js"/>
387-->
388
389 <gsf:script src="ext/js-mad/script/browser-detect.js"/>
390 <gsf:script src="ext/js-mad/script/main-jsmad.js"/>
391
392 </xsl:template>
393
394
395 <xsl:template name="audio-icon-cache">
396 <div style="display:none;">
397 <!-- pre-load various play/pause images to help with speed of interface update -->
398 <img src="ext/diy-audio-player/images/play32Highlight.png" />
399 <img src="ext/diy-audio-player/images/pause32.png" />
400 <img src="ext/diy-audio-player/images/pause32Highlight.png" />
401 <img src="ext/diy-audio-player/images/play20Highlight.png" />
402 <img src="ext/diy-audio-player/images/stop32.png" />
403 <img src="ext/diy-audio-player/images/stop32Highlight.png" />
404 <img src="ext/diy-audio-player/images/search20Highlight.png" />
405 </div>
406 </xsl:template>
407
408
409 <!-- *** -->
410 <!-- * Workflow control -->
411 <!-- *** -->
412
413 <xsl:template name="workflow-block">
414 <xsl:variable name="httpCollection">
415 <xsl:value-of select="/page/pageResponse/collection/metadataList/metadata[@name='httpPath']"/>
416 </xsl:variable>
417
418 <div id="workflow-turnstyle">
419
420 <div style="background-image: none; background-color: rgb(80%,80%,20%);">
421 Workflow
422 </div>
423
424 <div class="documenttext hide" style="color: white; background-color: rgb(40%,40%,20%); padding: 8px;">
425
426<!--
427 <form style="padding-left: 8px;">
428 <span class="vis-heading">Input Selection:</span>
429 <input type="radio" name="inputSelection" onclick="setInputSelectionMode(this)" value="left"/>Left only
430 <input type="radio" name="inputSelection" onclick="setInputSelectionMode(this)" value="right"/>Right only
431 <input type="radio" name="inputSelection" onclick="setInputSelectionMode(this)" value="diff"/>Average
432 <input type="radio" name="inputSelection" onclick="setInputSelectionMode(this)" value="mix" checked="checked"/>Difference
433 </form>
434 <hr/>
435-->
436
437 <form style="padding-left: 8px; height: 48px;">
438 <span class="vis-heading" style="padding-right: 10px" >Meandre Workflow:</span>
439
440 <select id="meandre-workflow-pos" onChange="loadSelectedWorkflow(this)" style="font-size: 90%; padding 8px;">
441 <option value="0" selected="selected">Chromagram</option>
442 <option value="1" >Dynamic Javascript Mixer</option>
443 </select>
444
445 <div style="float: right;" id="meandre-buttons">
446
447 <button type="button" id="meandre-run-button"
448 onclick="selectedMeandreWorkflow.runThisMeandreFlow(this)">
449 <img id="meandre-run-button" src="ext/diy-audio-player/images/play32.png"
450 width="32"
451 height="32"
452 XXonmouseover="playHighlightOn(this)"
453 XXonmouseout="playHighlightOff(this)"
454 XXonclick="runThisMeandreFlow(this)"
455 style="vertical-align: middle;"/>
456 Run
457 </button>
458
459 <button type="button" id="meandre-stop-button" onclick="selectedMeandreWorkflow.stopThisMeandreFlow(this)" disabled="disabled">
460 <img id="meandre-stop-button" src="ext/diy-audio-player/images/stop32.png"
461 width="32"
462 height="32"
463 XXonmouseover="stopHighlightOn(this)"
464 XXonmouseout="stopHighlightOff(this)"
465 XXonclick="stopThisMeandreFlow(this)"
466 style="vertical-align: middle;"/>
467 Stop
468 </button>
469
470<!--
471 <button type="button" id="meandre-run-button" onclick="runThisMeandreFlow(this)" >Run</button>
472 <button type="button" id="meandre-stop-button" onclick="stopThisMeandreFlow(this)" disabled="disabled">Stop</button>
473-->
474
475 </div>
476
477 </form>
478
479 <style>
480 #meandre-buttons button:hover:enabled {
481 background-color: #CCCC33;
482 color: #FFFFFF;
483 }
484 </style>
485
486
487 <div style="position: relative;">
488 <iframe id="workbenchFrame"
489 style="width: 100%; height: 400px;" >
490 If you see this, then your browser does not support the iframe element.
491 </iframe>
492
493 </div>
494
495 <gsf:script src="{$httpCollection}/script2/meandre-workflow/chromagram.js"/>
496 <gsf:script src="{$httpCollection}/script2/meandre-workflow/js-dynamic-mix.js"/>
497
498 <gsf:script>
499 var chromagramMeandreWorkflow = new ChromagramMeandreWorkflow();
500 var jsDynamicMixMeandreWorkflow = new JSDynamicMixMeandreWorkflow();
501
502 var meandreWorkflows = [ chromagramMeandreWorkflow, jsDynamicMixMeandreWorkflow ];
503
504 var selectedMeandreWorkflowPos =$('#meandre-workflow-pos option:selected').val();
505 var selectedMeandreWorkflow = meandreWorkflows[selectedMeandreWorkflowPos];
506
507 selectedMeandreWorkflow.meandreController.loadWorkbench( "workbenchFrame",selectedMeandreWorkflowPos);
508
509 function loadSelectedWorkflow(elem) {
510 selectedMeandreWorkflowPos = elem.value;
511 selectedMeandreWorkflow = meandreWorkflows[selectedMeandreWorkflowPos];
512
513 if (selectedMeandreWorkflowPos==1) {
514 $('#jsdynamic-turnstyle').show();
515 }
516 else {
517 $('#jsdynamic-turnstyle').hide();
518 }
519
520 console.info("Loading in new Meandre workbench flow (pos=" + selectedMeandreWorkflowPos+ ")");
521 selectedMeandreWorkflow.meandreController.loadWorkbench("workbenchFrame",selectedMeandreWorkflowPos);
522
523 }
524 </gsf:script>
525
526
527
528
529 <div id="jsdynamic-turnstyle" style="display:none">
530
531 <div style="background-image: none; background-color: rgb(80%,80%,20%);">
532 Dynamic Javascript Meandre Component
533 </div>
534
535 <div class="documenttext hide" style="color: white; background-color: rgb(40%,40%,20%); padding: 8px;">
536
537 <textarea id="js-dynamic-code" style="width:100%; height: 520px; font-size: 90%">
538 <xsl:text disable-output-escaping="yes">
539
540
541var arrayBinding = new JavaImporter(java.lang.reflect.Array);
542
543var JSDynamicComponent = function() {
544 this.frameCount = 0;
545}
546
547JSDynamicComponent.prototype.executeCallBack = function(cc) {
548
549 with(arrayBinding) {
550
551 if ((this.frameCount % 1000)==0) {
552 print("JSDynamicComponent: " + this.frameCount + "\n");
553 }
554
555 var inputObject = cc.getDataComponentFromInput("input");
556 var rawInput1DArray = inputObject;
557
558 var rawOutput1DArray = Array.newInstance(java.lang.Double.TYPE, rawInput1DArray.length);
559
560 for (var i=1; i&lt;rawOutput1DArray.length; i++) {
561 var diff = Array.getDouble(rawInput1DArray,i) - Array.getDouble(rawInput1DArray, i-1);
562 Array.setDouble(rawOutput1DArray,i,diff);
563 }
564
565 cc.pushDataComponentToOutput("output", rawOutput1DArray);
566
567 this.frameCount++;
568 }
569
570}
571
572var jsDynamicComponent = new JSDynamicComponent();
573
574 </xsl:text>
575 </textarea>
576 </div> <!-- end of Dynamic JS turnstyle block -->
577 </div>
578
579 </div>
580
581 </div>
582
583 <script>
584 <xsl:text disable-output-escaping="yes">
585 $(function(){
586 transformToTurnstyleBlock("workflow");
587 transformToTurnstyleBlock("jsdynamic");
588 });
589 </xsl:text>
590 </script>
591 </xsl:template>
592
593
594 <!-- *** -->
595 <!-- * Structured audio player -->
596 <!-- *** -->
597
598 <xsl:template name="structuredAudioPlayerBlock">
599
600 <gsf:script src="ext/diy-audio-player/script/structured-audio-play.js"/>
601
602 <div style="background-color: rgb(40%,40%,20%)">
603 <svg xmlns="http://www.w3.org/2000/svg"
604 xmlns:xlink="http://www.w3.org/1999/xlink"
605 version="1.1"
606 id="svgGroundTruthSegments"
607 width="100%" height="24"
608 onLoadXX="svgGTStructuredInit()">
609 </svg>
610 </div>
611
612 <div style="background-color: rgb(40%,40%,20%)">
613 <svg xmlns="http://www.w3.org/2000/svg"
614 xmlns:xlink="http://www.w3.org/1999/xlink"
615 version="1.1"
616 id="svgContentAnalysisSegments"
617 width="100%" height="24"
618 onLoad="svgCAStructuredInit({$cgiargCAAlgorithm})">
619 </svg>
620 </div>
621
622
623 <!-- **** now back in -->
624
625 <form id="UpdateCAForm" name="UpdateCAForm" method="get" action="{$library_name}"
626 style="display: block; background-color: #dddddd; padding: 6px;">
627 <div style="font-style: italics;">
628
629 Show the song structure automatically computed by analyzing
630 the audio data using algorithm:
631<!--
632 <select id="caaMenu" name="caAlgorithm">
633 <option value="1">BV1</option>
634 <option value="2">BV2</option>
635 <option value="3">GP7</option>
636 <option value="4">MHRAG2</option>
637 <option value="5">MND1</option>
638 <option value="6">WB1</option>
639-->
640<!--
641 <option value="-1">or hide</option>
642-->
643<!--
644 </select>:
645-->
646
647 <select id="caaMenu" name="caAlgorithm" onchange="updateCAAlgorithm()">
648 <xsl:for-each select="/page/pageResponse/document/metadataList/metadata[@name = 'json.seriesName']">
649 <option>
650 <xsl:attribute name='value'>
651 <xsl:value-of disable-output-escaping="yes" select="position()"/>
652 </xsl:attribute>
653 <xsl:if test="position() = $cgiargCAAlgorithm">
654 <xsl:attribute name='selected'>selected</xsl:attribute>
655 </xsl:if>
656 <xsl:value-of disable-output-escaping="yes" select="."/>
657 </option>
658 </xsl:for-each>
659 </select>
660
661 <gsf:foreach-metadata name="json.seriesData">
662 <gsf:variable2 name="seriesData"><xsl:value-of disable-output-escaping="yes" select="."/></gsf:variable2>
663 <gsf:variable name="seriesPos"><xsl:value-of disable-output-escaping="yes" select="position()"/></gsf:variable>
664
665 <gsf:script>
666 var cleanedSeriesData = gs.variables.seriesData.replace(/\\n/g,"").replace(/\n/g," ");
667 cleanedSeriesData = cleanedSeriesData.replace(/\"\".*?\"\"/g,"\"$1\"").replace(/;$/,"");
668 //console.log("cleaned data = " + cleanedSeriesData);
669 allData[gs.variables.seriesPos] = JSON.parse(cleanedSeriesData);
670 </gsf:script>
671 </gsf:foreach-metadata>
672
673<!--
674
675 <input type="button" name="Reload" value="Reload"
676 onclick="updateCAAlgorithm()" />
677-->
678
679
680
681 </div>
682 </form>
683
684 </xsl:template>
685
686 <xsl:template name="visualization-mode-block">
687
688 <div class="documenttext" style="color: white; background-color: rgb(40%,40%,20%); padding-top: 4px;">
689
690 <span class="vix-heading">Max Values:</span>
691 <div style="padding-left: 8px">
692 <style>
693 span.mv-fixed { display: inline-block; width: 30pt; }
694 </style>
695 <table width="100%">
696 <tr>
697 <td><span class="mv-fixed" id="freqSpectrumMax" >0.000</span>(Freq Spectrum) </td>
698 <td><span class="mv-fixed" id="freqPowerSpectrumMax">0.000</span>(Freq Power Spectrum) </td>
699 <td><span class="mv-fixed" id="filterBankMax" >0.000</span>(Filter Bank) </td>
700 <td><span class="mv-fixed" id="chromaFeaturesMax" >0.000</span>(Chroma Features) </td>
701 </tr>
702 </table>
703 </div>
704 <hr/>
705
706 <form style="padding-left: 8px; padding-right: 8px; padding-bottom: 0px;">
707 <div style="float: left;">
708 <span class="vis-heading">Visualization:</span>
709<!--
710 <input type="radio" name="visualization" onclick="setTransformMode(this)" value="freqSpectrum" />Frequency Spectrum
711 <input type="radio" name="visualization" onclick="setTransformMode(this)" value="freqPowerSpectrum"/>Frequency Power Spectrum
712-->
713
714 <input type="radio" name="visualization" onclick="setTransformMode(this)" value="filterBank"/>Filter Bank
715 <input type="radio" name="visualization" onclick="setTransformMode(this)" value="chromaFeatures" checked="checked"/>Chroma Features
716 </div>
717
718 <div style="float: left; padding-left: 140px;">
719 <span class="vis-heading">Colour Mapping:</span>
720 <input type="radio" name="colorMapping" onclick="setColorMappingMode(this)" value="rgb"/>RGB Intensity
721 <input type="radio" name="colorMapping" onclick="setColorMappingMode(this)" value="hsl" checked="checked"/>HSL Heat
722 </div>
723 </form>
724
725 <div style="clear: both; padding-top: 4px; padding-bottom: 4px;"><hr/></div>
726
727<!--
728 <form style="padding-left: 8px;">
729 <span class="vis-heading">Colour Mapping:</span>
730 <input type="radio" name="colorMapping" onclick="setColorMappingMode(this)" value="rgb"/>RGB Intensity
731 <input type="radio" name="colorMapping" onclick="setColorMappingMode(this)" value="hsl" checked="checked"/>HSL Heat Map
732 </form>
733 <hr/>
734-->
735
736 <form style="padding-left: 8px; padding-bottom: 0px;">
737 <div style="float: left;">
738 <span class="vis-heading">On Pause:</span>
739 <input type="checkbox" name="similarityMatrix" onclick="plotSimilarityMatrixWhenPaused(this)"/>Show Similarity Matrix
740 </div>
741 <div style="float: left; padding-left: 140px;">
742 <span class="vis-heading">Accelerated Processing:</span>
743 <input type="checkbox" name="acceleratedProcessingInput" onclick="acceleratedProcessingCheckbox(this)"/>&gt; realtime
744 <span id="accProcStatus"></span>
745 </div>
746
747 </form>
748 <div style="clear: both; padding-top: 4px; padding-bottom: 4px;"><hr/></div>
749
750 </div>
751
752 </xsl:template>
753
754 <!-- *** -->
755 <!-- * Settings form -->
756 <!-- *** -->
757
758 <xsl:template name="settings-form">
759 <xsl:param name="cgiargYScaleSimImg"/>
760
761 <xsl:variable name="httpCollection">
762 <xsl:value-of select="/page/pageResponse/collection/metadataList/metadata[@name='httpPath']"/>
763 </xsl:variable>
764
765 <div id="settings-turnstyle" style="margin: 6px;">
766 <div style="background-image: none; background-color: rgb(80%,80%,20%);">
767 Audio Content Search
768 </div>
769 <div class="documenttext" style="display: none;">
770
771
772 <form id="QueryForm" name="QueryForm" method="get" action="{$library_name}">
773 <input type="hidden" name="a" value="q"/>
774 <input type="hidden" name="sa"><xsl:attribute name="value"><xsl:value-of select="/page/pageRequest/@subaction"/></xsl:attribute></input>
775 <input type="hidden" name="rt" value="rd"/>
776
777 <input type="hidden" name="s" value="AudioQuery"/>
778 <input type="hidden" name="c" value="{$collName}"/>
779 <xsl:if test="not(paramList/param[@name='startPage'])">
780 <input type="hidden" name="startPage" value="1"/>
781 </xsl:if>
782 <xsl:choose>
783 <xsl:when test="/page/pageRequest/paramList/param[@name = 's1.maxDocs']">
784 <input type="hidden" name="s1.maxDocs">
785 <xsl:attribute name="value">
786 <xsl:value-of select="/page/pageRequest/paramList/param[@name = 's1.maxDocs']/@value"/>
787 </xsl:attribute>
788 </input>
789 </xsl:when>
790 <xsl:otherwise>
791 <input type="hidden" name="s1.maxDocs" value="100"/>
792 </xsl:otherwise>
793 </xsl:choose>
794 <xsl:choose>
795 <xsl:when test="/page/pageRequest/paramList/param[@name = 's1.hitsPerPage']">
796 <input type="hidden" name="s1.hitsPerPage">
797 <xsl:attribute name="value">
798 <xsl:value-of select="/page/pageRequest/paramList/param[@name = 's1.hitsPerPage']/@value"/>
799 </xsl:attribute>
800 </input>
801 </xsl:when>
802 <xsl:otherwise>
803 <input type="hidden" name="s1.hitsPerPage" value="20"/>
804 </xsl:otherwise>
805 </xsl:choose>
806
807 <input type="hidden" name="q">
808 <xsl:attribute name="value"><xsl:value-of select="/page/pageResponse/document/documentNode/@nodeID"/>.dir</xsl:attribute>
809 </input>
810
811
812 <input type="hidden" name="s1.query">
813<!--
814 <xsl:attribute name="value"><xsl:value-of select="/page/pageResponse/document/documentNode/@nodeID"/>.dir</xsl:attribute>
815-->
816 <xsl:attribute name="value"><xsl:value-of select="/page/pageResponse/document/@nodeID"/>.dir</xsl:attribute>
817 </input>
818
819 <input type="hidden" name="s1.offset" value="0" />
820 <input type="hidden" name="s1.length" value="200" />
821
822 <div style="font-style: italics;">Start new query @ offset
823 <span id="mysongCurrentPos">0 secs</span>,
824 with excerpt lasting
825
826 <input type="text" name="mysongWindowDuration" size="4" value="6" />
827 <!--
828 <span id="mysongWindowDuration" class="editable-offset"
829 style="cursor: pointer; border: 1px solid black; padding: 3px; width: 200px; min-width: 200px;">6.0</span>
830 -->
831 secs:
832
833 <input type="submit" value="Search" onclick="preSubmit(this.form);" />
834 </div>
835
836
837 <ul style="font-size: 80%; margin-top: 8px; font-style: italics;" >
838 <li>Use the <b>Play all of</b> bar to get to the part of the song you are interested in.</li>
839 <li>... the <b>query @ offset</b> value will change accordingly as the song progresses.</li>
840 <li>Click <b>pause</b> (anywhere outside of the time-line) to mark the spot you want to start the new music query.</li>
841 <li>Optionally click on the <b>excerpt lasting</b> value and edit, if you want to change the length of excerpt used in the match.</li>
842 <li>Finally, click the <b>Search</b> button to initiate the new query.</li>
843 </ul>
844
845 </form>
846
847 <hr/>
848
849<!--
850 <form id="RescaleForm" name="RescaleForm" method="get" action="{$library_name}">
851 <div style="font-style: italics;">
852 Make the scale factor for the y-dimension of the self-similarity
853 image be
854 <input type="text" name="ResizeScale" value="{$cgiargYScaleSimImg}"
855 size="3" /> then
856 <input type="button" name="ResizeImage" value="Resize Image"
857 onclick="javascript:rescaleImage()" />
858
859 </div>
860 </form>
861
862 <hr/>
863-->
864
865 <script>
866 <xsl:text disable-output-escaping="yes">
867 if (hasStructuredAudio) {
868 var caaMenu = document.getElementById("caaMenu");
869 caaMenu.options[caAlgorithm-1].selected = 1;
870 }
871 </xsl:text>
872 </script>
873
874
875 </div>
876 </div>
877 <script>
878 <xsl:text disable-output-escaping="yes">
879 $(function(){
880 transformToTurnstyleBlock("settings");
881 });
882 </xsl:text>
883 </script>
884
885 </xsl:template>
886
887
888 <!-- *** -->
889 <!-- * Computed Data -->
890 <!-- *** -->
891
892
893 <xsl:template name="computed-data">
894 <xsl:param name="httpCollection"/>
895 <xsl:param name="assocFilePath"/>
896
897 <div id="computed-turnstyle" style="margin: 6px;">
898 <div style="background-image: none; background-color: rgb(80%,80%,20%);">
899 Computed Data
900 </div>
901
902 <div class="documenttext" style="display: none;">
903 <table class="metadata-stripes" style="width: 100%">
904 <tbody>
905 <tr>
906 <td>jAudio Features</td><td><a href="{$httpCollection}/index/assoc/{$assocFilePath}/jaudio.xml">download ACE XML feature values file</a></td>
907 </tr>
908
909 <tr>
910 <td>jSongMiner Metadata</td><td><a href="{$httpCollection}/index/assoc/{$assocFilePath}/jsongminer.xml">download ACE XML classifications file</a></td>
911 </tr>
912
913 </tbody>
914 </table>
915 </div>
916 </div>
917
918 <gsf:script>
919 $(function(){
920 transformToTurnstyleBlock("computed");
921 });
922 </gsf:script>
923
924<!--
925
926 <div id="original-turnstyle" style="margin: 6px;">
927 <div style="background-image: none; background-color: rgb(80%,80%,20%);">
928 The Original Audio
929 </div>
930
931 <div style="display: none;">
932
933 <div>
934 <audio style="width: 100%;" id="original-audio" controls="controls" >
935 <source src="{$httpCollection}/index/assoc/{$assocFilePath}/doc.ogg" />
936 <source src="{$httpCollection}/index/assoc/{$assocFilePath}/doc.mp3" />
937 <source src="{$httpCollection}/index/assoc/{$assocFilePath}/doc.wav" />
938 </audio>
939 </div>
940
941 </div>
942 </div>
943
944 <gsf:script>
945 $(function(){
946 transformToTurnstyleBlock("original");
947 });
948 </gsf:script>
949-->
950
951 </xsl:template>
952
953</xsl:stylesheet>
Note: See TracBrowser for help on using the repository browser.