use svg-inline-loader

package.json

@@ -47,14 +47,14 @@
     "sass-loader": "^6.0.6",
     "strip-loader": "^0.1.2",
     "style-loader": "^0.20.1",
+    "svg-inline-loader": "0.8.0",
     "template-string-optimize-loader": "^2.2.3",
     "url-loader": "^0.6.2",
     "webpack": "^3.10.0",
     "webpack-dev-server": "^2.11.1"
   },
   "dependencies": {
     "balloon-css": "^0.5.0",
-    "object-assign": "4.1.1",
     "promise-polyfill": "7.0.2"
   }
 }

src/css/bezel.scss

@@ -59,7 +59,6 @@
         .diplayer-loading-dot {
             animation: diplayer-loading-dot-fade .8s ease infinite;
             opacity: 0;
-            fill: #fff;
             transform-origin: 4px 4px;
             @for $i from 7 through 1 {
                 &.diplayer-loading-dot-#{$i} {

src/css/player.scss

@@ -8,6 +8,16 @@
         box-sizing: content-box;
     }
 
+    svg {
+        width: 100%;
+        height: 100%;
+
+        path,
+        circle {
+            fill: #fff;
+        }
+    }
+
     &:-webkit-full-screen {
         width: 100%;
         height: 100%;

src/js/controller.js

@@ -1,5 +1,6 @@
 import utils from './utils';
 import Thumbnails from './thumbnails';
+import Icons from './icons';
 
 class Controller {
     constructor (player) {
@@ -180,7 +181,7 @@ class Controller {
             }
             else {
                 this.player.video.muted = true;
-                this.player.template.volumeIcon.innerHTML = this.player.icons.get('volume-off');
+                this.player.template.volumeIcon.innerHTML = Icons.volumeOff;
                 this.player.bar.set('volume', 0, 'width');
             }
         });

src/js/icons.js

@@ -0,0 +1,37 @@
+import play from '../assets/play.svg';
+import pause from '../assets/pause.svg';
+import volumeUp from '../assets/volume-up.svg';
+import volumeDown from '../assets/volume-down.svg';
+import volumeOff from '../assets/volume-off.svg';
+import full from '../assets/full.svg';
+import fullWeb from '../assets/full-web.svg';
+import setting from '../assets/setting.svg';
+import right from '../assets/right.svg';
+import comment from '../assets/comment.svg';
+import commentOff from '../assets/comment-off.svg';
+import send from '../assets/send.svg';
+import pallette from '../assets/pallette.svg';
+import camera from '../assets/camera.svg';
+import subtitle from '../assets/subtitle.svg';
+import loading from '../assets/loading.svg';
+
+const Icons = {
+    play: play,
+    pause: pause,
+    volumeUp: volumeUp,
+    volumeDown: volumeDown,
+    volumeOff: volumeOff,
+    full: full,
+    fullWeb: fullWeb,
+    setting: setting,
+    right: right,
+    comment: comment,
+    commentOff: commentOff,
+    send: send,
+    pallette: pallette,
+    camera: camera,
+    subtitle: subtitle,
+    loading: loading,
+};
+
+export default Icons;