bytev-charts-beta1.0/lib/DB/ByteVDB.js

测试版-1.0,版本号为小版本; 基于echarts和JavaScript及ES6封装的一个可以直接调用的图表组件库，内置主题设计，简单快捷，且支持用户自定义配置； npm 安装方式: npm install bytev-charts 若启动提示还需额外install插件,则运行 npm install @babel/runtime-corejs2 即可;

import "core-js/modules/es.array.iterator.js";
import "core-js/modules/es.object.to-string.js";
import "core-js/modules/es.string.iterator.js";
import "core-js/modules/web.dom-collections.iterator.js";
import "core-js/modules/web.url.js";
import "core-js/modules/web.url-search-params.js";
import "core-js/modules/web.timers.js";
//(function () {
var ByteVDB = {}; // IndexedDB
//1、创建或打开数据库。

var indexedDB = window.indexedDB || window.webkitIndexedDB || window.mozIndexedDB || window.OIndexedDB || window.msIndexedDB,
    IDBTransaction = window.IDBTransaction || window.webkitIDBTransaction || window.OIDBTransaction || window.msIDBTransaction,
    dbVersion = 1.0; // Create/open database

var request = indexedDB.open("bytevDB", dbVersion),
    db,
    createObjectStore = function createObjectStore(dataBase) {
  // Create an objectStore
  //2、创建一个objectStore（如果它尚不存在）
  // console.log("Creating objectStore")
  dataBase.createObjectStore("bytevTable");
},
    putBlobInDB = function putBlobInDB(blob, primaryKeyName, callBack) {
  // console.log("Putting data in IndexedDB");
  // Open a transaction to the database
  //4、初始化一个数据库事物
  var transaction = db.transaction(["bytevTable"], 'readwrite'); // Put the blob into the dabase
  //5、保存图像blob到数据库中去

  var put = transaction.objectStore("bytevTable").put(blob, primaryKeyName);

  if (callBack) {
    callBack();
  }
};

ByteVDB.read = function (primaryKeyName, callBack) {
  // Retrieve the file that was just stored
  //6、读出保存的文件并从中创建ObjectURL并将其设置为页面中图像元素的src
  // Open a transaction to the database
  var transaction = db.transaction(["bytevTable"], 'readwrite');

  transaction.objectStore("bytevTable").get(primaryKeyName).onsuccess = function (event) {
    var file = event.target.result; // console.log("Got file : " + file);

    if (callBack) {
      var fileURL = null;

      if (file) {
        // Get window.URL object
        var _URL = window.URL || window.webkitURL; // Create and revoke ObjectURL


        fileURL = _URL.createObjectURL(file);
      }

      callBack(fileURL); // Revoking ObjectURL

      setTimeout(function () {
        URL.revokeObjectURL(fileURL);
      }, 100);
    }
  };
};
/*
 * 添加数据的方法
 * path 数据的路径
 * progressFun 加载中/进度函数
 * callBack 加载完成/回调函数
 * */


ByteVDB.add = function (path, progressFun, callBack) {
  if (!path) {
    return false;
  }

  if (progressFun && !callBack) {
    callBack = progressFun;
    progressFun = null;
  } // Create XHR
  //3、将图像文件检索为blob


  var xhr = new XMLHttpRequest(),
      blob; // xhr.open("GET", "http://127.0.0.1:8020/%E8%87%AA%E5%8A%A8%E6%89%B6%E6%A2%AFdemo/model/scene.glb", true);

  xhr.open("GET", path, true); // xhr.open("GET", "http://47.93.51.30:9090/elevatorDemo/model/scene0.3.glb", true);
  // Set the responseType to blob

  xhr.responseType = "blob";
  xhr.addEventListener("load", function () {
    if (xhr.status === 200) {
      // console.log("data retrieved");
      // Blob as response
      blob = xhr.response; // console.log("Blob:" + blob);
      // Put the received blob into IndexedDB

      putBlobInDB(blob, path, callBack);
    }
  }, false); //监听进度事件

  xhr.addEventListener("progress", function (evt) {
    if (evt.lengthComputable) {
      var percentComplete = evt.loaded / evt.total; //console.log(percentComplete);
      //console.log((percentComplete * 100).toFixed(2) + "%");

      if (progressFun && callBack) {
        progressFun(evt);
      }
    }
  }, false); // Send XHR

  xhr.send();
};

request.onerror = function (event) {
  console.log("Error creating/accessing IndexedDB database");
};

request.onsuccess = function (event) {
  console.log("Success creating/accessing IndexedDB database");
  db = request.result;

  db.onerror = function (event) {
    console.log("Error creating/accessing IndexedDB database");
  }; //      // Interim solution for Google Chrome to create an objectStore. Will be deprecated
  //      if (db.setVersion) {
  //          if (db.version != dbVersion) {
  //              let setVersion = db.setVersion(dbVersion);
  //              setVersion.onsuccess = function () {
  //                  createObjectStore(db);
  //                  getImageFile();
  //              };
  //          }
  //          else {
  //              getImageFile();
  //          }
  //      }
  //      else {
  //          getImageFile();
  //      }

}; // For future use. Currently only in latest Firefox versions


request.onupgradeneeded = function (event) {
  createObjectStore(event.target.result);
}; //})();


export default ByteVDB;