comparison src/DML/MainVisBundle/Resources/views/Components/templates/cgpma_view.html.twig @ 0:493bcb69166c

added public content
author Daniel Wolff
date Tue, 09 Feb 2016 20:54:02 +0100
parents
children
comparison
equal deleted inserted replaced
-1:000000000000 0:493bcb69166c
1 {# cgpma stands for config grid panel main area #}
2
3 {%- jstmpl id="cgpma_collection_view__feature-selector" -%}
4 <div class="cgpma__input-block">
5 <div class="cgpma__label">feature to show</div>
6 <div class="cgpma__textfield" data-parameter-name="kind" data-autocomplete-suggestions="
7 {#--#}list {#-#}|list of recordings
8 {#-#};geography {#-#}|geography
9 {#-#};key-relative-chord-seq {#-#}|key-relative chord sequences
10 {#-#};mean-tempo-curve {#-#}|mean tempo curve
11 {#-#};pitch-class-histogram {#-#}|pitch class histogram
12 {#-#};tonic-relative-pitch-class-histogram {#-#}|pitch class histogram (tonic-rel.)
13 {#-#};pitch-histogram {#-#}|pitch histogram (fine res.)
14 {#-#};midi-pitch-histogram {#-#}|pitch histogram (semitone res.)
15 {#-#};similarity-matrix {#-#}|similarity matrix
16 {#-#};similarity-plane {#-#}|similarity plane
17 {#-#};tempo-histogram {#-#}|tempo histogram
18 {#-#};tonic-histogram {#-#}|tonic histogram
19 {#-#};tuning-stats {#-#}|tuning stats
20 {#-#}"></div>
21 {%- endjstmpl -%}
22
23 {%- jstmpl id="cgpma_recording_view__feature-selector" -%}
24 <div class="cgpma__input-block">
25 <div class="cgpma__label">feature to show</div>
26 <div class="cgpma__textfield" data-parameter-name="kind" data-autocomplete-suggestions="
27 {#--#}properties {#-#}|properties
28 {#-#};pitch-histogram {#-#}|pitch histogram (fine res.)
29 {#-#};midi-pitch-histogram {#-#}|pitch histogram (semitone res.)
30 {#-#};tempo-histogram {#-#}|tempo histogram
31 {#-#};tempo-nonuniform {#-#}|tempo (non-uniform)
32 {#-#};tempo-normalised {#-#}|tempo (normalised)
33 {#-#}"></div>
34 {%- endjstmpl -%}
35
36 {%- jstmpl id="cgpma_collection_view__empty" -%}
37 <div class="cgpma__explanation">
38 {#--#}A grid of music collections lets you analyse multiple custom-defined musicological datasets and compare them to each other.
39 {#-#} The panel on the top of the screen (&thinsp;↗&thinsp;) shows the properties of the selected collection.
40 {#-#} The panel on the left (this one) populates itself with the parameters of a selected data representation (i.e. view).
41 {#-#}</div>
42 {%- endjstmpl -%}
43
44 {%- jstmpl id="cgpma_recording_view__empty" -%}
45 {#-#}<div class="cgpma__explanation">
46 {#--#}A grid of music recordings is similar to the grid of music collections – x axis corresponds to recordings and y axis corresponds to their views.
47 {#-#}</div>
48 {%- endjstmpl -%}
49
50 {%- jstmpl id="cgpma_collection_view__unknown" -%}
51 {#-#}{% block unknownRow %}
52 {#-#}<div class="cgpma__explanation cgpma__explanation_for-previous-input">
53 {#--#}The selected feature cannot be represented.
54 {#--#} Please choose something from what is suggested above.
55 {#-#}</div>
56 {#-#}{% endblock %}
57 {%- endjstmpl -%}
58
59 {%- jstmpl id="cgpma_recording_view__unknown" -%}
60 {{ block("unknownRow") }}
61 {%- endjstmpl -%}
62
63
64 {###############################################################################
65 collection → default
66 ###############################################################################}
67 {%- jstmpl id="cgpma_collection_view_default" -%}
68 {% block defaultView %}
69 {#-#}<div class="cgpma__explanation cgpma__explanation_for-previous-input">
70 {#--#}Please choose one of the available features to populate the row.
71 {#-#}</div>
72 {% endblock %}
73 {%- endjstmpl -%}
74
75 {#-----------------------------------------------------------------------------#
76 collection → geography
77 #-----------------------------------------------------------------------------#}
78 {%- jstmpl id="cgpma_collection_view_geography" -%}
79 {#-#}<div class="cgpma__explanation cgpma__explanation_for-previous-input">
80 {#--#}Some recordings from the British Library have place names attached to them.
81 {#-#} This attribute is projected on a map if available.
82 {#-#}</div>
83 <div class="cgpma__input-block cgpma__input-block_location_first-in-group">
84 <div class="cgpma__label">region</div>
85 <div class="cgpma__textfield" data-parameter-name="displayRegion" data-autocomplete-suggestions="
86 {#--#}planet {#-#}|whole planet
87 {#-#};africa {#-#}|Africa
88 {#-#};europe {#-#}|Europe
89 {#-#}"></div>
90 </div>
91 <div class="cgpma__input-block cgpma__input-block_location_first-in-group">
92 <div class="cgpma__tickbox" data-parameter-name="showCountriesAsCircles">show countries as circles</div>
93 </div>
94 </div>{%- endjstmpl -%}
95
96
97 {#-----------------------------------------------------------------------------#
98 collection → key-relative-chord-seq
99 #-----------------------------------------------------------------------------#}
100 {%- jstmpl id="cgpma_collection_view_key-relative-chord-seq" -%}
101 {#-#}<div class="cgpma__explanation cgpma__explanation_for-previous-input">
102 {#--#}Key-relative chord sequences are patterns of chord sequences normalised by key.
103 {#-#}</div>
104 <div class="cgpma__input-block cgpma__input-block_location_first-in-group">
105 <div class="cgpma__label">number of sequences</div>
106 <div class="cgpma__textfield" data-parameter-name="sequenceCount" {# data-autocomplete-advisory="1"#} data-autocomplete-suggestions="
107 {#--#}10
108 {#-#};50
109 {#-#};100
110 {#-#};200
111 {#-#};(API ignores this parameter)
112 {#-#}"></div>
113 </div>
114 </div><div class="cgpma__input-block">
115 <div class="cgpma__input-block">
116 <div class="cgpma__label">representation</div>
117 <div class="cgpma__textfield" data-parameter-name="sequenceRepresentation" data-autocomplete-suggestions="
118 {#--#}parallel-coordinates {#-#}|parallel coordinates
119 {#-#};od-grid {#-#}|origin-destination grid (errros)
120 {#-#}"></div>
121 </div><div class="cgpma__input-block">
122 <div class="cgpma__label">show data for recordings</div>
123 <div class="cgpma__tickbox" data-parameter-name="recordingsInMajorModeAreIncluded">in major mode</div>
124 <div class="cgpma__tickbox" data-parameter-name="recordingsInMinorModeAreIncluded">in minor mode</div>
125 </div><div class="cgpma__input-block">
126 <div class="cgpma__label">show sequences</div>
127 <div class="cgpma__tickbox" data-parameter-name="nIsIncluded">with absent chords (N)</div>
128 <div class="cgpma__tickbox" data-parameter-name="chordSequencesWithCyclesAreIncluded">with repeating chords</div>
129 </div><div class="cgpma__input-block">
130 <div class="cgpma__label">number of steps</div>
131 <div class="cgpma__textfield" data-parameter-name="sequenceStepCount" data-autocomplete-advisory="1" data-autocomplete-suggestions="
132 {#--#}2
133 {#-#};3
134 {#-#};5
135 {#-#};10
136 {#-#}"></div>
137 </div>
138 </div><div class="cgpma__input-block">
139 <div class="cgpma__label">minimal support</div>
140 <div class="cgpma__textfield" data-parameter-name="minSupport" data-autocomplete-advisory="1" data-autocomplete-suggestions="
141 {#--#}35
142 {#-#};50
143 {#-#};65
144 {#-#};75
145 {#-#}"></div>
146 </div>
147 {#-#}<div class="cgpma__explanation cgpma__explanation_for-previous-input">
148 {#--#}smallest displayed percentage of recordings for a pattern
149 {#-#}</div>
150 <div class="cgpma__input-block">
151 <div class="cgpma__tickbox" data-parameter-name="guidesAreVisible">show guides</div>
152 <div class="cgpma__tickbox" data-parameter-name="chordGrouppingIsByType">group chords by type</div>
153 <div class="cgpma__tickbox" data-parameter-name="chordTypesArePopularOnly">chord types: ‘M’ and ‘m’ only</div>
154 </div>
155 {#-# }<div class="cgpma__explanation cgpma__explanation_for-previous-input">
156 {#--# }Parallel coordinates are blah-blah
157 {#-# }</div>
158 #}
159 {%- endjstmpl -%}
160
161
162 {#-----------------------------------------------------------------------------#
163 collection → list
164 #-----------------------------------------------------------------------------#}
165 {%- jstmpl id="cgpma_collection_view_list" -%}
166 <div class="cgpma__input-block">
167 <div class="cgpma__label">number of items </div>
168 <div class="cgpma__textfield" data-parameter-name="limit" data-autocomplete-advisory="1" data-autocomplete-suggestions="
169 {#--#}10
170 {#-#};20
171 {#-#};50
172 {#-#}"></div>
173 </div>
174 <div class="cgpma__input-block">
175 <div class="cgpma__label">offset</div>
176 <div class="cgpma__textfield" data-parameter-name="offset" data-autocomplete-advisory="1" data-autocomplete-suggestions="
177 {#--#}0
178 {#-#};10
179 {#-#};20
180 {#-#};30
181 {#-#}"></div>
182 </div>
183 <div class="cgpma__input-block">
184 <div class="cgpma__label">sort by</div>
185 <div class="cgpma__textfield" data-parameter-name="sortBy" data-autocomplete-suggestions="
186 {#--#}label
187 {#-#};date
188 {#-#}"></div>
189 </div>
190 {%- endjstmpl -%}
191
192
193 {#-----------------------------------------------------------------------------#
194 collection → mean-tempo-curve
195 #-----------------------------------------------------------------------------#}
196 {%- jstmpl id="cgpma_collection_view_mean-tempo-curve" -%}
197 {#-#}<div class="cgpma__explanation cgpma__explanation_for-previous-input">
198 {#--#}Summarises tempo changes through the duration of the recordings.
199 {#-#} The curve expresses average tempo changes relative to the track duration.
200 {#--#}</div>
201 {%- endjstmpl -%}
202
203
204 {#-----------------------------------------------------------------------------#
205 collection → pitch class histogram
206 #-----------------------------------------------------------------------------#}
207 {%- jstmpl id="cgpma_collection_view_pitch-class-histogram" -%}
208 {#-#}<div class="cgpma__explanation cgpma__explanation_for-previous-input">
209 {#--#}For each recording in the collection, all detected pitches are summarised in a histogram according to octave-equivalent pitch classes in the range 0-11 (C –B).
210 {#-#} The histogram shows the averages over all recordings (equally weighted).
211 {#-#}</div>
212 {%- endjstmpl -%}
213
214
215 {#-----------------------------------------------------------------------------#
216 collection → pitch class histogram (tonic-relative)
217 #-----------------------------------------------------------------------------#}
218 {%- jstmpl id="cgpma_collection_view_tonic-relative-pitch-class-histogram" -%}
219 {#-#}<div class="cgpma__explanation cgpma__explanation_for-previous-input">
220 {#--#}For each recording in the collection, all detected pitches are summarised in a histogram according to their position relative to the tonic, in the range of 0-11 semitones.
221 {#-#} The histogram shows the averages over all recordings (equally weighted).
222 {#-#}</div>
223 {%- endjstmpl -%}
224
225
226 {#-----------------------------------------------------------------------------#
227 collection → pitch histogram (fine res.)
228 #-----------------------------------------------------------------------------#}
229 {%- jstmpl id="cgpma_collection_view_pitch-histogram" -%}
230 {#-#}<div class="cgpma__explanation cgpma__explanation_for-previous-input">
231 {#--#}All detected pitches, to a resolution of a fifth 20 cents (the fifth of a semitone), are summarised in a histogram with 200 bins.
232 {#-#} The histogram shows the averages over all recordings (equally weighted).
233 {#-#}</div>
234 <div class="cgpma__input-block">
235 <div class="cgpma__label">weighting</div>
236 <div class="cgpma__textfield" data-parameter-name="weighting" data-autocomplete-suggestions="
237 {#--#}none
238 {#-#};dur {#-#}|duration
239 {#-#};vel {#-#}|loudness
240 {#-#}"></div>
241 </div>
242 <div class="cgpma__input-block">
243 <div class="cgpma__label">minimum pitch</div>
244 <div class="cgpma__textfield" data-parameter-name="pitchMin" data-autocomplete-suggestions="
245 {#--#}10
246 {#-#};20
247 {#-#};50
248 {#-#}"></div>
249 </div>
250 <div class="cgpma__input-block">
251 <div class="cgpma__label">maximum pitch</div>
252 <div class="cgpma__textfield" data-parameter-name="pitchMax" data-autocomplete-suggestions="
253 {#--#}100
254 {#-#};150
255 {#-#};200
256 {#-#}"></div>
257 </div>
258 {%- endjstmpl -%}
259
260
261 {#-----------------------------------------------------------------------------#
262 collection → pitch histogram (semitone res.)
263 #-----------------------------------------------------------------------------#}
264 {%- jstmpl id="cgpma_collection_view_midi-pitch-histogram" -%}
265 {#--#}<div class="cgpma__explanation cgpma__explanation_for-previous-input">
266 {#--#}All detected pitches, in semitone resolution, are summarised in a histogram according to MIDI pitch in the range 0-127 (semitones, 60 is middle C).
267 {#-#} The histogram shows the averages over all recordings (equally weighted).
268 {#--#}</div>
269 <div class="cgpma__input-block">
270 <div class="cgpma__label">weighting</div>
271 <div class="cgpma__textfield" data-parameter-name="weighting" data-autocomplete-suggestions="
272 {#--#}none
273 {#-#};dur {#-#}|duration
274 {#-#};vel {#-#}|vel
275 {#-#}"></div>
276 </div>
277 {%- endjstmpl -%}
278
279
280 {#-----------------------------------------------------------------------------#
281 collection → similarity matrix
282 #-----------------------------------------------------------------------------#}
283 {%- jstmpl id="cgpma_collection_view_similarity-matrix" -%}
284 {#--#}<div class="cgpma__explanation cgpma__explanation_for-previous-input">
285 {#--#}The pairwise difference of the recordings in the collection is displayed in a matrix using a compression distance metric.
286 {#-#} For each pair of recordings (a,b), the similarity is found at row a, column b.
287 {#--#}</div>
288 {%- block cgpmaForSimilarity -%}
289 <div class="cgpma__input-block">
290 <div class="cgpma__label">characteristics to involve</div>
291 <div class="cgpma__tickbox cgpma__tickbox_one-per-line" data-parameter-name="simFeaturesIncludeChords">chords</div>
292 <div class="cgpma__tickbox cgpma__tickbox_one-per-line" data-parameter-name="simFeaturesIncludeChromagram">chromagram</div>
293 <div class="cgpma__tickbox cgpma__tickbox_one-per-line" data-parameter-name="simFeaturesIncludeMFCC">mel-frequency cepstral coefficients</div>
294 </div><div class="cgpma__input-block">
295 <div class="cgpma__label">measure</div>
296 <div class="cgpma__textfield" data-parameter-name="measure" data-autocomplete-suggestions="
297 {#--#}euclidean {#-#}|euclidean
298 {#-#};compression {#-#}|compression
299 {#-#}"></div>
300 </div><div class="cgpma__input-block cgpma__id_compressor">
301 <div class="cgpma__label">compressor</div>
302 <div class="cgpma__textfield" data-parameter-name="compressor" data-autocomplete-suggestions="
303 {#--#}zlib {#-#}|normalised
304 {#-#};zxd {#-#}|differential
305 {#-#}"></div>
306 </div><div class="cgpma__input-block cgpma__id_subsampling">
307 <div class="cgpma__tickbox cgpma__tickbox_one-per-line" data-parameter-name="subsampling">subsampling</div>
308 <div class="cgpma__explanation cgpma__explanation_for-previous-tickbox">regularly skip samples in recordings to get an approximate but faster result</div>
309 </div>
310 {%- endblock cgpmaForSimilarity -%}
311 {%- endjstmpl -%}
312
313
314 {#-----------------------------------------------------------------------------#
315 collection → similarity plane
316 #-----------------------------------------------------------------------------#}
317 {%- jstmpl id="cgpma_collection_view_similarity-plane" -%}
318 {#--#}<div class="cgpma__explanation cgpma__explanation_for-previous-input">
319 {#--#}Recordings are arranged on a two-dimensional pane with respect to their similarity: Similar recordings are positioned closely together whereas dissimilar recordings are farther apart.
320 {#--#}</div>
321 {{ block("cgpmaForSimilarity") }}
322 {%- endjstmpl -%}
323
324
325 {#-----------------------------------------------------------------------------#
326 collection → tempo histogram
327 #-----------------------------------------------------------------------------#}
328 {%- jstmpl id="cgpma_collection_view_tempo-histogram" -%}
329 {#-#}<div class="cgpma__explanation cgpma__explanation_for-previous-input">
330 {#--#}For each recording, all detected tempi are summarised in a histogram.
331 {#-#} The histogram shows the average across the entire collection.
332 {#-#}</div>
333 <div class="cgpma__input-block">
334 <div class="cgpma__label">minimum tempo</div>
335 <div class="cgpma__textfield" data-parameter-name="tempoMin" data-autocomplete-advisory="1" data-autocomplete-suggestions="
336 {#--#}30
337 {#-#};50
338 {#-#};100
339 {#-#}"></div>
340 </div>
341 <div class="cgpma__input-block">
342 <div class="cgpma__label">maximum tempo</div>
343 <div class="cgpma__textfield" data-parameter-name="tempoMax" data-autocomplete-advisory="1" data-autocomplete-suggestions="
344 {#--#}150
345 {#-#};200
346 {#-#};300
347 {#-#}"></div>
348 </div>
349 {%- endjstmpl -%}
350
351
352 {#-----------------------------------------------------------------------------#
353 collection → tonic histogram
354 #-----------------------------------------------------------------------------#}
355 {%- jstmpl id="cgpma_collection_view_tonic-histogram" -%}
356 {#-#}<div class="cgpma__explanation cgpma__explanation_for-previous-input">
357 {#--#}Summarises the key tonic (root note) per piece (using the last detected).
358 {#-#} The histogram displays the number of recordings for each tonic.
359 {#-#}</div>
360 {%- endjstmpl -%}
361
362
363 {#-----------------------------------------------------------------------------#
364 collection → tuning stats
365 #-----------------------------------------------------------------------------#}
366 {%- jstmpl id="cgpma_collection_view_tuning-stats" -%}
367 {#-#}<div class="cgpma__explanation cgpma__explanation_for-previous-input">
368 {#--#}Summarises the reference pitch distribution based on high resolution transcription in a histogram with average and standard deviation added.
369 {#-#}</div>
370 {%- endjstmpl -%}
371
372
373 {###############################################################################
374 recording → default
375 ###############################################################################}
376 {%- jstmpl id="cgpma_recording_view_default" -%}
377 {{ block("defaultView") }}
378 {%- endjstmpl -%}
379
380
381 {#-----------------------------------------------------------------------------#
382 recording → properties
383 #-----------------------------------------------------------------------------#}
384 {%- jstmpl id="cgpma_recording_view_properties" -%}
385 {#-#}<div class="cgpma__explanation cgpma__explanation_for-previous-input">
386 {#--#}
387 {#-#}</div>
388 {%- endjstmpl -%}
389
390
391 {#-----------------------------------------------------------------------------#
392 recording → pitch histogram (fine res.)
393 #-----------------------------------------------------------------------------#}
394 {%- jstmpl id="cgpma_recording_view_pitch-histogram" -%}
395 {#-#}<div class="cgpma__explanation cgpma__explanation_for-previous-input">
396 {#--#}All detected pitches, to a resolution of a fifth 20 cents (the fifth of a semitone), are summarised in a histogram with 200 bins.
397 {#-#}</div>
398 {%- endjstmpl -%}
399
400
401 {#-----------------------------------------------------------------------------#
402 recording → midi pitch histogram (semitone res.)
403 #-----------------------------------------------------------------------------#}
404 {%- jstmpl id="cgpma_recording_view_midi-pitch-histogram" -%}
405 {#-#}<div class="cgpma__explanation cgpma__explanation_for-previous-input">
406 {#--#}All detected pitches, in semitone resolution, are summarised in a histogram according to MIDI pitch in the range 0-127 (semitones, 60 is middle C).
407 {#-#}</div>
408 {%- endjstmpl -%}
409
410
411 {#-----------------------------------------------------------------------------#
412 recording → tempo histogram
413 #-----------------------------------------------------------------------------#}
414 {%- jstmpl id="cgpma_recording_view_tempo-histogram" -%}
415 {#-#}<div class="cgpma__explanation cgpma__explanation_for-previous-input">
416 {#--#}Shows much time time is spent at various tempi in this recording.
417 {#-#} The tempo is estimated by a beat tracking algorithm, sampled at a uniform rate as in 'tempo (uniform)', and then a histogram compiled.
418 {#-#} The histogram bins are logarithmically spaced between given upper and lower limits.
419 {#-#}</div>
420 {%- endjstmpl -%}
421
422
423 {#-----------------------------------------------------------------------------#
424 recording → tempo (nonuniform)
425 #-----------------------------------------------------------------------------#}
426 {%- jstmpl id="cgpma_recording_view_tempo-nonuniform" -%}
427 {#-#}<div class="cgpma__explanation cgpma__explanation_for-previous-input">
428 {#--#}Shows the tempo estimated by automatic beat tracking algorithm, at different times throughout the recording.
429 {#-#} The times at which the tempo estimates are made depends on the algorithm and may not be uniformly spaced throughout the duration of the recording.
430 {#-#}</div>
431 {%- endjstmpl -%}
432
433
434 {#-----------------------------------------------------------------------------#
435 recording → tempo (normalised)
436 #-----------------------------------------------------------------------------#}
437 {%- jstmpl id="cgpma_recording_view_tempo-normalised" -%}
438 {#-#}<div class="cgpma__explanation cgpma__explanation_for-previous-input">
439 {#--#}shows the tempo estimated by automatic beat tracking algorithm, sampled at uniformly spaced times throughout the recording.
440 {#-#} These estimates are obtained by interpolating the raw tempo estimates show in 'tempo (non-uniform)'.
441 {#-#} The sampling period is an adjustable parameter with a default of 1 second.
442 {#-#}</div>
443 {%- endjstmpl -%}