Merge c0596d4 into 08ffe2a

app/css/templates/index.styl

@@ -1,2 +1,3 @@
 @import 'settings'
 @import 'toggles'
+@import 'submenu'

app/css/templates/submenu.styl

@@ -0,0 +1,46 @@
+ul.submenu
+  list-style-type: none
+  padding: 0
+  margin: 0
+
+  display: table
+  width: 100%
+
+  li
+    display: table-row
+    width: 100%
+
+    &:before
+      display: table-cell
+      width: 1em
+      height: 3.5em
+      content: ''
+      border-bottom: #ddd 1px solid
+
+    a
+      padding: 0.5em 0.5em 0.5em 0
+      border-bottom: #ddd 1px solid
+      display: table-cell
+      vertical-align: middle
+
+      .submenu-container
+        display: inline
+
+      &
+      &:link
+      &:active
+      &:visited
+      &:hover
+        text-decoration: none
+        color: #444
+
+      .submenu-caption
+        color: #666
+        font-size: 80%
+
+      .submenu-title
+        font-size: 120%
+
+
+    &:active
+      background-color: rgba(1, 1, 1, 10%)

app/js/controllers/mainmenu-controller.js → app/js/content/mainmenu-controller.js

@@ -1,11 +1,10 @@
 var util = require('util');
-var MenuController = require('./menu-controller');
-var MapController = require('./map-controller');
+var MenuController = require('../controllers/menu-controller');
+var MapController = require('../controllers/map-controller');
 var Famous = require('../shims/famous');
 var templates = require('../lib/templates');
-var TemplateController = require('./template-controller');
-var MasterController = require('./master-controller');
-var MapSplitController = require('./mapsplit-controller');
+var TemplateController = require('../controllers/template-controller');
+var MapSplitController = require('../controllers/mapsplit-controller');
 var T = require('../translate');
 
 function MainMenuController(options) {
@@ -83,6 +82,9 @@ function MainMenuController(options) {
       viewController: function () {
         return new MapSplitController({
           template: templates.ghid.routes.index,
+          mapOptions: {
+            preset: 'routes',
+          },
           title: T.span({
             ro: 'Trasee navale',
             en: 'Boat routes',
@@ -99,6 +101,9 @@ function MainMenuController(options) {
       viewController: function () {
         return new MapSplitController({
           template: templates.ghid.trails.index,
+          mapOptions: {
+            preset: 'routes',
+          },
           title: T.span({
             ro: 'Trasee terestre',
             en: 'Hiking trails',

app/js/content/map-presets.js

@@ -0,0 +1,42 @@
+var ol = require('../lib/ol');
+
+var MapPresets = {};
+
+MapPresets.registerPreset = function (name, preset) {
+  MapPresets[name] = preset;
+};
+
+function gps2mp(ext) {
+  if (ext.length === 4) {
+    return ol.proj.transformExtent(ext, 'EPSG:4326', 'EPSG:3857');
+  } else {
+    return ol.proj.transform(ext, 'EPSG:4326', 'EPSG:3857');
+  }
+}
+
+var deltaExtent = gps2mp([28.5, 44.33, 29.83, 45.6]);
+
+MapPresets.registerPreset('default', {
+  layers: [ {
+    type: 'tile',
+    url: 'assets/maps/delta',
+    extent: deltaExtent,
+    trim: true,
+  } ],
+  views: [ {
+    minZoom: 8,
+    maxZoom: 13,
+    extent: deltaExtent,
+  } ],
+});
+
+MapPresets.registerPreset('routes', {
+  extend: 'default',
+  layers: [ {
+    type: 'geojson',
+    url: 'assets/routes.geojson',
+    extent: deltaExtent,
+  } ],
+});
+
+module.exports = MapPresets;

app/js/controllers/map-controller.js

@@ -2,10 +2,13 @@ var TitleBarController = require('./titlebar-controller');
 var MapSurface = require('../views/map-surface');
 var util = require('util');
 var Famous = require('../shims/famous');
+var MapPresets = require('../content/map-presets');
+var _ = require('lodash');
 
 function MapController(options) {
   options = options || {};
-  options.title = 'Maps';
+  options.title = options.title || 'Maps';
+  options.preset = options.preset || 'default';
   TitleBarController.call(this, options);
 }
 util.inherits(MapController, TitleBarController);
@@ -14,10 +17,8 @@ MapController.prototype.buildContentTree = function (parentNode) {
   var modifier = new Famous.StateModifier({
     size: [undefined, undefined],
   });
-  var map = new MapSurface({
-    url: 'assets/maps/delta',
-    extent: [28.5, 44.33, 29.83, 45.6],
-  });
+
+  var map = new MapSurface(this.solvePreset(this.options.preset));
 
   this.on('resize', function () {
     map.emit('resize');
@@ -26,4 +27,30 @@ MapController.prototype.buildContentTree = function (parentNode) {
   parentNode.add(modifier).add(map);
 };
 
+MapController.prototype.solvePreset = function (preset) {
+
+  if (typeof(preset) === 'string') {
+    preset = MapPresets[preset];
+  }
+
+  if (typeof(preset) !== 'object') {
+    return null;
+  }
+
+  var extend = this.solvePreset(preset.extend);
+  var solved = _.extend({}, extend, preset);
+  var arrays = ['layers', 'views', 'features'];
+  if (preset && extend) {
+    for (var i = 0, n = arrays.length; i < n; i++) {
+      var name = arrays[i];
+      if (preset[name] && extend[name]) {
+        solved[name] = extend[name].concat(preset[name]);
+      }
+    }
+  }
+  delete solved.extend;
+
+  return solved;
+};
+
 module.exports = MapController;

app/js/controllers/mapsplit-controller.js

@@ -7,6 +7,7 @@ var cordova = require('../shims/cordova');
 
 function MapSplitController(options) {
   options = options || {};
+  options.mapOptions = options.mapOptions || {};
   options.splitRatio = options.splitRatio || 0.4;
   ViewController.call(this, options);
 }
@@ -39,10 +40,8 @@ MapSplitController.prototype.buildRenderTree = function (parentNode) {
     direction: 1,
     ratios: [split, 1 - split],
   });
-  var mapOptions = {
-    createTitleBar: false,
-  };
-  var mapVC = new MapController(mapOptions);
+  self.options.mapOptions.createTitleBar = false;
+  var mapVC = new MapController(self.options.mapOptions);
   var mapView = mapVC.getView();
   layoutMap.sequenceFrom([mapView, new Famous.RenderNode()]);
   parentNode.add(mapShowModifier).add(mapModifier).add(layoutMap);
@@ -84,7 +83,7 @@ MapSplitController.prototype.setFullScreenState = function (state) {
       self.layouts[idx].setRatios([split, 1 - split]);
       self.viewControllers[idx].emit('resize');
       var height = window.innerHeight;
-      if (cordova.iOS7) {
+      if (cordova.iOS7App) {
         height -= 20;
       }
       var delta = (split - self.options.splitRatio) * height;

app/js/controllers/master-controller.js

@@ -47,7 +47,7 @@ MasterController.prototype.navigateToIndex = function (index) {
 MasterController.prototype.setUpPage = function (page) {
   var self = this;
 
-  var links = page.find('a');
+  var links = page.find('a.template-link');
   links.on('click', function (evt) {
     evt.preventDefault();
   });

app/js/controllers/root-controller.js

@@ -2,7 +2,7 @@ var util = require('util');
 var cordova = require('../shims/cordova');
 var Famous = require('../shims/famous');
 var ViewController = require('./view-controller');
-var MainMenuController = require('./mainmenu-controller');
+var MainMenuController = require('../content/mainmenu-controller');
 
 function RootController () {
   ViewController.apply(this, arguments);

app/js/controllers/template-controller.js

@@ -5,6 +5,7 @@ var $ = require('jquery');
 var templates = require('../lib/templates');
 var _ = require('lodash');
 var T = require('../translate');
+var cordova = require('../shims/cordova');
 
 function TemplateController(options) {
   options = options || {};
@@ -99,10 +100,10 @@ TemplateController.prototype.buildContentTree = function (parentNode) {
   parentNode.add(containerView);
 };
 
-TemplateController.prototype.setUpLinks = function (page) {
+TemplateController.prototype.setUpTemplateLinks = function (page) {
   var self = this;
 
-  var links = page.find('a');
+  var links = page.find('a.template-link');
   links.on('click', function (evt) {
     evt.preventDefault();
   });
@@ -124,6 +125,48 @@ TemplateController.prototype.setUpLinks = function (page) {
 
 };
 
+TemplateController.prototype.setUpLinks = function (page) {
+  var links = page.find('a:not(.template-link)');
+  links.on('click', function (evt) {
+    evt.preventDefault();
+  });
+
+  Famous.FastClick(links, function(evt) {
+    var href = $(evt.currentTarget).attr('href');
+    if (/^tel:/.test(href)) {
+      if (cordova.present) {
+        buttons = {
+          en: ['Cancel', 'Call'],
+          ro: ['Anulați', 'Apelați'],
+        };
+        title = {
+          en: 'Phone number',
+          ro: 'Număr de telefon',
+        };
+        var lang = T.getLanguage();
+        navigator.notification.confirm(href.replace(/^tel:/, ''), function (index) {
+          if (index === 2) {
+            window.open(href, '_system');
+          }
+        }, title[lang], buttons[lang]);
+      } else {
+        window.open(href, '_self');
+      }
+      return;
+    }
+    if (/^mailto:/.test(href)) {
+      if (window.plugin && window.plugin.email) {
+        window.plugin.email.open({ to: [ href.replace(/^mailto:/, '') ] });
+      } else {
+        window.open(href, '_self');
+      }
+      return;
+    }
+    window.open(href, cordova.present ? '_system' : '_blank');
+  });
+
+};
+
 TemplateController.prototype.setUpSettings = function (page) {
   var self = this;
 
@@ -150,6 +193,7 @@ TemplateController.prototype.setUpSettings = function (page) {
 
 TemplateController.prototype.setUpPage = function (page) {
   this.setUpLinks(page);
+  this.setUpTemplateLinks(page);
   this.setUpSettings(page);
 };
 

app/js/shims/cordova.js

@@ -19,7 +19,7 @@ var cordova = {
 
   _onReady: function () {
     this.iOS = /iP(hone|ad|od)/.test(window.navigator.userAgent);
-    this.iOS7App = (cordova.present &&
+    this.iOS7App = (this.present &&
                     window.device.platform === 'iOS' &&
                     parseInt(window.device.version) >= 7);
   },