import applyMixin from "./mixin";
import devtoolPlugin from "./plugins/devtool";
import ModuleCollection from "./module/module-collection";
import { forEachValue, isObject, isPromise, assert, partial } from "./util";

let Vue; // bind on install

export class Store {
  constructor(options = {}) {
    // Auto install if it is not done yet and `window` has `Vue`.
    // To allow users to avoid auto-installation in some cases,
    // this code should be placed here. See #731
    if (!Vue && typeof window !== "undefined" && window.Vue) {
      install(window.Vue);
    }

    if (process.env.NODE_ENV !== "production") {
      assert(Vue, `must call Vue.use(Vuex) before creating a store instance.`);
      assert(
        typeof Promise !== "undefined",
        `vuex requires a Promise polyfill in this browser.`
      );
      assert(
        this instanceof Store,
        `store must be called with the new operator.`
      );
    }

    const { plugins = [], strict = false } = options;

    // store internal state
    this._committing = false;
    this._actions = Object.create(null);
    this._actionSubscribers = [];
    this._mutations = Object.create(null);
    this._wrappedGetters = Object.create(null);
    this._modules = new ModuleCollection(options);
    this._modulesNamespaceMap = Object.create(null);
    this._subscribers = [];
    this._watcherVM = new Vue();

    // bind commit and dispatch to self
    const store = this;
    const { dispatch, commit } = this;
    this.dispatch = function boundDispatch(type, payload) {
      return dispatch.call(store, type, payload);
    };
    this.commit = function boundCommit(type, payload, options) {
      return commit.call(store, type, payload, options);
    };

    // strict mode
    this.strict = strict;

    const state = this._modules.root.state;

    // init root module.
    // this also recursively registers all sub-modules
    // and collects all module getters inside this._wrappedGetters
    installModule(this, state, [], this._modules.root);

    // initialize the store vm, which is responsible for the reactivity
    // (also registers _wrappedGetters as computed properties)
    resetStoreVM(this, state);

    // apply plugins
    plugins.forEach(plugin => plugin(this));

    const useDevtools =
      options.devtools !== undefined ? options.devtools : Vue.config.devtools;
    if (useDevtools) {
      devtoolPlugin(this);
    }
  }

  get state() {
    return this._vm._data.$$state;
  }

  set state(v) {
    if (process.env.NODE_ENV !== "production") {
      assert(
        false,
        `use store.replaceState() to explicit replace store state.`
      );
    }
  }

  commit(_type, _payload, _options) {
    // check object-style commit
    const { type, payload, options } = unifyObjectStyle(
      _type,
      _payload,
      _options
    );

    const mutation = { type, payload };
    const entry = this._mutations[type];
    if (!entry) {
      if (process.env.NODE_ENV !== "production") {
        console.error(`[vuex] unknown mutation type: ${type}`);
      }
      return;
    }
    this._withCommit(() => {
      entry.forEach(function commitIterator(handler) {
        handler(payload);
      });
    });
    this._subscribers.forEach(sub => sub(mutation, this.state));

    if (process.env.NODE_ENV !== "production" && options && options.silent) {
      console.warn(
        `[vuex] mutation type: ${type}. Silent option has been removed. ` +
          "Use the filter functionality in the vue-devtools"
      );
    }
  }

  dispatch(_type, _payload) {
    // check object-style dispatch
    const { type, payload } = unifyObjectStyle(_type, _payload);

    const action = { type, payload };
    const entry = this._actions[type];
    if (!entry) {
      if (process.env.NODE_ENV !== "production") {
        console.error(`[vuex] unknown action type: ${type}`);
      }
      return;
    }

    try {
      this._actionSubscribers
        .filter(sub => sub.before)
        .forEach(sub => sub.before(action, this.state));
    } catch (e) {
      if (process.env.NODE_ENV !== "production") {
        console.warn(`[vuex] error in before action subscribers: `);
        console.error(e);
      }
    }

    const result =
      entry.length > 1
        ? Promise.all(entry.map(handler => handler(payload)))
        : entry[0](payload);

    return result.then(res => {
      try {
        this._actionSubscribers
          .filter(sub => sub.after)
          .forEach(sub => sub.after(action, this.state));
      } catch (e) {
        if (process.env.NODE_ENV !== "production") {
          console.warn(`[vuex] error in after action subscribers: `);
          console.error(e);
        }
      }
      return res;
    });
  }

  subscribe(fn) {
    return genericSubscribe(fn, this._subscribers);
  }

  subscribeAction(fn) {
    const subs = typeof fn === "function" ? { before: fn } : fn;
    return genericSubscribe(subs, this._actionSubscribers);
  }

  watch(getter, cb, options) {
    if (process.env.NODE_ENV !== "production") {
      assert(
        typeof getter === "function",
        `store.watch only accepts a function.`
      );
    }
    return this._watcherVM.$watch(
      () => getter(this.state, this.getters),
      cb,
      options
    );
  }

  replaceState(state) {
    this._withCommit(() => {
      this._vm._data.$$state = state;
    });
  }

  /**
   * @description
   * 注册模块 `myModule`
   * store.registerModule('myModule', {})
   * 注册嵌套模块 `nested/myModule`
   * store.registerModule(['nested', 'myModule'], {})
   * 之后就可以通过 store.state.myModule 和 store.state.nested.myModule 访问模块的状态
   */
  registerModule(path, rawModule, options = {}) {
    if (typeof path === "string") path = [path];
    // 对参数做断言，Array.isArray(path) && path.length > 0为真
    if (process.env.NODE_ENV !== "production") {
      assert(Array.isArray(path), `module path must be a string or an Array.`);
      assert(
        path.length > 0,
        "cannot register the root module by using registerModule."
      );
    }
    // 调用this._modules.register注册模块的方法
    this._modules.register(path, rawModule);
    installModule(
      this,
      this.state,
      path,
      this._modules.get(path),
      options.preserveState
    );
    // 重置store更新getters...
    resetStoreVM(this, this.state);
  }

  unregisterModule(path) {
    if (typeof path === "string") path = [path];

    if (process.env.NODE_ENV !== "production") {
      assert(Array.isArray(path), `module path must be a string or an Array.`);
    }
    // 卸载模块
    this._modules.unregister(path);
    this._withCommit(() => {
      const parentState = getNestedState(this.state, path.slice(0, -1));
      Vue.delete(parentState, path[path.length - 1]);
    });
    // 重置store
    resetStore(this);
  }

  hotUpdate(newOptions) {
    this._modules.update(newOptions);
    resetStore(this, true);
  }

  _withCommit(fn) {
    const committing = this._committing;
    this._committing = true;
    fn();
    this._committing = committing;
  }
}

function genericSubscribe(fn, subs) {
  if (subs.indexOf(fn) < 0) {
    subs.push(fn);
  }
  return () => {
    const i = subs.indexOf(fn);
    if (i > -1) {
      subs.splice(i, 1);
    }
  };
}

function resetStore(store, hot) {
  store._actions = Object.create(null);
  store._mutations = Object.create(null);
  store._wrappedGetters = Object.create(null);
  store._modulesNamespaceMap = Object.create(null);
  const state = store.state;
  // init all modules
  installModule(store, state, [], store._modules.root, true);
  // reset vm
  resetStoreVM(store, state, hot);
}

function resetStoreVM(store, state, hot) {
  const oldVm = store._vm;

  // bind store public getters
  store.getters = {};
  const wrappedGetters = store._wrappedGetters;
  const computed = {};
  forEachValue(wrappedGetters, (fn, key) => {
    // use computed to leverage its lazy-caching mechanism
    // direct inline function use will lead to closure preserving oldVm.
    // using partial to return function with only arguments preserved in closure enviroment.
    computed[key] = partial(fn, store);
    Object.defineProperty(store.getters, key, {
      get: () => store._vm[key],
      enumerable: true // for local getters
    });
  });

  // use a Vue instance to store the state tree
  // suppress warnings just in case the user has added
  // some funky global mixins
  const silent = Vue.config.silent;
  Vue.config.silent = true;
  store._vm = new Vue({
    data: {
      $$state: state
    },
    computed
  });
  Vue.config.silent = silent;

  // enable strict mode for new vm
  if (store.strict) {
    enableStrictMode(store);
  }

  if (oldVm) {
    if (hot) {
      // dispatch changes in all subscribed watchers
      // to force getter re-evaluation for hot reloading.
      store._withCommit(() => {
        oldVm._data.$$state = null;
      });
    }
    Vue.nextTick(() => oldVm.$destroy());
  }
}

// 递归安装模块
function installModule(store, rootState, path, module, hot) {
  // 如果path是[]，则是跟组件
  const isRoot = !path.length;
  // 获取名字空间
  const namespace = store._modules.getNamespace(path);
  // 注册名字空间集合
  if (module.namespaced) {
    // 安装命名空间时发现有这个命名空间了，则报错重复命名空间
    if (
      store._modulesNamespaceMap[namespace] &&
      process.env.NODE_ENV !== "production"
    ) {
      console.error(
        `[vuex] duplicate namespace ${namespace} for the namespaced module ${path.join(
          "/"
        )}`
      );
    }
    // 这里以path是['nested', 'myModule']举例，
    // 就是store._modulesNamespaceMap['nested/myModule'] = new Module({state: {}})
    store._modulesNamespaceMap[namespace] = module;
  }

  // 不是根模块时，设置状态
  if (!isRoot && !hot) {
    const parentState = getNestedState(rootState, path.slice(0, -1));
    const moduleName = path[path.length - 1];
    store._withCommit(() => {
      Vue.set(parentState, moduleName, module.state);
    });
  }

  const local = (module.context = makeLocalContext(store, namespace, path));

  module.forEachMutation((mutation, key) => {
    const namespacedType = namespace + key;
    registerMutation(store, namespacedType, mutation, local);
  });

  module.forEachAction((action, key) => {
    const type = action.root ? key : namespace + key;
    const handler = action.handler || action;
    registerAction(store, type, handler, local);
  });

  module.forEachGetter((getter, key) => {
    const namespacedType = namespace + key;
    registerGetter(store, namespacedType, getter, local);
  });

  module.forEachChild((child, key) => {
    installModule(store, rootState, path.concat(key), child, hot);
  });
}

/**
 * make localized dispatch, commit, getters and state
 * if there is no namespace, just use root ones
 */
function makeLocalContext(store, namespace, path) {
  const noNamespace = namespace === "";

  const local = {
    dispatch: noNamespace
      ? store.dispatch
      : (_type, _payload, _options) => {
          const args = unifyObjectStyle(_type, _payload, _options);
          const { payload, options } = args;
          let { type } = args;

          if (!options || !options.root) {
            type = namespace + type;
            if (
              process.env.NODE_ENV !== "production" &&
              !store._actions[type]
            ) {
              console.error(
                `[vuex] unknown local action type: ${
                  args.type
                }, global type: ${type}`
              );
              return;
            }
          }

          return store.dispatch(type, payload);
        },

    commit: noNamespace
      ? store.commit
      : (_type, _payload, _options) => {
          const args = unifyObjectStyle(_type, _payload, _options);
          const { payload, options } = args;
          let { type } = args;

          if (!options || !options.root) {
            type = namespace + type;
            if (
              process.env.NODE_ENV !== "production" &&
              !store._mutations[type]
            ) {
              console.error(
                `[vuex] unknown local mutation type: ${
                  args.type
                }, global type: ${type}`
              );
              return;
            }
          }

          store.commit(type, payload, options);
        }
  };

  // getters and state object must be gotten lazily
  // because they will be changed by vm update
  Object.defineProperties(local, {
    getters: {
      get: noNamespace
        ? () => store.getters
        : () => makeLocalGetters(store, namespace)
    },
    state: {
      get: () => getNestedState(store.state, path)
    }
  });

  return local;
}

function makeLocalGetters(store, namespace) {
  const gettersProxy = {};

  const splitPos = namespace.length;
  Object.keys(store.getters).forEach(type => {
    // skip if the target getter is not match this namespace
    if (type.slice(0, splitPos) !== namespace) return;

    // extract local getter type
    const localType = type.slice(splitPos);

    // Add a port to the getters proxy.
    // Define as getter property because
    // we do not want to evaluate the getters in this time.
    Object.defineProperty(gettersProxy, localType, {
      get: () => store.getters[type],
      enumerable: true
    });
  });

  return gettersProxy;
}

function registerMutation(store, type, handler, local) {
  const entry = store._mutations[type] || (store._mutations[type] = []);
  entry.push(function wrappedMutationHandler(payload) {
    handler.call(store, local.state, payload);
  });
}

function registerAction(store, type, handler, local) {
  const entry = store._actions[type] || (store._actions[type] = []);
  entry.push(function wrappedActionHandler(payload, cb) {
    let res = handler.call(
      store,
      {
        dispatch: local.dispatch,
        commit: local.commit,
        getters: local.getters,
        state: local.state,
        rootGetters: store.getters,
        rootState: store.state
      },
      payload,
      cb
    );
    if (!isPromise(res)) {
      res = Promise.resolve(res);
    }
    if (store._devtoolHook) {
      return res.catch(err => {
        store._devtoolHook.emit("vuex:error", err);
        throw err;
      });
    } else {
      return res;
    }
  });
}

function registerGetter(store, type, rawGetter, local) {
  if (store._wrappedGetters[type]) {
    if (process.env.NODE_ENV !== "production") {
      console.error(`[vuex] duplicate getter key: ${type}`);
    }
    return;
  }
  store._wrappedGetters[type] = function wrappedGetter(store) {
    return rawGetter(
      local.state, // local state
      local.getters, // local getters
      store.state, // root state
      store.getters // root getters
    );
  };
}

function enableStrictMode(store) {
  store._vm.$watch(
    function() {
      return this._data.$$state;
    },
    () => {
      if (process.env.NODE_ENV !== "production") {
        assert(
          store._committing,
          `do not mutate vuex store state outside mutation handlers.`
        );
      }
    },
    { deep: true, sync: true }
  );
}

// 获取嵌套状态
function getNestedState(state, path) {
  return path.length ? path.reduce((state, key) => state[key], state) : state;
}

// 统一对象样式
function unifyObjectStyle(type, payload, options) {
  if (isObject(type) && type.type) {
    options = payload;
    payload = type;
    type = type.type;
  }

  if (process.env.NODE_ENV !== "production") {
    assert(
      typeof type === "string",
      `expects string as the type, but found ${typeof type}.`
    );
  }

  return { type, payload, options };
}

// call Vue.use(vuex) 安装vuex
export function install(_Vue) {
  if (Vue && _Vue === Vue) {
    if (process.env.NODE_ENV !== "production") {
      console.error(
        "[vuex] already installed. Vue.use(Vuex) should be called only once."
      );
    }
    return;
  }
  Vue = _Vue;
  applyMixin(Vue);
}

class Light {
	constructor() {
		this.state = 'off';
		this.button = null;
	}
	// 接下来定义init方法，该方法负责在页面创建一个真实的button节点，假设这个button是电灯开关按钮，
    // 当button的onclick事件被触发时，就是电灯开关被按下的时候，代码如下：
    init() {
	    const button = document.createElement('button');
	    button.innerHTML = '开关';
	    this.button = document.body.appendChild(button);
	    this.button.addEventListener('click', this::buttonWasPressed)
    }
    // 当开关被按下时，程序会调用this.buttonWasPressed方法，开关按下之后的所有行为，都被封装在这个方法里，代码如下：
    buttonWasPressed() {
		if (this.state === 'off') {
			console.log('开灯');
			this.state = 'on';
		} else if (this.state === 'on') {
			console.log('关灯');
			this.state = 'off';
		}
	}
}
const light = new Light();
light.init();

// OffLightState 
class OffLightState {
	constructor(light) {
		this.light = light;
	}
	buttonWasPressed() {
		// offLightState对应的行为
		console.log('弱光');
		// 切换状态到weakLightState
		this.light.setState(this.light.weakLightState);
	}
}
// weakLightState
class WeakLightState {
	constructor(light) {
		this.light = light;
	}
	buttonWasPressed() {
		// weakLightState对应的行为
		console.log('强光');
		// 切换状态到strongLightState
		this.light.setState(this.light.strongLightState);
	}
}
class StrongLightState {
	constructor(light) {
		this.light = light;
	}
	buttonWasPressed() {
		// strongLightState对应的行为
		console.log('关灯');
		// 切换状态到offLightState
		this.light.setState(this.light.strongLightState);		
	}
}

class Light {
	constructor() {
		this.offLightState = new OffLightState(this);
		this.weakLightState = new WeakLightState(this);
		this.strongLightState = new StrongLightState(this);
		this.button = null;
	}
	// 在button按钮被按下的事件里，Context也不再直接进行任何实质性的操作，而是通过this.currState::buttonWasPressed()将请求委托给当前持有的状态对象去执行
	init() {
		const button = document.createElement('button');
        button.innerHTML = '开关';
        this.button = document.body.appendChild(button);
        // 设置当前状态
        this.currState = this.offLightState;
        this.button.addEventListener('click', this.currState::buttonWasPressed)
	}
	// 通过这个方法来切换light对象的状态。
	setState(newState) {
		this.currState = newState;
	}
}
// 现在可以进行一些测试：
const light = new Light();
light.init();

class State {
	constructor(light) {
		this.light = light;
	}
	buttonWasPressed() {
		throw new Error('父类的buttonWasPressed方法必须被重写')
	}
}
class SuperStrongLightState extends State {
	buttonWasPressed() {
		console.log('关灯');
		this.light.setState(this.light.offLightState);
	}
}

window.external.upload = function(state) {
	// 可能为sign、uploading、done、error
	console.log(state);
}
// 另外我们需要在页面放置一个用于上传的插件对象：
const plugin = (function() {
	const plugin = document.createElement('embed');
	plugin.style.display = 'none';
	plugin.type = 'application/txftn-wbkit';
	plugin.sign = function() {
		console.log('开始文件扫描');
	}
	plugin.pause = function() {
		console.log('暂停文件扫描');
	}
	plugin.uploading = function() {
		console.log('开始文件上传');
	}
	plugin.del = function() {
		console.log('删除文件上传');
	}
	plugin.done = function() {
		console.log('文件上传完成');
	}
	document.body.appendChild(plugin);
	return plugin;
})();

class Upload {
	constructor(fileName) {
		this.plugin = plugin;
		this.fileName = fileName;
		this.button1 = null;
		this.button2 = null;
		// 设置初始状态为waiting
		this.state = 'sign';
	}
	// init方法会进行写初始化工作，包括创建页面中的一些节点。在这些节点里，起主要作用的是两个用于控制上传流程的按钮，第一个按钮用于暂停和继续上传，第二个按钮用于删除文件：
	init() {
		this.dom = document.createElement('div');
		this.dom.innerHTML = 
		`<span>文件名称:${this.fileName}</span>\
		<button data-action="button1">扫描中</button>\
		<button data-action="button2">删除</button>`;
		document.body.appendChild(this.dom);
		// 第一个按钮
		this.button1 = this.dom.querySelector('[data-action="button1"]');
		// 第二个按钮
		this.button2 = this.dom.querySelector('[data-action="button2"]');
		this.bindEvent();
	}
	// 接下来需要给两个按钮分别绑定点击事件
	bindEvent() {
		this.button1.addEventListener('click', () => {
			// 扫描状态下，任何操作无效
			if (this.state === 'sign') {
				console.log('扫描中，点击无效...');
			}
			// 上传中，点击切换到暂停
			else if (this.state === 'uploading') {
				this.changeState('pause');
			}
			// 暂停中，点击切换到上传中
			else if (this.state === 'pause') {
				this.changeState('uploading');
			}
			else if (this.state === 'done') {
				console.log('文件已完成上传，点击无效');
			}
			else if (this.state === 'error') {
				console.log('文件上传失败，点击无效');
			}
		});
		this.button2.addEventListener('click', () => {
			if (this.state === 'done' || this.state === 'error' || this.state === 'pause') {
				// 上传完成、上传失败和暂停状态下可以删除
				this.changeState('del');
			}
			else if (this.state === 'sign') {
				console.log('文件正在扫描中，不能删除');
			}
			else if (this.state === 'uploading') {
				console.log('文件正在上传中，不能删除');
			}
		});
	}
	changeState(state) {
		switch(state) {
			case 'sign':
				this.plugin.sign();
				this.button1.innerHTML = '扫描中，任何操作无效';
				break;
			case 'uploading':
				this.plugin.uploading();
				this.button1.innerHTML = '正在上传，点击暂停';
				break;
			case 'pause':
				this.plugin.pause();
				this.button1.innerHTML = '已暂停，点击继续上传';
				break;
			case 'done':
				this.plugin.done();
				this.button1.innerHTML = '上传完成';
				break;
			case 'error':
				this.button1.innerHTML = '上传失败';
				break;
			case 'del':
				this.plugin.del();
				this.dom.parentNode.removeChild(this.dom);
				console.log('删除完成');
				break;
		}
		this.state = state;
	}
}
// 测试代码:
const uploadObj = new Upload('JavaScript设计模式与开发实践');
uploadObj.init();
// 插件调用JavaScript方法
window.external.upload = function(state) {
	uploadObj.changeState(state);
}
// 模拟上传进度
// 文件开始扫描
window.external.upload('sign');
// 1秒后开始上传
setTIimeout(function() {
	window.external.upload('uploading');
}, 1000);
// 5秒后上传完成
etTIimeout(function() {
	window.external.upload('done');
}, 5000);

window.external.upload = function(state) {
	// 可能为sign、uploading、done、error
	console.log(state);
}
const plugin = (function() {
	const plugin = document.createElement('embed');
	plugin.style.display = 'none';
	plugin.type = 'application/txftn-wbkit';
	plugin.sign = function() {
		console.log('开始文件扫描');
	}
	plugin.pause = function() {
		console.log('暂停文件扫描');
	}
	plugin.uploading = function() {
		console.log('开始文件上传');
	}
	plugin.del = function() {
		console.log('删除文件上传');
	}
	plugin.done = function() {
		console.log('文件上传完成');
	}
	document.body.appendChild(plugin);
	return plugin;
})();

class Upload {
	constructor(fileName) {
		this.plugin = plugin;
		this.fileName = fileName;
		this.button1 = null;
		this.button2 = null;
		// 设置初始状态为waiting
		this.signState = new SignState(this);
		this.uploadingState = new UpladState(this);
		this.pauseState = new PauseState(this);
		this.doneState = new DoneState(this);
		this.errorState = new ErrorState(this);
		// 设置当前状态
		this.currState = this.signState;
	}
}

init() {
	this.dom = document.createElement('div');
	this.dom.innerHTML = 
	`<span>文件名称:${this.fileName}</span>\
	<button data-action="button1">扫描中</button>\
	<button data-action="button2">删除</button>`;
	document.body.appendChild(this.dom);
	// 第一个按钮
	this.button1 = this.dom.querySelector('[data-action="button1"]');
	// 第二个按钮
	this.button2 = this.dom.querySelector('[data-action="button2"]');
	this.bindEvent();
}

bindEvent() {
	this.button1.addEventListener('click', this.currState::clickHandler1);
	this.button2.addEventListener('click', this.currState::clickHandler2);
}
sign() {
	this.plugin.sign();
	this.currenState = this.signState;
}
uploading() {
	this.button1.innerHTML = '正在上传，点击暂停';
	this.plugin.uploading();
	this.currState = this.uploadingState;
}
pause() {
	this.button1.innerHTML = '已暂停，点击继续上传';
	this.plugin.pause();
	this.currState = this.pauseState;
}
done() {
	this.button1.innerHTML = '上传完成';
	this.plugin.done();
	this.currState = this.doneState;
}
error() {
	this.button1.innerHTML = '上传失败';
	this.currState = this.errorState;
}
del() {
	this.plugin.del();
	this.dom.parentNode.removeChild(this.dom);
}

class State {
	constructor(uploadObj) {
		this.uploadObj = uploadObj;
	}
	clickHandler1() {
		throw new Error('子类必须重写父类的clickHanler1方法');
	}
	clickHanlder2() {
		throw new Error('子类必须重写父类的clickHandler2方法');
	}
}
class SignState extends State {
	clickHandler1() {
		console.log('扫描中，点击无效...');
	}
	clickHandler2() {
		console.log('文件正在上传中，不能删除');
	}
}
class UploadingState extends State {
	clickHandler1() {
		this.uploadObj.pause();
	}
	clickHandler2() {
		console.log('文件正在上传中，不能删除');
	}
}
class PauseState extends State {
	clickHandler1() {
		this.uploadObj.uploading);
	}
	clickHandler2() {
		this.uploadObj.del();
	}
}
class ErrorState extends State {
	clickHandler1() {
		console.log('文件上传失败，点击无效');
	}
	clickHandler2() {
		this.uploadObj.del();
	}
}
// 测试
const uploadObj = new Upload('JavaScript设计模式与开发实践');
uploadObj.init();
window.external.upload = function(state) {
	uploadObj[state]();
}
// 模拟上传进度
window.external.upload('sign');
setTimeout(function() {
	// 1秒后开始上传
	window.external.upload('uploading');
}, 1000);
setTimeout(function() {
	// 5秒后上传完成
	window.external.upload('done');
}, 5000);