优化gif demo

docs/gif/css/common.css

@@ -35,7 +35,7 @@ body,
 
 .part-left .artplayer {
     width: 500px;
-    height: 500px;
+    height: 300px;
     background: #fff;
 }
 

docs/gif/js/common.js

@@ -32,9 +32,11 @@
         plugins: [artplayerPluginGif]
     });
 
+    var $preview = document.querySelector('.preview');
     art.on('artplayerPluginGif', image => {
         var animatedImage = document.createElement('img');
         animatedImage.src = image;
-        document.querySelector('.preview').appendChild(animatedImage);
+        $preview.innerHTML = '';
+        $preview.appendChild(animatedImage);
     });
 })();

docs/uncompiled/artplayer-plugin-gif.js

@@ -2844,13 +2844,12 @@
     });
     return {
       name: 'artplayerPluginGif',
-      isProcessing: isProcessing,
       create: function create() {
         var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
         var callback = arguments.length > 1 ? arguments[1] : undefined;
         isProcessing = true;
         loading.show();
-        art.emit('artplayerPluginGif:create:start');
+        art.emit('artplayerPluginGif:start');
         notice.show(i18n.get('Start creating gif...'), false);
         console.log("Start time: ".concat(config.offset || 0, " s, Duration: ").concat(config.numFrames / 10 || 1));
         gifshot.createGIF(objectSpread({}, config, {
@@ -2868,7 +2867,7 @@
 
           isProcessing = false;
           loading.hide();
-          art.emit('artplayerPluginGif:create:end');
+          art.emit('artplayerPluginGif:end');
         });
       }
     };

packages/artplayer-plugin-gif/src/index.js

@@ -125,11 +125,10 @@ function artplayerPluginGif(art) {
 
     return {
         name: 'artplayerPluginGif',
-        isProcessing,
         create(config = {}, callback) {
             isProcessing = true;
             loading.show();
-            art.emit('artplayerPluginGif:create:start');
+            art.emit('artplayerPluginGif:start');
             notice.show(i18n.get('Start creating gif...'), false);
             console.log(`Start time: ${config.offset || 0} s, Duration: ${config.numFrames / 10 || 1}`);
             gifshot.createGIF(
@@ -150,7 +149,7 @@ function artplayerPluginGif(art) {
 
                     isProcessing = false;
                     loading.hide();
-                    art.emit('artplayerPluginGif:create:end');
+                    art.emit('artplayerPluginGif:end');
                 },
             );
         },