Add new Nim-centric skeleton.

FossilOrigin-Name: 57566f60cade44209294cba6c284b20134d07fd3
jaccarmac · Feb 7, 2015 · dec7b1b · dec7b1b
1 parent 9d89a4a
commit dec7b1b
Show file tree

Hide file tree

Showing 16 changed files with 154 additions and 386 deletions.
diff --git a/config.xml b/config.xml
@@ -1,5 +1,5 @@
 <?xml version='1.0' encoding='utf-8'?>
-<widget id="com.jaccarmac.draftboys" version="0.3.1"
+<widget id="com.jaccarmac.draftboys" version="0.4.0"
         xmlns="http://www.w3.org/ns/widgets"
         xmlns:cdv="http://cordova.apache.org/ns/1.0">
   <name>DRAFTBOYS</name>

diff --git a/draftboys.org b/draftboys.org
@@ -34,6 +34,31 @@ becomes more and more important.
 friends, and people with similar goals in DotA 2. It is also a project which
 will help me practice Cordova, Nim, literate programming, and App Engine.
 
+* Build and run.
+
+  To build and run =D R A F T B O Y S= you will need:
+
+  * [[http://cordova.apache.org/docs/en/edge/guide_cli_index.md.html#The%2520Command-Line%2520Interface][Cordova CLI with Android platform.]]
+  * [[http://nim-lang.org/download.html][Nim.]]
+
+  First, compile the Nim project into JavaScript.
+
+  #+BEGIN_SRC sh
+    nim js -o:www/js/draftboys.js src/draftboys
+  #+END_SRC
+
+  Then, run the Cordova app on a device or emulator.
+
+  #+BEGIN_SRC sh
+    cordova run
+  #+END_SRC
+
+  Or test it in a browser.
+
+  #+BEGIN_SRC sh
+    cordova browse
+  #+END_SRC
+
 * Configure Cordova.
 
   The file layout of a Cordova project is way too complicated to put in a
@@ -48,7 +73,7 @@ will help me practice Cordova, Nim, literate programming, and App Engine.
   #+NAME: config_xml
   #+BEGIN_SRC xml
     <?xml version='1.0' encoding='utf-8'?>
-    <widget id="com.jaccarmac.draftboys" version="0.3.1"
+    <widget id="com.jaccarmac.draftboys" version="0.4.0"
             xmlns="http://www.w3.org/ns/widgets"
             xmlns:cdv="http://cordova.apache.org/ns/1.0">
       <name>DRAFTBOYS</name>
@@ -63,41 +88,80 @@ will help me practice Cordova, Nim, literate programming, and App Engine.
     </widget>
   #+END_SRC
 
-* Turn Nim into JavaScript.
+* Provide content for single-page app.
+
+  =D R A F T B O Y S= is a single-age app, so all the content for it is stored
+  in one HTML file.
+
+  The beginning of the file contains metadata, a CSS ~link~, and a declaration
+  of a ~div~ with a class of ~app~. All content will be put in ~app~.
+
+  #+NAME: index.html-header
+  #+BEGIN_SRC web
+    <!doctype html>
+    <html>
+        <head>
+            <meta charset="utf-8" />
+            <meta name="format-detection" content="telephone=no" />
+            <meta name="msapplication-tap-highlight" content="no" />
+            <meta name="viewport" content="user-scalable=no, initial-scale=1,
+                                           maximum-scale=1, minimum-scale=1,
+                                           width=device-width,
+                                           height=device-height,
+                                           target-densitydpi=device-dpi" />
+            <link rel="stylesheet" type="text/css" href="css/draftboys.css">
+            <title>D R A F T B O Y S</title>
+        </head>
+        <body>
+            <div class="app">
+  #+END_SRC
 
-  Nim is a newish systems programming language with lots of abstractions that
-  compile down to C so they are very fast. The Nim compiler has an experimental
-  JavaScript compiler which I am attempting to integrate with Cordova as I
-  learn the language itself.
+  The end of the file include relevant JavaScript and closes all the relevant
+  tags.
 
-  For now, the code is extremely simple and just duplicates what the old
-  JavaScript did. To compile it, run =nim js -o:www/js/index.js src/index.nim=.
+  #+NAME: index.html-footer
+  #+BEGIN_SRC web
+            </div>
+            <script type="text/javascript" src="cordova.js"></script>
+            <script type="text/javascript" src="js/draftboys.js"></script>
+        </body>
+    </html>
+  #+END_SRC
 
-  #+BEGIN_SRC nim :tangle src/index.nim :padline no
-    import dom
+  This is a placeholder tag with an ID to hook onto.
 
-    proc querySelector(baseElement: ref dom.TNode, selectors: cstring):
-      ref dom.TNode {.importc: "Element.prototype.querySelector.call".}
+  #+NAME: index.html-placeholder
+  #+BEGIN_SRC web
+    <h1 id="placeholder"></h1>
+  #+END_SRC
 
-    proc receivedEvent(id: cstring) =
-      var parentElement = document.getElementByID(id)
-      var listeningElement = parentElement.querySelector(".listening")
-      var receivedElement = parentElement.querySelector(".received")
-      listeningElement.setAttribute("style", "display: none")
-      receivedElement.setAttribute("style", "display: block")
+* Style the document.
 
-    proc onDeviceReady() =
-      receivedEvent("deviceready")
+  This section is a placeholder for now.
 
-    proc addEventListener(typee: cstring,
-                          listener: proc (),
-                          useCapture: bool)
-                          {.importc: "document.addEventListener".}
+* Implement app behavior.
 
-    proc bindEvents() =
-      addEventListener("deviceready", onDeviceReady, false)
+  The meat of the project is the actual behavior, which is implemented in Nim
+  before it gets compiled to JavaScript. Nim has a pretty good ~dom~ module and
+  an excellent FFI for JavaScript which we can use to fill in the holes in
+  ~dom~.
 
-    bindEvents()
+  This section will contain subsections as the app matures. For now, here is
+  some simple placeholder behavior. One important thing to note is the FFI
+  declaration and use of ~addEventListener~ to bind the ~deviceready~ event.
+
+  #+NAME: draftboys.nim-placeholder
+  #+BEGIN_SRC nim
+    import dom
+
+    proc addEventListener(target: ref TDocument, `type`: cstring,
+                          listener: proc (event: TEvent), useCapture: bool = false)
+                         {.importc: "EventTarget.prototype.addEventListener.call".}
+
+    proc placeholderListener(event: TEvent) =
+      document.getElementById("placeholder").innerHTML = "Hello from Nim!"
+
+    document.addEventListener("deviceready", placeholderListener)
   #+END_SRC
 
 * Tangle source code.
@@ -107,3 +171,23 @@ will help me practice Cordova, Nim, literate programming, and App Engine.
    #+BEGIN_SRC xml :noweb no-export :tangle config.xml :padline no
      <<config_xml>>
    #+END_SRC
+
+** =www/index.html=
+
+   #+BEGIN_SRC web :noweb no-export :tangle www/index.html :padline no
+     <<index.html-header>>
+     <<index.html-placeholder>>
+     <<index.html-footer>>
+   #+END_SRC
+
+** =www/css/draftboys.css=
+
+   #+BEGIN_SRC web :noweb no-export :tangle www/css/draftboys.css :padline no
+
+   #+END_SRC
+
+** =src/draftboys.nim=
+
+   #+BEGIN_SRC nim :noweb no-export :tangle src/draftboys.nim :padline no
+     <<draftboys.nim-placeholder>>
+   #+END_SRC
diff --git a/platforms/android/AndroidManifest.xml b/platforms/android/AndroidManifest.xml
@@ -1,5 +1,5 @@
 <?xml version='1.0' encoding='utf-8'?>
-<manifest android:hardwareAccelerated="true" android:versionCode="301" android:versionName="0.3.1" package="com.jaccarmac.draftboys" xmlns:android="http://schemas.android.com/apk/res/android">
+<manifest android:hardwareAccelerated="true" android:versionCode="400" android:versionName="0.4.0" package="com.jaccarmac.draftboys" xmlns:android="http://schemas.android.com/apk/res/android">
     <supports-screens android:anyDensity="true" android:largeScreens="true" android:normalScreens="true" android:resizeable="true" android:smallScreens="true" android:xlargeScreens="true" />
     <uses-permission android:name="android.permission.INTERNET" />
     <application android:hardwareAccelerated="true" android:icon="@drawable/icon" android:label="@string/app_name">

diff --git a/platforms/android/assets/www/css/draftboys.css b/platforms/android/assets/www/css/draftboys.css
@@ -0,0 +1 @@
+
diff --git a/platforms/android/assets/www/css/index.css b/platforms/android/assets/www/css/index.css
diff --git a/platforms/android/assets/www/img/logo.png b/platforms/android/assets/www/img/logo.png
diff --git a/platforms/android/assets/www/index.html b/platforms/android/assets/www/index.html
@@ -1,41 +1,22 @@
-<!DOCTYPE html>
-<!--
-    Licensed to the Apache Software Foundation (ASF) under one
-    or more contributor license agreements.  See the NOTICE file
-    distributed with this work for additional information
-    regarding copyright ownership.  The ASF licenses this file
-    to you under the Apache License, Version 2.0 (the
-    "License"); you may not use this file except in compliance
-    with the License.  You may obtain a copy of the License at
-
-    http://www.apache.org/licenses/LICENSE-2.0
-
-    Unless required by applicable law or agreed to in writing,
-    software distributed under the License is distributed on an
-    "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
-     KIND, either express or implied.  See the License for the
-    specific language governing permissions and limitations
-    under the License.
--->
+<!doctype html>
 <html>
     <head>
         <meta charset="utf-8" />
         <meta name="format-detection" content="telephone=no" />
         <meta name="msapplication-tap-highlight" content="no" />
-        <!-- WARNING: for iOS 7, remove the width=device-width and height=device-height attributes. See https://issues.apache.org/jira/browse/CB-4323 -->
-        <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
-        <link rel="stylesheet" type="text/css" href="css/index.css" />
-        <title>Hello World</title>
+        <meta name="viewport" content="user-scalable=no, initial-scale=1,
+                                       maximum-scale=1, minimum-scale=1,
+                                       width=device-width,
+                                       height=device-height,
+                                       target-densitydpi=device-dpi" />
+        <link rel="stylesheet" type="text/css" href="css/draftboys.css">
+        <title>D R A F T B O Y S</title>
     </head>
     <body>
         <div class="app">
-            <h1>Apache Cordova</h1>
-            <div id="deviceready" class="blink">
-                <p class="event listening">Connecting to Device</p>
-                <p class="event received">Device is Ready</p>
-            </div>
+<h1 id="placeholder"></h1>
         </div>
         <script type="text/javascript" src="cordova.js"></script>
-        <script type="text/javascript" src="js/index.js"></script>
+        <script type="text/javascript" src="js/draftboys.js"></script>
     </body>
 </html>
diff --git a/www/js/index.js → platforms/android/assets/www/js/draftboys.js b/www/js/index.js → platforms/android/assets/www/js/draftboys.js
@@ -280,29 +280,11 @@ e_9270 = {m_type: NTI3038, parent: null, name: null, message: null, trace: null}
 e_9270.message = cstrToNimstr("divison by zero");
 raiseException(e_9270, "DivByZeroError");
 }
-function receivedevent_17009(id_17011) {
-var F={procname:"index.receivedEvent",prev:framePtr,filename:"index.nim",line:0};
+function placeholderlistener_17011(event_17013) {
+var F={procname:"draftboys.placeholderListener",prev:framePtr,filename:"/home/jaccarmac/src/jaccarmac.com/draftboys/src/draftboys.nim",line:0};
 framePtr = F;
-F.line = 7;
-var parentelement_17012 = document.getElementById(id_17011);
 F.line = 8;
-var listeningelement_17013 = Element.prototype.querySelector.call(parentelement_17012, ".listening");
-F.line = 9;
-var receivedelement_17014 = Element.prototype.querySelector.call(parentelement_17012, ".received");
-listeningelement_17013.setAttribute("style", "display: none");
-receivedelement_17014.setAttribute("style", "display: block");
+document.getElementById("placeholder").innerHTML = "Hello from Nim!";
 framePtr = framePtr.prev;
 }
-function ondeviceready_17015() {
-var F={procname:"index.onDeviceReady",prev:framePtr,filename:"index.nim",line:0};
-framePtr = F;
-receivedevent_17009("deviceready");
-framePtr = framePtr.prev;
-}
-function bindevents_17024() {
-var F={procname:"index.bindEvents",prev:framePtr,filename:"index.nim",line:0};
-framePtr = F;
-document.addEventListener("deviceready", ondeviceready_17015, 0);
-framePtr = framePtr.prev;
-}
-bindevents_17024();
+EventTarget.prototype.addEventListener.call(document, "deviceready", placeholderlistener_17011, 0);
diff --git a/platforms/android/res/xml/config.xml b/platforms/android/res/xml/config.xml
@@ -1,5 +1,5 @@
 <?xml version='1.0' encoding='utf-8'?>
-<widget id="com.jaccarmac.draftboys" version="0.3.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
+<widget id="com.jaccarmac.draftboys" version="0.4.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
     <preference name="loglevel" value="DEBUG" />
     <name>DRAFTBOYS</name>
     <description>