fineui/src/router/0.router.js

import { _ } from "@/core";
import { _global } from "@/core/0.foundation";


const Events = {
    // Bind an event to a `callback` function. Passing `"all"` will bind
    // the callback to all events fired.
    on(name, callback, context) {
        if (!eventsApi(this, "on", name, [callback, context]) || !callback) {
            return this;
        }
        this._events || (this._events = {});
        const events = this._events[name] || (this._events[name] = []);
        events.push({
            callback,
            context,
            ctx: context || this
        });

        return this;
    },

    // Bind an event to only be triggered a single time. After the first time
    // the callback is invoked, it will be removed.
    once(name, callback, context) {
        if (!eventsApi(this, "once", name, [callback, context]) || !callback) {
            return this;
        }
        const self = this;
        var once = _.once(function () {
            self.off(name, once);
            callback.apply(this, arguments);
        });
        once._callback = callback;

        return this.on(name, once, context);
    },

    // Remove one or many callbacks. If `context` is null, removes all
    // callbacks with that function. If `callback` is null, removes all
    // callbacks for the event. If `name` is null, removes all bound
    // callbacks for all events.
    off(name, callback, context) {
        if (
            !this._events ||
            !eventsApi(this, "off", name, [callback, context])
        ) {
            return this;
        }

        // Remove all callbacks for all events.
        if (!name && !callback && !context) {
            this._events = void 0;

            return this;
        }

        const names = name ? [name] : _.keys(this._events);
        for (let i = 0, length = names.length; i < length; i++) {
            name = names[i];

            // Bail out if there are no events stored.
            const events = this._events[name];
            if (!events) continue;

            // Remove all callbacks for this event.
            if (!callback && !context) {
                delete this._events[name];
                continue;
            }

            // Find any remaining events.
            const remaining = [];
            for (let j = 0, k = events.length; j < k; j++) {
                const event = events[j];
                if (
                    (callback &&
                        callback !== event.callback &&
                        callback !== event.callback._callback) ||
                    (context && context !== event.context)
                ) {
                    remaining.push(event);
                }
            }

            // Replace events if there are any remaining.  Otherwise, clean up.
            if (remaining.length) {
                this._events[name] = remaining;
            } else {
                delete this._events[name];
            }
        }

        return this;
    },

    un() {
        this.off.apply(this, arguments);
    },

    // Trigger one or many events, firing all bound callbacks. Callbacks are
    // passed the same arguments as `trigger` is, apart from the event name
    // (unless you're listening on `"all"`, which will cause your callback to
    // receive the true name of the event as the first argument).
    trigger(name) {
        if (!this._events) return this;
        const args = slice.call(arguments, 1);
        if (!eventsApi(this, "trigger", name, args)) return this;
        const events = this._events[name];
        const allEvents = this._events.all;
        if (events) triggerEvents(events, args);
        if (allEvents) triggerEvents(allEvents, arguments);

        return this;
    },

    fireEvent() {
        this.trigger.apply(this, arguments);
    },

    // Inversion-of-control versions of `on` and `once`. Tell *this* object to
    // listen to an event in another object ... keeping track of what it's
    // listening to.
    listenTo(obj, name, callback) {
        const listeningTo = this._listeningTo || (this._listeningTo = {});
        const id = obj._listenId || (obj._listenId = _.uniqueId("l"));
        listeningTo[id] = obj;
        if (!callback && typeof name === "object") callback = this;
        obj.on(name, callback, this);

        return this;
    },

    listenToOnce(obj, name, callback) {
        if (typeof name === "object") {
            for (const event in name) {
                this.listenToOnce(obj, event, name[event]);
            }

            return this;
        }
        if (eventSplitter.test(name)) {
            const names = name.split(eventSplitter);
            for (let i = 0, length = names.length; i < length; i++) {
                this.listenToOnce(obj, names[i], callback);
            }

            return this;
        }
        if (!callback) return this;
        var once = _.once(function () {
            this.stopListening(obj, name, once);
            callback.apply(this, arguments);
        });
        once._callback = callback;

        return this.listenTo(obj, name, once);
    },

    // Tell this object to stop listening to either specific events ... or
    // to every object it's currently listening to.
    stopListening(obj, name, callback) {
        let listeningTo = this._listeningTo;
        if (!listeningTo) return this;
        const remove = !name && !callback;
        if (!callback && typeof name === "object") callback = this;
        if (obj) (listeningTo = {})[obj._listenId] = obj;
        for (const id in listeningTo) {
            obj = listeningTo[id];
            obj.off(name, callback, this);
            if (remove || _.isEmpty(obj._events)) {
                delete this._listeningTo[id];
            }
        }

        return this;
    }
};

// Regular expression used to split event strings.
var eventSplitter = /\s+/;

// Implement fancy features of the Events API such as multiple event
// names `"change blur"` and jQuery-style event maps `{change: action}`
// in terms of the existing API.
var eventsApi = function (obj, action, name, rest) {
    if (!name) return true;

    // Handle event maps.
    if (typeof name === "object") {
        for (const key in name) {
            obj[action].apply(obj, [key, name[key]].concat(rest));
        }

        return false;
    }

    // Handle space separated event names.
    if (eventSplitter.test(name)) {
        const names = name.split(eventSplitter);
        for (let i = 0, length = names.length; i < length; i++) {
            obj[action].apply(obj, [names[i]].concat(rest));
        }

        return false;
    }

    return true;
};

// A difficult-to-believe, but optimized internal dispatch function for
// triggering events. Tries to keep the usual cases speedy (most internal
// BI events have 3 arguments).
var triggerEvents = function (events, args) {
    let ev,
        i = -1,
        l = events.length,
        a1 = args[0],
        a2 = args[1],
        a3 = args[2];
    switch (args.length) {
        case 0:
            while (++i < l) (ev = events[i]).callback.call(ev.ctx);

            return;
        case 1:
            while (++i < l) (ev = events[i]).callback.call(ev.ctx, a1);

            return;
        case 2:
            while (++i < l) (ev = events[i]).callback.call(ev.ctx, a1, a2);

            return;
        case 3:
            while (++i < l) {
                (ev = events[i]).callback.call(ev.ctx, a1, a2, a3);
            }

            return;
        default:
            while (++i < l) (ev = events[i]).callback.apply(ev.ctx, args);

            return;
    }
};

// BI.Router
// ---------------

// Routers map faux-URLs to actions, and fire events when routes are
// matched. Creating a new one sets its `routes` hash, if not set statically.
export const Router = function (options) {
    options || (options = {});
    if (options.routes) this.routes = options.routes;
    this._bindRoutes();
    this._init.apply(this, arguments);
};

// Cached regular expressions for matching named param parts and splatted
// parts of route strings.
const optionalParam = /\((.*?)\)/g;
const namedParam = /(\(\?)?:\w+/g;
const splatParam = /\*\w+/g;
const escapeRegExp = /[\-{}\[\]+?.,\\\^$|#\s]/g;

// Set up all inheritable **BI.Router** properties and methods.
_.extend(Router.prototype, Events, {
    // _init is an empty function by default. Override it with your own
    // initialization logic.
    _init() {},

    // Manually bind a single named route to a callback. For example:
    //
    //     this.route('search/:query/p:num', 'search', function(query, num) {
    //       ...
    //     });
    //
    route(route, name, callback) {
        if (!_.isRegExp(route)) route = this._routeToRegExp(route);
        if (_.isFunction(name)) {
            callback = name;
            name = "";
        }
        if (!callback) callback = this[name];
        const router = this;
        history.route(route, (fragment) => {
            const args = router._extractParameters(route, fragment);
            if (router.execute(callback, args, name) !== false) {
                router.trigger.apply(router, [`route:${name}`].concat(args));
                router.trigger("route", name, args);
                history.trigger("route", router, name, args);
            }
        });

        return this;
    },

    // Execute a route handler with the provided parameters.  This is an
    // excellent place to do pre-route setup or post-route cleanup.
    execute(callback, args, name) {
        if (callback) callback.apply(this, args);
    },

    // Simple proxy to `BI.history` to save a fragment into the history.
    navigate(fragment, options) {
        history.navigate(fragment, options);

        return this;
    },

    // Bind all defined routes to `BI.history`. We have to reverse the
    // order of the routes here to support behavior where the most general
    // routes can be defined at the bottom of the route map.
    _bindRoutes() {
        if (!this.routes) return;
        this.routes = _.result(this, "routes");
        let route,
            routes = _.keys(this.routes);
        while ((route = routes.pop()) != null) {
            this.route(route, this.routes[route]);
        }
    },

    // Convert a route string into a regular expression, suitable for matching
    // against the current location hash.
    _routeToRegExp(route) {
        route = route
            .replace(escapeRegExp, "\\$&")
            .replace(optionalParam, "(?:$1)?")
            .replace(namedParam, (match, optional) =>
                optional ? match : "([^/?]+)"
            )
            .replace(splatParam, "([^?]*?)");

        return new RegExp(`^${route}(?:\\?([\\s\\S]*))?$`);
    },

    // Given a route, and a URL fragment that it matches, return the array of
    // extracted decoded parameters. Empty or unmatched parameters will be
    // treated as `null` to normalize cross-browser behavior.
    _extractParameters(route, fragment) {
        const params = route.exec(fragment).slice(1);

        return _.map(params, (param, i) => {
            // Don't decode the search params.
            if (i === params.length - 1) return param || null;
            let resultParam = null;
            if (param) {
                try {
                    resultParam = decodeURIComponent(param);
                } catch (e) {
                    resultParam = param;
                }
            }

            return resultParam;
        });
    }
});

// History
// ----------------

// Handles cross-browser history management, based on either
// [pushState](http://diveintohtml5.info/history.html) and real URLs, or
// [onhashchange](https://developer.mozilla.org/en-US/docs/DOM/window.onhashchange)
// and URL fragments. If the browser supports neither (old IE, natch),
// falls back to polling.
const History = function () {
    this.handlers = [];
    this.checkUrl = _.bind(this.checkUrl, this);

    // Ensure that `History` can be used outside of the browser.
    if (typeof window !== "undefined") {
        this.location = _global.location;
        this.history = _global.history;
    }
};

// Cached regex for stripping a leading hash/slash and trailing space.
const routeStripper = /^[#\/]|\s+$/g;

// Cached regex for stripping leading and trailing slashes.
const rootStripper = /^\/+|\/+$/g;

// Cached regex for stripping urls of hash.
const pathStripper = /#.*$/;

// Has the history handling already been started?
History.started = false;

// Set up all inheritable **BI.History** properties and methods.
_.extend(History.prototype, Events, {
    // The default interval to poll for hash changes, if necessary, is
    // twenty times a second.
    interval: 50,

    // Are we at the app root?
    atRoot() {
        const path = this.location.pathname.replace(/[^\/]$/, "$&/");

        return path === this.root && !this.getSearch();
    },

    // In IE6, the hash fragment and search params are incorrect if the
    // fragment contains `?`.
    getSearch() {
        const match = this.location.href.replace(/#.*/, "").match(/\?.+/);

        return match ? match[0] : "";
    },

    // Gets the true hash value. Cannot use location.hash directly due to bug
    // in Firefox where location.hash will always be decoded.
    getHash(window) {
        const match = (window || this).location.href.match(/#(.*)$/);

        return match ? match[1] : "";
    },

    // Get the pathname and search params, without the root.
    getPath() {
        let path = this.location.pathname + this.getSearch();
        try {
            path = decodeURI(path);
        } catch (e) {}
        const root = this.root.slice(0, -1);
        if (!path.indexOf(root)) path = path.slice(root.length);

        return path.charAt(0) === "/" ? path.slice(1) : path;
    },

    // Get the cross-browser normalized URL fragment from the path or hash.
    getFragment(fragment) {
        if (fragment == null) {
            if (this._hasPushState || !this._wantsHashChange) {
                fragment = this.getPath();
            } else {
                fragment = this.getHash();
            }
        }

        return fragment.replace(routeStripper, "");
    },

    // Start the hash change handling, returning `true` if the current URL matches
    // an existing route, and `false` otherwise.
    start(options) {
        if (History.started) {
            throw new Error("BI.history has already been started");
        }
        History.started = true;

        // Figure out the initial configuration. Do we need an iframe?
        // Is pushState desired ... is it available?
        this.options = _.extend({ root: "/" }, this.options, options);
        this.root = this.options.root;
        this._wantsHashChange = this.options.hashChange !== false;
        this._hasHashChange = "onhashchange" in window;
        this._wantsPushState = !!this.options.pushState;
        this._hasPushState = !!(
            this.options.pushState &&
            this.history &&
            this.history.pushState
        );
        this.fragment = this.getFragment();

        // Normalize root to always include a leading and trailing slash.
        this.root = `/${this.root}/`.replace(rootStripper, "/");

        // Transition from hashChange to pushState or vice versa if both are
        // requested.
        if (this._wantsHashChange && this._wantsPushState) {
            // If we've started off with a route from a `pushState`-enabled
            // browser, but we're currently in a browser that doesn't support it...
            if (!this._hasPushState && !this.atRoot()) {
                const root = this.root.slice(0, -1) || "/";
                this.location.replace(`${root}#${this.getPath()}`);
                // Return immediately as browser will do redirect to new url
                return true;

                // Or if we've started out with a hash-based route, but we're currently
                // in a browser where it could be `pushState`-based instead...
            } else if (this._hasPushState && this.atRoot()) {
                this.navigate(this.getHash(), { replace: true });
            }
        }

        // Proxy an iframe to handle location events if the browser doesn't
        // support the `hashchange` event, HTML5 history, or the user wants
        // `hashChange` but not `pushState`.
        if (
            !this._hasHashChange &&
            this._wantsHashChange &&
            (!this._wantsPushState || !this._hasPushState)
        ) {
            const iframe = document.createElement("iframe");
            iframe.src = "javascript:0";
            iframe.style.display = "none";
            iframe.tabIndex = -1;
            const body = document.body;
            // Using `appendChild` will throw on IE < 9 if the document is not ready.
            this.iframe = body.insertBefore(
                iframe,
                body.firstChild
            ).contentWindow;
            this.iframe.document.open().close();
            this.iframe.location.hash = `#${this.fragment}`;
        }

        // Add a cross-platform `addEventListener` shim for older browsers.
        const addEventListener =
            _global.addEventListener ||
            function (eventName, listener) {
                return attachEvent(`on${eventName}`, listener);
            };

        // Depending on whether we're using pushState or hashes, and whether
        // 'onhashchange' is supported, determine how we check the URL state.
        if (this._hasPushState) {
            addEventListener("popstate", this.checkUrl, false);
        } else if (
            this._wantsHashChange &&
            this._hasHashChange &&
            !this.iframe
        ) {
            addEventListener("hashchange", this.checkUrl, false);
        } else if (this._wantsHashChange) {
            this._checkUrlInterval = setInterval(this.checkUrl, this.interval);
        }

        if (!this.options.silent) return this.loadUrl();
    },

    // Disable BI.history, perhaps temporarily. Not useful in a real app,
    // but possibly useful for unit testing Routers.
    stop() {
        // Add a cross-platform `removeEventListener` shim for older browsers.
        const removeEventListener =
            _global.removeEventListener ||
            function (eventName, listener) {
                return detachEvent(`on${eventName}`, listener);
            };

        // Remove window listeners.
        if (this._hasPushState) {
            removeEventListener("popstate", this.checkUrl, false);
        } else if (
            this._wantsHashChange &&
            this._hasHashChange &&
            !this.iframe
        ) {
            removeEventListener("hashchange", this.checkUrl, false);
        }

        // Clean up the iframe if necessary.
        if (this.iframe) {
            document.body.removeChild(this.iframe.frameElement);
            this.iframe = null;
        }

        // Some environments will throw when clearing an undefined interval.
        if (this._checkUrlInterval) clearInterval(this._checkUrlInterval);
        History.started = false;
    },

    // Add a route to be tested when the fragment changes. Routes added later
    // may override previous routes.
    route(route, callback) {
        this.handlers.unshift({ route, callback });
    },

    // check route is Exist. if exist, return the route
    checkRoute(route) {
        for (let i = 0; i < this.handlers.length; i++) {
            if (
                this.handlers[i].route.toString() ===
                Router.prototype._routeToRegExp(route).toString()
            ) {
                return this.handlers[i];
            }
        }

        return null;
    },

    // remove a route match in routes
    unRoute(route) {
        const index = _.findIndex(this.handlers, (handler) =>
            handler.route.test(route)
        );
        if (index > -1) {
            this.handlers.splice(index, 1);
        }
    },

    // Checks the current URL to see if it has changed, and if it has,
    // calls `loadUrl`, normalizing across the hidden iframe.
    checkUrl(e) {
        let current = this.getFragment();
        try {
            // getFragment 得到的值是编码过的,而this.fragment是没有编码过的
            // 英文路径没有问题，遇上中文和空格有问题了
            current = decodeURIComponent(current);
        } catch (e) {}
        // If the user pressed the back button, the iframe's hash will have
        // changed and we should use that for comparison.
        if (current === this.fragment && this.iframe) {
            current = this.getHash(this.iframe);
        }

        if (current === this.fragment) return false;
        if (this.iframe) this.navigate(current);
        this.loadUrl();
    },

    // Attempt to load the current URL fragment. If a route succeeds with a
    // match, returns `true`. If no defined routes matches the fragment,
    // returns `false`.
    loadUrl(fragment) {
        fragment = this.fragment = this.getFragment(fragment);

        return _.some(this.handlers, (handler) => {
            if (handler.route.test(fragment)) {
                handler.callback(fragment);

                return true;
            }
        });
    },

    // Save a fragment into the hash history, or replace the URL state if the
    // 'replace' option is passed. You are responsible for properly URL-encoding
    // the fragment in advance.
    //
    // The options object can contain `trigger: true` if you wish to have the
    // route callback be fired (not usually desirable), or `replace: true`, if
    // you wish to modify the current URL without adding an entry to the history.
    navigate(fragment, options) {
        if (!History.started) return false;
        if (!options || options === true) options = { trigger: !!options };

        // Normalize the fragment.
        fragment = this.getFragment(fragment || "");

        // Don't include a trailing slash on the root.
        let root = this.root;
        if (fragment === "" || fragment.charAt(0) === "?") {
            root = root.slice(0, -1) || "/";
        }
        const url = root + fragment;

        // Strip the hash and decode for matching.
        fragment = fragment.replace(pathStripper, "");
        try {
            fragment = decodeURI(fragment);
        } catch (e) {}

        if (this.fragment === fragment) return;
        this.fragment = fragment;

        // If pushState is available, we use it to set the fragment as a real URL.
        if (this._hasPushState) {
            this.history[options.replace ? "replaceState" : "pushState"](
                {},
                document.title,
                url
            );

            // If hash changes haven't been explicitly disabled, update the hash
            // fragment to store history.
        } else if (this._wantsHashChange) {
            this._updateHash(this.location, fragment, options.replace);
            if (this.iframe && fragment !== this.getHash(this.iframe)) {
                // Opening and closing the iframe tricks IE7 and earlier to push a
                // history entry on hash-tag change.  When replace is true, we don't
                // want this.
                if (!options.replace) this.iframe.document.open().close();
                this._updateHash(
                    this.iframe.location,
                    fragment,
                    options.replace
                );
            }

            // If you've told us that you explicitly don't want fallback hashchange-
            // based history, then `navigate` becomes a page refresh.
        } else {
            return this.location.assign(url);
        }
        if (options.trigger) return this.loadUrl(fragment);
    },

    // Update the hash location, either replacing the current entry, or adding
    // a new one to the browser history.
    _updateHash(location, fragment, replace) {
        if (replace) {
            const href = location.href.replace(/(javascript:|#).*$/, "");
            location.replace(`${href}#${fragment}`);
        } else {
            // Some browsers require that `hash` contains a leading #.
            location.hash = `#${fragment}`;
        }
    }
});

// Create the default BI.history.
export const history = new History();