- Timestamp:
- 2015-05-16T10:45:00+12:00 (9 years ago)
- Location:
- main/trunk/model-sites-dev/respooled/collect/popup-video-respooled
- Files:
-
- 5 edited
Legend:
- Unmodified
- Added
- Removed
-
main/trunk/model-sites-dev/respooled/collect/popup-video-respooled/etc/collectionConfig.xml
r29883 r29885 354 354 <gsf:script src="{$httpCollection}/js/jam-guitar.js"/> 355 355 356 <gsf:script src="{$httpCollection}/js/game-on.js"/> 357 356 358 357 359 <!-- MIDI.js library --> -
main/trunk/model-sites-dev/respooled/collect/popup-video-respooled/js/audiosynth.view.js
r29883 r29885 390 390 391 391 mediaPlayedNotes[String(mediaStartPlayTime)].push( 392 { 'midiPitch' : playedMidiPitch,393 'midiNoteOn' : relativePlayedNoteStartTime,394 'midiNoteOff' : relativePlayedNoteEndTime,392 { 'midiPitch' : playedMidiPitch, 393 'midiNoteOn' : relativePlayedNoteStartTime, 394 'midiNoteOff' : relativePlayedNoteEndTime, 395 395 'startCurrentTime' : playedNoteStartCurrentTime, 396 'duration ': playedDuration, 397 'humanReadble': playedNotePitch } 396 'duration' : playedDuration, 397 'startPercTime': playedNoteStartCurrentTime/mediaPlayer.duration, 398 'humanReadble' : playedNotePitch } 398 399 ); 399 400 -
main/trunk/model-sites-dev/respooled/collect/popup-video-respooled/js/in-the-groove.js
r29883 r29885 65 65 tinnyEffectNode.connect(audioCtx.destination); 66 66 67 initGameOn(); 68 67 69 console.log("onLoadMetadata done"); 68 70 }); -
main/trunk/model-sites-dev/respooled/collect/popup-video-respooled/js/media-player.js
r29883 r29885 26 26 27 27 var recordedNotesArray = null; 28 29 var hasLocalStorage = (typeof(Storage) !== "undefined"); 28 30 29 31 function initialiseMediaPlayer() { … … 150 152 var formattedTime = convertSecsToTimeStr(currentTime); 151 153 $('#mediaPlayerCurrentTime').html(formattedTime); 154 155 updateGameOnCurrentTimeline(); 152 156 } 153 157 … … 304 308 } 305 309 else { 306 console.log("**** Saving under name '" + save_name +"': " + JSON.stringify(recordedNotesArray)); 310 311 if (hasLocalStorage) { 312 var docOID = gs.cgiParams.d; 313 314 var docStorageStr = localStorage.getItem(docOID); 315 var docStorage = (docStorageStr != null) ? eval("("+docStorageStr+")") : {palTracks:{}, popTracks:{}}; 316 317 var palTracks = docStorage.palTracks; 318 319 // Make timing information relative to ba base value 320 var num_rec_notes = recordedNotesArray.length; 321 322 var base_time_sct = recordedNotesArray[0].startCurrentTime; 323 var base_time_mnon = recordedNotesArray[0].midiNoteOn; 324 var base_time_moff = recordedNotesArray[0].midiNoteOff; 325 var base_time_spt = recordedNotesArray[0].startPercTime; 326 327 for (var i=0; i<num_rec_notes; i++) { 328 recordedNotesArray[i].startCurrentTime -= base_time_sct; 329 recordedNotesArray[i].midiNoteOn -= base_time_mnon; 330 recordedNotesArray[i].midiNoteOff -= base_time_moff; 331 recordedNotesArray[i].startPercTime -= base_time_spt; 332 } 333 334 palTracks[save_name] = [ { name: save_name + " 1", baseCTime: base_time_sct, events: recordedNotesArray } ] 335 336 console.log("Storing " + num_rec_notes + " recorded notes as layer '" + save_name +"'"); 337 console.log("**** saved: " + JSON.stringify(palTracks[save_name])); 338 339 localStorage.setItem(docOID, JSON.stringify(docStorage)); 340 } 341 else { 342 console.log("Warning: unable to save '" + save_name +"' as browser does not support LocalStorage"); 343 } 344 307 345 308 346 var $dialog = $('#save-recording-popup'); 309 310 347 $dialog.dialog( "close" ); 311 348 } -
main/trunk/model-sites-dev/respooled/collect/popup-video-respooled/transform/pages/document.xsl
r29883 r29885 1388 1388 <fieldset> 1389 1389 <label for="name">Name</label> 1390 <input type="text" name="save-recording-name" id="save-recording-name" value="My Recording" class="text ui-widget-content ui-corner-all"/> 1391 1390 <input type="text" 1391 name="save-recording-name" id="save-recording-name" value="My Recording" 1392 class="text ui-widget-content ui-corner-all"/> 1393 </fieldset> 1394 1392 1395 <!-- Allow form submission with keyboard without duplicating the dialog button --> 1393 1396 <input type="submit" tabindex="-1" style="position:absolute; top:-1000px"/> 1394 </fieldset> 1397 1395 1398 </form> 1396 1399 </div> 1397 1400 1398 1401 <div style="color: white;"> 1399 1400 <form id="mpmForm" style="width:99%;">1401 <fieldset>1402 <legend id="mpm-legend">Video Player Mode</legend>1403 1404 <div id="mpm-div" class="radio-div">1405 1406 <div class="radio-label-combo" style="display:inline-block; width: 32%">1407 <span>1408 <input type="radio" id="mpm-record" name="mpm-radio" onchange="setPlaybackMode()" value="record"/>1409 </span>1410 <label for="mpm-record" class="radio-label">1411 <span style="color: red;">1412 Lay down new track (record)1413 </span>1414 </label>1415 </div>1416 1417 <div class="radio-label-combo" style="display:inline-block; width: 32%">1418 <span>1419 <input type="radio" id="mpm-neutral" name="mpm-radio" onchange="setPlaybackMode()" value="neutral" checked="checked"/>1420 </span>1421 <label for="mpm-neutral" class="radio-label">1422 <span style="color: orange;">1423 Put into Neutral1424 </span>1425 </label>1426 </div>1427 1428 <div class="radio-label-combo" style="display:inline-block; width: 32%">1429 <span>1430 <input type="radio" id="mpm-game-on" name="mpm-radio" onchange="setPlaybackMode()" value="overlay"/>1431 </span>1432 <label for="mpm-game-on" class="radio-label">1433 <span style="color: green;">1434 Game on!1435 </span>1436 </label>1437 </div>1438 1439 </div>1440 </fieldset>1441 </form>1442 1402 1443 1403 <form style="width: 99%; margin-top: 10px; margin-bottom: 10px;"> … … 1450 1410 1451 1411 <div style="padding: 8px;"> 1412 <button id="mpm-new-overlay" 1413 classXX="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-icon-primary" 1414 style="background-color:#2E52A4; color:#CCC; width:19%; text-align: center; margin-right: 8px;"> 1415 New Layer 1416 </button> 1452 1417 <button id="mpm-merge-overlay" 1453 1418 classXX="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-icon-primary" 1454 style="background-color:#2E52A4; color: white; width:24%; text-align: center; margin-right: 8px;">1419 style="background-color:#2E52A4; color:#CCC; width:19%; text-align: center; margin-right: 8px;"> 1455 1420 Merge Selected 1456 1421 </button> 1457 1422 <button id="mpm-split-overlay" 1458 1423 classXX="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-icon-primary" 1459 style="background-color:#2E52A4; color: white; width:24%; text-align: center; margin-right: 8px;">1424 style="background-color:#2E52A4; color:#CCC; width:19%; text-align: center; margin-right: 8px;"> 1460 1425 Split Selected 1461 1426 </button> 1462 1427 <button id="mpm-edit-overlay" 1463 1428 classXX="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-icon-primary" 1464 style="background-color:#2E52A4; color: white; width:24%; text-align: center; margin-right: 8px;">1429 style="background-color:#2E52A4; color:#CCC; width:19%; text-align: center; margin-right: 8px;"> 1465 1430 Edit Selected 1466 1431 </button> 1467 1432 <button id="mpm-delete-overlay" 1468 1433 classXX="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-icon-primary" 1469 style="background-color:#2E52A4; color: white; width:24%; text-align: center;">1434 style="background-color:#2E52A4; color:#CCC; width:19%; text-align: center;"> 1470 1435 Delete Selected 1471 1436 </button> … … 1474 1439 </form> 1475 1440 1476 <form style="width: 99%; margin-top: 10px; margin-bottom: 10px;">1441 <form id="mpmForm" style="width:99%;"> 1477 1442 <fieldset> 1478 <legend id="pam-legend">Play Along Layers</legend> 1443 <legend id="mpm-legend">Video Player Mode</legend> 1444 1445 <div id="mpm-div" class="radio-div"> 1446 1447 <div class="radio-label-combo" style="display:inline-block; width: 32%"> 1448 <span> 1449 <input type="radio" id="mpm-record" name="mpm-radio" onchange="setPlaybackMode()" value="record"/> 1450 </span> 1451 <label for="mpm-record" class="radio-label"> 1452 <span style="color: red;" title="The notes/beat you play on the instruments get recorded, and form a new layer"> 1453 Lay down new track 1454 </span> 1455 </label> 1456 </div> 1457 1458 <div class="radio-label-combo" style="display:inline-block; width: 32%"> 1459 <span> 1460 <input type="radio" id="mpm-neutral" name="mpm-radio" onchange="setPlaybackMode()" value="neutral" checked="checked"/> 1461 </span> 1462 <label for="mpm-neutral" class="radio-label"> 1463 <span style="color: orange;" title="Sit back and relax listening to the video"> 1464 Put into Neutral 1465 </span> 1466 </label> 1467 </div> 1468 1469 <div class="radio-label-combo" style="display:inline-block; width: 32%"> 1470 <span> 1471 <input type="radio" id="mpm-game-on" name="mpm-radio" onchange="setPlaybackMode()" value="overlay"/> 1472 </span> 1473 <label for="mpm-game-on" class="radio-label"> 1474 <span style="color: green;" title="When you play the video, try to play one of the instruments below to match the notes in the chosen layers on display. Get it right, and a rich rendition of the pop song is played, otherwise it sounds quite and tinny"> 1475 Game on! 1476 </span> 1477 </label> 1478 </div> 1479 1480 </div> 1481 </fieldset> 1482 </form> 1483 1484 1485 <form id="pamForm" style="width: 99%; margin-top: 10px; margin-bottom: 10px; "> 1486 <fieldset> 1487 <legend id="pam-legend">Play Along Layers: Game On!</legend> 1479 1488 <input type="checkbox" name="PianoHero" value="PianoHero" />Piano Hero<br /> 1480 1489 <input type="checkbox" name="DrumHero" value="DrumHero" />Drum-beat Hero<br /> 1481 1490 1482 1491 <div style="padding: 8px;"> 1483 <button id="pam-merge-overlay" style="background-color:#2E52A4; color:white; width:24%; text-align: center; margin-right: 8px;"> 1492 <button id="pam-display-overlay" style="background-color:#2E52A4; color:#CCC; width:19%; text-align: center; margin-right: 8px;"> 1493 Display Selected 1494 </button> 1495 <button id="pam-merge-overlay" style="background-color:#2E52A4; color:#CCC; width:19%; text-align: center; margin-right: 8px;"> 1484 1496 Merge Selected 1485 1497 </button> 1486 <button id="pam-split-overlay" style="background-color:#2E52A4; color:white; width:24%; text-align: center; margin-right: 8px;">1498 <button id="pam-split-overlay" style="background-color:#2E52A4; color:#CCC; width:19%; text-align: center; margin-right: 8px;"> 1487 1499 Split Selected 1488 1500 </button> 1489 <button id="pam-edit-overlay" style="background-color:#2E52A4; color:white; width:24%; text-align: center; margin-right: 8px;">1501 <button id="pam-edit-overlay" style="background-color:#2E52A4; color:#CCC; width:19%; text-align: center; margin-right: 8px;"> 1490 1502 Edit Selected 1491 1503 </button> 1492 <button id="pam-delete-overlay" style="background-color:#2E52A4; color:white; width:24%; text-align: center;"> 1504 <button id="pam-delete-overlay" 1505 style="background-color:#2E52A4; color:#CCC; width:19%; text-align: center;" 1506 onclick="return pamDelete()"> 1493 1507 Delete Selected 1494 1508 </button> … … 1508 1522 <div class="analysis-bar"> 1509 1523 <div id="analysis-titlebar" style="background-image: none; background-color: #2E52A4; width: 97%; float: left; margin-bottom: 10px;"> 1510 Game On 1511 </div> 1512 1513 1514 <div id="analysis-area" class="documenttext" style="display: none; position: absolute: left: 0px; top: 0px;"> 1515 <div style="color: white; width:100%; height: 400px;"> 1524 Game On 1525 </div> 1526 1527 <div id="analysis-area" class="documenttext" 1528 style="display: none; position: absolute: left: 0px; top: 0px;"> 1529 <div style="width:97.7%; height: 500px; margin: 6px; background-colorXX: white"> 1530 <div id="gameOnPaper" width="100%" height="445"><xsl:comment>filler</xsl:comment></div> 1531 <!-- 1532 <svg id="gameOnPaper" xmlns="http://www.w3.org/2000/svg" version="1.1" 1533 width="100%" height="445" 1534 XXviewBox="0 0 100 100" XXpreserveAspectRatio="xMidYMid slice" 1535 XXstyle="width:100%; height:100%;" styleXX="position:absolute; top:0; left:0; z-index:-1;"> 1536 1537 <rect x="0" y="0" width="100" height="100" style="fill:rgb(0,0,255);stroke-width:1;stroke:rgb(0,0,0)" /> 1516 1538 <xsl:comment>filler</xsl:comment> 1517 </div> 1539 </svg> 1540 --> 1541 </div> 1518 1542 1519 1543 </div> 1520 1544 </div> 1521 1545
Note:
See TracChangeset
for help on using the changeset viewer.