Start of basic route controller

2025-11-06 22:29:44 +08:00 · 2013-09-19 23:12:57 -05:00
parent 4a8b35326f
commit 1814b0e781
2 changed files with 107 additions and 0 deletions
--- a/hacking/RouteController.js
+++ b/hacking/RouteController.js
@ -0,0 +1,78 @@
+/**
+ * Adapted from Backbone.js
+ */
+(function(window, document, ionic) {
+  // Cached regex for stripping a leading hash/slash and trailing space.
+  var routeStripper = /^[#\/]|\s+$/g;
+
+  // Cached regex for stripping leading and trailing slashes.
+  var rootStripper = /^\/+|\/+$/g;
+
+  // Cached regex for removing a trailing slash.
+  var trailingSlash = /\/$/;
+
+  RouteViewController = function(options) {
+    this.options = options;
+
+    this.root = this.options.root || '/';
+
+    this.handlers = [];
+
+    this._bindEvents();
+
+    this.location = window.location;
+    this.history = window.history;
+  };
+
+  RouteViewController.prototype = {
+
+    _bindEvents: function() {
+      var _this = this;
+
+      window.addEventListener('popstate', function(event) {
+        console.log("POP STATE", event, window.location, window.location.hash);
+        _this.checkUrl(event);
+      });
+      window.addEventListener('pushstate', function(event) {
+        console.log("PUSH STATE", event, window.location);
+      });
+    },
+    checkUrl: function(e) {
+      var current = this.getFragment();
+      if (current === this.fragment) return false;
+      this.loadUrl() || this.loadUrl(this.getHash());
+    },
+    getFragment: function(fragment, forcePushState) {
+      if (fragment == null) {
+        if (this._hasPushState || !this._wantsHashChange || forcePushState) {
+          fragment = this.location.pathname;
+          var root = this.root.replace(this.trailingSlash, '');
+          if (!fragment.indexOf(root)) fragment = fragment.substr(root.length);
+        } else {
+          fragment = this.getHash();
+        }
+      }
+      return fragment.replace(this.routeStripper, '');
+    },
+    getHash: function(window) {
+      var match = (window || this).location.href.match(/#(.*)$/);
+      return match ? match[1] : '';
+    },
+
+    // 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: function(fragmentOverride) {
+      var fragment = this.fragment = this.getFragment(fragmentOverride);
+      var matched = false;
+      for(var i = 0; i < this.handlers.length; i++) {
+        var h = this.handlers[i];
+        if (h.route.test(fragment)) {
+          h.callback(fragment);
+          matched = true;
+        }
+      }
+      return matched;
+    },
+  };
+})(this, document, ion = this.ionic || {});
--- a/hacking/route.html
+++ b/hacking/route.html
@ -0,0 +1,29 @@
+<html>
+  <head>
+    <meta charset="utf-8">
+    <title>Route Controller</title>
+
+    <!-- Sets initial viewport load and disables zooming  -->
+    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
+    <link href="/vendor/font-awesome/css/font-awesome.css" rel="stylesheet">
+    <link rel="stylesheet" href="../dist/ionic.css">
+  </head>
+  <body>
+    <section>
+      <header class="bar bar-header bar-dark">
+        <h1 class="title">Routes</h1>
+      </header>
+
+      <main class="has-header content">
+        <a href="#cats">Cats</a>
+      </main>
+    </section>
+
+    <script src="RouteController.js"></script>
+    <script>
+      var rc = new RouteViewController({
+      });
+    </script>
+  </body>
+</html>
+