annotate test_create.html @ 3141:335bc77627e0 tip

fixing discrete interface to allow labels to display
author Dave Moffat <me@davemoffat.com>
date Mon, 26 Jul 2021 12:15:24 +0100
parents 3dcdada1058f
children
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
n@2907 15 <title>WAET 1.2.2 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">
n@2907 21 <h1>Web Audio Evaluation Tool</h1>
n@3096 22 <h3>Test Creator <span class="label label-primary">v1.2.3</span></h3>
nicholas@2859 23 </div>
nicholas@2887 24 <button type="button" class="btn btn-info" ng-click="validate()">Validate</button>
nicholas@2887 25 <button type="button" class="btn btn-success" ng-click="exportXML()" ng-disabled="validated == false">Export XML</button>
nicholas@2887 26 <div ng-switch on="validated" ng-show="showValidationMessages">
nicholas@2887 27 <div class="panel panel-danger" ng-switch-when="false">
nicholas@2887 28 <div class="panel-heading">
nicholas@2887 29 <button type="button" class="close" data-dismiss="alert" aria-label="Close" ng-click="hideValidationMessages"><span aria-hidden="true">&times;</span></button>
nicholas@2887 30 <h3 class="panel-title">Invalid Specification!</h3>
nicholas@2887 31 </div>
nicholas@2887 32 <div class="panel-body">
nicholas@2887 33 <p>Your specification is invalid. Please fix the following issues!</p>
nicholas@2887 34 <ul id="validation-error-list">
nicholas@2887 35 <li>Errors</li>
nicholas@2887 36 </ul>
nicholas@2887 37 </div>
nicholas@2887 38 </div>
nicholas@2887 39 <div class="alert alert-success" role="alert" ng-switch-when="true">
nicholas@2887 40 <button type="button" class="close" data-dismiss="alert" aria-label="Close" ng-click="hideValidationMessages"><span aria-hidden="true">&times;</span></button>
b@2946 41 <strong>Validates! </strong><span>Well done, you can export this specification!</span>
nicholas@2887 42 </div>
nicholas@2887 43 </div>
nicholas@2859 44 <div id="setupNode" class="node" ng-controller="setup">
nicholas@2859 45 <h2>Setup</h2>
nicholas@2859 46 <div class="attributes">
nicholas@2859 47 <div class="attribute">
nicholas@2859 48 <span>Interface: </span>
n@2912 49 <select type="text" ng-model="specification.interface" required>
n@2912 50 <option value="{{i.name}}" ng-repeat="i in availableInterfaceModules">{{i.name}}</option>
n@2912 51 </select>
nicholas@2859 52 </div>
nicholas@2884 53 <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 54 <span>Save URL: </span>
nicholas@2877 55 <input type="text" ng-model="specification.projectReturn" placeholder="save.php" />
nicholas@2859 56 </div>
nicholas@2884 57 <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 58 <span>Exit URL: </span>
n@2907 59 <input type="text" ng-model="specification.returnURL" placeholder="{{placeholder('returnURL')}}" />
nicholas@2859 60 </div>
nicholas@2884 61 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Randomise the page order">
nicholas@2859 62 <span>Randomise Page Order: </span>
nicholas@2859 63 <input type="checkbox" ng-model="specification.randomiseOrder" />
nicholas@2859 64 </div>
nicholas@2884 65 <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 66 <span>Page Pool Size: </span>
n@2907 67 <input type="number" ng-model="specification.poolSize" min="0" placeholder="{{placeholder('poolSize')}}" />
nicholas@2859 68 </div>
nicholas@2884 69 <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 70 <span>Loudness Normalisation (LUFS): </span>
n@2907 71 <input type="number" ng-model="specification.loudness" max="0" placeholder="{{placeholder('loudness')}}" />
nicholas@2859 72 </div>
nicholas@2884 73 <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 74 <span>Fixed Sampling Rate: </span>
n@2907 75 <input type="number" ng-model="specification.sampleRate" min="0" placeholder="{{placeholder('sampleRate')}}" />
nicholas@2859 76 </div>
nicholas@2884 77 <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 78 <span>Global Cross-fade time: </span>
n@2907 79 <input type="number" ng-model="specification.crossFade" min="0" step="0.1" placeholder="{{placeholder('crossFade')}}" />
nicholas@2859 80 </div>
nicholas@2884 81 <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 82 <span>Global Fragment Pre-Silence: </span>
n@2907 83 <input type="number" ng-model="specification.preSilence" min="0" step="0.1" placeholder="{{placeholder('preSilence')}}" />
nicholas@2859 84 </div>
nicholas@2884 85 <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 86 <span>Global Fragment Post-Silence: </span>
n@2907 87 <input type="number" ng-model="specification.postSilence" min="0" step="0.1" placeholder="{{placeholder('postSilence')}}" />
nicholas@2859 88 </div>
nicholas@2884 89 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Disable switching of audio elements">
nicholas@2859 90 <span>Play audio one-at-a-time: </span>
nicholas@2859 91 <input type="checkbox" ng-model="specification.playOne" />
nicholas@2859 92 </div>
nicholas@2884 93 <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 94 <span>Minimum number of fragment plays</span>
n@2907 95 <input type="number" ng-model="specification.minNumberPlays" min="0" max="{{specification.maxNumberPlays}}" placeholder="{{placeholder('minNumberPlays')}}" />
nicholas@2874 96 </div>
nicholas@2884 97 <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 98 <span>Maximum number of fragment plays</span>
n@2907 99 <input type="number" ng-model="specification.maxNumberPlays" min="{{specification.minNumberPlays || 0}}" placeholder="{{placeholder('maxNumberPlays')}}" />
nicholas@2874 100 </div>
nicholas@2859 101 </div>
nicholas@2859 102 <div class="node">
nicholas@2859 103 <h2>Test Completed Message</h2>
nicholas@2884 104 <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 105 </div>
nicholas@3100 106 <div class="node">
nicholas@3100 107 <h2>Pre-Test Calibrations</h2>
nicholas@3100 108 <div class="attributes">
nicholas@3100 109 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Perform a frequency listening response">
nicholas@3100 110 <span>Check Frequency Response</span>
nicholas@3100 111 <input type="checkbox" value="testTimer" ng-model="specification.calibration.checkFrequencies" />
nicholas@3100 112 </div>
nicholas@3100 113 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Set the output levels">
nicholas@3100 114 <span>Check Levels</span>
nicholas@3100 115 <input type="checkbox" value="testTimer" ng-model="specification.calibration.checkLevels" />
nicholas@3100 116 </div>
nicholas@3100 117 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Check L/R configuration">
nicholas@3100 118 <span>Check Channels</span>
nicholas@3100 119 <input type="checkbox" value="testTimer" ng-model="specification.calibration.checkChannels" />
nicholas@3100 120 </div>
nicholas@3100 121 </div>
nicholas@3100 122 </div>
nicholas@2859 123 <div id="metricsNode" class="node">
nicholas@2859 124 <h3>Session Metrics</h3>
nicholas@2859 125 <div class="attributes">
nicholas@2884 126 <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 127 <span>Collect Total Test Time: </span>
nicholas@2859 128 <input type="checkbox" value="testTimer" 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="Collect the accumulative listening time for each fragment">
nicholas@2859 131 <span>Collect Fragment Listen Time: </span>
nicholas@2859 132 <input type="checkbox" value="elementTimer" 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 the initial position of the fragment">
nicholas@2859 135 <span>Collect Fragment Initial Position: </span>
nicholas@2859 136 <input type="checkbox" value="elementInitialPosition" ng-click="enableMetric($event)" />
nicholas@2859 137 </div>
nicholas@2884 138 <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 139 <span>Collect Fragment Movements: </span>
nicholas@2859 140 <input type="checkbox" value="elementTracker" ng-click="enableMetric($event)" />
nicholas@2859 141 </div>
nicholas@2884 142 <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 143 <span>Collect Fragment Listened To Flag: </span>
nicholas@2859 144 <input type="checkbox" value="elementFlagListenedTo" ng-click="enableMetric($event)" />
nicholas@2859 145 </div>
nicholas@2884 146 <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 147 <span>Collect Fragment Moved Flag: </span>
nicholas@2859 148 <input type="checkbox" value="elementFlagMoved" ng-click="enableMetric($event)" />
nicholas@2859 149 </div>
nicholas@2884 150 <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 151 <span>Collect Fragment Listened Flag: </span>
nicholas@2859 152 <input type="checkbox" value="elementListenTracker" ng-click="enableMetric($event)" />
nicholas@2859 153 </div>
nicholas@2859 154 </div>
nicholas@2859 155 </div>
nicholas@2859 156 <div id="globalpresurvey" class="node" ng-controller="survey" ng-init="survey = specification.preTest">
nicholas@2859 157 <h2>Pre Test Survey</h2>
nicholas@3021 158 <div class="attributes">
nicholas@3021 159 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Allow users to go both back and forward in the test">
nicholas@3021 160 <span>Show back button: </span>
nicholas@3021 161 <input type="checkbox" ng-model="survey.showBackButton" />
nicholas@3021 162 </div>
nicholas@3021 163 </div>
nicholas@2859 164 <button type="button" class="btn btn-success" ng-click="addSurveyEntry()">Add Entry</button>
n@2911 165 <div class="node surveyentry" ng-repeat="opt in survey.options" ng-controller="surveyOption">
nicholas@2859 166 <h3>Survey Entry</h3>
nicholas@2859 167 <button type="button" class="btn btn-danger" ng-click="removeSurveyEntry(opt);">Delete Entry</button>
nicholas@2859 168 <div class="attributes">
n@2911 169 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Type of survey entry.">
nicholas@2859 170 <span>Survey Type: </span>
nicholas@2859 171 <select ng-model="opt.type">
nicholas@2859 172 <option value="question">Question</option>
nicholas@2859 173 <option value="radio">Radio</option>
nicholas@2859 174 <option value="checkbox">Checkbox</option>
nicholas@2859 175 <option value="statement">Statement</option>
nicholas@2859 176 <option value="number">Number</option>
nicholas@2859 177 <option value="slider">Slider</option>
nicholas@2859 178 <option value="video">Video</option>
nicholas@2859 179 <option value="youtube">YouTube</option>
nicholas@2859 180 </select>
nicholas@2859 181 </div>
n@2911 182 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Unique across the entire session of all ID entries. ">
nicholas@2859 183 <span>Unique Survey Entry ID:</span>
nicholas@2877 184 <input type="text" ng-model="opt.id" required/>
nicholas@2859 185 </div>
n@2911 186 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Friendly name. Will be used in test results parsers instead of the ID, if defined.">
nicholas@2859 187 <span>Entry Name:</span>
nicholas@2859 188 <input type="text" ng-model="opt.name" />
nicholas@2859 189 </div>
n@2911 190 <div class="attribute" ng-show="['question', 'checkbox', 'radio', 'number'].indexOf(opt.type) >= 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="An answer must be given to continue with the test.">
nicholas@2859 191 <span>Mandatory:</span>
nicholas@2859 192 <input type="checkbox" ng-model="opt.mandatory" />
nicholas@2859 193 </div>
n@2911 194 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Minimum time in seconds before continuing.">
nicholas@2859 195 <span>Minimum Wait Time (s):</span>
nicholas@2859 196 <input type="number" ng-model="opt.minWait" min="0" />
nicholas@2859 197 </div>
n@2911 198 <div class="attribute" ng-show="opt.type == 'question'" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Size of the displayed text box. Does not limit entry but may discourage (or encourage) longer ansewrs if bigger.">
nicholas@2859 199 <span>Box Size:</span>
nicholas@2859 200 <select ng-model="opt.boxsize">
nicholas@2859 201 <option value="small">Small</option>
nicholas@2859 202 <option value="normal">Normal</option>
nicholas@2859 203 <option value="large">Large</option>
nicholas@2859 204 <option value="huge">Huge</option>
nicholas@2859 205 </select>
nicholas@2859 206 </div>
n@2911 207 <div class="attribute" ng-show="['checkbox', 'radio'].indexOf(opt.type) >= 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="The minimum number of options that must be selected before continuing">
nicholas@2859 208 <span>Minimum Selected:</span>
nicholas@2859 209 <input type="number" ng-model="opt.min" min="0" />
nicholas@2859 210 </div>
n@2911 211 <div class="attribute" ng-show="['checkbox', 'radio'].indexOf(opt.type) >= 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Maximum number of options that can be selected to continue.">
nicholas@2859 212 <span>Maximum Selected:</span>
nicholas@2859 213 <input type="number" ng-model="opt.max" max="{{opt.options.length}}" />
nicholas@2859 214 </div>
n@2911 215 <div class="attribute" ng-show="['slider', 'number'].indexOf(opt.type) >= 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Minimum numerical value">
nicholas@2859 216 <span>Minimum Value:</span>
nicholas@2859 217 <input type="number" ng-model="opt.min" />
nicholas@2859 218 </div>
n@2911 219 <div class="attribute" ng-show="['slider', 'number'].indexOf(opt.type) >= 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Maximum numerical value">
nicholas@2859 220 <span>Maximum Value:</span>
nicholas@2859 221 <input type="number" ng-model="opt.max" />
nicholas@2859 222 </div>
n@2911 223 <div class="attribute" ng-show="['video', 'youtube'].indexOf(opt.type) >= 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="URL of the video to embed.">
nicholas@2859 224 <span>Video URL:</span>
nicholas@2859 225 <input type="text" ng-model="opt.url" />
nicholas@2859 226 </div>
nicholas@2859 227 </div>
n@2911 228 <div class="node" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Statement / Question to pose to the subject.">
nicholas@2859 229 <h4>Statement</h4>
nicholas@2859 230 <textarea ng-model="opt.statement"></textarea>
nicholas@2859 231 </div>
nicholas@2859 232 <div class="node" ng-show="['checkbox', 'radio'].indexOf(opt.type) >= 0">
nicholas@2859 233 <h4>Options</h4>
nicholas@2859 234 <div>
nicholas@2859 235 <button type="button" class="btn btn-default" ng-click="addOption();">Add Option</button>
nicholas@2859 236 </div>
nicholas@2859 237 <div class="node" ng-repeat="option in opt.options">
nicholas@2859 238 <div class="attributes">
nicholas@2859 239 <div class="attribute">
nicholas@2859 240 <button type="button" class="btn btn-default" ng-click="removeOption(option);">Remove</button>
nicholas@2859 241 </div>
nicholas@2859 242 <div class="attribute">
nicholas@2859 243 <span>Name: </span>
nicholas@2877 244 <input type="text" ng-model="option.name" required/>
nicholas@2859 245 </div>
nicholas@2859 246 <div class="attribute">
nicholas@2859 247 <span>Displayed Text: </span>
nicholas@2877 248 <input type="text" ng-model="option.text" required/>
nicholas@2859 249 </div>
nicholas@2859 250 </div>
nicholas@2859 251 </div>
nicholas@2859 252 </div>
nicholas@2859 253 <div class="node">
nicholas@2859 254 <h4>Conditionals</h4>
nicholas@2859 255 <button type="button" class="btn btn-default" ng-click="addCondition()">Add Condition</button>
nicholas@2859 256 <div class="node" ng-repeat="condition in opt.conditions">
nicholas@2859 257 <div class="attributes">
nicholas@2859 258 <div class="attribute">
nicholas@2859 259 <button type="button" class="btn btn-danger" ng-click="removeCondition(condition)">Remove</button>
nicholas@2859 260 </div>
nicholas@2859 261 <div class="attribute">
nicholas@2859 262 <span>Check Type:</span>
nicholas@2859 263 <select ng-model="condition.check">
nicholas@2859 264 <option value="equals">Equal To</option>
nicholas@2859 265 <option value="lessThan">Less Than</option>
nicholas@2859 266 <option value="greaterThan">Greater Than</option>
nicholas@2859 267 <option value="stringContains">String Contains</option>
nicholas@2859 268 </select>
nicholas@2859 269 </div>
nicholas@2859 270 <div class="attribute">
nicholas@2859 271 <span>Value: </span>
nicholas@2877 272 <input type="text" ng-model="condition.value" required/>
nicholas@2859 273 </div>
nicholas@2859 274 <div class="attribute">
nicholas@2859 275 <span>Jump To On Pass: </span>
nicholas@2859 276 <select ng-model="condition.jumpToOnPass">
nicholas@2859 277 <option value="">None</option>
nicholas@2859 278 <option ng-repeat="entry in survey.options" value="{{entry.id}}">{{entry.id}}</option>
nicholas@2859 279 </select>
nicholas@2859 280 </div>
nicholas@2859 281 <div class="attribute">
nicholas@2859 282 <span>Jump To On Fail: </span>
nicholas@2859 283 <select ng-model="condition.jumpToOnFail">
nicholas@2859 284 <option value="">None</option>
nicholas@2859 285 <option ng-repeat="entry in survey.options" value="{{entry.id}}">{{entry.id}}</option>
nicholas@2859 286 </select>
nicholas@2859 287 </div>
nicholas@2859 288 </div>
nicholas@2859 289 </div>
nicholas@2859 290 </div>
nicholas@2859 291 </div>
nicholas@2859 292 </div>
nicholas@2859 293 <div id="globalpostsurvey" class="node" ng-controller="survey" ng-init="survey = specification.postTest">
nicholas@2859 294 <h2>Post Test Survey</h2>
nicholas@3021 295 <div class="attributes">
nicholas@3021 296 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Allow users to go both back and forward in the test">
nicholas@3021 297 <span>Show back button: </span>
nicholas@3021 298 <input type="checkbox" ng-model="survey.showBackButton" />
nicholas@3021 299 </div>
nicholas@3021 300 </div>
nicholas@2859 301 <button type="button" class="btn btn-success" ng-click="addSurveyEntry()">Add Entry</button>
n@2911 302 <div class="node surveyentry" ng-repeat="opt in survey.options" ng-controller="surveyOption">
nicholas@2859 303 <h3>Survey Entry</h3>
nicholas@2859 304 <button type="button" class="btn btn-danger" ng-click="removeSurveyEntry(opt);">Delete Entry</button>
nicholas@2859 305 <div class="attributes">
n@2911 306 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Type of survey entry.">
nicholas@2859 307 <span>Survey Type: </span>
nicholas@2859 308 <select ng-model="opt.type">
nicholas@2859 309 <option value="question">Question</option>
nicholas@2859 310 <option value="radio">Radio</option>
nicholas@2859 311 <option value="checkbox">Checkbox</option>
nicholas@2859 312 <option value="statement">Statement</option>
nicholas@2859 313 <option value="number">Number</option>
nicholas@2859 314 <option value="slider">Slider</option>
nicholas@2859 315 <option value="video">Video</option>
nicholas@2859 316 <option value="youtube">YouTube</option>
nicholas@2859 317 </select>
nicholas@2859 318 </div>
n@2911 319 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Unique across the entire session of all ID entries. ">
nicholas@2859 320 <span>Unique Survey Entry ID:</span>
nicholas@2877 321 <input type="text" ng-model="opt.id" required/>
nicholas@2859 322 </div>
n@2911 323 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Friendly name. Will be used in test results parsers instead of the ID, if defined.">
nicholas@2859 324 <span>Entry Name:</span>
nicholas@2859 325 <input type="text" ng-model="opt.name" />
nicholas@2859 326 </div>
n@2911 327 <div class="attribute" ng-show="['question', 'checkbox', 'radio', 'number'].indexOf(opt.type) >= 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="An answer must be given to continue with the test.">
nicholas@2859 328 <span>Mandatory:</span>
nicholas@2859 329 <input type="checkbox" ng-model="opt.mandatory" />
nicholas@2859 330 </div>
n@2911 331 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Minimum time in seconds before continuing.">
nicholas@2859 332 <span>Minimum Wait Time (s):</span>
nicholas@2859 333 <input type="number" ng-model="opt.minWait" min="0" />
nicholas@2859 334 </div>
n@2911 335 <div class="attribute" ng-show="opt.type == 'question'" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Size of the displayed text box. Does not limit entry but may discourage (or encourage) longer ansewrs if bigger.">
nicholas@2859 336 <span>Box Size:</span>
nicholas@2859 337 <select ng-model="opt.boxsize">
nicholas@2859 338 <option value="small">Small</option>
nicholas@2859 339 <option value="normal">Normal</option>
nicholas@2859 340 <option value="large">Large</option>
nicholas@2859 341 <option value="huge">Huge</option>
nicholas@2859 342 </select>
nicholas@2859 343 </div>
n@2911 344 <div class="attribute" ng-show="['checkbox', 'radio'].indexOf(opt.type) >= 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="The minimum number of options that must be selected before continuing">
nicholas@2859 345 <span>Minimum Selected:</span>
nicholas@2859 346 <input type="number" ng-model="opt.min" min="0" />
nicholas@2859 347 </div>
n@2911 348 <div class="attribute" ng-show="['checkbox', 'radio'].indexOf(opt.type) >= 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Maximum number of options that can be selected to continue.">
nicholas@2859 349 <span>Maximum Selected:</span>
nicholas@2859 350 <input type="number" ng-model="opt.max" max="{{opt.options.length}}" />
nicholas@2859 351 </div>
n@2911 352 <div class="attribute" ng-show="['slider', 'number'].indexOf(opt.type) >= 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Minimum numerical value">
nicholas@2859 353 <span>Minimum Value:</span>
nicholas@2859 354 <input type="number" ng-model="opt.min" />
nicholas@2859 355 </div>
n@2911 356 <div class="attribute" ng-show="['slider', 'number'].indexOf(opt.type) >= 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Maximum numerical value">
nicholas@2859 357 <span>Maximum Value:</span>
nicholas@2859 358 <input type="number" ng-model="opt.max" />
nicholas@2859 359 </div>
n@2911 360 <div class="attribute" ng-show="['video', 'youtube'].indexOf(opt.type) >= 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="URL of the video to embed.">
nicholas@2859 361 <span>Video URL:</span>
nicholas@2859 362 <input type="text" ng-model="opt.url" />
nicholas@2859 363 </div>
nicholas@2859 364 </div>
n@2911 365 <div class="node" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Statement / Question to pose to the subject.">
nicholas@2859 366 <h4>Statement</h4>
nicholas@2859 367 <textarea ng-model="opt.statement"></textarea>
nicholas@2859 368 </div>
nicholas@2859 369 <div class="node" ng-show="['checkbox', 'radio'].indexOf(opt.type) >= 0">
nicholas@2859 370 <h4>Options</h4>
nicholas@2859 371 <div>
nicholas@2859 372 <button type="button" class="btn btn-default" ng-click="addOption();">Add Option</button>
nicholas@2859 373 </div>
nicholas@2859 374 <div class="node" ng-repeat="option in opt.options">
nicholas@2859 375 <div class="attributes">
nicholas@2859 376 <div class="attribute">
nicholas@2859 377 <button type="button" class="btn btn-default" ng-click="removeOption(option);">Remove</button>
nicholas@2859 378 </div>
nicholas@2859 379 <div class="attribute">
nicholas@2859 380 <span>Name: </span>
nicholas@2877 381 <input type="text" ng-model="option.name" required/>
nicholas@2859 382 </div>
nicholas@2859 383 <div class="attribute">
nicholas@2859 384 <span>Displayed Text: </span>
nicholas@2877 385 <input type="text" ng-model="option.text" required/>
nicholas@2859 386 </div>
nicholas@2859 387 </div>
nicholas@2859 388 </div>
nicholas@2859 389 </div>
nicholas@2859 390 <div class="node">
nicholas@2859 391 <h4>Conditionals</h4>
nicholas@2859 392 <button type="button" class="btn btn-default" ng-click="addCondition()">Add Condition</button>
nicholas@2859 393 <div class="node" ng-repeat="condition in opt.conditions">
nicholas@2859 394 <div class="attributes">
nicholas@2859 395 <div class="attribute">
nicholas@2859 396 <button type="button" class="btn btn-danger" ng-click="removeCondition(condition)">Remove</button>
nicholas@2859 397 </div>
nicholas@2859 398 <div class="attribute">
nicholas@2859 399 <span>Check Type:</span>
nicholas@2859 400 <select ng-model="condition.check">
nicholas@2859 401 <option value="equals">Equal To</option>
nicholas@2859 402 <option value="lessThan">Less Than</option>
nicholas@2859 403 <option value="greaterThan">Greater Than</option>
nicholas@2859 404 <option value="stringContains">String Contains</option>
nicholas@2859 405 </select>
nicholas@2859 406 </div>
nicholas@2859 407 <div class="attribute">
nicholas@2859 408 <span>Value: </span>
nicholas@2877 409 <input type="text" ng-model="condition.value" required/>
nicholas@2859 410 </div>
nicholas@2859 411 <div class="attribute">
nicholas@2859 412 <span>Jump To On Pass: </span>
nicholas@2859 413 <select ng-model="condition.jumpToOnPass">
nicholas@2859 414 <option value="">None</option>
nicholas@2859 415 <option ng-repeat="entry in survey.options" value="{{entry.id}}">{{entry.id}}</option>
nicholas@2859 416 </select>
nicholas@2859 417 </div>
nicholas@2859 418 <div class="attribute">
nicholas@2859 419 <span>Jump To On Fail: </span>
nicholas@2859 420 <select ng-model="condition.jumpToOnFail">
nicholas@2859 421 <option value="">None</option>
nicholas@2859 422 <option ng-repeat="entry in survey.options" value="{{entry.id}}">{{entry.id}}</option>
nicholas@2859 423 </select>
nicholas@2859 424 </div>
nicholas@2859 425 </div>
nicholas@2859 426 </div>
nicholas@2859 427 </div>
nicholas@2859 428 </div>
nicholas@2859 429 </div>
nicholas@2859 430 <div id="globalinterface" class="node" ng-controller="interfaceNode" ng-init="interface = specification.interfaces">
nicholas@2859 431 <h2>Interface (Globals)</h2>
nicholas@2859 432 <div class="node interfaceOptions">
nicholas@2859 433 <div class="attributes">
n@2911 434 <div class="attribute" name="fragmentPlayed" type="check" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="A page can only be submitted if all fragments have been played">
nicholas@2859 435 <span>Check all fragments played: </span>
nicholas@2859 436 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 437 </div>
n@2911 438 <div class="attribute" name="fragmentFullPlayback" type="check" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="A page can only be submitted if all fragments have been played completely.">
nicholas@2859 439 <span>Check all fragments fully played: </span>
nicholas@2859 440 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 441 </div>
n@2911 442 <div class="attribute" name="fragmentMoved" type="check" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="A page can only be submitted if all fragments have been moved">
nicholas@2859 443 <span>Check all fragments have been moved: </span>
nicholas@2859 444 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 445 </div>
n@2911 446 <div class="attribute" name="fragmentComments" type="check" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="A page can only be submitted if all fragments have their comment boxes completed.">
nicholas@2859 447 <span>Check all fragments have comments: </span>
nicholas@2859 448 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 449 </div>
n@2911 450 <div class="attribute" name="scalerange" type="check" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="A page can only be submitted if there are fragments above and below the maximum and minimum ranges.">
nicholas@2859 451 <span>Enforce a scale usage: </span>
nicholas@2859 452 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@3136 453 <div ng-show="interface.options.find((x)=>{return x.name == 'scalerange';})">
nicholas@3136 454 <span>Minimum:</span>
nicholas@3136 455 <input type="number" min="0" max="100" name="min" ng-keyup="updateScaleRange();"/>
nicholas@3136 456 <span>Maximum:</span>
nicholas@3136 457 <input type="number" min="0" max="100" name="max" ng-keyup="updateScaleRange();"/>
nicholas@3136 458 </div>
nicholas@2859 459 </div>
n@2911 460 <div class="attribute" name="volume" type="show" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Show the master volume control on each page.">
nicholas@2859 461 <span>Show master volume control: </span>
nicholas@2859 462 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 463 </div>
n@2911 464 <div class="attribute" name="playhead" type="show" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Show the playhead for the fragments.">
nicholas@2859 465 <span>Show playhead: </span>
nicholas@2859 466 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 467 </div>
n@2911 468 <div class="attribute" name="page-count" type="show" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Show number of completed and remaining pages.">
nicholas@2859 469 <span>Show Page Count: </span>
nicholas@2859 470 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 471 </div>
n@2911 472 <div class="attribute" name="comments" type="show" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Show comment boxes for each fragment.">
nicholas@2859 473 <span>Show Fragment Comments: </span>
nicholas@2859 474 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 475 </div>
nicholas@3042 476 <div class="attribute" name="ticks" type="show" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Show tick marks for each scale label">
nicholas@3042 477 <span>Show Scale Ticks: </span>
nicholas@3042 478 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@3042 479 </div>
nicholas@2859 480 </div>
nicholas@2859 481 </div>
nicholas@2859 482 </div>
nicholas@2859 483 </div>
nicholas@2859 484 <div style="text-align: center;">
nicholas@2859 485 <button type="button" class="btn btn-success" ng-click="addPage()">Add Page</button>
nicholas@2859 486 </div>
nicholas@3097 487 <div class="node pageNode" ng-controller="page" ng-repeat="page in specification.pages" dropzone>
nicholas@2859 488 <h2>Page</h2>
nicholas@2862 489 <button type="button" class="btn btn-danger" ng-click="removePage(page)">Remove Page</button>
nicholas@2859 490 <div class="attributes">
nicholas@2859 491 <div class="attribute">
nicholas@2859 492 <span>Unique ID: </span>
nicholas@2877 493 <input type="text" ng-model="page.id" required/>
nicholas@2859 494 </div>
nicholas@2884 495 <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 496 <span>Fragment common-root URL: </span>
nicholas@2859 497 <input type="text" ng-model="page.hostURL" />
nicholas@2859 498 </div>
nicholas@2859 499 <div class="attribute">
nicholas@2859 500 <span>Randomise Fragment Order: </span>
nicholas@2859 501 <input type="checkbox" ng-model="page.randomiseOrder" />
nicholas@2859 502 </div>
nicholas@2884 503 <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.">
n@2911 504 <span>Numer of repetitions: </span>
n@2907 505 <input type="number" ng-model="page.repeatCount" value="0" step="1" placeholder="{{placeholder('repeatCount')}}" />
nicholas@2859 506 </div>
nicholas@2884 507 <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 508 <span>Loop audio: </span>
nicholas@2859 509 <input type="checkbox" ng-model="page.loop" />
nicholas@2859 510 </div>
nicholas@2884 511 <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 512 <span>Synchronous audio playback: </span>
nicholas@2859 513 <input type="checkbox" ng-model="page.synchronous" />
nicholas@2859 514 </div>
nicholas@2884 515 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Over-ride global loudness normalisation">
nicholas@2859 516 <span>Loudness (page): </span>
n@2907 517 <input type="number" ng-model="page.loudness" max="0" placeholder="{{specification.loudness || placeholder('loudness')}}" />
nicholas@2859 518 </div>
nicholas@2884 519 <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 520 <span>Label type: </span>
nicholas@2859 521 <select ng-model="page.label">
nicholas@2859 522 <option value="default">Default</option>
nicholas@2859 523 <option value="none">None</option>
nicholas@2859 524 <option value="number">[1, 2, 3...]</option>
nicholas@2859 525 <option value="letter">[a, b, c...]</option>
nicholas@2859 526 <option value="capital">[A, B, C...]</option>
nicholas@2859 527 <option value="samediff" ng-show="specification.interface == 'AB'">[Same, Different]</option>
nicholas@2859 528 </select>
nicholas@2859 529 </div>
nicholas@2859 530 <div class="attribute" ng-show="page.label != 'default' && page.label != 'none'">
nicholas@2859 531 <span>Label Start: </span>
nicholas@2859 532 <input type="text" ng-model="page.labelStart" />
nicholas@2859 533 </div>
nicholas@2884 534 <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 535 <span>Fragment pool size: </span>
n@2907 536 <input type="number" ng-model="page.poolSize" min="0" max="page.audioElements.length" placeholder="{{placeholder('poolSize')}}" />
nicholas@2859 537 </div>
nicholas@2884 538 <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 539 <span>Always include page: </span>
nicholas@2859 540 <input type="checkbox" ng-model="page.alwaysInclude" />
nicholas@2859 541 </div>
nicholas@2884 542 <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 543 <span>Fixed Page Position: </span>
nicholas@2859 544 <input type="number" ng-model="page.position" min="0" max="{{specification.pages.length}}" />
nicholas@2859 545 </div>
nicholas@2884 546 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Over-ride global pre-silence">
nicholas@2859 547 <span>Fragment pre-silence: </span>
n@2907 548 <input type="number" ng-model="page.preSilence" min="0" step="0.1" placeholder="{{specification.preSilence || placeholder('preSilence')}}" />
nicholas@2859 549 </div>
nicholas@2884 550 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Over-ride global post-silence">
nicholas@2859 551 <span>Fragment post-silence: </span>
n@2907 552 <input type="number" ng-model="page.postSilence" min="0" step="0.1" placeholder="{{specification.postSilence || placeholder('postSilence')}}" />
nicholas@2859 553 </div>
nicholas@2884 554 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Disable switching of audio">
nicholas@2859 555 <span>Cannot interupt audio: </span>
nicholas@2859 556 <input type="checkbox" ng-model="page.playOne" />
nicholas@2859 557 </div>
nicholas@2884 558 <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 559 <span>Only move playing audio: </span>
nicholas@2859 560 <input type="checkbox" ng-model="page.restrictMovement" />
nicholas@2859 561 </div>
nicholas@2884 562 <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 563 <span>Minimum number of fragment plays</span>
n@2907 564 <input type="number" ng-model="page.minNumberPlays" min="0" max="{{page.maxNumberPlays || specification.maxNumberPlays}}" placeholder="{{specification.minNumberPlays || placeholder('minNumberPlays')}}" />
nicholas@2874 565 </div>
nicholas@2884 566 <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 567 <span>Maximum number of fragment plays</span>
n@2907 568 <input type="number" ng-model="page.maxNumberPlays" min="{{page.minNumberPlays || specification.minNumberPlays || 0}}" placeholder="{{specification.maxNumberPlays || placeholder('maxNumberPlays')}}" />
nicholas@2874 569 </div>
nicholas@2859 570 </div>
nicholas@2884 571 <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 572 <h3>Page Title</h3>
nicholas@2859 573 <textarea ng-model="page.title"></textarea>
nicholas@2859 574 </div>
nicholas@2859 575 <div class="node">
nicholas@2859 576 <h3>Comment box text prefix</h3>
nicholas@2859 577 <textarea ng-model="page.commentboxprefix"></textarea>
nicholas@2859 578 <p>Example:
nicholas@2859 579 <span style="font-weight:600">{{page.commentboxprefix}} A</span>
nicholas@2859 580 </p>
nicholas@2859 581 </div>
nicholas@2859 582 <div class="node" ng-controller="survey" ng-init="survey = page.preTest">
nicholas@2859 583 <h2>Pre Page Survey</h2>
nicholas@3021 584 <div class="attributes">
nicholas@3021 585 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Allow users to go both back and forward in the test">
nicholas@3021 586 <span>Show back button: </span>
nicholas@3021 587 <input type="checkbox" ng-model="survey.showBackButton" />
nicholas@3021 588 </div>
nicholas@3021 589 </div>
nicholas@2859 590 <button type="button" class="btn btn-success" ng-click="addSurveyEntry()">Add Entry</button>
n@2911 591 <div class="node surveyentry" ng-repeat="opt in survey.options" ng-controller="surveyOption">
nicholas@2859 592 <h3>Survey Entry</h3>
nicholas@2859 593 <button type="button" class="btn btn-danger" ng-click="removeSurveyEntry(opt);">Delete Entry</button>
nicholas@2859 594 <div class="attributes">
n@2911 595 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Type of survey entry.">
nicholas@2859 596 <span>Survey Type: </span>
nicholas@2859 597 <select ng-model="opt.type">
nicholas@2859 598 <option value="question">Question</option>
nicholas@2859 599 <option value="radio">Radio</option>
nicholas@2859 600 <option value="checkbox">Checkbox</option>
nicholas@2859 601 <option value="statement">Statement</option>
nicholas@2859 602 <option value="number">Number</option>
nicholas@2859 603 <option value="slider">Slider</option>
nicholas@2859 604 <option value="video">Video</option>
nicholas@2859 605 <option value="youtube">YouTube</option>
nicholas@2859 606 </select>
nicholas@2859 607 </div>
n@2911 608 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Unique across the entire session of all ID entries. ">
nicholas@2859 609 <span>Unique Survey Entry ID:</span>
nicholas@2877 610 <input type="text" ng-model="opt.id" required/>
nicholas@2859 611 </div>
n@2911 612 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Friendly name. Will be used in test results parsers instead of the ID, if defined.">
nicholas@2859 613 <span>Entry Name:</span>
nicholas@2859 614 <input type="text" ng-model="opt.name" />
nicholas@2859 615 </div>
n@2911 616 <div class="attribute" ng-show="['question', 'checkbox', 'radio', 'number'].indexOf(opt.type) >= 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="An answer must be given to continue with the test.">
nicholas@2859 617 <span>Mandatory:</span>
nicholas@2859 618 <input type="checkbox" ng-model="opt.mandatory" />
nicholas@2859 619 </div>
n@2911 620 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Minimum time in seconds before continuing.">
nicholas@2859 621 <span>Minimum Wait Time (s):</span>
nicholas@2859 622 <input type="number" ng-model="opt.minWait" min="0" />
nicholas@2859 623 </div>
n@2911 624 <div class="attribute" ng-show="opt.type == 'question'" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Size of the displayed text box. Does not limit entry but may discourage (or encourage) longer ansewrs if bigger.">
nicholas@2859 625 <span>Box Size:</span>
nicholas@2859 626 <select ng-model="opt.boxsize">
nicholas@2859 627 <option value="small">Small</option>
nicholas@2859 628 <option value="normal">Normal</option>
nicholas@2859 629 <option value="large">Large</option>
nicholas@2859 630 <option value="huge">Huge</option>
nicholas@2859 631 </select>
nicholas@2859 632 </div>
n@2911 633 <div class="attribute" ng-show="['checkbox', 'radio'].indexOf(opt.type) >= 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="The minimum number of options that must be selected before continuing">
nicholas@2859 634 <span>Minimum Selected:</span>
nicholas@2859 635 <input type="number" ng-model="opt.min" min="0" />
nicholas@2859 636 </div>
n@2911 637 <div class="attribute" ng-show="['checkbox', 'radio'].indexOf(opt.type) >= 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Maximum number of options that can be selected to continue.">
nicholas@2859 638 <span>Maximum Selected:</span>
nicholas@2859 639 <input type="number" ng-model="opt.max" max="{{opt.options.length}}" />
nicholas@2859 640 </div>
n@2911 641 <div class="attribute" ng-show="['slider', 'number'].indexOf(opt.type) >= 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Minimum numerical value">
nicholas@2859 642 <span>Minimum Value:</span>
nicholas@2859 643 <input type="number" ng-model="opt.min" />
nicholas@2859 644 </div>
n@2911 645 <div class="attribute" ng-show="['slider', 'number'].indexOf(opt.type) >= 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Maximum numerical value">
nicholas@2859 646 <span>Maximum Value:</span>
nicholas@2859 647 <input type="number" ng-model="opt.max" />
nicholas@2859 648 </div>
n@2911 649 <div class="attribute" ng-show="['video', 'youtube'].indexOf(opt.type) >= 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="URL of the video to embed.">
nicholas@2859 650 <span>Video URL:</span>
nicholas@2859 651 <input type="text" ng-model="opt.url" />
nicholas@2859 652 </div>
nicholas@2859 653 </div>
n@2911 654 <div class="node" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Statement / Question to pose to the subject.">
nicholas@2859 655 <h4>Statement</h4>
nicholas@2859 656 <textarea ng-model="opt.statement"></textarea>
nicholas@2859 657 </div>
nicholas@2859 658 <div class="node" ng-show="['checkbox', 'radio'].indexOf(opt.type) >= 0">
nicholas@2859 659 <h4>Options</h4>
nicholas@2859 660 <div>
nicholas@2859 661 <button type="button" class="btn btn-default" ng-click="addOption();">Add Option</button>
nicholas@2859 662 </div>
nicholas@2859 663 <div class="node" ng-repeat="option in opt.options">
nicholas@2859 664 <div class="attributes">
nicholas@2859 665 <div class="attribute">
nicholas@2859 666 <button type="button" class="btn btn-default" ng-click="removeOption(option);">Remove</button>
nicholas@2859 667 </div>
nicholas@2859 668 <div class="attribute">
nicholas@2859 669 <span>Name: </span>
nicholas@2877 670 <input type="text" ng-model="option.name" required/>
nicholas@2859 671 </div>
nicholas@2859 672 <div class="attribute">
nicholas@2859 673 <span>Displayed Text: </span>
nicholas@2877 674 <input type="text" ng-model="option.text" required/>
nicholas@2859 675 </div>
nicholas@2859 676 </div>
nicholas@2859 677 </div>
nicholas@2859 678 </div>
nicholas@2859 679 <div class="node">
nicholas@2859 680 <h4>Conditionals</h4>
nicholas@2859 681 <button type="button" class="btn btn-default" ng-click="addCondition()">Add Condition</button>
nicholas@2859 682 <div class="node" ng-repeat="condition in opt.conditions">
nicholas@2859 683 <div class="attributes">
nicholas@2859 684 <div class="attribute">
nicholas@2859 685 <button type="button" class="btn btn-danger" ng-click="removeCondition(condition)">Remove</button>
nicholas@2859 686 </div>
nicholas@2859 687 <div class="attribute">
nicholas@2859 688 <span>Check Type:</span>
nicholas@2859 689 <select ng-model="condition.check">
nicholas@2859 690 <option value="equals">Equal To</option>
nicholas@2859 691 <option value="lessThan">Less Than</option>
nicholas@2859 692 <option value="greaterThan">Greater Than</option>
nicholas@2859 693 <option value="stringContains">String Contains</option>
nicholas@2859 694 </select>
nicholas@2859 695 </div>
nicholas@2859 696 <div class="attribute">
nicholas@2859 697 <span>Value: </span>
nicholas@2877 698 <input type="text" ng-model="condition.value" required/>
nicholas@2859 699 </div>
nicholas@2859 700 <div class="attribute">
nicholas@2859 701 <span>Jump To On Pass: </span>
nicholas@2859 702 <select ng-model="condition.jumpToOnPass">
nicholas@2859 703 <option value="">None</option>
nicholas@2859 704 <option ng-repeat="entry in survey.options" value="{{entry.id}}">{{entry.id}}</option>
nicholas@2859 705 </select>
nicholas@2859 706 </div>
nicholas@2859 707 <div class="attribute">
nicholas@2859 708 <span>Jump To On Fail: </span>
nicholas@2859 709 <select ng-model="condition.jumpToOnFail">
nicholas@2859 710 <option value="">None</option>
nicholas@2859 711 <option ng-repeat="entry in survey.options" value="{{entry.id}}">{{entry.id}}</option>
nicholas@2859 712 </select>
nicholas@2859 713 </div>
nicholas@2859 714 </div>
nicholas@2859 715 </div>
nicholas@2859 716 </div>
nicholas@2859 717 </div>
nicholas@2859 718 </div>
nicholas@2867 719 <div class="node" ng-controller="survey" ng-init="survey = page.postTest">
nicholas@2859 720 <h2>Post Page Survey</h2>
nicholas@3021 721 <div class="attributes">
nicholas@3021 722 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Allow users to go both back and forward in the test">
nicholas@3021 723 <span>Show back button: </span>
nicholas@3021 724 <input type="checkbox" ng-model="survey.showBackButton" />
nicholas@3021 725 </div>
nicholas@3021 726 </div>
nicholas@2859 727 <button type="button" class="btn btn-success" ng-click="addSurveyEntry()">Add Entry</button>
n@2911 728 <div class="node surveyentry" ng-repeat="opt in survey.options" ng-controller="surveyOption">
nicholas@2859 729 <h3>Survey Entry</h3>
nicholas@2859 730 <button type="button" class="btn btn-danger" ng-click="removeSurveyEntry(opt);">Delete Entry</button>
nicholas@2859 731 <div class="attributes">
n@2911 732 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Type of survey entry.">
nicholas@2859 733 <span>Survey Type: </span>
nicholas@2859 734 <select ng-model="opt.type">
nicholas@2859 735 <option value="question">Question</option>
nicholas@2859 736 <option value="radio">Radio</option>
nicholas@2859 737 <option value="checkbox">Checkbox</option>
nicholas@2859 738 <option value="statement">Statement</option>
nicholas@2859 739 <option value="number">Number</option>
nicholas@2859 740 <option value="slider">Slider</option>
nicholas@2859 741 <option value="video">Video</option>
nicholas@2859 742 <option value="youtube">YouTube</option>
nicholas@2859 743 </select>
nicholas@2859 744 </div>
n@2911 745 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Unique across the entire session of all ID entries. ">
nicholas@2859 746 <span>Unique Survey Entry ID:</span>
n@2911 747 <input type="text" ng-model="opt.id" required/>
nicholas@2859 748 </div>
n@2911 749 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Friendly name. Will be used in test results parsers instead of the ID, if defined.">
nicholas@2859 750 <span>Entry Name:</span>
nicholas@2859 751 <input type="text" ng-model="opt.name" />
nicholas@2859 752 </div>
n@2911 753 <div class="attribute" ng-show="['question', 'checkbox', 'radio', 'number'].indexOf(opt.type) >= 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="An answer must be given to continue with the test.">
nicholas@2859 754 <span>Mandatory:</span>
nicholas@2859 755 <input type="checkbox" ng-model="opt.mandatory" />
nicholas@2859 756 </div>
n@2911 757 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Minimum time in seconds before continuing.">
nicholas@2859 758 <span>Minimum Wait Time (s):</span>
nicholas@2859 759 <input type="number" ng-model="opt.minWait" min="0" />
nicholas@2859 760 </div>
n@2911 761 <div class="attribute" ng-show="opt.type == 'question'" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Size of the displayed text box. Does not limit entry but may discourage (or encourage) longer ansewrs if bigger.">
nicholas@2859 762 <span>Box Size:</span>
nicholas@2859 763 <select ng-model="opt.boxsize">
nicholas@2859 764 <option value="small">Small</option>
nicholas@2859 765 <option value="normal">Normal</option>
nicholas@2859 766 <option value="large">Large</option>
nicholas@2859 767 <option value="huge">Huge</option>
nicholas@2859 768 </select>
nicholas@2859 769 </div>
n@2911 770 <div class="attribute" ng-show="['checkbox', 'radio'].indexOf(opt.type) >= 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="The minimum number of options that must be selected before continuing">
nicholas@2859 771 <span>Minimum Selected:</span>
nicholas@2859 772 <input type="number" ng-model="opt.min" min="0" />
nicholas@2859 773 </div>
n@2911 774 <div class="attribute" ng-show="['checkbox', 'radio'].indexOf(opt.type) >= 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Maximum number of options that can be selected to continue.">
nicholas@2859 775 <span>Maximum Selected:</span>
nicholas@2859 776 <input type="number" ng-model="opt.max" max="{{opt.options.length}}" />
nicholas@2859 777 </div>
n@2911 778 <div class="attribute" ng-show="['slider', 'number'].indexOf(opt.type) >= 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Minimum numerical value">
nicholas@2859 779 <span>Minimum Value:</span>
nicholas@2859 780 <input type="number" ng-model="opt.min" />
nicholas@2859 781 </div>
n@2911 782 <div class="attribute" ng-show="['slider', 'number'].indexOf(opt.type) >= 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Maximum numerical value">
nicholas@2859 783 <span>Maximum Value:</span>
nicholas@2859 784 <input type="number" ng-model="opt.max" />
nicholas@2859 785 </div>
n@2911 786 <div class="attribute" ng-show="['video', 'youtube'].indexOf(opt.type) >= 0" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="URL of the video to embed.">
nicholas@2859 787 <span>Video URL:</span>
nicholas@2859 788 <input type="text" ng-model="opt.url" />
nicholas@2859 789 </div>
nicholas@2859 790 </div>
n@2911 791 <div class="node" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Statement / Question to pose to the subject.">
nicholas@2859 792 <h4>Statement</h4>
nicholas@2859 793 <textarea ng-model="opt.statement"></textarea>
nicholas@2859 794 </div>
nicholas@2859 795 <div class="node" ng-show="['checkbox', 'radio'].indexOf(opt.type) >= 0">
nicholas@2859 796 <h4>Options</h4>
nicholas@2859 797 <div>
nicholas@2859 798 <button type="button" class="btn btn-default" ng-click="addOption();">Add Option</button>
nicholas@2859 799 </div>
nicholas@2859 800 <div class="node" ng-repeat="option in opt.options">
nicholas@2859 801 <div class="attributes">
nicholas@2859 802 <div class="attribute">
nicholas@2859 803 <button type="button" class="btn btn-default" ng-click="removeOption(option);">Remove</button>
nicholas@2859 804 </div>
nicholas@2859 805 <div class="attribute">
nicholas@2859 806 <span>Name: </span>
nicholas@2877 807 <input type="text" ng-model="option.name" required/>
nicholas@2859 808 </div>
nicholas@2859 809 <div class="attribute">
nicholas@2859 810 <span>Displayed Text: </span>
nicholas@2877 811 <input type="text" ng-model="option.text" required/>
nicholas@2859 812 </div>
nicholas@2859 813 </div>
nicholas@2859 814 </div>
nicholas@2859 815 </div>
nicholas@2859 816 <div class="node">
nicholas@2859 817 <h4>Conditionals</h4>
nicholas@2859 818 <button type="button" class="btn btn-default" ng-click="addCondition()">Add Condition</button>
nicholas@2859 819 <div class="node" ng-repeat="condition in opt.conditions">
nicholas@2859 820 <div class="attributes">
nicholas@2859 821 <div class="attribute">
nicholas@2859 822 <button type="button" class="btn btn-danger" ng-click="removeCondition(condition)">Remove</button>
nicholas@2859 823 </div>
nicholas@2859 824 <div class="attribute">
nicholas@2859 825 <span>Check Type:</span>
nicholas@2859 826 <select ng-model="condition.check">
nicholas@2859 827 <option value="equals">Equal To</option>
nicholas@2859 828 <option value="lessThan">Less Than</option>
nicholas@2859 829 <option value="greaterThan">Greater Than</option>
nicholas@2859 830 <option value="stringContains">String Contains</option>
nicholas@2859 831 </select>
nicholas@2859 832 </div>
nicholas@2859 833 <div class="attribute">
nicholas@2859 834 <span>Value: </span>
nicholas@2877 835 <input type="text" ng-model="condition.value" required/>
nicholas@2859 836 </div>
nicholas@2859 837 <div class="attribute">
nicholas@2859 838 <span>Jump To On Pass: </span>
nicholas@2859 839 <select ng-model="condition.jumpToOnPass">
nicholas@2859 840 <option value="">None</option>
nicholas@2859 841 <option ng-repeat="entry in survey.options" value="{{entry.id}}">{{entry.id}}</option>
nicholas@2859 842 </select>
nicholas@2859 843 </div>
nicholas@2859 844 <div class="attribute">
nicholas@2859 845 <span>Jump To On Fail: </span>
nicholas@2859 846 <select ng-model="condition.jumpToOnFail">
nicholas@2859 847 <option value="">None</option>
nicholas@2859 848 <option ng-repeat="entry in survey.options" value="{{entry.id}}">{{entry.id}}</option>
nicholas@2859 849 </select>
nicholas@2859 850 </div>
nicholas@2859 851 </div>
nicholas@2859 852 </div>
nicholas@2859 853 </div>
nicholas@2859 854 </div>
nicholas@2859 855 </div>
nicholas@2859 856 <button type="button" class="btn btn-success" ng-show="specification.interface == 'APE' || page.interfaces.length == 0" ng-click="addInterface()">Add Interface/Axis</button>
n@2911 857 <div class="node interface" ng-repeat="interface in page.interfaces" ng-controller="interfaceNode">
nicholas@2859 858 <h2>Interface</h2>
nicholas@2859 859 <button type="button" class="btn btn-danger" ng-click="removeInterface(interface)">Remove Interface/Axis</button>
nicholas@2859 860 <div class="node interfaceOptions">
nicholas@2859 861 <div class="attributes">
nicholas@2859 862 <div class="attribute" name="fragmentPlayed" type="check">
nicholas@2859 863 <span>Check all fragments played: </span>
nicholas@2859 864 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 865 </div>
nicholas@2859 866 <div class="attribute" name="fragmentFullPlayback" type="check">
nicholas@2859 867 <span>Check all fragments fully played: </span>
nicholas@2859 868 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 869 </div>
nicholas@2859 870 <div class="attribute" name="fragmentMoved" type="check">
nicholas@2859 871 <span>Check all fragments have been moved: </span>
nicholas@2859 872 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 873 </div>
nicholas@2859 874 <div class="attribute" name="fragmentComments" type="check">
nicholas@2859 875 <span>Check all fragments have comments: </span>
nicholas@2859 876 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 877 </div>
nicholas@2859 878 <div class="attribute" name="scalerange" type="check">
nicholas@2859 879 <span>Enforce a scale usage: </span>
nicholas@2859 880 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 881 <span>Minimum:</span>
nicholas@2859 882 <input type="number" min="0" max="100" name="min" />
nicholas@2859 883 <span>Maximum:</span>
nicholas@2859 884 <input type="number" min="0" max="100" name="max" />
nicholas@2859 885 </div>
nicholas@2859 886 <div class="attribute" name="volume" type="show">
nicholas@2859 887 <span>Show master volume control: </span>
nicholas@2859 888 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 889 </div>
nicholas@2859 890 <div class="attribute" name="playhead" type="show">
nicholas@2859 891 <span>Show playhead: </span>
nicholas@2859 892 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 893 </div>
nicholas@2859 894 <div class="attribute" name="page-count" type="show">
nicholas@2859 895 <span>Show Page Count: </span>
nicholas@2859 896 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 897 </div>
nicholas@2859 898 <div class="attribute" name="comments" type="show">
nicholas@2859 899 <span>Show Fragment Comments: </span>
nicholas@2859 900 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@2859 901 </div>
nicholas@3042 902 <div class="attribute" name="ticks" type="show" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Show tick marks for each scale label">
nicholas@3042 903 <span>Show Scale Ticks: </span>
nicholas@3042 904 <input type="checkbox" ng-click="enableInterfaceOption($event)" />
nicholas@3042 905 </div>
nicholas@2859 906 </div>
nicholas@2859 907 </div>
nicholas@2859 908 <div class="node">
nicholas@2859 909 <h3>Axis Title</h3>
nicholas@2859 910 <textarea ng-model="interface.title"></textarea>
nicholas@2859 911 <div class="attributes">
nicholas@2859 912 <div class="attribute">
nicholas@2859 913 <span>Axis name (in saves): </span>
nicholas@2859 914 <input type="text" ng-model="interface.name" />
nicholas@2859 915 </div>
nicholas@2859 916 </div>
nicholas@2859 917 </div>
nicholas@2859 918 <div class="node">
nicholas@2859 919 <h3>Axis Image</h3>
nicholas@2859 920 <textarea ng-model="interface.image"></textarea>
nicholas@2859 921 </div>
nicholas@2886 922 <div class="node" name="scale-selection">
nicholas@2859 923 <h3>Axis Scales</h3>
nicholas@2864 924 <button type="button" class="btn btn-success" ng-click="addScale();">Add</button>
nicholas@2864 925 <button type="button" class="btn btn-danger" ng-click="clearScales()" ng-show="interface.scales.length > 0">Clear Scales</button>
nicholas@2864 926 <div class="dropdown" style="display: inline-block;">
nicholas@2864 927 <button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
nicholas@2886 928 Scales: {{selectedScale}}
nicholas@2864 929 <span class="caret"></span>
nicholas@2864 930 </button>
nicholas@2864 931 <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
nicholas@2886 932 <li ng-repeat="scale in scales" ng-click="useScales(scale)"><a href="#">{{scale.name}}</a></li>
nicholas@2864 933 </ul>
nicholas@2864 934 </div>
nicholas@2859 935 <div class="node" ng-repeat="scale in interface.scales">
nicholas@2859 936 <div class="attributes">
nicholas@2859 937 <div class="attribute">
nicholas@2859 938 <button type="button" class="btn btn-danger" ng-click="removeScale(scale);">Remove</button>
nicholas@2859 939 </div>
nicholas@2859 940 <div class="attribute">
nicholas@2859 941 <span>Position: </span>
nicholas@2877 942 <input type="number" min="0" max="100" ng-model="scale.position" required/>
nicholas@2859 943 </div>
nicholas@2859 944 <div class="attribute">
nicholas@2859 945 <span>Text: </span>
nicholas@2877 946 <input type="text" ng-model="scale.text" required/>
nicholas@2859 947 </div>
nicholas@2859 948 </div>
nicholas@2859 949 </div>
nicholas@2859 950 </div>
nicholas@2859 951 </div>
nicholas@2859 952 <div class="node">
nicholas@2859 953 <h3>Comment Questions</h3>
nicholas@2859 954 <button type="button" class="btn btn-success" ng-click="addCommentQuestion()">Add Comment Question</button>
nicholas@2859 955 <div class="node" ng-repeat="cq in page.commentQuestions">
nicholas@2859 956 <button type="button" class="btn btn-danger" ng-click="removeCommentQuestion(cq)">Remove Comment Question</button>
nicholas@2859 957 <div class="attributes">
nicholas@2859 958 <div class="attribute">
nicholas@3036 959 <span>Type:</span>
nicholas@3036 960 <select ng-model="cq.type">
nicholas@3036 961 <option value="question">Question</option>
nicholas@3036 962 <option value="checkbox">Checkbox</option>
nicholas@3036 963 <option value="radio">Radio</option>
nicholas@3036 964 <option value="slider">Slider</option>
nicholas@3036 965 </select>
nicholas@3036 966 </div>
nicholas@3036 967 <div class="attribute">
nicholas@2859 968 <span>Unique ID:</span>
nicholas@2877 969 <input type="text" ng-model="cq.id" required/>
nicholas@2859 970 </div>
nicholas@2859 971 <div class="attribute">
nicholas@2859 972 <span>Common Name:</span>
nicholas@2859 973 <input type="text" ng-model="cq.name" />
nicholas@2859 974 </div>
nicholas@3036 975 <div class="attribute">
nicholas@3036 976 <span>Mandatory:</span>
nicholas@3036 977 <input type="checkbox" ng-model="cq.mandatory" />
nicholas@3036 978 </div>
nicholas@2859 979 <div class="attribute" ng-show="cq.type == 'slider'">
nicholas@2859 980 <span>Minimum:</span>
nicholas@2859 981 <input type="number" ng-model="cq.min" />
nicholas@2859 982 </div>
nicholas@2859 983 <div class="attribute" ng-show="cq.type == 'slider'">
nicholas@2859 984 <span>Maximum:</span>
nicholas@2859 985 <input type="number" ng-model="cq.max" />
nicholas@2859 986 </div>
nicholas@2859 987 <div class="attribute" ng-show="cq.type == 'slider'">
nicholas@2859 988 <span>Step size:</span>
nicholas@2859 989 <input type="number" ng-model="cq.step" />
nicholas@2859 990 </div>
nicholas@2859 991 <div class="attribute" ng-show="cq.type == 'slider'">
nicholas@2859 992 <span>Initial Value:</span>
nicholas@2859 993 <input type="number" ng-model="cq.value" />
nicholas@2859 994 </div>
nicholas@2859 995 </div>
nicholas@2859 996 <div class="node">
nicholas@2859 997 <h4>Question:</h4>
nicholas@2859 998 <textarea ng-model="cq.statement"></textarea>
nicholas@2859 999 </div>
nicholas@2859 1000 <div class="node" ng-show="['radio', 'checkbox'].indexOf(cq.type) >= 0">
nicholas@2859 1001 <h4>Options</h4>
nicholas@2859 1002 <div class="node" ng-repeat="option in cq.options">
nicholas@2859 1003 <div class="attributes">
nicholas@2859 1004 <div class="attribute">
nicholas@2859 1005 <button type="button" class="btn btn-danger" ng-click="removeCommentQuestionOption(cq,option)">Remove</button>
nicholas@2859 1006 </div>
nicholas@2859 1007 <div class="attribute">
nicholas@2859 1008 <span>Name: </span>
nicholas@2877 1009 <input type="text" ng-model="option.name" required/>
nicholas@2859 1010 </div>
nicholas@2859 1011 <div class="attribute">
nicholas@2859 1012 <span>Display Text: </span>
nicholas@2877 1013 <input type="text" ng-model="option.text" required/>
nicholas@2859 1014 </div>
nicholas@2859 1015 </div>
nicholas@2859 1016 </div>
nicholas@2859 1017 </div>
nicholas@2859 1018 </div>
nicholas@2859 1019 </div>
nicholas@2859 1020 <button type="button" class="btn btn-success" ng-click="addAudioElement()">Add Fragment</button>
n@2911 1021 <div class="node audioelement" ng-repeat="fragment in page.audioElements">
nicholas@2859 1022 <h3>Audio Fragment</h3>
nicholas@2859 1023 <button type="button" class="btn btn-danger" ng-click="removeAudioElement(fragment)">Remove Fragment</button>
nicholas@2859 1024 <div class="attributes">
n@2911 1025 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="The unique ID of this fragment. Must be unique across the entire session">
nicholas@2859 1026 <span>Unique ID: </span>
nicholas@2877 1027 <input type="text" ng-model="fragment.id" required/>
nicholas@2859 1028 </div>
n@2911 1029 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="URL of the fragment.">
nicholas@2859 1030 <span>URL: </span>
nicholas@2877 1031 <input type="text" ng-model="fragment.url" required/>
nicholas@2859 1032 <span>Full URL: </span><span style="font-weight=600">{{page.hostURL}}{{fragment.url}}</span>
nicholas@2859 1033 </div>
nicholas@2884 1034 <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 1035 <span>Fragment Gain (dB): </span>
nicholas@2859 1036 <input type="number" ng-model="fragment.gain" />
nicholas@2859 1037 </div>
nicholas@2884 1038 <div class="attribute" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="Manually set the label">
nicholas@2859 1039 <span>Fragment Label: </span>
nicholas@2859 1040 <input type="text" ng-model="fragment.label" />
nicholas@2859 1041 </div>
nicholas@2859 1042 <div class="attribute">
nicholas@2859 1043 <span>Fragment Common name: </span>
nicholas@2859 1044 <input type="text" ng-model="fragment.name" />
nicholas@2859 1045 </div>
nicholas@2859 1046 <div class="attribute">
nicholas@2859 1047 <span>Fragment Type: </span>
nicholas@2859 1048 <select ng-model="fragment.type">
nicholas@2859 1049 <option value="normal">Normal</option>
nicholas@2859 1050 <option value="anchor">Hidden Anchor</option>
nicholas@2859 1051 <option value="reference">Hidden Reference</option>
nicholas@2859 1052 <option value="outside-reference">Outside Reference</option>
nicholas@2859 1053 </select>
nicholas@2859 1054 </div>
nicholas@2859 1055 <div class="attribute" ng-show="fragment.type == 'anchor'">
nicholas@2859 1056 <span>Anchor must be below: </span>
n@2911 1057 <input type="number" ng-model="fragment.marker" min="0" max="100" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="If this is set, the page cannot be submitted if this fragment is above this point." />
nicholas@2859 1058 </div>
nicholas@2859 1059 <div class="attribute" ng-show="fragment.type == 'reference'">
nicholas@2859 1060 <span>Reference must be above: </span>
n@2911 1061 <input type="number" ng-model="fragment.marker" min="0" max="100" data-container="body" data-toggle="popover" data-placement="bottom" data-trigger="hover" data-content="If this is set, the page cannot be submitted if this fragment is below this point." />
nicholas@2859 1062 </div>
nicholas@2884 1063 <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 1064 <span>Loudness: </span>
n@2907 1065 <input type="number" ng-model="fragment.loudness" max="0" placeholder="{{page.loudness || specification.loudness || ''}}" />
nicholas@2859 1066 </div>
nicholas@2884 1067 <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 1068 <span>Always include fragment: </span>
nicholas@2859 1069 <input type="checkbox" ng-model="fragment.alwaysInclude" max="0" />
nicholas@2859 1070 </div>
nicholas@2884 1071 <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 1072 <span>Fragment Pre-Silence: </span>
nicholas@2859 1073 <input type="number" ng-model="fragment.preSilence" max="0" step="0.1" />
nicholas@2859 1074 </div>
nicholas@2884 1075 <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 1076 <span>Fragment Post-Silence: </span>
nicholas@2859 1077 <input type="number" ng-model="fragment.postSilence" max="0" step="0.1" />
nicholas@2859 1078 </div>
nicholas@2884 1079 <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 1080 <span>Fragment playback start position (s): </span>
nicholas@2859 1081 <input type="number" ng-model="fragment.startTime" min="0" max="{{fragment.stopTime}}" />
nicholas@2859 1082 </div>
nicholas@2884 1083 <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 1084 <span>Fragment playback stop position (s): </span>
nicholas@2859 1085 <input type="number" ng-model="fragment.stopTime" min="{{fragment.startTime}}" />
nicholas@2859 1086 </div>
nicholas@2859 1087 <div class="attribute">
nicholas@2859 1088 <span>Fragment sampling rate: </span>
nicholas@2859 1089 <input type="number" ng-model="fragment.sampleRate" min="1" />
nicholas@2859 1090 </div>
nicholas@2884 1091 <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 1092 <span>Fragment Image (URL): </span>
nicholas@2859 1093 <input type="text" ng-model="fragment.image" />
nicholas@2859 1094 </div>
nicholas@2874 1095 <div class="attribute">
nicholas@2874 1096 <span>Minimum number of plays</span>
nicholas@2874 1097 <input type="number" ng-model="fragment.minNumberPlays" min="0" max="{{fragment.maxNumberPlays || page.maxNumberPlays || specification.maxNumberPlays}}" />
nicholas@2874 1098 </div>
nicholas@2874 1099 <div class="attribute">
nicholas@2874 1100 <span>Maximum number of plays</span>
nicholas@2874 1101 <input type="number" ng-model="fragment.maxNumberPlays" min="{{fragment.minNumberPlays || page.minNumberPlays || specification.minNumberPlays || 0}}" />
nicholas@2874 1102 </div>
nicholas@2859 1103 </div>
nicholas@2859 1104 </div>
nicholas@2859 1105 </div>
nicholas@2887 1106 </div>
nicholas@3098 1107 <div class="modal fade bs-example-modal-lg" id="popupHolder" tabindex="-1" role="dialog" ng-controller="introduction">
nicholas@3098 1108 <div class="modal-dialog modal-lg" role="document">
nicholas@3098 1109 <div class="modal-content">
nicholas@3098 1110 <div class="modal-header">
nicholas@3099 1111 <h3>Test Creator</h3>
nicholas@3099 1112 <h3 class="label label-primary">v1.2.3</h3>
nicholas@2986 1113 </div>
nicholas@3098 1114 <div class="modal-body" ng-switch="state">
nicholas@3098 1115 <div ng-switch-when="0">
nicholas@3098 1116 <div>
nicholas@3108 1117 <h3>Please wait while assets load...</h3>
nicholas@3108 1118 </div>
nicholas@2887 1119 </div>
nicholas@3108 1120 <div ng-switch-when="1">
nicholas@3108 1121 <div>
nicholas@3098 1122 <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.3 version.</span>
nicholas@3098 1123 </div>
nicholas@3098 1124 <div>
nicholas@3098 1125 <input type="file" id="files" ng-model="files" onchange="handleFiles(event)" />
nicholas@3098 1126 </div>
b@2946 1127 </div>
nicholas@3108 1128 <div ng-switch-when="2">
nicholas@3098 1129 <div>
nicholas@3098 1130 <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@3098 1131 </div>
nicholas@3098 1132 <div class="row">
nicholas@3099 1133 <div class="col-md-6">
nicholas@3098 1134 <div class="new-test" ng-repeat="i in testSpecifications.interfaces" ng-mouseover="mouseover(i.name)" ng-click="select(i.name)">
nicholas@3098 1135 <label style="cursor:pointer">
nicholas@3098 1136 <input type="radio" name="new-test" value="{{i.name}}" id="i.name" style="cursor:pointer" /> {{i.name}}
nicholas@3098 1137 </label>
nicholas@3098 1138 </div>
b@2946 1139 </div>
nicholas@3098 1140 <div class="col-md-6">
nicholas@3098 1141 <span>{{description}}</span>
nicholas@3098 1142 </div>
b@2946 1143 </div>
b@2946 1144 </div>
nicholas@3108 1145 <div ng-switch-when="3" dropzone>
nicholas@3099 1146 <div>
nicholas@3099 1147 <h4>Audio Files</h4>
nicholas@3099 1148 <p>{{selected}} is a pairwise test with only two fragments per page. To make it easy to add a lot of fragments (and therefore pages) you can automatically drop your fragments onto here, set a name for each and we will populate your page elements for you!</p>
nicholas@3099 1149 </div>
nicholas@3099 1150 <table class="table table-bordered">
nicholas@3099 1151 <tr>
nicholas@3099 1152 <td>Filename</td>
nicholas@3099 1153 <td>Name</td>
nicholas@3099 1154 </tr>
nicholas@3099 1155 <tr ng-repeat="elem in audioFragments">
nicholas@3099 1156 <td>{{elem.fname}}</td>
nicholas@3099 1157 <td>
nicholas@3099 1158 <input type="text" ng-model="elem.name" required />
nicholas@3099 1159 </td>
nicholas@3099 1160 </tr>
nicholas@3099 1161 </table>
nicholas@2887 1162 </div>
nicholas@2859 1163 </div>
nicholas@3098 1164 <div class="modal-footer">
nicholas@3098 1165 <button id="popupBack" type="button" class="btn btn-default" ng-show="state>0" ng-click="back()">Back</button>
nicholas@3099 1166 <button id="popupNext" type="button" class="btn btn-warning" ng-show="state>1" ng-click="skip()">Skip</button>
nicholas@3098 1167 <button id="popupNext" type="button" class="btn btn-default" ng-click="next()">Next</button>
nicholas@2859 1168 </div>
nicholas@2887 1169 </div>
nicholas@2859 1170 </div>
nicholas@2859 1171 </div>
nicholas@2887 1172 <div id="screenblank" ng-show="popupVisible"></div>
nicholas@2859 1173 </body>
nicholas@2859 1174
nicholas@2859 1175 </html>