初步完成

docs/thumbnail/js/common.js

@@ -1,4 +1,5 @@
 (function() {
+    var $img = document.querySelector('.img');
     var $upload = document.querySelector('.upload');
     var $file = document.querySelector('.file');
     var $artplayer = document.querySelector('.artplayer');
@@ -16,34 +17,28 @@
             $artplayer.style.display = 'block';
             restartArtplayer();
         },
-        callbackThumbnailUrl: function (url) {
-            console.log(url);
-        }
+        callbackThumbnailUrl: function(url) {
+            $img.style.backgroundImage = `url(${url})`;
+        },
+        callbackDone: function(videoUrl, thumbnailUrl) {
+            restartArtplayer();
+        },
     });
 
     function restartArtplayer() {
-        var number = Number($number.value);
-        var width = Number($width.value);
-        var height = Number($height.value);
-        var column = Number($column.value);
-
         Artplayer.instances.forEach(function(art) {
             art.destroy(true);
         });
 
         var option = {
             container: $artplayer,
-            url: thumbnail.videoUrl
+            url: thumbnail.videoUrl,
         };
 
         if (thumbnail.thumbnailUrl) {
             option.thumbnails = {
                 url: thumbnail.thumbnailUrl,
-                number: number,
-                width: width,
-                height: height,
-                column: column,
-            }
+            };
         }
 
         var art = new Artplayer(option);
@@ -52,13 +47,13 @@
             var $video = art.template.$video;
             $aspectRatio.textContent = $video.videoWidth + ' x ' + $video.videoHeight;
             $duration.textContent = $video.duration + 's';
-            thumbnail.setup({
+            thumbnail.mergeOption({
                 videoElement: $video,
-                number: number,
-                width: width,
-                height: height,
-                column: column,
             });
+
+            if (!thumbnail.thumbnailUrl) {
+                thumbnail.getThumbnailUrl();
+            }
         });
     }
 })();