diff --git a/interface/resources/icons/loader-red-countdown-ring.gif b/interface/resources/icons/loader-red-countdown-ring.gif new file mode 100644 index 0000000000..eb15b9aedd Binary files /dev/null and b/interface/resources/icons/loader-red-countdown-ring.gif differ diff --git a/scripts/system/html/css/record.css b/scripts/system/html/css/record.css index 985c323b01..ca15ccab17 100644 --- a/scripts/system/html/css/record.css +++ b/scripts/system/html/css/record.css @@ -116,6 +116,16 @@ body { #spinner { text-align: center; margin-top: 25%; + position: relative; +} + +#spinner span { + display: block; + position: relative; + top: -101px; + color: #e2334d; + font-size: 60px; + font-weight: bold; } diff --git a/scripts/system/html/js/record.js b/scripts/system/html/js/record.js index 719289f43a..914bdfa4d1 100644 --- a/scripts/system/html/js/record.js +++ b/scripts/system/html/js/record.js @@ -24,6 +24,7 @@ var isUsingToolbar = false, elShowInfoButton, elLoadButton, elSpinner, + elCountdownNumber, elRecordButton, elFinishOnOpen, elFinishOnOpenLabel, @@ -35,6 +36,7 @@ var isUsingToolbar = false, STOP_PLAYING_RECORDING_ACTION = "stopPlayingRecording", LOAD_RECORDING_ACTION = "loadRecording", START_RECORDING_ACTION = "startRecording", + COUNTDOWN_NUMBER_ACTION = "countdownNumber", STOP_RECORDING_ACTION = "stopRecording", FINISH_ON_OPEN_ACTION = "finishOnOpen"; @@ -190,6 +192,9 @@ function onScriptEventReceived(data) { elRecordButton.classList.add("pressed"); updateSpinner(); break; + case COUNTDOWN_NUMBER_ACTION: + elCountdownNumber.innerHTML = message.value; + break; case STOP_RECORDING_ACTION: isRecording = false; elRecordButton.classList.remove("pressed"); @@ -275,6 +280,7 @@ function onBodyLoaded() { elLoadButton.onclick = onLoadButtonClicked; elSpinner = document.getElementById("spinner"); + elCountdownNumber = document.getElementById("countdown-number"); elRecordButton = document.getElementById("record-button"); elRecordButton.onclick = onRecordButtonClicked; diff --git a/scripts/system/html/record.html b/scripts/system/html/record.html index bd527b6714..de08a593ca 100644 --- a/scripts/system/html/record.html +++ b/scripts/system/html/record.html @@ -63,7 +63,8 @@
diff --git a/scripts/system/record.js b/scripts/system/record.js index 8b6d38c6c4..9a7850cd38 100644 --- a/scripts/system/record.js +++ b/scripts/system/record.js @@ -195,6 +195,7 @@ } function finishCountdown() { + Dialog.countdownNumber(""); recordingState = RECORDING; startRecording(); } @@ -202,20 +203,23 @@ function cancelCountdown() { recordingState = IDLE; Script.clearInterval(countdownTimer); + Dialog.countdownNumber(""); log("Cancel countdown"); } function startCountdown() { recordingState = COUNTING_DOWN; log("Start countdown"); - playSound(tickSound); countdownSeconds = COUNTDOWN_SECONDS; + Dialog.countdownNumber(countdownSeconds); + playSound(tickSound); countdownTimer = Script.setInterval(function () { countdownSeconds -= 1; if (countdownSeconds <= 0) { Script.clearInterval(countdownTimer); finishCountdown(); } else { + Dialog.countdownNumber(countdownSeconds); playSound(tickSound); } }, 1000); @@ -405,6 +409,7 @@ STOP_PLAYING_RECORDING_ACTION = "stopPlayingRecording", LOAD_RECORDING_ACTION = "loadRecording", START_RECORDING_ACTION = "startRecording", + COUNTDOWN_NUMBER_ACTION = "countdownNumber", STOP_RECORDING_ACTION = "stopRecording", FINISH_ON_OPEN_ACTION = "finishOnOpen", SETTINGS_FINISH_ON_OPEN = "record/finishOnOpen"; @@ -454,6 +459,14 @@ })); } + function countdownNumber(number) { + tablet.emitScriptEvent(JSON.stringify({ + type: EVENT_BRIDGE_TYPE, + action: COUNTDOWN_NUMBER_ACTION, + value: number + })); + } + function finishOnOpen() { return isFinishOnOpen; } @@ -531,6 +544,7 @@ return { updatePlayerDetails: updatePlayerDetails, updateRecordingStatus: updateRecordingStatus, + countdownNumber: countdownNumber, finishOnOpen: finishOnOpen, setUp: setUp, tearDown: tearDown