source: main/trunk/model-sites-dev/multimodal-mdl/collect/js-dsp-my-ipod/transform/pages/document.xsl@ 28433

Last change on this file since 28433 was 28433, checked in by davidb, 11 years ago

Further collections to add to the set
  • Property svn:executable set to *
  • Property svn:mime-type set to application/xml
File size: 28.5 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><i><gsf:metadata name="LastFM.LastFMArtistWikiSummary"/></i></td>
221 </tr>
222
223<!--
224dc.Identifier.echonestsongid
225dc.Identifier.echonestartistid
226
227dc.Identifier.lastfmtrackurl
228dc.Identifier.lastfmalbumurl
229dc.Identifier.lastfmartisturl
230
231//dc.Identifier
232dc.Identifier.musicbrainzalbumid
233dc.Identifier.musicbrainzartistid
234dc.Identifier.musicbrainzsongid
235dc.Identifier.playmeartistid
236
237-->
238
239 <tr>
240 <td colspan="2">
241
242 <xsl:for-each select="/page/pageResponse/document/metadataList/metadata[@name = 'dc.Relation.artistrelatedimage']">
243 <xsl:if test="position() &lt;= 6">
244 <a target="_blank">
245 <xsl:attribute name='href'>
246 <xsl:value-of disable-output-escaping="yes" select="."/>
247 </xsl:attribute>
248
249 <img width="150">
250 <xsl:attribute name='src'>
251 <xsl:value-of disable-output-escaping="yes" select="."/>
252 </xsl:attribute>
253 </img>
254 </a>
255 </xsl:if>
256 </xsl:for-each>
257 </td>
258 </tr>
259
260 <tr>
261 <td>Linked Data</td>
262 <td>
263 <!--
264 <gsf:metadata name="dc.Identifier"/><br />
265 -->
266
267 <table>
268 <tr>
269 <td>
270 MusicBrainz song id:
271 </td>
272 <td>
273 <a href="http://dbtune.org/musicbrainz/resource/track/{$musicbrainzsongid}" target="#musicbrainz">
274 <xsl:copy-of select="$musicbrainzsongid"/>
275 </a>
276 </td>
277 </tr>
278
279 <tr>
280 <td>
281 MusicBrainz album id:
282 </td>
283 <td>
284 <a href="http://dbtune.org/musicbrainz/resource/record/{$musicbrainzalbumid}" target="#musicbrainz">
285 <xsl:copy-of select="$musicbrainzalbumid"/>
286 </a>
287 </td>
288 </tr>
289
290 <tr>
291 <td>
292 MusicBrainz artist id:
293 </td>
294 <td>
295 <a href="http://dbtune.org/musicbrainz/page/artist/{$musicbrainzartistid}" target="#musicbrainz">
296 <xsl:copy-of select="$musicbrainzartistid"/>
297 </a>
298 </td>
299 </tr>
300 <tr>
301 <td colspan="2">
302 <a href="{$lastfmtrackurl}" target="#lastfm">
303 <xsl:copy-of select="$lastfmtrackurl"/>
304 </a>
305 </td>
306 </tr>
307 <tr>
308 <td>
309 EchoNest song id:
310 </td>
311 <td>
312 <a href="{$echonestsongid}" target="#echonestsongid">
313 <xsl:copy-of select="$echonestsongid"/>
314 </a>
315 </td>
316 </tr>
317 </table>
318
319 </td>
320 </tr>
321
322
323 </tbody>
324 </table>
325 </xsl:template>
326
327
328
329 <!-- *** -->
330 <!-- * Audio Player -->
331 <!-- *** -->
332
333
334 <xsl:template name="js-mad-header">
335
336 <gsf:script src="ext/js-mad/script/mad.js"/>
337 <gsf:script src="ext/js-mad/script/rq_table.js"/>
338 <gsf:script src="ext/js-mad/script/imdct_s.js"/>
339 <gsf:script src="ext/js-mad/script/huffman.js"/>
340 <gsf:script src="ext/js-mad/script/bit.js"/>
341 <gsf:script src="ext/js-mad/script/stream.js"/>
342 <gsf:script src="ext/js-mad/script/layer3.js"/>
343 <gsf:script src="ext/js-mad/script/frame.js"/>
344 <gsf:script src="ext/js-mad/script/synth.js"/>
345
346 <gsf:script src="ext/js-mad/script/arraybuffer/bytestream.js"/>
347 <gsf:script src="ext/js-mad/script/arraybuffer/filestream.js"/>
348 <gsf:script src="ext/js-mad/script/arraybuffer/substream.js"/>
349 <gsf:script src="ext/js-mad/script/arraybuffer/arraystream.js"/>
350 <gsf:script src="ext/js-mad/script/arraybuffer/ajaxstream.js"/>
351
352 <gsf:script src="ext/js-mad/script/binarystring/bytestream.js"/>
353 <gsf:script src="ext/js-mad/script/binarystring/filestream.js"/>
354 <gsf:script src="ext/js-mad/script/binarystring/substream.js"/>
355 <gsf:script src="ext/js-mad/script/binarystring/stringstream.js"/>
356 <gsf:script src="ext/js-mad/script/binarystring/ajaxstream.js"/>
357
358 <gsf:script src="ext/js-mad/script/id3v22stream.js"/>
359 <gsf:script src="ext/js-mad/script/id3v23stream.js"/>
360 <gsf:script src="ext/js-mad/script/mp3file.js"/>
361
362<!--
363 <gsf:script src="ext/js-mad/script/player.js"/>
364-->
365
366 <gsf:script src="ext/js-mad/script/sink.min.js"/>
367
368<!--
369 <gsf:script src="ext/js-mad/script/require.js"/>
370-->
371<!--
372 <gsf:script src="ext/js-mad/script/sink-light.js"/>
373-->
374
375 <gsf:script src="ext/js-mad/script/browser-detect.js"/>
376 <gsf:script src="ext/js-mad/script/main-jsmad.js"/>
377
378 </xsl:template>
379
380
381 <xsl:template name="audio-icon-cache">
382 <div style="display:none;">
383 <!-- pre-load various play/pause images to help with speed of interface update -->
384 <img src="ext/diy-audio-player/images/play32Highlight.png" />
385 <img src="ext/diy-audio-player/images/pause32.png" />
386 <img src="ext/diy-audio-player/images/pause32Highlight.png" />
387 <img src="ext/diy-audio-player/images/play20Highlight.png" />
388 <img src="ext/diy-audio-player/images/stop32.png" />
389 <img src="ext/diy-audio-player/images/stop32Highlight.png" />
390 <img src="ext/diy-audio-player/images/search20Highlight.png" />
391 </div>
392 </xsl:template>
393
394
395 <!-- *** -->
396 <!-- * Workflow control -->
397 <!-- *** -->
398
399 <xsl:template name="workflow-block">
400 <xsl:variable name="httpCollection">
401 <xsl:value-of select="/page/pageResponse/collection/metadataList/metadata[@name='httpPath']"/>
402 </xsl:variable>
403
404 <div id="workflow-turnstyle">
405
406 <div style="background-image: none; background-color: rgb(80%,80%,20%);">
407 Workflow
408 </div>
409
410 <div class="documenttext hide" style="color: white; background-color: rgb(40%,40%,20%); padding: 8px;">
411
412<!--
413 <form style="padding-left: 8px;">
414 <span class="vis-heading">Input Selection:</span>
415 <input type="radio" name="inputSelection" onclick="setInputSelectionMode(this)" value="left"/>Left only
416 <input type="radio" name="inputSelection" onclick="setInputSelectionMode(this)" value="right"/>Right only
417 <input type="radio" name="inputSelection" onclick="setInputSelectionMode(this)" value="diff"/>Average
418 <input type="radio" name="inputSelection" onclick="setInputSelectionMode(this)" value="mix" checked="checked"/>Difference
419 </form>
420 <hr/>
421-->
422
423 <form style="padding-left: 8px; height: 48px;">
424 <span class="vis-heading" style="padding-right: 10px" >Meandre Workflow:</span>
425
426 <select id="meandre-workflow-pos" onChange="loadSelectedWorkflow(this)" style="font-size: 90%; padding 8px;">
427 <option value="0" selected="selected">Chromagram</option>
428 <option value="1" >Dynamic Javascript Mixer</option>
429 </select>
430
431 <div style="float: right;" id="meandre-buttons">
432
433 <button type="button" id="meandre-run-button"
434 onclick="selectedMeandreWorkflow.runThisMeandreFlow(this)">
435 <img id="meandre-run-button" src="ext/diy-audio-player/images/play32.png"
436 width="32"
437 height="32"
438 XXonmouseover="playHighlightOn(this)"
439 XXonmouseout="playHighlightOff(this)"
440 XXonclick="runThisMeandreFlow(this)"
441 style="vertical-align: middle;"/>
442 Run
443 </button>
444
445 <button type="button" id="meandre-stop-button" onclick="selectedMeandreWorkflow.stopThisMeandreFlow(this)" disabled="disabled">
446 <img id="meandre-stop-button" src="ext/diy-audio-player/images/stop32.png"
447 width="32"
448 height="32"
449 XXonmouseover="stopHighlightOn(this)"
450 XXonmouseout="stopHighlightOff(this)"
451 XXonclick="stopThisMeandreFlow(this)"
452 style="vertical-align: middle;"/>
453 Stop
454 </button>
455
456<!--
457 <button type="button" id="meandre-run-button" onclick="runThisMeandreFlow(this)" >Run</button>
458 <button type="button" id="meandre-stop-button" onclick="stopThisMeandreFlow(this)" disabled="disabled">Stop</button>
459-->
460
461 </div>
462
463 </form>
464
465 <style>
466 #meandre-buttons button:hover:enabled {
467 background-color: #CCCC33;
468 color: #FFFFFF;
469 }
470 </style>
471
472
473 <div style="position: relative;">
474 <iframe id="workbenchFrame"
475 style="width: 100%; height: 400px;" >
476 If you see this, then your browser does not support the iframe element.
477 </iframe>
478
479 </div>
480
481 <gsf:script src="{$httpCollection}/script/meandre-workflow/chromagram.js"/>
482 <gsf:script src="{$httpCollection}/script/meandre-workflow/js-dynamic-mix.js"/>
483
484 <gsf:script>
485 var chromagramMeandreWorkflow = new ChromagramMeandreWorkflow();
486 var jsDynamicMixMeandreWorkflow = new JSDynamicMixMeandreWorkflow();
487
488 var meandreWorkflows = [ chromagramMeandreWorkflow, jsDynamicMixMeandreWorkflow ];
489
490 var selectedMeandreWorkflowPos =$('#meandre-workflow-pos option:selected').val();
491 var selectedMeandreWorkflow = meandreWorkflows[selectedMeandreWorkflowPos];
492
493 selectedMeandreWorkflow.meandreController.loadWorkbench( "workbenchFrame",selectedMeandreWorkflowPos);
494
495 function loadSelectedWorkflow(elem) {
496 selectedMeandreWorkflowPos = elem.value;
497 selectedMeandreWorkflow = meandreWorkflows[selectedMeandreWorkflowPos];
498
499 if (selectedMeandreWorkflowPos==1) {
500 $('#jsdynamic-turnstyle').show();
501 }
502 else {
503 $('#jsdynamic-turnstyle').hide();
504 }
505
506 console.info("Loading in new Meandre workbench flow (pos=" + selectedMeandreWorkflowPos+ ")");
507 selectedMeandreWorkflow.meandreController.loadWorkbench("workbenchFrame",selectedMeandreWorkflowPos);
508
509 }
510 </gsf:script>
511
512
513
514
515 <div id="jsdynamic-turnstyle" style="display:none">
516
517 <div style="background-image: none; background-color: rgb(80%,80%,20%);">
518 Dynamic Javascript Meandre Component
519 </div>
520
521 <div class="documenttext hide" style="color: white; background-color: rgb(40%,40%,20%); padding: 8px;">
522
523 <textarea id="js-dynamic-code" style="width:100%; height: 520px; font-size: 60%">
524 <xsl:text disable-output-escaping="yes">
525
526
527var arrayBinding = new JavaImporter(java.lang.reflect.Array);
528
529var JSDynamicComponent = function() {
530 this.frameCount = 0;
531}
532
533JSDynamicComponent.prototype.executeCallBack = function(cc) {
534
535 with(arrayBinding) {
536
537 if ((this.frameCount % 1000)==0) {
538 print("JSDynamicComponent: " + this.frameCount + "\n");
539 }
540
541 var inputObject = cc.getDataComponentFromInput("input");
542 var rawInput1DArray = inputObject;
543
544 var rawOutput1DArray = Array.newInstance(java.lang.Double.TYPE, rawInput1DArray.length);
545
546 for (var i=1; i&lt;rawOutput1DArray.length; i++) {
547 var diff = Array.getDouble(rawInput1DArray,i) - Array.getDouble(rawInput1DArray, i-1);
548 Array.setDouble(rawOutput1DArray,i,diff);
549 }
550
551 cc.pushDataComponentToOutput("output", rawOutput1DArray);
552
553 this.frameCount++;
554 }
555
556}
557
558var jsDynamicComponent = new JSDynamicComponent();
559
560 </xsl:text>
561 </textarea>
562 </div> <!-- end of Dynamic JS turnstyle block -->
563 </div>
564
565 </div>
566
567 </div>
568
569 <script>
570 <xsl:text disable-output-escaping="yes">
571 $(function(){
572 transformToTurnstyleBlock("workflow");
573 transformToTurnstyleBlock("jsdynamic");
574 });
575 </xsl:text>
576 </script>
577 </xsl:template>
578
579
580 <!-- *** -->
581 <!-- * Structured audio player -->
582 <!-- *** -->
583
584 <xsl:template name="structuredAudioPlayerBlock">
585
586 <gsf:script src="ext/diy-audio-player/script/structured-audio-play.js"/>
587
588 <div style="background-color: rgb(40%,40%,20%)">
589 <svg xmlns="http://www.w3.org/2000/svg"
590 xmlns:xlink="http://www.w3.org/1999/xlink"
591 version="1.1"
592 id="svgGroundTruthSegments"
593 width="100%" height="24"
594 onLoadXX="svgGTStructuredInit()">
595 </svg>
596 </div>
597
598 <div style="background-color: rgb(40%,40%,20%)">
599 <svg xmlns="http://www.w3.org/2000/svg"
600 xmlns:xlink="http://www.w3.org/1999/xlink"
601 version="1.1"
602 id="svgContentAnalysisSegments"
603 width="100%" height="24"
604 onLoadXX="svgCAStructuredInit({$cgiargCAAlgorithm})">
605 </svg>
606 </div>
607 </xsl:template>
608
609 <xsl:template name="visualization-mode-block">
610
611 <div class="documenttext" style="color: white; background-color: rgb(40%,40%,20%); padding-top: 4px;">
612
613 <span class="vix-heading">Max Values:</span>
614 <div style="padding-left: 8px">
615 <style>
616 span.mv-fixed { display: inline-block; width: 30pt; }
617 </style>
618 <table width="100%">
619 <tr>
620 <td><span class="mv-fixed" id="freqSpectrumMax" >0.000</span>(Freq Spectrum) </td>
621 <td><span class="mv-fixed" id="freqPowerSpectrumMax">0.000</span>(Freq Power Spectrum) </td>
622 <td><span class="mv-fixed" id="filterBankMax" >0.000</span>(Filter Bank) </td>
623 <td><span class="mv-fixed" id="chromaFeaturesMax" >0.000</span>(Chroma Features) </td>
624 </tr>
625 </table>
626 </div>
627 <hr/>
628
629 <form style="padding-left: 8px; padding-right: 8px; padding-bottom: 0px;">
630 <div style="float: left;">
631 <span class="vis-heading">Visualization:</span>
632<!--
633 <input type="radio" name="visualization" onclick="setTransformMode(this)" value="freqSpectrum" />Frequency Spectrum
634 <input type="radio" name="visualization" onclick="setTransformMode(this)" value="freqPowerSpectrum"/>Frequency Power Spectrum
635-->
636
637 <input type="radio" name="visualization" onclick="setTransformMode(this)" value="filterBank"/>Filter Bank
638 <input type="radio" name="visualization" onclick="setTransformMode(this)" value="chromaFeatures" checked="checked"/>Chroma Features
639 </div>
640
641 <div style="float: left; padding-left: 140px;">
642 <span class="vis-heading">Colour Mapping:</span>
643 <input type="radio" name="colorMapping" onclick="setColorMappingMode(this)" value="rgb"/>RGB Intensity
644 <input type="radio" name="colorMapping" onclick="setColorMappingMode(this)" value="hsl" checked="checked"/>HSL Heat
645 </div>
646 </form>
647
648 <div style="clear: both; padding-top: 4px; padding-bottom: 4px;"><hr/></div>
649
650<!--
651 <form style="padding-left: 8px;">
652 <span class="vis-heading">Colour Mapping:</span>
653 <input type="radio" name="colorMapping" onclick="setColorMappingMode(this)" value="rgb"/>RGB Intensity
654 <input type="radio" name="colorMapping" onclick="setColorMappingMode(this)" value="hsl" checked="checked"/>HSL Heat Map
655 </form>
656 <hr/>
657-->
658
659 <form style="padding-left: 8px; padding-bottom: 0px;">
660 <span class="vis-heading">On Pause:</span>
661 <input type="checkbox" name="similarityMatrix" onclick="plotSimilarityMatrixWhenPaused(this)"/>Show Similarity Matrix
662 </form>
663 <hr/>
664
665 </div>
666
667 </xsl:template>
668
669 <!-- *** -->
670 <!-- * Settings form -->
671 <!-- *** -->
672
673 <xsl:template name="settings-form">
674 <xsl:param name="cgiargYScaleSimImg"/>
675
676 <xsl:variable name="httpCollection">
677 <xsl:value-of select="/page/pageResponse/collection/metadataList/metadata[@name='httpPath']"/>
678 </xsl:variable>
679
680 <div id="settings-turnstyle" style="margin: 6px;">
681 <div style="background-image: none; background-color: rgb(80%,80%,20%);">
682 Audio Content Search
683 </div>
684 <div class="documenttext" style="display: none;">
685
686
687 <form id="QueryForm" name="QueryForm" method="get" action="{$library_name}">
688 <input type="hidden" name="a" value="q"/>
689 <input type="hidden" name="sa"><xsl:attribute name="value"><xsl:value-of select="/page/pageRequest/@subaction"/></xsl:attribute></input>
690 <input type="hidden" name="rt" value="rd"/>
691
692 <input type="hidden" name="s" value="AudioQuery"/>
693 <input type="hidden" name="c" value="{$collName}"/>
694 <xsl:if test="not(paramList/param[@name='startPage'])">
695 <input type="hidden" name="startPage" value="1"/>
696 </xsl:if>
697 <xsl:choose>
698 <xsl:when test="/page/pageRequest/paramList/param[@name = 's1.maxDocs']">
699 <input type="hidden" name="s1.maxDocs">
700 <xsl:attribute name="value">
701 <xsl:value-of select="/page/pageRequest/paramList/param[@name = 's1.maxDocs']/@value"/>
702 </xsl:attribute>
703 </input>
704 </xsl:when>
705 <xsl:otherwise>
706 <input type="hidden" name="s1.maxDocs" value="100"/>
707 </xsl:otherwise>
708 </xsl:choose>
709 <xsl:choose>
710 <xsl:when test="/page/pageRequest/paramList/param[@name = 's1.hitsPerPage']">
711 <input type="hidden" name="s1.hitsPerPage">
712 <xsl:attribute name="value">
713 <xsl:value-of select="/page/pageRequest/paramList/param[@name = 's1.hitsPerPage']/@value"/>
714 </xsl:attribute>
715 </input>
716 </xsl:when>
717 <xsl:otherwise>
718 <input type="hidden" name="s1.hitsPerPage" value="20"/>
719 </xsl:otherwise>
720 </xsl:choose>
721
722 <input type="hidden" name="q">
723 <xsl:attribute name="value"><xsl:value-of select="/page/pageResponse/document/documentNode/@nodeID"/>.dir</xsl:attribute>
724 </input>
725
726
727 <input type="hidden" name="s1.query">
728<!--
729 <xsl:attribute name="value"><xsl:value-of select="/page/pageResponse/document/documentNode/@nodeID"/>.dir</xsl:attribute>
730-->
731 <xsl:attribute name="value"><xsl:value-of select="/page/pageResponse/document/@nodeID"/>.dir</xsl:attribute>
732 </input>
733
734 <input type="hidden" name="s1.offset" value="0" />
735 <input type="hidden" name="s1.length" value="200" />
736
737 <div style="font-style: italics;">Start new query @ offset
738 <span id="mysongCurrentPos">0 secs</span>,
739 with excerpt lasting
740
741 <input type="text" name="mysongWindowDuration" size="4" value="6" />
742 <!--
743 <span id="mysongWindowDuration" class="editable-offset"
744 style="cursor: pointer; border: 1px solid black; padding: 3px; width: 200px; min-width: 200px;">6.0</span>
745 -->
746 secs:
747
748 <input type="submit" value="Search" onclick="preSubmit(this.form);" />
749 </div>
750
751
752 <ul style="font-size: 80%; margin-top: 8px; font-style: italics;" >
753 <li>Use the <b>Play all of</b> bar to get to the part of the song you are interested in.</li>
754 <li>... the <b>query @ offset</b> value will change accordingly as the song progresses.</li>
755 <li>Click <b>pause</b> (anywhere outside of the time-line) to mark the spot you want to start the new music query.</li>
756 <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>
757 <li>Finally, click the <b>Search</b> button to initiate the new query.</li>
758 </ul>
759
760 </form>
761
762 <hr/>
763
764<!--
765 <form id="RescaleForm" name="RescaleForm" method="get" action="{$library_name}">
766 <div style="font-style: italics;">
767 Make the scale factor for the y-dimension of the self-similarity
768 image be
769 <input type="text" name="ResizeScale" value="{$cgiargYScaleSimImg}"
770 size="3" /> then
771 <input type="button" name="ResizeImage" value="Resize Image"
772 onclick="javascript:rescaleImage()" />
773
774 </div>
775 </form>
776
777 <hr/>
778-->
779
780 <!-- **** currently not displayed -->
781
782 <form id="UpdateCAForm" name="UpdateCAForm" method="get" action="{$library_name}" style="display: none;">
783 <div style="font-style: italics;">
784
785 Show the song structure automatically computed by analyzing
786 the audio data using algorithm
787
788 <select id="caaMenu" name="caAlgorithm">
789 <option value="1">BV1</option>
790 <option value="2">BV2</option>
791 <option value="3">GP7</option>
792 <option value="4">MHRAG2</option>
793 <option value="5">MND1</option>
794 <option value="6">WB1</option>
795
796<!--
797 <option value="-1">or hide</option>
798-->
799
800 </select>:
801
802 <input type="button" name="Reload" value="Reload"
803 onclick="updateCAAlgorithm()" />
804
805 </div>
806 </form>
807
808 <script>
809 <xsl:text disable-output-escaping="yes">
810 if (hasStructuredAudio) {
811 var caaMenu = document.getElementById("caaMenu");
812 caaMenu.options[caAlgorithm-1].selected = 1;
813 }
814 </xsl:text>
815 </script>
816
817
818 </div>
819 </div>
820 <script>
821 <xsl:text disable-output-escaping="yes">
822 $(function(){
823 transformToTurnstyleBlock("settings");
824 });
825 </xsl:text>
826 </script>
827
828 </xsl:template>
829
830
831 <!-- *** -->
832 <!-- * Computed Data -->
833 <!-- *** -->
834
835
836 <xsl:template name="computed-data">
837 <xsl:param name="httpCollection"/>
838 <xsl:param name="assocFilePath"/>
839
840 <div id="computed-turnstyle" style="margin: 6px;">
841 <div style="background-image: none; background-color: rgb(80%,80%,20%);">
842 Computed Data
843 </div>
844
845 <div class="documenttext" style="display: none;">
846 <table class="metadata-stripes" style="width: 100%">
847 <tbody>
848 <tr>
849 <td>jAudio Features</td><td><a href="{$httpCollection}/index/assoc/{$assocFilePath}/jaudio.xml">download ACE XML feature values file</a></td>
850 </tr>
851
852 <tr>
853 <td>jSongMiner Metadata</td><td><a href="{$httpCollection}/index/assoc/{$assocFilePath}/jsongminer.xml">download ACE XML classifications file</a></td>
854 </tr>
855
856 </tbody>
857 </table>
858 </div>
859 </div>
860
861 <gsf:script>
862 $(function(){
863 transformToTurnstyleBlock("computed");
864 });
865 </gsf:script>
866
867
868 <div id="original-turnstyle" style="margin: 6px;">
869 <div style="background-image: none; background-color: rgb(80%,80%,20%);">
870 The Original Audio
871 </div>
872
873 <div style="display: none;">
874
875 <div>
876 <audio style="width: 100%;" id="original-audio" controls="controls" >
877 <source src="{$httpCollection}/index/assoc/{$assocFilePath}/doc.ogg" />
878 <source src="{$httpCollection}/index/assoc/{$assocFilePath}/doc.mp3" />
879 <source src="{$httpCollection}/index/assoc/{$assocFilePath}/doc.wav" />
880 </audio>
881 </div>
882
883 </div>
884 </div>
885
886 <gsf:script>
887 $(function(){
888 transformToTurnstyleBlock("original");
889 });
890 </gsf:script>
891
892
893 </xsl:template>
894
895</xsl:stylesheet>
Note: See TracBrowser for help on using the repository browser.