From 24e5d3c4afe5a4890aaf385e54f1c5c7a0b4241f Mon Sep 17 00:00:00 2001
From: Jacob Mischka <jacob@mischka.me>
Date: Sat, 3 Feb 2018 10:41:52 -0600
Subject: [PATCH] Add audio/video volume binding

Fixes #1143
---
 src/generators/nodes/Attribute.ts                            | 1 +
 src/generators/nodes/Binding.ts                              | 4 ++--
 src/validate/html/validateElement.ts                         | 3 ++-
 .../_config.js                                               | 5 +++++
 .../binding-audio-currenttime-duration-volume/main.html      | 2 ++
 .../samples/binding-audio-currenttime-duration/main.html     | 1 -
 6 files changed, 12 insertions(+), 4 deletions(-)
 rename test/runtime/samples/{binding-audio-currenttime-duration => binding-audio-currenttime-duration-volume}/_config.js (80%)
 create mode 100644 test/runtime/samples/binding-audio-currenttime-duration-volume/main.html
 delete mode 100644 test/runtime/samples/binding-audio-currenttime-duration/main.html

diff --git a/src/generators/nodes/Attribute.ts b/src/generators/nodes/Attribute.ts
index 01b62d23da..08075efee2 100644
--- a/src/generators/nodes/Attribute.ts
+++ b/src/generators/nodes/Attribute.ts
@@ -540,6 +540,7 @@ const attributeLookup = {
 			'textarea',
 		],
 	},
+	volume: { appliesTo: ['audio', 'video'] },
 	width: {
 		appliesTo: ['canvas', 'embed', 'iframe', 'img', 'input', 'object', 'video'],
 	},
diff --git a/src/generators/nodes/Binding.ts b/src/generators/nodes/Binding.ts
index 3ab5f79769..16bd24c0f2 100644
--- a/src/generators/nodes/Binding.ts
+++ b/src/generators/nodes/Binding.ts
@@ -73,7 +73,7 @@ export default class Binding extends Node {
 			);
 		}
 
-		if (this.name === 'currentTime') {
+		if (this.name === 'currentTime' || this.name === 'volume') {
 			updateCondition = `!isNaN(${snippet})`;
 			initialUpdate = null;
 		}
@@ -267,4 +267,4 @@ function isComputed(node: Node) {
 	}
 
 	return false;
-}
\ No newline at end of file
+}
diff --git a/src/validate/html/validateElement.ts b/src/validate/html/validateElement.ts
index 1156ebcea7..550f8d2ae7 100644
--- a/src/validate/html/validateElement.ts
+++ b/src/validate/html/validateElement.ts
@@ -139,7 +139,8 @@ export default function validateElement(
 				name === 'paused' ||
 				name === 'buffered' ||
 				name === 'seekable' ||
-				name === 'played'
+				name === 'played' ||
+				name === 'volume'
 			) {
 				if (node.name !== 'audio' && node.name !== 'video') {
 					validator.error(
diff --git a/test/runtime/samples/binding-audio-currenttime-duration/_config.js b/test/runtime/samples/binding-audio-currenttime-duration-volume/_config.js
similarity index 80%
rename from test/runtime/samples/binding-audio-currenttime-duration/_config.js
rename to test/runtime/samples/binding-audio-currenttime-duration-volume/_config.js
index 793ca5d280..abb0eeaacb 100644
--- a/test/runtime/samples/binding-audio-currenttime-duration/_config.js
+++ b/test/runtime/samples/binding-audio-currenttime-duration-volume/_config.js
@@ -7,20 +7,25 @@ export default {
 	test ( assert, component, target, window ) {
 		assert.equal( component.get( 't' ), 0 );
 		assert.equal( component.get( 'd' ), 0 );
+		assert.equal( component.get( 'v' ), 0.5 );
 		assert.equal( component.get( 'paused' ), true );
 
 		const audio = target.querySelector( 'audio' );
 		const timeupdate = new window.Event( 'timeupdate' );
 		const durationchange = new window.Event( 'durationchange' );
+		const volumechange = new window.Event( 'volumechange' );
 
 		audio.currentTime = 10;
 		audio.duration = 20;
+		audio.volume = 0.75;
 		audio.dispatchEvent( timeupdate );
 		audio.dispatchEvent( durationchange );
+		audio.dispatchEvent( volumechange );
 		audio.play();
 
 		assert.equal( component.get( 't' ), 10 );
 		assert.equal( component.get( 'd' ), 0 ); // not 20, because read-only. Not sure how to test this!
+		assert.equal( component.get( 'v' ), 0.75 );
 		assert.equal( component.get( 'paused' ), true ); // ditto...
 		component.destroy();
 	}
diff --git a/test/runtime/samples/binding-audio-currenttime-duration-volume/main.html b/test/runtime/samples/binding-audio-currenttime-duration-volume/main.html
new file mode 100644
index 0000000000..c65c0af8b7
--- /dev/null
+++ b/test/runtime/samples/binding-audio-currenttime-duration-volume/main.html
@@ -0,0 +1,2 @@
+<audio bind:currentTime='t' bind:duration='d' bind:paused bind:volume='v'
+	src='music.mp3'></audio>
diff --git a/test/runtime/samples/binding-audio-currenttime-duration/main.html b/test/runtime/samples/binding-audio-currenttime-duration/main.html
deleted file mode 100644
index dc3aac8afe..0000000000
--- a/test/runtime/samples/binding-audio-currenttime-duration/main.html
+++ /dev/null
@@ -1 +0,0 @@
-<audio bind:currentTime='t' bind:duration='d' bind:paused src='music.mp3'></audio>