ginpei · ginpei · Jan 6, 2019 · Jan 7, 2019 · Jan 7, 2019 · Jan 8, 2019
diff --git a/.codeclimate.yml b/.codeclimate.yml
@@ -0,0 +1,2 @@
+exclude_patterns:
+- "**/*.test.ts"
diff --git a/.editorconfig b/.editorconfig
@@ -1,14 +1,13 @@
+# editorconfig.org
 root = true
 
 [*]
+indent_size = 2
+indent_style = space
 end_of_line = lf
 charset = utf-8
-indent_style = tab
-indent_size = 2
+trim_trailing_whitespace = true
+insert_final_newline = true
 
 [*.md]
-indent_style = space
-indent_size = 4
-
-[package.json]
-indent_style = space
+trim_trailing_whitespace = false
diff --git a/.gitignore b/.gitignore
@@ -1,2 +1,5 @@
+.,*
 node_modules
 examples/video.mp4
+out
+coverage
diff --git a/.npmignore b/.npmignore
@@ -0,0 +1,3 @@
+/.vscode/settings.json
+/out/test.*
+/out/web.*
diff --git a/.travis.yml b/.travis.yml
@@ -0,0 +1,11 @@
+language: node_js
+node_js:
+  - "10"
+before_script:
+  - curl -L https://codeclimate.com/downloads/test-reporter/test-reporter-latest-linux-amd64 > ./cc-test-reporter
+  - chmod +x ./cc-test-reporter
+  - ./cc-test-reporter before-build
+script:
+  - npm test -- --coverage
+after_script:
+  - ./cc-test-reporter after-build --exit-code $TRAVIS_TEST_RESULT
diff --git a/README.md b/README.md
@@ -2,6 +2,12 @@ Note: "youtube.js" has been renamed "html5-youtube.js".
 
 # html5-youtube.js
 
+[![NPM](https://nodei.co/npm/html5-youtube.png)](https://nodei.co/npm/html5-youtube/)
+
+<!-- TODO change branch to master -->
+[![Build Status](https://travis-ci.org/ginpei/html5-youtube.js.svg?branch=v2)](https://travis-ci.org/ginpei/html5-youtube.js)
+[![Maintainability](https://api.codeclimate.com/v1/badges/cd4a8c29404801838810/maintainability)](https://codeclimate.com/github/ginpei/html5-youtube.js/maintainability)
+
 YouTube Player API wrapper like HTML5 video API.
 
 * [YouTube Player API Reference for iframe Embeds - YouTube — Google Developers](https://developers.google.com/youtube/iframe_api_reference)

diff --git a/examples/basic.html b/examples/basic.html
@@ -7,11 +7,11 @@
 	<body>
 		<h1>html5-youtube.js</h1>
 		<div id="my-youtube-player" data-youtube-videoid="KFstP0C9sVk"></div>
-		<script src="../html5-youtube.js"></script>
+		<script src="../out/web/html5-youtube.js"></script>
 		<script>
 var elPlayer = document.getElementById('my-youtube-player');
 
-youtube({ el:elPlayer });
+const player = new Html5YouTube(elPlayer);
 		</script>
 	</body>
 </html>
diff --git a/examples/full-player.compat.html b/examples/full-player.compat.html
diff --git a/examples/full-player.html b/examples/full-player.html
@@ -35,7 +35,7 @@ <h1>html5-youtube.js</h1>
 			<br />
 			<label><input class="js-logging" type="checkbox" checked />Log all events in console</label>
 		</div>
-		<script src="../html5-youtube.js"></script>
+		<script src="../out/web/html5-youtube.js"></script>
 		<script>
 (function() {
 	var elPlayer = document.querySelector('.js-player');
@@ -59,7 +59,7 @@ <h1>html5-youtube.js</h1>
 		this.innerHTML = text;
 	};
 
-	var player = window.player = youtube({ el:elPlayer });
+	var player = window.player = new Html5YouTube(elPlayer);
 
 	player.addEventListener('canplay', function(event) {
 		elVideos.disabled = false;
@@ -75,7 +75,7 @@ <h1>html5-youtube.js</h1>
 		elCurrentTimeText.setTime(player.currentTime);
 		elVolume.checked = player.muted;
 		elVolume.value = player.volume;
-		elPlaybackRate.value = youtube.availablePlaybackRates.indexOf(player.playbackRate);
+		elPlaybackRate.value = Html5YouTube.availablePlaybackRates.indexOf(player.playbackRate);
 		elPlaybackRateText.innerHTML = player.playbackRate;
 	});
 	player.addEventListener('play', function(event) {
@@ -103,7 +103,7 @@ <h1>html5-youtube.js</h1>
 		elVolume.value = player.volume;
 	});
 	player.addEventListener('ratechange', function(event) {
-		elPlaybackRate.value = youtube.availablePlaybackRates.indexOf(player.playbackRate);
+		elPlaybackRate.value = Html5YouTube.availablePlaybackRates.indexOf(player.playbackRate);
 		elPlaybackRateText.innerHTML = player.playbackRate;
 	});
 	player.addEventListener('error', function(event) {
@@ -150,7 +150,7 @@ <h1>html5-youtube.js</h1>
 		player.volume = this.value;
 	});
 	elPlaybackRate.addEventListener('change', function(event) {
-		player.playbackRate = youtube.availablePlaybackRates[this.value];
+		player.playbackRate = Html5YouTube.availablePlaybackRates[this.value];
 	});
 })();
 		</script>

diff --git a/examples/html5video.html b/examples/html5video.html
@@ -2,7 +2,7 @@
 <html lang="en">
 	<head>
 		<meta charset="UTF-8">
-		<title>HTML5 &lt;video&gt;</title>
+		<title>HTML5 &lt;video&gt; (to compare)</title>
 		<style>
 			.player {
 				height: 300px;
@@ -11,7 +11,7 @@
 		</style>
 	</head>
 	<body>
-		<h1>HTML5 &lt;video&gt;</h1>
+		<h1>HTML5 &lt;video&gt; (to compare)</h1>
 		<p>
 			<em>This is the demo of HTML5 video, not html5-youtube.js.</em>
 			Before run, you have to download video file using this command:
@@ -43,7 +43,7 @@ <h1>HTML5 &lt;video&gt;</h1>
 		</div>
 		<script>
 (function() {
-	var youtube = {
+	var Html5YouTube = {
 		availablePlaybackRates: [0.25, 0.5, 1, 1.5, 2]
 	};
 
@@ -85,7 +85,7 @@ <h1>HTML5 &lt;video&gt;</h1>
 		elCurrentTimeText.setTime(player.currentTime);
 		elVolume.checked = player.muted;
 		elVolume.value = player.volume;
-		elPlaybackRate.value = youtube.availablePlaybackRates.indexOf(player.playbackRate);
+		elPlaybackRate.value = Html5YouTube.availablePlaybackRates.indexOf(player.playbackRate);
 		elPlaybackRateText.innerHTML = player.playbackRate;
 	});
 	player.addEventListener('play', function(event) {
@@ -113,7 +113,7 @@ <h1>HTML5 &lt;video&gt;</h1>
 		elVolume.value = player.volume;
 	});
 	player.addEventListener('ratechange', function(event) {
-		elPlaybackRate.value = youtube.availablePlaybackRates.indexOf(player.playbackRate);
+		elPlaybackRate.value = Html5YouTube.availablePlaybackRates.indexOf(player.playbackRate);
 		elPlaybackRateText.innerHTML = player.playbackRate;
 	});
 	player.addEventListener('error', function(event) {
@@ -160,7 +160,7 @@ <h1>HTML5 &lt;video&gt;</h1>
 		player.volume = this.value;
 	});
 	elPlaybackRate.addEventListener('change', function(event) {
-		player.playbackRate = youtube.availablePlaybackRates[this.value];
+		player.playbackRate = Html5YouTube.availablePlaybackRates[this.value];
 	});
 
 	player.src = videoId;

diff --git a/examples/player.html b/examples/player.html
@@ -17,15 +17,15 @@ <h1>html5-youtube.js</h1>
 			<button class="js-play" disabled>Play</button>
 			<button class="js-pause" disabled>Pause</button>
 		</div>
-		<script src="../html5-youtube.js"></script>
+		<script src="../out/web/html5-youtube.js"></script>
 		<script>
 (function() {
 	var elPlayer = document.querySelector('.js-player');
 	var elPlay = document.querySelector('.js-play');
 	var elPause = document.querySelector('.js-pause');
 	var videoId = 'KFstP0C9sVk';
 
-	var player = youtube({ el:elPlayer, id:videoId })
+  var player = new Html5YouTube(elPlayer, { videoId })
 		.on('ready', function(event) {
 			player.play();
 		})