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:gsf="http://www.greenstone.org/greenstone3/schema/ConfigFormat"
|
---|
7 | xmlns:gslib="http://www.greenstone.org/skinning"
|
---|
8 | xmlns:v-bind="http://vuejs.org"
|
---|
9 | xmlns:v-on="http://vuejs.org"
|
---|
10 | extension-element-prefixes="java util"
|
---|
11 | exclude-result-prefixes="java util">
|
---|
12 |
|
---|
13 | <!-- use the 'main' layout -->
|
---|
14 | <xsl:import href="layouts/main.xsl"/>
|
---|
15 |
|
---|
16 | <xsl:variable name="groupPath"><xsl:value-of select="/page/pageRequest/paramList/param[@name='group']/@value"/></xsl:variable>
|
---|
17 | <!-- set page title -->
|
---|
18 | <xsl:template name="pageTitle"><gslib:collectionName/></xsl:template>
|
---|
19 |
|
---|
20 | <!-- set page breadcrumbs -->
|
---|
21 | <xsl:template name="breadcrumbs"><gslib:siteLink/><gslib:rightArrow/>
|
---|
22 | <xsl:if test="$groupPath != ''">
|
---|
23 | <xsl:for-each select="/page/pageResponse/pathList/group">
|
---|
24 | <xsl:sort data-type="number" select="@position"/>
|
---|
25 | <a>
|
---|
26 | <xsl:attribute name="href"><gslib:groupHref path="{@path}"/></xsl:attribute>
|
---|
27 | <xsl:attribute name="title"><gslib:groupName path="{@path}"/></xsl:attribute>
|
---|
28 | <gslib:groupName path="{@path}"/>
|
---|
29 | </a>
|
---|
30 | <gslib:rightArrow/>
|
---|
31 | </xsl:for-each>
|
---|
32 | </xsl:if>
|
---|
33 | </xsl:template>
|
---|
34 |
|
---|
35 | <!-- the page content -->
|
---|
36 | <xsl:template match="/page">
|
---|
37 | <xsl:call-template name="audio-transcription"/>
|
---|
38 | </xsl:template>
|
---|
39 |
|
---|
40 | <!-- <xsl:attribute-set name="vue">
|
---|
41 | <xsl:attribute name="v-on" />
|
---|
42 | <xsl:attribute name="v-bind" />
|
---|
43 | </xsl:attribute-set> -->
|
---|
44 |
|
---|
45 | <!-- Template for processing audio file uploads -->
|
---|
46 | <xsl:template name="audio-transcription">
|
---|
47 | <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet" />
|
---|
48 | <link href="interfaces/{$interface_name}/style/asr.css" rel="stylesheet" type="text/css" />
|
---|
49 |
|
---|
50 | <span class="monospace-font-size">ngÄ tama a rangi |</span>
|
---|
51 |
|
---|
52 | <section id="audio-transcription-container" class="paper">
|
---|
53 | <!-- Contains the file input, transcribe button and transcription progress indicator -->
|
---|
54 | <div id="audioUploadContainer">
|
---|
55 | <button class="btn-primary" type="button" v-on:click="openFilePicker">
|
---|
56 | <span class="material-icons"></span> <!-- file_upload -->
|
---|
57 | <span>Upload Audio Files</span>
|
---|
58 | </button>
|
---|
59 |
|
---|
60 | <input id="audioFileInput" type="file" v-on:input="onFilesChanged"
|
---|
61 | accept="audio/wav" multiple="multiple" v-bind:disabled="isTranscribing" />
|
---|
62 |
|
---|
63 | <button id="btnBeginTranscription" class="btn-primary" type="submit"
|
---|
64 | v-bind:disabled="!canTranscribe" v-on:click="doTranscription">
|
---|
65 | <span class="material-icons"></span> <!-- history_edu -->
|
---|
66 | <span>Transcribe</span>
|
---|
67 | </button>
|
---|
68 |
|
---|
69 | <progress v-if="isTranscribing" class="indeterminateLoadingBar" />
|
---|
70 | </div>
|
---|
71 |
|
---|
72 | <!-- <div class="audio-slider__container">
|
---|
73 | <button type="button" class="btn-fab">
|
---|
74 | <span class="material-icons mdi-xl"></span>
|
---|
75 | </button>
|
---|
76 | <input type="range" min="0" value="0" class="audio-slider__range" />
|
---|
77 | <span class="audio-slider__value">1:23</span>
|
---|
78 | </div> -->
|
---|
79 |
|
---|
80 | <!-- Contains the audio element and transcription list -->
|
---|
81 | <div id="transcriptionsDisplayContainer">
|
---|
82 |
|
---|
83 | <audio id="transcriptionAudio">
|
---|
84 | <source id="transcriptionAudioSource" />
|
---|
85 | </audio>
|
---|
86 |
|
---|
87 | <ul id="transcriptionsList" class="transcription__list"></ul>
|
---|
88 |
|
---|
89 | <template id="transcriptionTemplate">
|
---|
90 | <li class="transcription__container">
|
---|
91 |
|
---|
92 | <div class="transcription__header">
|
---|
93 | <button class="btn-fab transcription__play-button theme-flat" type="button">
|
---|
94 | <span class="material-icons"></span> <!-- play_arrow -->
|
---|
95 | </button>
|
---|
96 | <button class="btn-fab transcription__remove-button theme-error" type="button">
|
---|
97 | <span class="material-icons"></span> <!-- delete -->
|
---|
98 | </button>
|
---|
99 | <p class="transcription__text"></p>
|
---|
100 | <p class="body2 transcription__file-name">test</p>
|
---|
101 | </div>
|
---|
102 |
|
---|
103 | <gsf:div class="transcription__word-list" id="transcriptionWordList">
|
---|
104 | <ul class="transcription__list">
|
---|
105 | <li v-for="line in lines" style="display: flex">
|
---|
106 | <span v-for="word in line.words" style="border: 1px solid blue">{{ word }}</span>
|
---|
107 | </li>
|
---|
108 | </ul>
|
---|
109 | </gsf:div>
|
---|
110 |
|
---|
111 | <div class="audio-slider-container">
|
---|
112 | <input type="range" min="0" value="0" class="audio-slider" />
|
---|
113 | </div>
|
---|
114 |
|
---|
115 | <hr class="divider" />
|
---|
116 |
|
---|
117 | </li>
|
---|
118 | </template>
|
---|
119 |
|
---|
120 | <template id="errorTemplate">
|
---|
121 | <li class="error-list-item">
|
---|
122 | <div>
|
---|
123 | <div class="spaced-block">
|
---|
124 | <b>Transcription Failed: </b><span></span>
|
---|
125 | </div>
|
---|
126 | <div class="spaced-block">
|
---|
127 | <b>File: </b><span></span>
|
---|
128 | </div>
|
---|
129 | </div>
|
---|
130 | </li>
|
---|
131 | </template>
|
---|
132 | </div>
|
---|
133 | </section>
|
---|
134 |
|
---|
135 | <!-- TODO: Switch to production version for release builds -->
|
---|
136 | <gsf:script src="https://unpkg.com/vue@next"></gsf:script>
|
---|
137 | <gsf:script src="interfaces/{$interface_name}/js/asr/asr-controller.js"></gsf:script>
|
---|
138 | </xsl:template>
|
---|
139 |
|
---|
140 | </xsl:stylesheet>
|
---|