How to get duration of gif image in JavaScript

Question

I tried to show gif only one time. So I used this code to achieve this.

    var ui_img = document.getElementById("ui_image");
    ui_img.hidden = false;
    setTimeout(function () {
        ui_img.hidden = true;
    }, 8000);

But I knew the all gifs do not have the same duration. How can I solve this?

Answer 1

This will return duration value

isGifAnimated(file) {
    return new Promise((resolve, reject) => {
      try {
        let fileReader = new FileReader();
        fileReader.readAsArrayBuffer(file);
        fileReader.onload = (event) => {
          let arr = new Uint8Array(fileReader.result);
          let duration = 0;
          for (var i = 0; i < arr.length; i++) {
            if (arr[i] == 0x21
              && arr[i + 1] == 0xF9
              && arr[i + 2] == 0x04
              && arr[i + 7] == 0x00) {
              const delay = (arr[i + 5] << 8) | (arr[i + 4] & 0xFF)
              duration += delay < 2 ? 10 : delay;
            }
          }
          resolve(duration / 100);
        }

      } catch (e) {
        reject(e);
      }
    });
  }