@lijuhong1981/jsgif 1.2.10 → 1.2.12

package/index.js

@@ -1,5 +1,10 @@
 import GIFPlayer from "./src/GIFPlayer.js";
-import GIFImageLoader from "./src/GifImageLoader.js";
+import loadGIFImage from "./src/loadGIFImage.js";
+import GIFImageLoader from "./src/GIFImageLoader.js";
 
 export default GIFPlayer;
-export { GIFPlayer, GIFImageLoader };
+export {
+    GIFPlayer,
+    loadGIFImage,
+    GIFImageLoader,
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lijuhong1981/jsgif",
-  "version": "1.2.10",
+  "version": "1.2.12",
   "description": "> TODO: description",
   "author": "lijuhong1981 <lijuhong@hotmail.com>",
   "homepage": "https://github.com/lijuhong1981/jslibs#readme",
@@ -18,11 +18,12 @@
   "bugs": {
     "url": "https://github.com/lijuhong1981/jslibs/issues"
   },
-  "gitHead": "2e37ef04a004a8563c1dedb1ccad6d40050adc23",
+  "gitHead": "a1eac84f5720dadfac32210e20bff644508d4b3a",
   "dependencies": {
     "@lijuhong1981/jscheck": "^1.0.10",
     "@lijuhong1981/jsdestroy": "^1.1.11",
     "@lijuhong1981/jsevents": "^1.1.10",
-    "@lijuhong1981/jsload": "^1.2.7"
+    "@lijuhong1981/jsload": "^1.2.9",
+    "@lijuhong1981/jstask": "^1.1.6"
   }
 }

package/src/GIFImageLoader.js

@@ -1,23 +1,13 @@
 import ImageLoader from "@lijuhong1981/jsload/src/ImageLoader.js";
-import GIFPlayer from "./GIFPlayer.js";
+import loadGIFImage from "./loadGIFImage.js";
 
 class GIFImageLoader extends ImageLoader {
-    // constructor(options) {
-    //     super(options);
-    // }
 
     /**
      * 重写图片加载函数，生成canvas以绘制gif动画
     */
-    onImageLoad(options, onLoad, onError) {
-        const player = new GIFPlayer();
-        player.loadUrl(options.url, options.requestOptions, function () {
-            onLoad(player.canvas);
-        }, function (error) {
-            onError(error);
-        });
-        player.canvas.gifPlayer = player;
-        return player.canvas;
+    onLoad(url, options) {
+        return loadGIFImage(url, options);
     }
 };
 

package/src/GIFPlayer.js

@@ -136,11 +136,11 @@ const defaultOptions = {
 function GIFPlayer(options = {}) {
     options = Object.assign({}, defaultOptions, options);
     console.log('options:', options);
-    const CANVAS = document.createElement("canvas");
+    const CANVAS = options.canvas || document.createElement("canvas");
     const CANVAS_CTX = CANVAS.getContext('2d');
-    const TEMP_CANVAS = document.createElement("canvas");//用来拿 imageData 的工具人
-    const TEMP_CANVAS_CTX = TEMP_CANVAS.getContext('2d', { willReadFrequently: true, }); // 工具人的 getContext('2d')
-    const ATLAS_CANVAS = document.createElement("canvas");
+    const TEMP_CANVAS = document.createElement("canvas");//用来拿 imageData 的缓存canvas
+    const TEMP_CANVAS_CTX = TEMP_CANVAS.getContext('2d', { willReadFrequently: true, });
+    const ATLAS_CANVAS = options.atlasCanvas || document.createElement("canvas");
     const FRAME_LIST = []; // 存放每一帧数据以及对应的延时
     let GIF_INFO = {}; // GIF 的一些信息
     let STREAM = null;

package/src/loadGIFImage.js

@@ -0,0 +1,34 @@
+import defer from "@lijuhong1981/jstask/src/defer.js";
+import GIFPlayer from "./GIFPlayer.js";
+
+/**
+ * 加载APNG图片
+ * @param {string} url 图片url
+ * @param {object} options 加载配置项
+ * @param {object} options.requestOptions 请求配置项，可选项
+ * @param {Function} options.onLoad 可选，加载成功回调函数
+ * @param {Function} options.onError 可选，加载出错回调函数
+ * @param {HTMLCanvasElement} result 输出的Canvas对象，可不填
+ * @returns {HTMLCanvasElement} 返回Canvas对象
+ */
+function loadGIFImage(url, options = {}, result = document.createElement('canvas')) {
+    const readyPromise = defer();
+    result.readyPromise = readyPromise.promise;
+
+    const player = new GIFPlayer({
+        canvas: result,
+    });
+    player.loadUrl(url, options.requestOptions, function () {
+        if (typeof options.onLoad === 'function')
+            options.onLoad(result);
+        readyPromise.resolve(result);
+    }, function (error) {
+        if (typeof options.onError === 'function')
+            options.onError(error);
+        readyPromise.reject(error);
+    });
+    result.gifPlayer = player;
+    return result;
+};
+
+export default loadGIFImage;