Merge pull request #12 from dapetcu21/master

Started adding content

app/css/template.styl

@@ -4,8 +4,34 @@
 .template-container-inner
   overflow-x: hidden //Collapses margins
 
-  padding: 1em
-  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
 
 .template-bg
   background-color: #f9f9f9
+
+// All in-template styling goes in here:
+
+.template-container-inner
+  padding: 0 0 1em 0
+  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
+
+  section
+    > *
+      padding: 0 16px
+
+    > .lightbox
+      padding: 0
+
+  .lightbox
+    max-height: 400px
+    overflow: hidden
+
+    .lightbox-container
+      transform: translate(0, 50%)
+      width: 100%
+      height: 100%
+      max-height: 400px
+
+      img
+        width: 100%
+        height: auto
+        transform: translate(0, -50%)

app/js/controllers/mainmenu-controller.js

@@ -15,13 +15,6 @@ function MainMenuController(options) {
         ro: 'Despre Deltă',
         en: 'About the Delta',
       }),
-      viewController: function () {
-        return new TemplateController({
-          template: templates.article,
-          title: 'Some Template',
-          backIcon: 'fa-home',
-        });
-      },
     },
     restricted: {
       title: T.span({
@@ -40,6 +33,16 @@ function MainMenuController(options) {
         ro: 'Planificare',
         en: 'Planning',
       }),
+      viewController: function () {
+        return new TemplateController({
+          template: templates.ghid.planning.index,
+          title: T.span({
+            ro: 'Planificare',
+            en: 'Planning',
+          }),
+          backIcon: 'fa-home',
+        });
+      },
     },
     routes: {
       title: T.span({

app/js/controllers/menu-controller.js

@@ -14,8 +14,8 @@ function MenuController(options) {
   var self = this;
 
   self.buttons = [];
-  self.on('navigateBack', function() {
-    self.presentIn(200);
+  self.on('navigateBack:before', function() {
+    self.presentIn(300);
   });
 }
 util.inherits(MenuController, NavigationController);
@@ -150,7 +150,7 @@ MenuController.prototype.present = function (isIn, skip, globalDelay) {
   presentSurface(self.titleBarModifier, self.titleBarShowModifier, false, 0);
   presentSurface(self.captureSurfaceModifier, self.captureSurfaceShowModifier, false, isIn ? 300 : 0);
 
-  W.all(promises).then(function () {
+  self.endOfTransitionPromise = W.all(promises).then(function () {
     _.each(afterActions, function (cb) {
       cb();
     });
@@ -320,6 +320,7 @@ MenuController.prototype.buildGrid = function (parentNode) {
 };
 
 MenuController.prototype.createNavRenderController = function () {
+  var self = this;
   var renderController = new Famous.RenderController({
     inTransition: {
       method: 'delay',
@@ -331,6 +332,14 @@ MenuController.prototype.createNavRenderController = function () {
     outTransition: {
       duration: 400,
       curve: 'easeOut',
+      delay: 100,
+      method: 'delay',
+      delayMethod: Famous.PromiseTransition,
+      promise: { 
+        then: function () {
+          self.endOfTransitionPromise.then.apply(self.endOfTransitionPromise, arguments);
+        }
+      }
     }
   });
 

app/js/controllers/navigation-controller.js

@@ -53,6 +53,7 @@ NavigationController.prototype.navigateBack = function () {
   if ((this.viewController instanceof NavigationController) && this.viewController.viewController) {
     return;
   }
+  this.emit('navigateBack:before');
   this.setNavigationItem(null);
   this.emit('navigateBack');
 };

app/js/controllers/template-controller.js

@@ -5,11 +5,12 @@ var $ = require('jquery');
 var templates = require('../lib/templates');
 var _ = require('lodash');
 var cordova = require('../shims/cordova');
+var T = require('../translate');
 
 function TemplateController(options) {
   options = options || {};
   options.template = options.template || (function () {});
-  options.templateOptions = options.templateOptions || {};
+  options.templateOptions = options.templateOptions || { T: T };
   TitleBarController.call(this, options);
 }
 util.inherits(TemplateController, TitleBarController);
@@ -55,7 +56,7 @@ TemplateController.prototype.buildContentTree = function (parentNode) {
       });
 
       Famous.FastClick(elements, function(evt) {
-        var href = $(evt.target).attr('href');
+        var href = $(evt.currentTarget).attr('href');
         var t = templates;
         _.each(href.split('/'), function (el) {
           t = t[el];

app/js/shims/famous-FastClick.js

@@ -5,7 +5,6 @@ function FastClick(element, callback) {
     var targeted = true;
 
     element.on('touchstart', function (event) {
-      console.log(event);
       if (!(event instanceof window.TouchEvent) && 
         (event.originalEvent instanceof window.TouchEvent)) {
           event = event.originalEvent;

app/js/shims/famous-PromiseTransition.js

@@ -0,0 +1,42 @@
+var TweenTransition = require('famous/transitions/TweenTransition');
+
+function PromiseTransition() {
+    this.state = 0;
+}
+
+PromiseTransition.SUPPORTS_MULTIPLE = true;
+
+PromiseTransition.prototype.get = function get() {
+  if (this._instance) {
+    return this._instance.get();
+  }
+  return this.state;
+};
+
+PromiseTransition.prototype.set = function set(endState, transition, callback) {
+  if (!this._instance) {
+    var method = transition.promiseMethod;
+    if (!method) {
+      method = TweenTransition;
+    }
+    this._instance = new method();
+    this._instance.reset(this.state);
+  }
+  this._instance.set(endState, transition, transition.promise ? function () {
+    transition.promise.then(callback);
+  } : callback);
+  this._endState = endState;
+  this._transition = transition;
+  this._callback = callback;
+  this._running = true;
+  this._startTime = Date.now();
+};
+
+PromiseTransition.prototype.reset = function reset(startState) {
+  this.state = startState;
+  if (this._instance) {
+    this._instance.reset(startState);
+  }
+};
+
+module.exports = PromiseTransition;

app/js/shims/famous.js

@@ -17,9 +17,11 @@ Famous.Transitionable = require('famous/transitions/Transitionable');
 Famous.SnapTransition = require('famous/transitions/SnapTransition');
 Famous.SpringTransition = require('famous/transitions/SpringTransition');
 Famous.DelayTransition = require('./famous-DelayTransition');
+Famous.PromiseTransition = require('./famous-PromiseTransition');
 Famous.Transitionable.registerMethod('snap', Famous.SnapTransition);
 Famous.Transitionable.registerMethod('spring', Famous.SpringTransition);
 Famous.Transitionable.registerMethod('delay', Famous.DelayTransition);
+Famous.Transitionable.registerMethod('promise', Famous.PromiseTransition);
 
 Famous.GridLayout = require('famous/views/GridLayout');
 Famous.ScrollView = require('famous/views/Scrollview');

app/templates/ghid/planning/cand.jade

@@ -0,0 +1,24 @@
+include ../../mixins
+
++article('Când putem vizita Delta Dunării?')
+  .lang.lang-ro
+    +section('Când putem vizita Delta Dunării?')
+
+      +lightbox('img/4-1-ro.jpg')
+
+      h2 Când putem vizita Delta Dunării?
+
+      p
+        | La fel cum există o "lege a muntelui", vizitatorii care cunosc deja Delta Dunării pot să confirme că există şi o "lege a deltei", o lege mai mult sau mai puţin scrisă dar pe care vizitatorii acesteia trebuie să o respecte. De aceea, se recomandă celor care doresc să viziteze Delta Dunării să facă o pregătire informativă corespunzătoare prealabilă, atât în ceea ce priveşte potenţialele locuri pitoreşti de vizitat dar şi potenţialele dificultăţi ale unei astfel de vizite.
+        | Astfel, perioadele cele mai prielnice, pentru vizitarea deltei sunt primăvara (aprilie – iunie) şi toamna (septembrie – octombrie), când temperaturile sunt mai acceptabile şi nici nu sunt prea multe insecte hematofage (ţânţari, tăuni, etc.). Desigur că şi vara este foarte frumos în deltă, însă se ştie că în serile fără vânt (şi sunt destule în acest sezon), roiurile imense de ţânţari invadează totul, odată cu lăsarea serii. Adăposturile ideale în aceste condiţii rămân corturile de orice fel, care însă trebuie închise încă înainte de ora 18:00. După această oră, servirea meselor, admirarea apusurilor şi a naturii trebuie să se facă în şi din pavilioane sau încăperi protejate cu plase împotriva ţânţarilor. Cine doreşte să întârzie mai mult pe malul apei trebuie să se echipeze corespunzător cu pantaloni lungi, hanorac cu glugă, creme şi spray-uri protectoare adecvate. Fiind un imperiu al apelor, este bine de ştiut că unul din cele mai mari pericole în deltă îl reprezintă înecul. Datorită adâncimii şi vitezei de curgere se formează curenţi circulari puternici (anafoare) foarte periculoşi chiar şi pentru înotătorii experimentaţi. Majoritatea canalelor şi lacurilor din deltă au adâncimi mari de peste 2 metri, canalele având maluri abrupte şi alunecoase. De aceea se recomandă scăldatul numai în locurile special amenajate precum şi existenţa pe toată durata deplasărilor în deltă a unor mijloace de prim ajutor în cazul unor accidente de alunecare sau cădere în apă (colac şi vestă de salvare).
+
+  .lang.lang-en
+    +section('When can we visit the Danube Delta?')
+
+      +lightbox('img/4-1-en.jpg')
+
+      h2 When can we visit the Danube Delta?
+
+      p
+        | Just like there is a "law of the mountain", travelers who know the Danube Delta can confirm that there is also a "law of the Delta", one that is more or less written, but which every visitor must respect. Because of this, it is recommended for everybody who wants to visit the Danube Delta, to inform themselves in advance, not only about the picturesque places to visit, but also about the potential difficulties related to such a trip.
+        | Thus, the most favorable periods, during which visiting the delta is a good idea, are spring (April -June) and autumn (September - October), when the temperatures are more acceptable and there aren’t too many blood-sucking insects (mosquitoes, horseflies, etc.). Of course summer is also a beautiful season in the delta, but it is well known that during calm evenings, without wind (which are common in this season), huge swarms of mosquitoes invade everything at nightfall. Ideal refuges in this case remain the tents of any kind, but they must be closed even before 18:00. After this hour, if you want to have dinner, admire the sunset or the nature, you must do it indoors or from spaces protected with mosquitoes nets. Who wants to stay until late on the river bank, should be properly equipped with long trousers, hooded sweatshirt, and mosquito repellent cream or spray. Being the empire of the waters, it is good to know that one of the greatest dangers in the delta is the drowning. Water in the Danube arms is very deep, with steep and slippery banks. Due to the water depth and flow speed, dangerous circular currents (called anafoare) are formed, very dangerous even for experienced swimmers. Therefore, it is recommended to swim and bathe only in specially places and having always, during the entire trip in the delta, first aid means in case of slipping or falling accidentally in the water (life-buoys or lifejackets).

app/templates/ghid/planning/index.jade

@@ -0,0 +1,5 @@
+include ../../mixins
+
++submenu
+  +submenu-item('ghid/planning/cand', T, 'When can we visit the Danube Delta?', 'Când putem vizita Delta Dunării?')
+

app/templates/mixins.jade

@@ -1,3 +1,28 @@
 mixin do-stuff()
   p stuff!
 
+mixin article()
+  article
+    if block
+      block
+
+mixin section()
+  section
+    if block
+      block
+
+mixin lightbox(source)
+  .lightbox
+    .lightbox-container
+      img(src='assets/' + source)
+
+mixin submenu()
+  li
+    if block
+      block
+
+mixin submenu-item(linkTarget, T, en, ro)
+  ul
+    - var translated = T.span({ en: en, ro: ro });
+    a(href=linkTarget, data-title=translated)
+      != translated

gulp/build.js

@@ -42,7 +42,7 @@ gulp.task('index.html', function () {
 // Generate JS functions from Jade templates.
 // Run this before any JS task, because Browserify needs to bundle them in.
 gulp.task('templates', function () {
-  templatizer(paths.app + '/templates', paths.app + '/js/lib/templates.js');
+  return templatizer(paths.app + '/templates', paths.app + '/js/lib/templates.js');
 });
 
 // Common outputs between all of the JS tasks.
@@ -73,7 +73,7 @@ gulp.task('js:istanbul', ['templates'], function () {
 });
 
 // Bundles Browserify with sourcemaps.
-gulp.task('js:dev', function () {
+gulp.task('js:dev', ['templates'], function () {
   var bundleStream = browserify({
       entries: paths.app + '/js/main.js',
       debug: true
@@ -89,7 +89,7 @@ gulp.task('js:dev', function () {
 function spitCss() {
   return gulp.src(paths.app + '/css/main.styl')
     .pipe($.stylus())
-    .pipe($.autoprefixer(opts.autoprefixer))
+    .pipe($.autoprefixer(opts.autoprefixer));
 }
 
 // Copies over and minifies CSS.

gulp/watch.js

@@ -11,7 +11,7 @@ var browserSync = require('browser-sync');
 // Common watch hooks.
 gulp.task('watch:common', ['build'], function () {
   gulp.watch(paths.app + '/index.jade', ['index.html']);
-  gulp.watch(paths.app + '/templates/*.jade', ['templates']);
+  gulp.watch(paths.app + '/templates/**/*.jade', ['templates', 'js:dev']);
   gulp.watch(paths.app + '/**/*.js', ['js:dev']);
   gulp.watch(paths.app + '/**/*.styl', ['css:dev']);
 });

import_pictures.sh

@@ -0,0 +1,17 @@
+#1/bin/bash
+
+SRC='../delta-book/img/'
+DST='./app/assets/img/'
+
+find "$SRC" -type f | while read file; do
+    width=$(gm identify "$file" -format '%w')
+    toFname=$(basename "$file")
+    toFname="${DST}/${toFname%.*}.jpg"
+    echo "$toFname"
+    if [[ "$width" -gt 1024 ]]; then
+        gm convert "$file" -resize 1024x "$toFname"
+    else
+        gm convert "$file" "$toFname"
+    fi
+done
+

mobile/platforms/ios/Danube Delta/config.xml

@@ -22,6 +22,12 @@
     <feature name="Device">
         <param name="ios-package" value="CDVDevice" />
     </feature>
+    <feature name="Geolocation">
+        <param name="ios-package" value="CDVLocation" />
+    </feature>
+    <feature name="Compass">
+        <param name="ios-package" value="CDVCompass" />
+    </feature>
     <icon height="60" src="res/icons/ios/AppIcon60x60.png" width="60" />
     <icon height="120" src="res/icons/ios/AppIcon60x60@2x.png" width="120" />
     <icon height="76" src="res/icons/ios/AppIcon76x76.png" width="76" />
@@ -45,10 +51,4 @@
     </author>
     <content src="index.html" />
     <access origin="*" />
-    <feature name="Geolocation">
-        <param name="ios-package" value="CDVLocation" />
-    </feature>
-    <feature name="Compass">
-        <param name="ios-package" value="CDVCompass" />
-    </feature>
 </widget>