Mercurial > hg > webaudioevaluationtool

annotate test_create.html @ 2887:cedaf7ee1b81

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Reformat page layout
author Nicholas Jillings <nicholas.jillings@mail.bcu.ac.uk>
date Tue, 27 Jun 2017 20:52:07 +0100
parents c70036f28226
children a1e294297380
rev   line source
nicholas@2859 1 <html>
nicholas@2859 2
nicholas@2859 3 <head>
nicholas@2859 4 <meta http-equiv="content-type" content="text/html; charset=utf-8">
nicholas@2859 5 <!-- This defines the test creator tool for the Web Audio Evaluation Toolbox -->
nicholas@2859 6 <link rel="stylesheet" type="text/css" href="test_create/style.css" />
nicholas@2859 7 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
nicholas@2859 8 <script src="js/jquery-2.1.4.js"></script>
nicholas@2859 9 <script src="js/angular.min.js"></script>
nicholas@2859 10 <script type="text/javascript" src="js/specification.js"></script>
nicholas@2859 11 <script type="text/javascript" src="test_create/test_core.js"></script>
nicholas@2859 12 <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
nicholas@2887 13 <script type="text/javascript" src="js/xmllint.js"></script>
nicholas@2859 14
nicholas@2859 15 <title>WAET 1.2.1 Test Creator</title>
nicholas@2859 16 </head>
nicholas@2859 17
nicholas@2887 18 <body ng-app="creator" ng-controller="view">
nicholas@2887 19 <div class="container">
nicholas@2859 20 <div id="pageRoot">
nicholas@2859 21 <h1>Web Audio Evaluation Tool - Test Creator</h1>
nicholas@2859 22 </div>
nicholas@2887 23 <button type="button" class="btn btn-info" ng-click="validate()">Validate</button>
nicholas@2887 24 <button type="button" class="btn btn-success" ng-click="exportXML()" ng-disabled="validated == false">Export XML</button>
nicholas@2887 25 <div ng-switch on="validated" ng-show="showValidationMessages">
nicholas@2887 26 <div class="panel panel-danger" ng-switch-when="false">
nicholas@2887 27 <div class="panel-heading">
nicholas@2887 28 <button type="button" class="close" data-dismiss="alert" aria-label="Close" ng-click="hideValidationMessages"><span aria-hidden="true">&times;</span></button>
nicholas@2887 29 <h3 class="panel-title">Invalid Specification!</h3>
nicholas@2887 30 </div>
nicholas@2887 31 <div class="panel-body">
nicholas@2887 32 <p>Your specification is invalid. Please fix the following issues!</p>
nicholas@2887 33 <ul id="validation-error-list">
nicholas@2887 34 <li>Errors</li>
nicholas@2887 35 </ul>
nicholas@2887 36 </div>
nicholas@2887 37 </div>
nicholas@2887 38 <div class="alert alert-success" role="alert" ng-switch-when="true">
nicholas@2887 39 <button type="button" class="close" data-dismiss="alert" aria-label="Close" ng-click="hideValidationMessages"><span aria-hidden="true">&times;</span></button>
nicholas@2887 40 <strong>Validates!</strong><span>Well done, you can export this specification!</span>
nicholas@2887 41 </div>
nicholas@2887 42 </div>
nicholas@2859 43 <div id="setupNode" class="node" ng-controller="setup">
nicholas@2859 44 <h2>Setup</h2>
nicholas@2859 45 <div class="attributes">
nicholas@2859 46 <div class="attribute">
nicholas@2859 47 <span>Interface: </span>
nicholas@2877 48 <input type="text" ng-model="specification.interface" required/>
nicholas@2859 49 </div>
nicholas@2884 50 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="If you would like to save to a server other than your hosting server, you can place the full WAET URL here">
nicholas@2859 51 <span>Save URL: </span>
nicholas@2877 52 <input type="text" ng-model="specification.projectReturn" placeholder="save.php" />
nicholas@2859 53 </div>
nicholas@2884 54 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Once the test is completed and save confirmed, the browser will redirect to this page, if not defined.">
nicholas@2859 55 <span>Exit URL: </span>
nicholas@2859 56 <input type="text" ng-model="specification.returnURL" />
nicholas@2859 57 </div>
nicholas@2884 58 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Randomise the page order">
nicholas@2859 59 <span>Randomise Page Order: </span>
nicholas@2859 60 <input type="checkbox" ng-model="specification.randomiseOrder" />
nicholas@2859 61 </div>
nicholas@2884 62 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Set the number of pages to present to the user. This includes repeated pages. Set to '0' or blank to ignore. Randomise page order must be selected.">
nicholas@2859 63 <span>Page Pool Size: </span>
nicholas@2859 64 <input type="number" ng-model="specification.poolSize" min="0" />
nicholas@2859 65 </div>
nicholas@2884 66 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Automatically analyse and normalsie audio to this target LUFS. If unsure, use -25LUFS. 0 or blank disables normalisation">
nicholas@2859 67 <span>Loudness Normalisation (LUFS): </span>
nicholas@2859 68 <input type="number" ng-model="specification.loudness" max="0" />
nicholas@2859 69 </div>
nicholas@2884 70 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Only perform the test if the browser reported sampling rate matches this.">
nicholas@2859 71 <span>Fixed Sampling Rate: </span>
nicholas@2859 72 <input type="number" ng-model="specification.sampleRate" min="0" />
nicholas@2859 73 </div>
nicholas@2884 74 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Show a 'method of adjustment' audio calibration before testing.">
nicholas@2859 75 <span>Pre-Test audio calibration: </span>
nicholas@2859 76 <input type="checkbox" ng-model="specification.calibration" />
nicholas@2859 77 </div>
nicholas@2884 78 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Default cross-fade time when switching between elements. Can be over-ridden on each page">
nicholas@2859 79 <span>Global Cross-fade time: </span>
nicholas@2859 80 <input type="number" ng-model="specification.crossFade" min="0" step="0.1" />
nicholas@2859 81 </div>
nicholas@2884 82 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Default pre-play element silence. Can be over-ridden on each page and element">
nicholas@2859 83 <span>Global Fragment Pre-Silence: </span>
nicholas@2859 84 <input type="number" ng-model="specification.preSilence" min="0" step="0.1" />
nicholas@2859 85 </div>
nicholas@2884 86 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Default post-play element silence. Can be over-ridden on each page and element">
nicholas@2859 87 <span>Global Fragment Post-Silence: </span>
nicholas@2859 88 <input type="number" ng-model="specification.preSilence" min="0" step="0.1" />
nicholas@2859 89 </div>
nicholas@2884 90 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Disable switching of audio elements">
nicholas@2859 91 <span>Play audio one-at-a-time: </span>
nicholas@2859 92 <input type="checkbox" ng-model="specification.playOne" />
nicholas@2859 93 </div>
nicholas@2884 94 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Minimum number of times an audio fragment must be played">
nicholas@2874 95 <span>Minimum number of fragment plays</span>
nicholas@2874 96 <input type="number" ng-model="specification.minNumberPlays" min="0" max="{{specification.maxNumberPlays}}" />
nicholas@2874 97 </div>
nicholas@2884 98 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Maximum number of times an audio fragment can be played">
nicholas@2874 99 <span>Maximum number of fragment plays</span>
nicholas@2874 100 <input type="number" ng-model="specification.maxNumberPlays" min="{{specification.minNumberPlays || 0}}" />
nicholas@2874 101 </div>
nicholas@2859 102 </div>
nicholas@2859 103 <div class="node">
nicholas@2859 104 <h2>Test Completed Message</h2>
nicholas@2884 105 <textarea ng-model="specification.exitText" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Once the test is completed, you can show a message to the user. Markdown syntax is supported for formatting."></textarea>
nicholas@2859 106 </div>
nicholas@2859 107 <div id="metricsNode" class="node">
nicholas@2859 108 <h3>Session Metrics</h3>
nicholas@2859 109 <div class="attributes">
nicholas@2884 110 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Report the total test participation time">
nicholas@2859 111 <span>Collect Total Test Time: </span>
nicholas@2859 112 <input type="checkbox" value="testTimer" ng-click="enableMetric($event)" />
nicholas@2859 113 </div>
nicholas@2884 114 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Collect the accumulative listening time for each fragment">
nicholas@2859 115 <span>Collect Fragment Listen Time: </span>
nicholas@2859 116 <input type="checkbox" value="elementTimer" ng-click="enableMetric($event)" />
nicholas@2859 117 </div>
nicholas@2884 118 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Store the initial position of the fragment">
nicholas@2859 119 <span>Collect Fragment Initial Position: </span>
nicholas@2859 120 <input type="checkbox" value="elementInitialPosition" ng-click="enableMetric($event)" />
nicholas@2859 121 </div>
nicholas@2884 122 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Store each movement / value change of each fragment with page-relative timestamps.">
nicholas@2884 123 <span>Collect Fragment Movements: </span>
nicholas@2859 124 <input type="checkbox" value="elementTracker" ng-click="enableMetric($event)" />
nicholas@2859 125 </div>
nicholas@2884 126 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Store boolean reporting if a fragment has been played">
nicholas@2859 127 <span>Collect Fragment Listened To Flag: </span>
nicholas@2859 128 <input type="checkbox" value="elementFlagListenedTo" ng-click="enableMetric($event)" />
nicholas@2859 129 </div>
nicholas@2884 130 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Store boolean reporting if a fragment has been moved">
nicholas@2859 131 <span>Collect Fragment Moved Flag: </span>
nicholas@2859 132 <input type="checkbox" value="elementFlagMoved" ng-click="enableMetric($event)" />
nicholas@2859 133 </div>
nicholas@2884 134 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Store each time a fragment starts and stops playback with page relative timestamps. Also holds fragment relative timestamps.">
nicholas@2859 135 <span>Collect Fragment Listened Flag: </span>
nicholas@2859 136 <input type="checkbox" value="elementListenTracker" ng-click="enableMetric($event)" />
nicholas@2859 137 </div>
nicholas@2859 138 </div>
nicholas@2859 139 </div>
nicholas@2859 140 <div id="globalpresurvey" class="node" ng-controller="survey" ng-init="survey = specification.preTest">
nicholas@2859 141 <h2>Pre Test Survey</h2>
nicholas@2859 142 <button type="button" class="btn btn-success" ng-click="addSurveyEntry()">Add Entry</button>
nicholas@2859 143 <div class="node" ng-repeat="opt in survey.options" ng-controller="surveyOption">
nicholas@2859 144 <h3>Survey Entry</h3>
nicholas@2859 145 <button type="button" class="btn btn-danger" ng-click="removeSurveyEntry(opt);">Delete Entry</button>
nicholas@2859 146 <div class="attributes">
nicholas@2859 147 <div class="attribute">
nicholas@2859 148 <span>Survey Type: </span>
nicholas@2859 149 <select ng-model="opt.type">
nicholas@2859 150 <option value="question">Question</option>
nicholas@2859 151 <option value="radio">Radio</option>
nicholas@2859 152 <option value="checkbox">Checkbox</option>
nicholas@2859 153 <option value="statement">Statement</option>
nicholas@2859 154 <option value="number">Number</option>
nicholas@2859 155 <option value="slider">Slider</option>
nicholas@2859 156 <option value="video">Video</option>
nicholas@2859 157 <option value="youtube">YouTube</option>
nicholas@2859 158 </select>
nicholas@2859 159 </div>
nicholas@2859 160 <div class="attribute">
nicholas@2859 161 <span>Unique Survey Entry ID:</span>
nicholas@2877 162 <input type="text" ng-model="opt.id" required/>
nicholas@2859 163 </div>
nicholas@2859 164 <div class="attribute">
nicholas@2859 165 <span>Entry Name:</span>
nicholas@2859 166 <input type="text" ng-model="opt.name" />
nicholas@2859 167 </div>
nicholas@2859 168 <div class="attribute" ng-show="['question', 'checkbox', 'radio', 'number'].indexOf(opt.type) >= 0">
nicholas@2859 169 <span>Mandatory:</span>
nicholas@2859 170 <input type="checkbox" ng-model="opt.mandatory" />
nicholas@2859 171 </div>
nicholas@2859 172 <div class="attribute">
nicholas@2859 173 <span>Minimum Wait Time (s):</span>
nicholas@2859 174 <input type="number" ng-model="opt.minWait" min="0" />
nicholas@2859 175 </div>
nicholas@2859 176 <div class="attribute" ng-show="opt.type == 'question'">
nicholas@2859 177 <span>Box Size:</span>
nicholas@2859 178 <select ng-model="opt.boxsize">
nicholas@2859 179 <option value="small">Small</option>
nicholas@2859 180 <option value="normal">Normal</option>
nicholas@2859 181 <option value="large">Large</option>
nicholas@2859 182 <option value="huge">Huge</option>
nicholas@2859 183 </select>
nicholas@2859 184 </div>
nicholas@2859 185 <div class="attribute" ng-show="['checkbox', 'radio'].indexOf(opt.type) >= 0">
nicholas@2859 186 <span>Minimum Selected:</span>
nicholas@2859 187 <input type="number" ng-model="opt.min" min="0" />
nicholas@2859 188 </div>
nicholas@2859 189 <div class="attribute" ng-show="['checkbox', 'radio'].indexOf(opt.type) >= 0">
nicholas@2859 190 <span>Maximum Selected:</span>
nicholas@2859 191 <input type="number" ng-model="opt.max" max="{{opt.options.length}}" />
nicholas@2859 192 </div>
nicholas@2859 193 <div class="attribute" ng-show="['slider', 'number'].indexOf(opt.type) >= 0">
nicholas@2859 194 <span>Minimum Value:</span>
nicholas@2859 195 <input type="number" ng-model="opt.min" />
nicholas@2859 196 </div>
nicholas@2859 197 <div class="attribute" ng-show="['slider', 'number'].indexOf(opt.type) >= 0">
nicholas@2859 198 <span>Maximum Value:</span>
nicholas@2859 199 <input type="number" ng-model="opt.max" />
nicholas@2859 200 </div>
nicholas@2859 201 <div class="attribute" ng-show="['video', 'youtube'].indexOf(opt.type) >= 0">
nicholas@2859 202 <span>Video URL:</span>
nicholas@2859 203 <input type="text" ng-model="opt.url" />
nicholas@2859 204 </div>
nicholas@2859 205 </div>
nicholas@2859 206 <div class="node">
nicholas@2859 207 <h4>Statement</h4>
nicholas@2859 208 <textarea ng-model="opt.statement"></textarea>
nicholas@2859 209 </div>
nicholas@2859 210 <div class="node" ng-show="['checkbox', 'radio'].indexOf(opt.type) >= 0">
nicholas@2859 211 <h4>Options</h4>
nicholas@2859 212 <div>
nicholas@2859 213 <button type="button" class="btn btn-default" ng-click="addOption();">Add Option</button>
nicholas@2859 214 </div>
nicholas@2859 215 <div class="node" ng-repeat="option in opt.options">
nicholas@2859 216 <div class="attributes">
nicholas@2859 217 <div class="attribute">
nicholas@2859 218 <button type="button" class="btn btn-default" ng-click="removeOption(option);">Remove</button>
nicholas@2859 219 </div>
nicholas@2859 220 <div class="attribute">
nicholas@2859 221 <span>Name: </span>
nicholas@2877 222 <input type="text" ng-model="option.name" required/>
nicholas@2859 223 </div>
nicholas@2859 224 <div class="attribute">
nicholas@2859 225 <span>Displayed Text: </span>
nicholas@2877 226 <input type="text" ng-model="option.text" required/>
nicholas@2859 227 </div>
nicholas@2859 228 </div>
nicholas@2859 229 </div>
nicholas@2859 230 </div>
nicholas@2859 231 <div class="node">
nicholas@2859 232 <h4>Conditionals</h4>
nicholas@2859 233 <button type="button" class="btn btn-default" ng-click="addCondition()">Add Condition</button>
nicholas@2859 234 <div class="node" ng-repeat="condition in opt.conditions">
nicholas@2859 235 <div class="attributes">
nicholas@2859 236 <div class="attribute">
nicholas@2859 237 <button type="button" class="btn btn-danger" ng-click="removeCondition(condition)">Remove</button>
nicholas@2859 238 </div>
nicholas@2859 239 <div class="attribute">
nicholas@2859 240 <span>Check Type:</span>
nicholas@2859 241 <select ng-model="condition.check">
nicholas@2859 242 <option value="equals">Equal To</option>
nicholas@2859 243 <option value="lessThan">Less Than</option>
nicholas@2859 244 <option value="greaterThan">Greater Than</option>
nicholas@2859 245 <option value="stringContains">String Contains</option>
nicholas@2859 246 </select>
nicholas@2859 247 </div>
nicholas@2859 248 <div class="attribute">
nicholas@2859 249 <span>Value: </span>
nicholas@2877 250 <input type="text" ng-model="condition.value" required/>
nicholas@2859 251 </div>
nicholas@2859 252 <div class="attribute">
nicholas@2859 253 <span>Jump To On Pass: </span>
nicholas@2859 254 <select ng-model="condition.jumpToOnPass">
nicholas@2859 255 <option value="">None</option>
nicholas@2859 256 <option ng-repeat="entry in survey.options" value="{{entry.id}}">{{entry.id}}</option>
nicholas@2859 257 </select>
nicholas@2859 258 </div>
nicholas@2859 259 <div class="attribute">
nicholas@2859 260 <span>Jump To On Fail: </span>
nicholas@2859 261 <select ng-model="condition.jumpToOnFail">
nicholas@2859 262 <option value="">None</option>
nicholas@2859 263 <option ng-repeat="entry in survey.options" value="{{entry.id}}">{{entry.id}}</option>
nicholas@2859 264 </select>
nicholas@2859 265 </div>
nicholas@2859 266 </div>
nicholas@2859 267 </div>
nicholas@2859 268 </div>
nicholas@2859 269 </div>
nicholas@2859 270 </div>
nicholas@2859 271 <div id="globalpostsurvey" class="node" ng-controller="survey" ng-init="survey = specification.postTest">
nicholas@2859 272 <h2>Post Test Survey</h2>
nicholas@2859 273 <button type="button" class="btn btn-success" ng-click="addSurveyEntry()">Add Entry</button>
nicholas@2859 274 <div class="node" ng-repeat="opt in survey.options" ng-controller="surveyOption">
nicholas@2859 275 <h3>Survey Entry</h3>
nicholas@2859 276 <button type="button" class="btn btn-danger" ng-click="removeSurveyEntry(opt);">Delete Entry</button>
nicholas@2859 277 <div class="attributes">
nicholas@2859 278 <div class="attribute">
nicholas@2859 279 <span>Survey Type: </span>
nicholas@2859 280 <select ng-model="opt.type">
nicholas@2859 281 <option value="question">Question</option>
nicholas@2859 282 <option value="radio">Radio</option>
nicholas@2859 283 <option value="checkbox">Checkbox</option>
nicholas@2859 284 <option value="statement">Statement</option>
nicholas@2859 285 <option value="number">Number</option>
nicholas@2859 286 <option value="slider">Slider</option>
nicholas@2859 287 <option value="video">Video</option>
nicholas@2859 288 <option value="youtube">YouTube</option>
nicholas@2859 289 </select>
nicholas@2859 290 </div>
nicholas@2859 291 <div class="attribute">
nicholas@2859 292 <span>Unique Survey Entry ID:</span>
nicholas@2877 293 <input type="text" ng-model="opt.id" required/>
nicholas@2859 294 </div>
nicholas@2859 295 <div class="attribute">
nicholas@2859 296 <span>Entry Name:</span>
nicholas@2859 297 <input type="text" ng-model="opt.name" />
nicholas@2859 298 </div>
nicholas@2859 299 <div class="attribute" ng-show="['question', 'checkbox', 'radio', 'number'].indexOf(opt.type) >= 0">
nicholas@2859 300 <span>Mandatory:</span>
nicholas@2859 301 <input type="checkbox" ng-model="opt.mandatory" />
nicholas@2859 302 </div>
nicholas@2859 303 <div class="attribute">
nicholas@2859 304 <span>Minimum Wait Time (s):</span>
nicholas@2859 305 <input type="number" ng-model="opt.minWait" min="0" />
nicholas@2859 306 </div>
nicholas@2859 307 <div class="attribute" ng-show="opt.type == 'question'">
nicholas@2859 308 <span>Box Size:</span>
nicholas@2859 309 <select ng-model="opt.boxsize">
nicholas@2859 310 <option value="small">Small</option>
nicholas@2859 311 <option value="normal">Normal</option>
nicholas@2859 312 <option value="large">Large</option>
nicholas@2859 313 <option value="huge">Huge</option>
nicholas@2859 314 </select>
nicholas@2859 315 </div>
nicholas@2859 316 <div class="attribute" ng-show="['checkbox', 'radio'].indexOf(opt.type) >= 0">
nicholas@2859 317 <span>Minimum Selected:</span>
nicholas@2859 318 <input type="number" ng-model="opt.min" min="0" />
nicholas@2859 319 </div>
nicholas@2859 320 <div class="attribute" ng-show="['checkbox', 'radio'].indexOf(opt.type) >= 0">
nicholas@2859 321 <span>Maximum Selected:</span>
nicholas@2859 322 <input type="number" ng-model="opt.max" max="{{opt.options.length}}" />
nicholas@2859 323 </div>
nicholas@2859 324 <div class="attribute" ng-show="['slider', 'number'].indexOf(opt.type) >= 0">
nicholas@2859 325 <span>Minimum Value:</span>
nicholas@2859 326 <input type="number" ng-model="opt.min" />
nicholas@2859 327 </div>
nicholas@2859 328 <div class="attribute" ng-show="['slider', 'number'].indexOf(opt.type) >= 0">
nicholas@2859 329 <span>Maximum Value:</span>
nicholas@2859 330 <input type="number" ng-model="opt.max" />
nicholas@2859 331 </div>
nicholas@2859 332 <div class="attribute" ng-show="['video', 'youtube'].indexOf(opt.type) >= 0">
nicholas@2859 333 <span>Video URL:</span>
nicholas@2859 334 <input type="text" ng-model="opt.url" />
nicholas@2859 335 </div>
nicholas@2859 336 </div>
nicholas@2859 337 <div class="node">
nicholas@2859 338 <h4>Statement</h4>
nicholas@2859 339 <textarea ng-model="opt.statement"></textarea>
nicholas@2859 340 </div>
nicholas@2859 341 <div class="node" ng-show="['checkbox', 'radio'].indexOf(opt.type) >= 0">
nicholas@2859 342 <h4>Options</h4>
nicholas@2859 343 <div>
nicholas@2859 344 <button type="button" class="btn btn-default" ng-click="addOption();">Add Option</button>
nicholas@2859 345 </div>
nicholas@2859 346 <div class="node" ng-repeat="option in opt.options">
nicholas@2859 347 <div class="attributes">
nicholas@2859 348 <div class="attribute">
nicholas@2859 349 <button type="button" class="btn btn-default" ng-click="removeOption(option);">Remove</button>
nicholas@2859 350 </div>
nicholas@2859 351 <div class="attribute">
nicholas@2859 352 <span>Name: </span>
nicholas@2877 353 <input type="text" ng-model="option.name" required/>
nicholas@2859 354 </div>
nicholas@2859 355 <div class="attribute">
nicholas@2859 356 <span>Displayed Text: </span>
nicholas@2877 357 <input type="text" ng-model="option.text" required/>
nicholas@2859 358 </div>
nicholas@2859 359 </div>
nicholas@2859 360 </div>
nicholas@2859 361 </div>
nicholas@2859 362 <div class="node">
nicholas@2859 363 <h4>Conditionals</h4>
nicholas@2859 364 <button type="button" class="btn btn-default" ng-click="addCondition()">Add Condition</button>
nicholas@2859 365 <div class="node" ng-repeat="condition in opt.conditions">
nicholas@2859 366 <div class="attributes">
nicholas@2859 367 <div class="attribute">
nicholas@2859 368 <button type="button" class="btn btn-danger" ng-click="removeCondition(condition)">Remove</button>
nicholas@2859 369 </div>
nicholas@2859 370 <div class="attribute">
nicholas@2859 371 <span>Check Type:</span>
nicholas@2859 372 <select ng-model="condition.check">
nicholas@2859 373 <option value="equals">Equal To</option>
nicholas@2859 374 <option value="lessThan">Less Than</option>
nicholas@2859 375 <option value="greaterThan">Greater Than</option>
nicholas@2859 376 <option value="stringContains">String Contains</option>
nicholas@2859 377 </select>
nicholas@2859 378 </div>
nicholas@2859 379 <div class="attribute">
nicholas@2859 380 <span>Value: </span>
nicholas@2877 381 <input type="text" ng-model="condition.value" required/>
nicholas@2859 382 </div>
nicholas@2859 383 <div class="attribute">
nicholas@2859 384 <span>Jump To On Pass: </span>
nicholas@2859 385 <select ng-model="condition.jumpToOnPass">
nicholas@2859 386 <option value="">None</option>
nicholas@2859 387 <option ng-repeat="entry in survey.options" value="{{entry.id}}">{{entry.id}}</option>
nicholas@2859 388 </select>
nicholas@2859 389 </div>
nicholas@2859 390 <div class="attribute">
nicholas@2859 391 <span>Jump To On Fail: </span>
nicholas@2859 392 <select ng-model="condition.jumpToOnFail">
nicholas@2859 393 <option value="">None</option>
nicholas@2859 394 <option ng-repeat="entry in survey.options" value="{{entry.id}}">{{entry.id}}</option>
nicholas@2859 395 </select>
nicholas@2859 396 </div>
nicholas@2859 397 </div>
nicholas@2859 398 </div>
nicholas@2859 399 </div>
nicholas@2859 400 </div>
nicholas@2859 401 </div>
nicholas@2859 402 <div id="globalinterface" class="node" ng-controller="interfaceNode" ng-init="interface = specification.interfaces">
nicholas@2859 403 <h2>Interface (Globals)</h2>
nicholas@2859 404 <div class="node interfaceOptions">
nicholas@2859 405 <div class="attributes">
nicholas@2859 406 <div class="attribute" name="fragmentPlayed" type="check">
nicholas@2859 407 <span>Check all fragments played: </span>
nicholas@2859 408 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 409 </div>
nicholas@2859 410 <div class="attribute" name="fragmentFullPlayback" type="check">
nicholas@2859 411 <span>Check all fragments fully played: </span>
nicholas@2859 412 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 413 </div>
nicholas@2859 414 <div class="attribute" name="fragmentMoved" type="check">
nicholas@2859 415 <span>Check all fragments have been moved: </span>
nicholas@2859 416 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 417 </div>
nicholas@2859 418 <div class="attribute" name="fragmentComments" type="check">
nicholas@2859 419 <span>Check all fragments have comments: </span>
nicholas@2859 420 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 421 </div>
nicholas@2859 422 <div class="attribute" name="scalerange" type="check">
nicholas@2859 423 <span>Enforce a scale usage: </span>
nicholas@2859 424 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 425 <span>Minimum:</span>
nicholas@2859 426 <input type="number" min="0" max="100" name="min" />
nicholas@2859 427 <span>Maximum:</span>
nicholas@2859 428 <input type="number" min="0" max="100" name="max" />
nicholas@2859 429 </div>
nicholas@2859 430 <div class="attribute" name="volume" type="show">
nicholas@2859 431 <span>Show master volume control: </span>
nicholas@2859 432 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 433 </div>
nicholas@2859 434 <div class="attribute" name="playhead" type="show">
nicholas@2859 435 <span>Show playhead: </span>
nicholas@2859 436 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 437 </div>
nicholas@2859 438 <div class="attribute" name="page-count" type="show">
nicholas@2859 439 <span>Show Page Count: </span>
nicholas@2859 440 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 441 </div>
nicholas@2859 442 <div class="attribute" name="comments" type="show">
nicholas@2859 443 <span>Show Fragment Comments: </span>
nicholas@2859 444 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 445 </div>
nicholas@2859 446 </div>
nicholas@2859 447 </div>
nicholas@2859 448 </div>
nicholas@2859 449 </div>
nicholas@2859 450 <div style="text-align: center;">
nicholas@2859 451 <button type="button" class="btn btn-success" ng-click="addPage()">Add Page</button>
nicholas@2859 452 </div>
nicholas@2859 453 <div class="node pageNode" ng-controller="page" ng-repeat="page in specification.pages">
nicholas@2859 454 <h2>Page</h2>
nicholas@2862 455 <button type="button" class="btn btn-danger" ng-click="removePage(page)">Remove Page</button>
nicholas@2859 456 <div class="attributes">
nicholas@2859 457 <div class="attribute">
nicholas@2859 458 <span>Unique ID: </span>
nicholas@2877 459 <input type="text" ng-model="page.id" required/>
nicholas@2859 460 </div>
nicholas@2884 461 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Define the common root of each fragment URL. For example if every fragment URL starts with 'http://example.org/media/' then this can be placed here and the remainder for each fragment in their respective URL boxed.">
nicholas@2859 462 <span>Fragment common-root URL: </span>
nicholas@2859 463 <input type="text" ng-model="page.hostURL" />
nicholas@2859 464 </div>
nicholas@2859 465 <div class="attribute">
nicholas@2859 466 <span>Randomise Fragment Order: </span>
nicholas@2859 467 <input type="checkbox" ng-model="page.randomiseOrder" />
nicholas@2859 468 </div>
nicholas@2884 469 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Specify if this page should be repeated and how many times. Please note, that if page-pooling is also selected then it 'may' not repeat as many times.">
nicholas@2859 470 <span>Repeat Page N-times: </span>
nicholas@2877 471 <input type="number" ng-model="page.repeatCount" value="0" step="1" />
nicholas@2859 472 </div>
nicholas@2884 473 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Loop audio playback until manually stopped or the page submit button is pressed">
nicholas@2859 474 <span>Loop audio: </span>
nicholas@2859 475 <input type="checkbox" ng-model="page.loop" />
nicholas@2859 476 </div>
nicholas@2884 477 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Synchronise playback of each fragment in this page. If all fragments have the same audio (such as mix evaluations) then this can enable users to seemlessly transition. Otherwise audio will start from the beginning of each fragment">
nicholas@2859 478 <span>Synchronous audio playback: </span>
nicholas@2859 479 <input type="checkbox" ng-model="page.synchronous" />
nicholas@2859 480 </div>
nicholas@2884 481 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Over-ride global loudness normalisation">
nicholas@2859 482 <span>Loudness (page): </span>
nicholas@2859 483 <input type="number" ng-model="page.loudness" max="0" />
nicholas@2859 484 </div>
nicholas@2884 485 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Label type to display on the fragments.">
nicholas@2859 486 <span>Label type: </span>
nicholas@2859 487 <select ng-model="page.label">
nicholas@2859 488 <option value="default">Default</option>
nicholas@2859 489 <option value="none">None</option>
nicholas@2859 490 <option value="number">[1, 2, 3...]</option>
nicholas@2859 491 <option value="letter">[a, b, c...]</option>
nicholas@2859 492 <option value="capital">[A, B, C...]</option>
nicholas@2859 493 <option value="samediff" ng-show="specification.interface == 'AB'">[Same, Different]</option>
nicholas@2859 494 </select>
nicholas@2859 495 </div>
nicholas@2859 496 <div class="attribute" ng-show="page.label != 'default' && page.label != 'none'">
nicholas@2859 497 <span>Label Start: </span>
nicholas@2859 498 <input type="text" ng-model="page.labelStart" />
nicholas@2859 499 </div>
nicholas@2884 500 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Select a subgroup of the given audio fragments to display. 0 or blank means all fragments will be displayed.">
nicholas@2859 501 <span>Fragment pool size: </span>
nicholas@2859 502 <input type="number" ng-model="page.poolSize" min="0" max="page.audioElements.length" />
nicholas@2859 503 </div>
nicholas@2884 504 <div class="attribute" ng-show="specification.poolSize > 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Always display this page, even after sub-pooling of pages">
nicholas@2859 505 <span>Always include page: </span>
nicholas@2859 506 <input type="checkbox" ng-model="page.alwaysInclude" />
nicholas@2859 507 </div>
nicholas@2884 508 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Always show this page in this position. Useful for training pages to ensure they are always positioned first.">
nicholas@2859 509 <span>Fixed Page Position: </span>
nicholas@2859 510 <input type="number" ng-model="page.position" min="0" max="{{specification.pages.length}}" />
nicholas@2859 511 </div>
nicholas@2884 512 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Over-ride global pre-silence">
nicholas@2859 513 <span>Fragment pre-silence: </span>
nicholas@2859 514 <input type="number" ng-model="page.preSilence" min="0" step="0.1" />
nicholas@2859 515 </div>
nicholas@2884 516 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Over-ride global post-silence">
nicholas@2859 517 <span>Fragment post-silence: </span>
nicholas@2859 518 <input type="number" ng-model="page.postSilence" min="0" step="0.1" />
nicholas@2859 519 </div>
nicholas@2884 520 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Disable switching of audio">
nicholas@2859 521 <span>Cannot interupt audio: </span>
nicholas@2859 522 <input type="checkbox" ng-model="page.playOne" />
nicholas@2859 523 </div>
nicholas@2884 524 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Only allow playing fragments' interface handle to be manipulated during playback.">
nicholas@2859 525 <span>Only move playing audio: </span>
nicholas@2859 526 <input type="checkbox" ng-model="page.restrictMovement" />
nicholas@2859 527 </div>
nicholas@2884 528 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Over-ride global minimum number of fragment plays">
nicholas@2874 529 <span>Minimum number of fragment plays</span>
nicholas@2874 530 <input type="number" ng-model="page.minNumberPlays" min="0" max="{{page.maxNumberPlays || specification.maxNumberPlays}}" />
nicholas@2874 531 </div>
nicholas@2884 532 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Over-ride global maximum number of fragment plays">
nicholas@2874 533 <span>Maximum number of fragment plays</span>
nicholas@2874 534 <input type="number" ng-model="page.maxNumberPlays" min="{{page.minNumberPlays || specification.minNumberPlays || 0}}" />
nicholas@2874 535 </div>
nicholas@2859 536 </div>
nicholas@2884 537 <div class="node" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Set the title of the page">
nicholas@2859 538 <h3>Page Title</h3>
nicholas@2859 539 <textarea ng-model="page.title"></textarea>
nicholas@2859 540 </div>
nicholas@2859 541 <div class="node">
nicholas@2859 542 <h3>Comment box text prefix</h3>
nicholas@2859 543 <textarea ng-model="page.commentboxprefix"></textarea>
nicholas@2859 544 <p>Example:
nicholas@2859 545 <span style="font-weight:600">{{page.commentboxprefix}} A</span>
nicholas@2859 546 </p>
nicholas@2859 547 </div>
nicholas@2859 548 <div class="node" ng-controller="survey" ng-init="survey = page.preTest">
nicholas@2859 549 <h2>Pre Page Survey</h2>
nicholas@2859 550 <button type="button" class="btn btn-success" ng-click="addSurveyEntry()">Add Entry</button>
nicholas@2859 551 <div class="node" ng-repeat="opt in survey.options" ng-controller="surveyOption">
nicholas@2859 552 <h3>Survey Entry</h3>
nicholas@2859 553 <button type="button" class="btn btn-danger" ng-click="removeSurveyEntry(opt);">Delete Entry</button>
nicholas@2859 554 <div class="attributes">
nicholas@2859 555 <div class="attribute">
nicholas@2859 556 <span>Survey Type: </span>
nicholas@2859 557 <select ng-model="opt.type">
nicholas@2859 558 <option value="question">Question</option>
nicholas@2859 559 <option value="radio">Radio</option>
nicholas@2859 560 <option value="checkbox">Checkbox</option>
nicholas@2859 561 <option value="statement">Statement</option>
nicholas@2859 562 <option value="number">Number</option>
nicholas@2859 563 <option value="slider">Slider</option>
nicholas@2859 564 <option value="video">Video</option>
nicholas@2859 565 <option value="youtube">YouTube</option>
nicholas@2859 566 </select>
nicholas@2859 567 </div>
nicholas@2859 568 <div class="attribute">
nicholas@2859 569 <span>Unique Survey Entry ID:</span>
nicholas@2877 570 <input type="text" ng-model="opt.id" required/>
nicholas@2859 571 </div>
nicholas@2859 572 <div class="attribute">
nicholas@2859 573 <span>Entry Name:</span>
nicholas@2859 574 <input type="text" ng-model="opt.name" />
nicholas@2859 575 </div>
nicholas@2859 576 <div class="attribute" ng-show="['question', 'checkbox', 'radio', 'number'].indexOf(opt.type) >= 0">
nicholas@2859 577 <span>Mandatory:</span>
nicholas@2859 578 <input type="checkbox" ng-model="opt.mandatory" />
nicholas@2859 579 </div>
nicholas@2859 580 <div class="attribute">
nicholas@2859 581 <span>Minimum Wait Time (s):</span>
nicholas@2859 582 <input type="number" ng-model="opt.minWait" min="0" />
nicholas@2859 583 </div>
nicholas@2859 584 <div class="attribute" ng-show="opt.type == 'question'">
nicholas@2859 585 <span>Box Size:</span>
nicholas@2859 586 <select ng-model="opt.boxsize">
nicholas@2859 587 <option value="small">Small</option>
nicholas@2859 588 <option value="normal">Normal</option>
nicholas@2859 589 <option value="large">Large</option>
nicholas@2859 590 <option value="huge">Huge</option>
nicholas@2859 591 </select>
nicholas@2859 592 </div>
nicholas@2859 593 <div class="attribute" ng-show="['checkbox', 'radio'].indexOf(opt.type) >= 0">
nicholas@2859 594 <span>Minimum Selected:</span>
nicholas@2859 595 <input type="number" ng-model="opt.min" min="0" />
nicholas@2859 596 </div>
nicholas@2859 597 <div class="attribute" ng-show="['checkbox', 'radio'].indexOf(opt.type) >= 0">
nicholas@2859 598 <span>Maximum Selected:</span>
nicholas@2859 599 <input type="number" ng-model="opt.max" max="{{opt.options.length}}" />
nicholas@2859 600 </div>
nicholas@2859 601 <div class="attribute" ng-show="['slider', 'number'].indexOf(opt.type) >= 0">
nicholas@2859 602 <span>Minimum Value:</span>
nicholas@2859 603 <input type="number" ng-model="opt.min" />
nicholas@2859 604 </div>
nicholas@2859 605 <div class="attribute" ng-show="['slider', 'number'].indexOf(opt.type) >= 0">
nicholas@2859 606 <span>Maximum Value:</span>
nicholas@2859 607 <input type="number" ng-model="opt.max" />
nicholas@2859 608 </div>
nicholas@2859 609 <div class="attribute" ng-show="['video', 'youtube'].indexOf(opt.type) >= 0">
nicholas@2859 610 <span>Video URL:</span>
nicholas@2859 611 <input type="text" ng-model="opt.url" />
nicholas@2859 612 </div>
nicholas@2859 613 </div>
nicholas@2859 614 <div class="node">
nicholas@2859 615 <h4>Statement</h4>
nicholas@2859 616 <textarea ng-model="opt.statement"></textarea>
nicholas@2859 617 </div>
nicholas@2859 618 <div class="node" ng-show="['checkbox', 'radio'].indexOf(opt.type) >= 0">
nicholas@2859 619 <h4>Options</h4>
nicholas@2859 620 <div>
nicholas@2859 621 <button type="button" class="btn btn-default" ng-click="addOption();">Add Option</button>
nicholas@2859 622 </div>
nicholas@2859 623 <div class="node" ng-repeat="option in opt.options">
nicholas@2859 624 <div class="attributes">
nicholas@2859 625 <div class="attribute">
nicholas@2859 626 <button type="button" class="btn btn-default" ng-click="removeOption(option);">Remove</button>
nicholas@2859 627 </div>
nicholas@2859 628 <div class="attribute">
nicholas@2859 629 <span>Name: </span>
nicholas@2877 630 <input type="text" ng-model="option.name" required/>
nicholas@2859 631 </div>
nicholas@2859 632 <div class="attribute">
nicholas@2859 633 <span>Displayed Text: </span>
nicholas@2877 634 <input type="text" ng-model="option.text" required/>
nicholas@2859 635 </div>
nicholas@2859 636 </div>
nicholas@2859 637 </div>
nicholas@2859 638 </div>
nicholas@2859 639 <div class="node">
nicholas@2859 640 <h4>Conditionals</h4>
nicholas@2859 641 <button type="button" class="btn btn-default" ng-click="addCondition()">Add Condition</button>
nicholas@2859 642 <div class="node" ng-repeat="condition in opt.conditions">
nicholas@2859 643 <div class="attributes">
nicholas@2859 644 <div class="attribute">
nicholas@2859 645 <button type="button" class="btn btn-danger" ng-click="removeCondition(condition)">Remove</button>
nicholas@2859 646 </div>
nicholas@2859 647 <div class="attribute">
nicholas@2859 648 <span>Check Type:</span>
nicholas@2859 649 <select ng-model="condition.check">
nicholas@2859 650 <option value="equals">Equal To</option>
nicholas@2859 651 <option value="lessThan">Less Than</option>
nicholas@2859 652 <option value="greaterThan">Greater Than</option>
nicholas@2859 653 <option value="stringContains">String Contains</option>
nicholas@2859 654 </select>
nicholas@2859 655 </div>
nicholas@2859 656 <div class="attribute">
nicholas@2859 657 <span>Value: </span>
nicholas@2877 658 <input type="text" ng-model="condition.value" required/>
nicholas@2859 659 </div>
nicholas@2859 660 <div class="attribute">
nicholas@2859 661 <span>Jump To On Pass: </span>
nicholas@2859 662 <select ng-model="condition.jumpToOnPass">
nicholas@2859 663 <option value="">None</option>
nicholas@2859 664 <option ng-repeat="entry in survey.options" value="{{entry.id}}">{{entry.id}}</option>
nicholas@2859 665 </select>
nicholas@2859 666 </div>
nicholas@2859 667 <div class="attribute">
nicholas@2859 668 <span>Jump To On Fail: </span>
nicholas@2859 669 <select ng-model="condition.jumpToOnFail">
nicholas@2859 670 <option value="">None</option>
nicholas@2859 671 <option ng-repeat="entry in survey.options" value="{{entry.id}}">{{entry.id}}</option>
nicholas@2859 672 </select>
nicholas@2859 673 </div>
nicholas@2859 674 </div>
nicholas@2859 675 </div>
nicholas@2859 676 </div>
nicholas@2859 677 </div>
nicholas@2859 678 </div>
nicholas@2867 679 <div class="node" ng-controller="survey" ng-init="survey = page.postTest">
nicholas@2859 680 <h2>Post Page Survey</h2>
nicholas@2859 681 <button type="button" class="btn btn-success" ng-click="addSurveyEntry()">Add Entry</button>
nicholas@2859 682 <div class="node" ng-repeat="opt in survey.options" ng-controller="surveyOption">
nicholas@2859 683 <h3>Survey Entry</h3>
nicholas@2859 684 <button type="button" class="btn btn-danger" ng-click="removeSurveyEntry(opt);">Delete Entry</button>
nicholas@2859 685 <div class="attributes">
nicholas@2859 686 <div class="attribute">
nicholas@2859 687 <span>Survey Type: </span>
nicholas@2859 688 <select ng-model="opt.type">
nicholas@2859 689 <option value="question">Question</option>
nicholas@2859 690 <option value="radio">Radio</option>
nicholas@2859 691 <option value="checkbox">Checkbox</option>
nicholas@2859 692 <option value="statement">Statement</option>
nicholas@2859 693 <option value="number">Number</option>
nicholas@2859 694 <option value="slider">Slider</option>
nicholas@2859 695 <option value="video">Video</option>
nicholas@2859 696 <option value="youtube">YouTube</option>
nicholas@2859 697 </select>
nicholas@2859 698 </div>
nicholas@2859 699 <div class="attribute">
nicholas@2859 700 <span>Unique Survey Entry ID:</span>
nicholas@2877 701 <input type="text" ng-model="opt.id" required />
nicholas@2859 702 </div>
nicholas@2859 703 <div class="attribute">
nicholas@2859 704 <span>Entry Name:</span>
nicholas@2859 705 <input type="text" ng-model="opt.name" />
nicholas@2859 706 </div>
nicholas@2859 707 <div class="attribute" ng-show="['question', 'checkbox', 'radio', 'number'].indexOf(opt.type) >= 0">
nicholas@2859 708 <span>Mandatory:</span>
nicholas@2859 709 <input type="checkbox" ng-model="opt.mandatory" />
nicholas@2859 710 </div>
nicholas@2859 711 <div class="attribute">
nicholas@2859 712 <span>Minimum Wait Time (s):</span>
nicholas@2859 713 <input type="number" ng-model="opt.minWait" min="0" />
nicholas@2859 714 </div>
nicholas@2859 715 <div class="attribute" ng-show="opt.type == 'question'">
nicholas@2859 716 <span>Box Size:</span>
nicholas@2859 717 <select ng-model="opt.boxsize">
nicholas@2859 718 <option value="small">Small</option>
nicholas@2859 719 <option value="normal">Normal</option>
nicholas@2859 720 <option value="large">Large</option>
nicholas@2859 721 <option value="huge">Huge</option>
nicholas@2859 722 </select>
nicholas@2859 723 </div>
nicholas@2859 724 <div class="attribute" ng-show="['checkbox', 'radio'].indexOf(opt.type) >= 0">
nicholas@2859 725 <span>Minimum Selected:</span>
nicholas@2859 726 <input type="number" ng-model="opt.min" min="0" />
nicholas@2859 727 </div>
nicholas@2859 728 <div class="attribute" ng-show="['checkbox', 'radio'].indexOf(opt.type) >= 0">
nicholas@2859 729 <span>Maximum Selected:</span>
nicholas@2859 730 <input type="number" ng-model="opt.max" max="{{opt.options.length}}" />
nicholas@2859 731 </div>
nicholas@2859 732 <div class="attribute" ng-show="['slider', 'number'].indexOf(opt.type) >= 0">
nicholas@2859 733 <span>Minimum Value:</span>
nicholas@2859 734 <input type="number" ng-model="opt.min" />
nicholas@2859 735 </div>
nicholas@2859 736 <div class="attribute" ng-show="['slider', 'number'].indexOf(opt.type) >= 0">
nicholas@2859 737 <span>Maximum Value:</span>
nicholas@2859 738 <input type="number" ng-model="opt.max" />
nicholas@2859 739 </div>
nicholas@2859 740 <div class="attribute" ng-show="['video', 'youtube'].indexOf(opt.type) >= 0">
nicholas@2859 741 <span>Video URL:</span>
nicholas@2859 742 <input type="text" ng-model="opt.url" />
nicholas@2859 743 </div>
nicholas@2859 744 </div>
nicholas@2859 745 <div class="node">
nicholas@2859 746 <h4>Statement</h4>
nicholas@2859 747 <textarea ng-model="opt.statement"></textarea>
nicholas@2859 748 </div>
nicholas@2859 749 <div class="node" ng-show="['checkbox', 'radio'].indexOf(opt.type) >= 0">
nicholas@2859 750 <h4>Options</h4>
nicholas@2859 751 <div>
nicholas@2859 752 <button type="button" class="btn btn-default" ng-click="addOption();">Add Option</button>
nicholas@2859 753 </div>
nicholas@2859 754 <div class="node" ng-repeat="option in opt.options">
nicholas@2859 755 <div class="attributes">
nicholas@2859 756 <div class="attribute">
nicholas@2859 757 <button type="button" class="btn btn-default" ng-click="removeOption(option);">Remove</button>
nicholas@2859 758 </div>
nicholas@2859 759 <div class="attribute">
nicholas@2859 760 <span>Name: </span>
nicholas@2877 761 <input type="text" ng-model="option.name" required/>
nicholas@2859 762 </div>
nicholas@2859 763 <div class="attribute">
nicholas@2859 764 <span>Displayed Text: </span>
nicholas@2877 765 <input type="text" ng-model="option.text" required/>
nicholas@2859 766 </div>
nicholas@2859 767 </div>
nicholas@2859 768 </div>
nicholas@2859 769 </div>
nicholas@2859 770 <div class="node">
nicholas@2859 771 <h4>Conditionals</h4>
nicholas@2859 772 <button type="button" class="btn btn-default" ng-click="addCondition()">Add Condition</button>
nicholas@2859 773 <div class="node" ng-repeat="condition in opt.conditions">
nicholas@2859 774 <div class="attributes">
nicholas@2859 775 <div class="attribute">
nicholas@2859 776 <button type="button" class="btn btn-danger" ng-click="removeCondition(condition)">Remove</button>
nicholas@2859 777 </div>
nicholas@2859 778 <div class="attribute">
nicholas@2859 779 <span>Check Type:</span>
nicholas@2859 780 <select ng-model="condition.check">
nicholas@2859 781 <option value="equals">Equal To</option>
nicholas@2859 782 <option value="lessThan">Less Than</option>
nicholas@2859 783 <option value="greaterThan">Greater Than</option>
nicholas@2859 784 <option value="stringContains">String Contains</option>
nicholas@2859 785 </select>
nicholas@2859 786 </div>
nicholas@2859 787 <div class="attribute">
nicholas@2859 788 <span>Value: </span>
nicholas@2877 789 <input type="text" ng-model="condition.value" required/>
nicholas@2859 790 </div>
nicholas@2859 791 <div class="attribute">
nicholas@2859 792 <span>Jump To On Pass: </span>
nicholas@2859 793 <select ng-model="condition.jumpToOnPass">
nicholas@2859 794 <option value="">None</option>
nicholas@2859 795 <option ng-repeat="entry in survey.options" value="{{entry.id}}">{{entry.id}}</option>
nicholas@2859 796 </select>
nicholas@2859 797 </div>
nicholas@2859 798 <div class="attribute">
nicholas@2859 799 <span>Jump To On Fail: </span>
nicholas@2859 800 <select ng-model="condition.jumpToOnFail">
nicholas@2859 801 <option value="">None</option>
nicholas@2859 802 <option ng-repeat="entry in survey.options" value="{{entry.id}}">{{entry.id}}</option>
nicholas@2859 803 </select>
nicholas@2859 804 </div>
nicholas@2859 805 </div>
nicholas@2859 806 </div>
nicholas@2859 807 </div>
nicholas@2859 808 </div>
nicholas@2859 809 </div>
nicholas@2859 810 <button type="button" class="btn btn-success" ng-show="specification.interface == 'APE' || page.interfaces.length == 0" ng-click="addInterface()">Add Interface/Axis</button>
nicholas@2859 811 <div class="node" ng-repeat="interface in page.interfaces" ng-controller="interfaceNode">
nicholas@2859 812 <h2>Interface</h2>
nicholas@2859 813 <button type="button" class="btn btn-danger" ng-click="removeInterface(interface)">Remove Interface/Axis</button>
nicholas@2859 814 <div class="node interfaceOptions">
nicholas@2859 815 <div class="attributes">
nicholas@2859 816 <div class="attribute" name="fragmentPlayed" type="check">
nicholas@2859 817 <span>Check all fragments played: </span>
nicholas@2859 818 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 819 </div>
nicholas@2859 820 <div class="attribute" name="fragmentFullPlayback" type="check">
nicholas@2859 821 <span>Check all fragments fully played: </span>
nicholas@2859 822 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 823 </div>
nicholas@2859 824 <div class="attribute" name="fragmentMoved" type="check">
nicholas@2859 825 <span>Check all fragments have been moved: </span>
nicholas@2859 826 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 827 </div>
nicholas@2859 828 <div class="attribute" name="fragmentComments" type="check">
nicholas@2859 829 <span>Check all fragments have comments: </span>
nicholas@2859 830 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 831 </div>
nicholas@2859 832 <div class="attribute" name="scalerange" type="check">
nicholas@2859 833 <span>Enforce a scale usage: </span>
nicholas@2859 834 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 835 <span>Minimum:</span>
nicholas@2859 836 <input type="number" min="0" max="100" name="min" />
nicholas@2859 837 <span>Maximum:</span>
nicholas@2859 838 <input type="number" min="0" max="100" name="max" />
nicholas@2859 839 </div>
nicholas@2859 840 <div class="attribute" name="volume" type="show">
nicholas@2859 841 <span>Show master volume control: </span>
nicholas@2859 842 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 843 </div>
nicholas@2859 844 <div class="attribute" name="playhead" type="show">
nicholas@2859 845 <span>Show playhead: </span>
nicholas@2859 846 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 847 </div>
nicholas@2859 848 <div class="attribute" name="page-count" type="show">
nicholas@2859 849 <span>Show Page Count: </span>
nicholas@2859 850 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 851 </div>
nicholas@2859 852 <div class="attribute" name="comments" type="show">
nicholas@2859 853 <span>Show Fragment Comments: </span>
nicholas@2859 854 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 855 </div>
nicholas@2859 856 </div>
nicholas@2859 857 </div>
nicholas@2859 858 <div class="node">
nicholas@2859 859 <h3>Axis Title</h3>
nicholas@2859 860 <textarea ng-model="interface.title"></textarea>
nicholas@2859 861 <div class="attributes">
nicholas@2859 862 <div class="attribute">
nicholas@2859 863 <span>Axis name (in saves): </span>
nicholas@2859 864 <input type="text" ng-model="interface.name" />
nicholas@2859 865 </div>
nicholas@2859 866 </div>
nicholas@2859 867 </div>
nicholas@2859 868 <div class="node">
nicholas@2859 869 <h3>Axis Image</h3>
nicholas@2859 870 <textarea ng-model="interface.image"></textarea>
nicholas@2859 871 </div>
nicholas@2886 872 <div class="node" name="scale-selection">
nicholas@2859 873 <h3>Axis Scales</h3>
nicholas@2864 874 <button type="button" class="btn btn-success" ng-click="addScale();">Add</button>
nicholas@2864 875 <button type="button" class="btn btn-danger" ng-click="clearScales()" ng-show="interface.scales.length > 0">Clear Scales</button>
nicholas@2864 876 <div class="dropdown" style="display: inline-block;">
nicholas@2864 877 <button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
nicholas@2886 878 Scales: {{selectedScale}}
nicholas@2864 879 <span class="caret"></span>
nicholas@2864 880 </button>
nicholas@2864 881 <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
nicholas@2886 882 <li ng-repeat="scale in scales" ng-click="useScales(scale)"><a href="#">{{scale.name}}</a></li>
nicholas@2864 883 </ul>
nicholas@2864 884 </div>
nicholas@2859 885 <div class="node" ng-repeat="scale in interface.scales">
nicholas@2859 886 <div class="attributes">
nicholas@2859 887 <div class="attribute">
nicholas@2859 888 <button type="button" class="btn btn-danger" ng-click="removeScale(scale);">Remove</button>
nicholas@2859 889 </div>
nicholas@2859 890 <div class="attribute">
nicholas@2859 891 <span>Position: </span>
nicholas@2877 892 <input type="number" min="0" max="100" ng-model="scale.position" required/>
nicholas@2859 893 </div>
nicholas@2859 894 <div class="attribute">
nicholas@2859 895 <span>Text: </span>
nicholas@2877 896 <input type="text" ng-model="scale.text" required/>
nicholas@2859 897 </div>
nicholas@2859 898 </div>
nicholas@2859 899 </div>
nicholas@2859 900 </div>
nicholas@2859 901 </div>
nicholas@2859 902 <div class="node">
nicholas@2859 903 <h3>Comment Questions</h3>
nicholas@2859 904 <button type="button" class="btn btn-success" ng-click="addCommentQuestion()">Add Comment Question</button>
nicholas@2859 905 <div class="node" ng-repeat="cq in page.commentQuestions">
nicholas@2859 906 <button type="button" class="btn btn-danger" ng-click="removeCommentQuestion(cq)">Remove Comment Question</button>
nicholas@2859 907 <div class="attributes">
nicholas@2859 908 <div class="attribute">
nicholas@2859 909 <span>Unique ID:</span>
nicholas@2877 910 <input type="text" ng-model="cq.id" required/>
nicholas@2859 911 </div>
nicholas@2859 912 <div class="attribute">
nicholas@2859 913 <span>Common Name:</span>
nicholas@2859 914 <input type="text" ng-model="cq.name" />
nicholas@2859 915 </div>
nicholas@2859 916 <div class="attribute" ng-show="cq.type == 'slider'">
nicholas@2859 917 <span>Minimum:</span>
nicholas@2859 918 <input type="number" ng-model="cq.min" />
nicholas@2859 919 </div>
nicholas@2859 920 <div class="attribute" ng-show="cq.type == 'slider'">
nicholas@2859 921 <span>Maximum:</span>
nicholas@2859 922 <input type="number" ng-model="cq.max" />
nicholas@2859 923 </div>
nicholas@2859 924 <div class="attribute" ng-show="cq.type == 'slider'">
nicholas@2859 925 <span>Step size:</span>
nicholas@2859 926 <input type="number" ng-model="cq.step" />
nicholas@2859 927 </div>
nicholas@2859 928 <div class="attribute" ng-show="cq.type == 'slider'">
nicholas@2859 929 <span>Initial Value:</span>
nicholas@2859 930 <input type="number" ng-model="cq.value" />
nicholas@2859 931 </div>
nicholas@2859 932 </div>
nicholas@2859 933 <div class="node">
nicholas@2859 934 <h4>Question:</h4>
nicholas@2859 935 <textarea ng-model="cq.statement"></textarea>
nicholas@2859 936 </div>
nicholas@2859 937 <div class="node" ng-show="['radio', 'checkbox'].indexOf(cq.type) >= 0">
nicholas@2859 938 <h4>Options</h4>
nicholas@2859 939 <div class="node" ng-repeat="option in cq.options">
nicholas@2859 940 <div class="attributes">
nicholas@2859 941 <div class="attribute">
nicholas@2859 942 <button type="button" class="btn btn-danger" ng-click="removeCommentQuestionOption(cq,option)">Remove</button>
nicholas@2859 943 </div>
nicholas@2859 944 <div class="attribute">
nicholas@2859 945 <span>Name: </span>
nicholas@2877 946 <input type="text" ng-model="option.name" required/>
nicholas@2859 947 </div>
nicholas@2859 948 <div class="attribute">
nicholas@2859 949 <span>Display Text: </span>
nicholas@2877 950 <input type="text" ng-model="option.text" required/>
nicholas@2859 951 </div>
nicholas@2859 952 </div>
nicholas@2859 953 </div>
nicholas@2859 954 </div>
nicholas@2859 955 </div>
nicholas@2859 956 </div>
nicholas@2859 957 <button type="button" class="btn btn-success" ng-click="addAudioElement()">Add Fragment</button>
nicholas@2859 958 <div class="node" ng-repeat="fragment in page.audioElements">
nicholas@2859 959 <h3>Audio Fragment</h3>
nicholas@2859 960 <button type="button" class="btn btn-danger" ng-click="removeAudioElement(fragment)">Remove Fragment</button>
nicholas@2859 961 <div class="attributes">
nicholas@2859 962 <div class="attribute">
nicholas@2859 963 <span>Unique ID: </span>
nicholas@2877 964 <input type="text" ng-model="fragment.id" required/>
nicholas@2859 965 </div>
nicholas@2859 966 <div class="attribute">
nicholas@2859 967 <span>URL: </span>
nicholas@2877 968 <input type="text" ng-model="fragment.url" required/>
nicholas@2859 969 <span>Full URL: </span><span style="font-weight=600">{{page.hostURL}}{{fragment.url}}</span>
nicholas@2859 970 </div>
nicholas@2884 971 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Set the gain of this fragment. This is applied after any normalisation">
nicholas@2859 972 <span>Fragment Gain (dB): </span>
nicholas@2859 973 <input type="number" ng-model="fragment.gain" />
nicholas@2859 974 </div>
nicholas@2884 975 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Manually set the label">
nicholas@2859 976 <span>Fragment Label: </span>
nicholas@2859 977 <input type="text" ng-model="fragment.label" />
nicholas@2859 978 </div>
nicholas@2859 979 <div class="attribute">
nicholas@2859 980 <span>Fragment Common name: </span>
nicholas@2859 981 <input type="text" ng-model="fragment.name" />
nicholas@2859 982 </div>
nicholas@2859 983 <div class="attribute">
nicholas@2859 984 <span>Fragment Type: </span>
nicholas@2859 985 <select ng-model="fragment.type">
nicholas@2859 986 <option value="normal">Normal</option>
nicholas@2859 987 <option value="anchor">Hidden Anchor</option>
nicholas@2859 988 <option value="reference">Hidden Reference</option>
nicholas@2859 989 <option value="outside-reference">Outside Reference</option>
nicholas@2859 990 </select>
nicholas@2859 991 </div>
nicholas@2859 992 <div class="attribute" ng-show="fragment.type == 'anchor'">
nicholas@2859 993 <span>Anchor must be below: </span>
nicholas@2859 994 <input type="number" ng-model="fragment.marker" min="0" max="100" />
nicholas@2859 995 </div>
nicholas@2859 996 <div class="attribute" ng-show="fragment.type == 'reference'">
nicholas@2859 997 <span>Reference must be above: </span>
nicholas@2859 998 <input type="number" ng-model="fragment.marker" min="0" max="100" />
nicholas@2859 999 </div>
nicholas@2884 1000 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Over-ride global and page loudness">
nicholas@2859 1001 <span>Loudness: </span>
nicholas@2859 1002 <input type="number" ng-model="fragment.loudness" max="0" />
nicholas@2859 1003 </div>
nicholas@2884 1004 <div class="attribute" ng-show="page.poolSize > 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Always include this fragment after any sub-pooling">
nicholas@2859 1005 <span>Always include fragment: </span>
nicholas@2859 1006 <input type="checkbox" ng-model="fragment.alwaysInclude" max="0" />
nicholas@2859 1007 </div>
nicholas@2884 1008 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Over-ride global / page pre-silence">
nicholas@2859 1009 <span>Fragment Pre-Silence: </span>
nicholas@2859 1010 <input type="number" ng-model="fragment.preSilence" max="0" step="0.1" />
nicholas@2859 1011 </div>
nicholas@2884 1012 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Over-ride global / page post-silence">
nicholas@2859 1013 <span>Fragment Post-Silence: </span>
nicholas@2859 1014 <input type="number" ng-model="fragment.postSilence" max="0" step="0.1" />
nicholas@2859 1015 </div>
nicholas@2884 1016 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="By default the fragment will start playback at the beginning.">
nicholas@2859 1017 <span>Fragment playback start position (s): </span>
nicholas@2859 1018 <input type="number" ng-model="fragment.startTime" min="0" max="{{fragment.stopTime}}" />
nicholas@2859 1019 </div>
nicholas@2884 1020 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="By default the fragment will play until the end">
nicholas@2859 1021 <span>Fragment playback stop position (s): </span>
nicholas@2859 1022 <input type="number" ng-model="fragment.stopTime" min="{{fragment.startTime}}" />
nicholas@2859 1023 </div>
nicholas@2859 1024 <div class="attribute">
nicholas@2859 1025 <span>Fragment sampling rate: </span>
nicholas@2859 1026 <input type="number" ng-model="fragment.sampleRate" min="1" />
nicholas@2859 1027 </div>
nicholas@2884 1028 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Associate an image with this fragment">
nicholas@2859 1029 <span>Fragment Image (URL): </span>
nicholas@2859 1030 <input type="text" ng-model="fragment.image" />
nicholas@2859 1031 </div>
nicholas@2874 1032 <div class="attribute">
nicholas@2874 1033 <span>Minimum number of plays</span>
nicholas@2874 1034 <input type="number" ng-model="fragment.minNumberPlays" min="0" max="{{fragment.maxNumberPlays || page.maxNumberPlays || specification.maxNumberPlays}}" />
nicholas@2874 1035 </div>
nicholas@2874 1036 <div class="attribute">
nicholas@2874 1037 <span>Maximum number of plays</span>
nicholas@2874 1038 <input type="number" ng-model="fragment.maxNumberPlays" min="{{fragment.minNumberPlays || page.minNumberPlays || specification.minNumberPlays || 0}}" />
nicholas@2874 1039 </div>
nicholas@2859 1040 </div>
nicholas@2859 1041 </div>
nicholas@2859 1042 </div>
nicholas@2887 1043 </div>
nicholas@2887 1044 <div id="popupHolder" ng-show="popupVisible">
nicholas@2887 1045 <div ng-controller="introduction" class="popup" ng-show="popupVisible">
nicholas@2887 1046 <div class="popupTitle" ng-switch="state">
nicholas@2887 1047 <span ng-switch-when="0">Test Creator</span>
nicholas@2887 1048 <span ng-switch-when="1">Create New Test</span>
nicholas@2887 1049 </div>
nicholas@2887 1050 <div class="popupContent container-fluid" ng-switch="state">
nicholas@2887 1051 <div ng-switch-when="0">
nicholas@2887 1052 <div>
nicholas@2887 1053 <span>Welcome to the WAET test creator tool. This will allow you to create a new test from scratch to suit your testing needs. If you wish to update a test file, please drag and drop the XML document into the area below for processing, otherwise press 'Next' to start a new test. This tool generates files for the WAET 1.2.1 version.</span>
nicholas@2887 1054 </div>
nicholas@2887 1055 <div>
nicholas@2887 1056 <input type="file" id="files" ng-model="files" onchange="handleFiles(event)" />
nicholas@2887 1057 </div>
nicholas@2859 1058 </div>
nicholas@2887 1059 <div ng-switch-when="1">
nicholas@2887 1060 <div>
nicholas@2887 1061 <span>Please select the interface you would like to use below. Selecting an interface will give a brief description of the interface type.</span>
nicholas@2887 1062 </div>
nicholas@2887 1063 <div class="row">
nicholas@2887 1064 <div class="col-md-6" style="overflow-y: scroll;height: 333px;">
nicholas@2887 1065 <div class="new-test" ng-repeat="i in testSpecifications.interfaces" ng-mouseover="mouseover(i.name)" ng-click="initialise(i.name)">
nicholas@2887 1066 <label style="cursor:pointer">
nicholas@2887 1067 <input type="radio" name="new-test" value="{{i.name}}" id="i.name" style="cursor:pointer" /> {{i.name}}
nicholas@2887 1068 </label>
nicholas@2887 1069 </div>
nicholas@2859 1070 </div>
nicholas@2887 1071 <div class="col-md-6">
nicholas@2887 1072 <span>{{description}}</span>
nicholas@2859 1073 </div>
nicholas@2859 1074 </div>
nicholas@2859 1075 </div>
nicholas@2887 1076 </div>
nicholas@2887 1077 <div class="popupButtons">
nicholas@2887 1078 <button id="popupBack" type="button" class="btn btn-default" ng-show="state>0" ng-click="back()">Back</button>
nicholas@2887 1079 <button id="popupNext" type="button" class="btn btn-default" ng-click="next()">Next</button>
nicholas@2859 1080 </div>
nicholas@2859 1081 </div>
nicholas@2859 1082 </div>
nicholas@2887 1083 <div id="screenblank" ng-show="popupVisible"></div>
nicholas@2859 1084 </body>
nicholas@2859 1085
nicholas@2859 1086 </html>