Initial commit

shiawuen · Dec 22, 2011 · 4b9c566 · 4b9c566
commit 4b9c566
Show file tree

Hide file tree

Showing 10 changed files with 4,945 additions and 0 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1 @@
+node_modules
diff --git a/css/.gitignore b/css/.gitignore
@@ -0,0 +1,2 @@
+style.css
+.DS_Store
diff --git a/css/style.styl b/css/style.styl
@@ -0,0 +1,22 @@
+@import 'nib'
+
+body {
+  margin: 0;
+  padding: 0;
+}
+
+.ball {
+  margin-top: -25px;
+  margin-left: -25px;
+  absolute: top 50% left 50%;
+
+  width: 50px;
+  height: 50px;
+  border-radius: 25px;
+
+  background: #1e5799;
+  background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(1%,#7db9e8), color-stop(100%,#1e5799));
+  background: -webkit-radial-gradient(center, ellipse cover,  #7db9e8 1%,#1e5799 100%);
+  background: radial-gradient(center, ellipse cover,  #7db9e8 1%,#1e5799 100%);
+
+}
diff --git a/index.html b/index.html
@@ -0,0 +1,23 @@
+<!DOCTYPE HTML>
+<html lang="en-US">
+<head>
+  <meta charset="UTF-8">
+  <title>PhoneGap Test</title>
+
+  <link rel="stylesheet" href="css/style.css" />
+
+  <script src="http://192.168.1.2:8999/target/target-script-min.js"></script>
+
+  <script src="js/lib/phonegap.js"></script>
+  <script src="js/shims/request-anination-frame.js.js"></script>
+  <script src="js/helpers/dom-select.js"></script>
+  <script src="js/mylibs/accelerathor.js"></script>
+  <script src="js/mylibs/ball.js"></script>
+  <script src="js/index.js"></script>
+</head>
+<body>
+
+  <div id="ball" class="ball"></div>
+
+</body>
+</html>
diff --git a/js/helpers/dom-select.js b/js/helpers/dom-select.js
@@ -0,0 +1,3 @@
+function byId(id) {
+  return document.getElementById(id);
+}
diff --git a/js/index.js b/js/index.js
@@ -0,0 +1,93 @@
+(function(global, undef) {
+
+/**
+ * Local cache
+ */
+var requestAnimFrame = window.requestAnimFrame;
+
+
+/**
+ * The ball
+ */
+
+var ball;
+
+
+/**
+ * Accelerometer state
+ */
+
+var acceleration;
+
+
+/**
+ * Options for Accelerometer events
+ */
+
+var options = { frequency: 500 };
+
+
+global.addEventListener('deviceready', init);
+
+
+function init() {
+
+  /**
+   * 2. Listen on accelerometer state update
+   */
+  accelerathor.watch(
+      onAccelerometerUpdate
+    , onAccelerometerError
+    , options);
+
+
+  /**
+   * 3. Intialize the state of the ball
+   */
+  ball = new Ball(byId('ball'));
+  // More stuff
+
+
+  /**
+   * 4. Wiring up the drawing for the ball movement
+   */
+
+  animate();
+}
+
+/**
+ * Animatate the ball
+ */
+
+function move() {
+
+  // skip if accelerometer state not ready
+  if (typeof acceleration === 'undefined')
+    return;
+
+
+  // Move the ball!!!
+
+}
+
+
+function animate() {
+  requestAnimFrame(animate);
+  move();
+}
+
+
+/**
+ * Event handlers for Accelerometer
+ */
+
+function onAccelerometerUpdate(_acceleration) {
+  acceleration = _acceleration;
+}
+
+
+function onAccelerometerError() {
+  throw new Error("Unable to retrieve accelerometer");
+}
+
+})(window);