Home >Web Front-end >JS Tutorial >tuzhu_req.js realizes the effect of imitating Baidu picture homepage_jquery

tuzhu_req.js realizes the effect of imitating Baidu picture homepage_jquery

WBOY
WBOYOriginal
2016-05-16 15:45:481242browse

tuzhu_req.js handles file request loading asynchronous synchronization function, imitating the effect of Baidu picture homepage

/*土著人开发的require组件 @土著人 (http://www.tuzhuren.com)*/
! function() {
  function e() {}
  Function.prototype.bind || (Function.prototype.bind = function(t) {
    var n = this;
    if ("function" != typeof n)
      throw new TypeError("Function.prototype.bind called on incompatible " + n);
    var o = r.call(arguments, 1),
      i = function() {
        if (this instanceof i) {
          var e = n.apply(this, o.concat(r.call(arguments)));
          return Object(e) === e ? e : this;
        }
        return n.apply(t, o.concat(r.call(arguments)));
      };
    return n.prototype && (e.prototype = n.prototype, i.prototype = new e, e.prototype = null), i;
  });
  var t = Array.prototype,
    r = t.slice;
}();
var require, define;
! function(e) {
  function t(e, t) {
    if (!(e in u)) {
      u[e] = !0;
      var r = document.createElement("script");
      if (t) {
        var o = setTimeout(t, require.timeout);
        r.onerror = function() {
          clearTimeout(o), t()
        }, r.onreadystatechange = function() {
          "complete" == this.readyState && clearTimeout(o)
        }
      }
      return r.type = "text/javascript", r.src = e, n.appendChild(r), r;
    }
  }
 
  function r(e, r, n) {
    var i = o[e] || (o[e] = []);
    i.push(r);
    var a, u = c[e] || {},
      s = u.pkg;
    a = s ? p[s].url : u.url || e, t(a, n && function() {
      n(e);
    });
  }
  function isFunction(it) {
    return Object.prototype.toString.call(it) === '[object Function]';
  }
  function isArray(it) {
    return Object.prototype.toString.call(it) === '[object Array]';
  }
  var n = document.getElementsByTagName("head")[0],
    o = {},
    i = {},
    a = {},
    u = {},
    c = {},
    p = {};
  define = function(name, deps, callback) {
    if (isArray(deps) && isFunction(callback)) {
      deps = callback;
    }
    i[name] = deps;
    var r = o[e];
    if (r) {
      for (var n = 0, a = r.length; a > n; ++n)
        r[n]();
      delete o[name];
    }
  }, require = function(e) {
    e = require.alias(e);
    var t = a[e];
    if (t)
      return t.exports;
    var r = i[e];
    if (!r)
      return false;
    t = a[e] = {
      exports: {}
    };
    var n = "function" == typeof r ? r.apply(t, [require, t.exports, t]) : r;
    return n && (t.exports = n), t.exports;
  }, require.async = function(t, n, o) {
    function a(e) {
      for (var t = e.length - 1; t >= 0; --t) {
        var n = e[t],
          p = c[n];
        p && "deps" in p && a(p.deps), n in i || n in s || (s[n] = !0, l++, r(n, u, o));
      }
    }
 
    function u() {
      if (0 == l--) {
        var r, o, i = [];
        for (r = 0, o = t.length; o > r; ++r)
          try {
            i[r] = require(t[r])
          } catch (a) {}
        n && n.apply(e, i);
      }
    }
    "string" == typeof t && (t = [t]);
    for (var p = t.length - 1; p >= 0; --p)
      t[p] = require.alias(t[p]);
    var s = {},
      l = 0;
    a(t), u();
  }, require.resourceMap = function(e) {
    var t, r;
    r = e.res;
    for (t in r)
      r.hasOwnProperty(t) && (c[t] = r[t]);
    r = e.pkg;
    for (t in r)
      r.hasOwnProperty(t) && (p[t] = r[t]);
  }, require.loadJs = function(e) {
    t(e);
  }, require.loadCss = function(e) {
    if (e.content) {
      var t = document.createElement("style");
      t.type = "text/css", t.styleSheet ? t.styleSheet.cssText = e.content : t.innerHTML = e.content, n.appendChild(t);
    } else if (e.url) {
      var r = document.createElement("link");
      r.href = e.url, r.rel = "stylesheet", r.type = "text/css", n.appendChild(r);
    }
  }, require.alias = function(e) {
    return e
  }, require.timeout = 5e3, define.amd = {
    jQuery: !0,
    version: "1.0.0"
  }
}(this);
! function() {
 (function() {
   var widgets = [],
     nameIdxMap = {},
     callbacks = [],
     remainings = 0;
   require.widget = {
     register: function(name) {
       var idx = nameIdxMap[name];
       if (idx == undefined) {
         nameIdxMap[name] = widgets.length;
         widgets.push(1);
         remainings++;
       } else {
         widgets[idx]++;
       }
     },
     ready: function(callback, ctx) {
       callbacks.push({
         func: callback,
         context: ctx
       });
       if (remainings < 1) {
         _ready();
       }
     },
     loaded: function(name) {
       var idx = nameIdxMap[name],
         num = widgets[idx] - 1;
 
       widgets[idx] = num;
       if (num == 0 && remainings) {
         remainings--;
       }
 
       if (remainings < 1) {
         _ready();
       }
     }
   };
 
   function _ready() {
     var callback;
     while (callback = callbacks.pop()) {
       callback.func.call(callback.ctx);
     }
   }
 })();
}();

I hope this article can help you learn to use javascript to handle file request loading asynchronous synchronization functions.

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn