Starting nav list test

2025-11-06 14:19:17 +08:00 · 2013-09-22 14:06:27 -05:00
parent c6d0dd4457
commit ddb7279a25
1 changed files with 90 additions and 0 deletions
--- a/hacking/navList.html
+++ b/hacking/navList.html
@ -0,0 +1,90 @@
+<html ng-app="navTest">
+  <head>
+    <meta charset="utf-8">
+    <title>Nav List</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">
+    <script src="/vendor/angular/1.2.0rc2/angular.js"></script>
+    <script src="/vendor/angular/1.2.0rc2/angular-touch.js"></script>
+    <script src="/vendor/angular/1.2.0rc2/angular-animate.js"></script>
+    <style>
+      .reveal-animation {
+        /*
+        -webkit-transform: translate3d(0%, 0, 0);
+                transform: translate3d(0%, 0, 0);
+
+       -webkit-transition: -webkit-transform 1s ease-in-out;
+               transition:         transform 1s ease-in-out;
+        */
+      }
+      .reveal-animation.ng-enter {
+        -webkit-transition: .2s ease-in-out all;
+        -webkit-transform:translate3d(100%,0,0) ;
+      }
+      .reveal-animation.ng-enter-active {
+        -webkit-transform:translate3d(0,0,0) ;
+      }
+      .reveal-animation.ng-leave {
+        -webkit-transition: .2s ease-in-out all;
+        -webkit-transform:translate3d(0%,0,0);
+      }
+      .reveal-animation.ng-leave-active {
+        -webkit-transition: .2s ease-in-out all;
+        -webkit-transform:translate3d(-100%,0,0);
+      }
+    </style>
+
+  </head>
+  <body>
+
+    <nav-controller>
+      <nav-bar></nav-bar>
+      <content has-header="true" ng-controller="AppCtrl" class="reveal-animation">
+      </content>
+    </nav-controller>
+
+    <script src="NavController.js"></script>
+    <script src="NavAngular.js"></script>
+    <script>
+      var pageNumber = 0;
+
+      var pushIt = function($scope, $compile, $element, cb) {
+        var childScope = $scope.$new();
+        childScope.isVisible = true;
+
+        pageNumber++;
+
+        var el = $compile('<div title="Home: ' + pageNumber + '" ng-controller="CatsCtrl" nav-content has-header="true" class="reveal-animation" ng-show="isVisible">' +
+          '<h1>' + pageNumber + '</h1>' +
+          '<a href="#" class="button button-success" ng-click="goNext()">Next</a>' +
+          '</div>')(childScope, cb);
+      }
+
+      angular.module('navTest', ['ionic.ui'])
+
+      .controller('AppCtrl', function($scope, $compile, $element) {
+
+        $scope.items = [
+          { text: 'Hello' }
+        ];
+        pushIt($scope, $compile, $element, function(cloned, scope) {
+          $element.append(cloned);
+        })
+
+      })
+
+      .controller('CatsCtrl', function($scope, $compile, $element) {
+        console.log('Cats', $element);
+        $scope.goNext = function() {
+          pushIt($scope, $compile, $element, function(cloned, scope) {
+            $element.parent().append(cloned);
+          })
+        };
+      });
+    </script>
+  </body>
+</html>
+