still not really usable

route360 · Jun 10, 2014 · 11baa2b · 11baa2b
1 parent f2eb18a
commit 11baa2b
Show file tree

Hide file tree

Showing 49 changed files with 3,089 additions and 77 deletions.
diff --git a/build/build.js b/build/build.js
@@ -93,7 +93,7 @@ exports.build = function (callback, version, compsBase32, buildName) {
 	    outro = '}(window, document));',
 	    newSrc = copy + intro + combineFiles(files) + outro,
 
-	    pathPart = 'dist/leaflet' + (buildName ? '-' + buildName : ''),
+	    pathPart = 'dist/r360' + (buildName ? '-' + buildName : ''),
 	    srcPath = pathPart + '-src.js',
 
 	    oldSrc = loadSilently(srcPath),

diff --git a/build/deps.js b/build/deps.js
@@ -1,6 +1,7 @@
 var deps = {
 	api: {
 		src: ['r360.js',
+              'r360-defaults.js',
 		      'api/polygons/PolygonService.js',
 		      'api/routes/RouteService.js',
 		      'api/time/TimeService.js'
@@ -22,17 +23,15 @@ var deps = {
 
 	polygon: {
 		src: ['geometry/polygon/Polygon.js',
-              'geometry/polygon/MultiPolygon.js',
-              'geometry/polygon/PolygonParser.js'
+              'geometry/polygon/MultiPolygon.js'
              ],
 		desc: '',
 		heading: ''
 	},
 
     route: {
         src: ['geometry/route/RouteSegment.js',
-              'geometry/route/Route.js',
-              'geometry/route/RouteParser.js'
+              'geometry/route/Route.js'
              ],
         desc: '',
         heading: ''

diff --git a/debug/demo/newyork.html b/debug/demo/newyork.html
@@ -3,6 +3,20 @@
 <head>
     <title>Route 360 - New York</title>
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <script src="../underscore.js"></script>
+    <!-- // <script src="../jquery_v2_1_1.js"></script> -->
+    <!-- // <script src="../jquery_ui_1_10_4.js"></script> -->
+    <!-- <link rel="stylesheet" href="../jquery_ui_slider.css"/> -->
+
+    <script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
+    <link rel="stylesheet" href="http://144.76.246.53/norway/lib/query-ui/jquery-ui-1.10.4.custom.css"/>
+    <script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
+    <script src="http://144.76.246.53/norway/src/jquery.ui.touch-punch.min.js"></script>
+
+
+    <link rel="stylesheet" href="../leaflet.css"/>
+    <link rel="stylesheet" href="../../dist/r360.css"/>
+    <script src="../leaflet.js"></script>
     <script type="text/javascript" src="../../build/deps.js"></script>
     <script src="../r360-include.js"></script>
 </head>
@@ -12,8 +26,214 @@
 
     <script type="text/javascript">
 
-        console.log("test");
+        $(document).ready(function(){
+
+            /*-----------------------------------------   setting up the map ------------------------------------*/
+
+            // var map = L.map('map', {zoomControl: false}).setView([40.71448, -74.00598], 13);
+            var map = L.map('map', {zoomControl: false}).setView([52.516389, 13.377778], 13);
+            var zoom = L.control.zoom({position: 'bottomleft'});
+                map.addControl( zoom );
+
+            //attribution to give credit to OSM Kartverket and MI
+                var attribution ='<a href="https://www.mapbox.com/about/maps/" target="_blank">© Mapbox © OpenStreetMap</a> | DEM © <a href="http://www.data.kartverket.no/" target="_blank">Kartverket</a> | Utviklet av <a href="http://www.route360.net/en/" target="_blank">Route360°</a> for <a href="http://www.forbrukerradet.no/" target="_blank">Forbrukerrådet</a>';
+
+             // initialising the base map. To change the base map just change following lines as described by cloudmade, mapbox etc..
+            L.tileLayer('http://a.tiles.mapbox.com/v3/mi.i65jib2f/{z}/{x}/{y}.png', {
+                    maxZoom: 18,
+                    attribution: attribution
+            }).addTo(map);
+
+            /*---------------------------------  defining optional values and settings ------------------------------------*/
+
+
+            /*defining icons for source and target markers*/
+            var sourceIcon = L.icon({iconUrl: '../../dist/images/marker-icon.png', iconAnchor: [12,45]});
+            var targetIcon = L.icon({iconUrl: '../../dist/images/checkered-flag-icon.png', iconAnchor: [3,48], popupAnchor: [16,-48]});
+            var sourceMarker, targetMarker;
+            var hasCycleSpeedButtons    = false;
+            var hasWalkSpeedButtons     = false;
+            var hasTravelStartTimeSlider= false;
+            var uphill                  = 20;
+            var downhill                = -10;
+
+            var panOptions = {
+                duration : 0.35,
+            };          
+
+             // Here you can chose the opacity of the polygons and the width of the "polygon lines"
+            var polygonLayerOptions = {
+              opacity : 0.4,
+              strokeWidth : 15
+            };
+
+            // define time steps and colors here. Always use time values of the same distance and not too much time. Max 7200 (2h)
+            // travel times are defined in seconds the initial values in minutes... Also the label may be altered here
+            var travelTimeControlOptions = {
+                travelTimes     : [
+                    { time : 1200 , color : "#006837"},
+                    { time : 2400 , color : "#39B54A"},
+                    { time : 3600 , color : "#8CC63F"},
+                    { time : 4800 , color : "#F7931E"},
+                    { time : 6000 , color : "#F15A24"},
+                    { time : 7200 , color : "#C1272D"}
+                ],
+                position : 'topright',
+                label: 'Travel time: ',
+                initValue: 30
+                //icon: "../img/bike_small.png"
+            };
+
+            var buttonOptions = {
+                buttons : [
+                  {label: 'Transit', value: 'transit', tooltip: 'public transport'},
+                  {label: 'Cycling', value: 'bike', tooltip: 'bicycle'},
+                  {label: 'Walking', value: 'walk', tooltip: 'walking'},
+                  {label: 'Car', value: 'car', tooltip: 'car'},
+                ],
+                checked : 'bike'
+            };
+
+            var cycleSpeedButtonOptions = {
+                buttons : [
+                  {label: 'slow', value: 12, tooltip: 'cycling speed 12 km/h'},
+                  {label: 'medium', value: 17, tooltip: 'cycling speed 17 km/h'},
+                  {label: 'fast', value: 22, tooltip: 'cycling speed 22 km/h'}
+                ],
+                checked : 17
+            };
+
+            var walkSpeedButtonOptions = {
+                buttons : [
+                  {label: 'slow', value: 4, tooltip: 'walking speed 4 km/h'},
+                  {label: 'medium', value: 6, tooltip: 'walking speed 6 km/h'},
+                  {label: 'fast', value: 8, tooltip: 'walking speed 8 km/h'}
+                ],
+                checked : 6
+            };
+
+             // the layer the polygons will be shown later on
+            var cpl                     = r360.route360PolygonLayer(polygonLayerOptions); 
+             // defining the layer where our routes will be shown later on
+            var routeLayer              = L.featureGroup().addTo(map);         
+            var travelTimeControl       = r360.travelTimeControl(travelTimeControlOptions);
+            // var travelStartDateControl  = new MI.TravelStartDateControl();
+            // var travelModeButtons       = new MI.RadioButtonControl(buttonOptions);
+            // var travelStartTimeControl  = new MI.TravelStartTimeControl();
+            // var cycleSpeedButtons       = new MI.RadioButtonControl(cycleSpeedButtonOptions);
+            // var walkSpeedButtons        = new MI.RadioButtonControl(walkSpeedButtonOptions);
+            // var targetNamePicker        = new MI.NamePicker({country : "Deutschland", reset : true, placeholder : 'To:'});
+            // var startNamePicker         = new MI.NamePicker({placeholder : "From", country : "Deutschland", reset : false});
+
+
+            map.addControl(travelTimeControl);               
+            // map.addLayer(cpl);
+            // map.addControl(travelModeButtons); 
+            // map.addControl(startNamePicker);
+
+            // addOrRemoveControls(travelModeButtons.getValue());
+
+            /*------------------------------------  defining functionality for gui elements ------------------------------------------  */
+
+            //  when slider has been used: show polygons...         
+            travelTimeControl.onSlideStop(function(travelTimes){    
+                 showPolygons();
+            });
+
+            map.on("click", function(e){    
+
+                if ( map.hasLayer(sourceMarker) ){
+
+                    if ( !map.hasLayer(targetMarker)) addTargetMarker(e.latlng);  
+                    else {
+
+                        targetMarker.setLatLng(e.latlng);              
+                        // MI.getAddressByCoordinates(e.latlng, function(json){
+                        //     targetNamePicker.setFieldValue(json.display_name.replace(/, Norwegen/g, ''));
+                        // });
+                    }
+                    map.panTo(e.latlng, panOptions);
+                    // showRoutes();                       
+                }                          
+                else {
+
+                    addSourceMarker(e.latlng);
+
+                    // if ( map.hasLayer(targetMarker) ) showRoutes();
+
+                    showPolygons();
+                }
+            });
+
+            /*------------------------------------ helper functions --------------------------------------*/
+
+            function addSourceMarker(latlng){
+
+                sourceMarker = L.marker(latlng, {icon: sourceIcon, draggable: true});
+                sourceMarker.addTo(map);
+                map.panTo(latlng, panOptions);
+                sourceMarker.id = "sourceMarker";
+                // MI.getAddressByCoordinates(sourceMarker.getLatLng(), function(json){
+                //     startNamePicker.setFieldValue(json.display_name.replace(/, Norwegen/g, ''));
+                // });
+                // sourceMarker.on("dragend", function(e){
+                //     showPolygons();
+                //     MI.getAddressByCoordinates(sourceMarker.getLatLng(), function(json){
+                //         startNamePicker.setFieldValue(json.display_name.replace(/, Norwegen/g, ''));
+                //     });
+                //     if(map.hasLayer(targetMarker)){
+                //         showRoutes();
+                //     }
+                // });
+                showPolygons();
+                if ( map.hasLayer(targetMarker) ) showRoutes();
+                // addTargetNamePicker();
+            };
+
+            function showPolygons(){
+                var travelOptions = getTravelOptionsFromControls(); 
+
+                r360.PolygonService.getTravelTimePolygons(travelOptions, function(json){
+
+                    var polygons = r360.Util.parsePolygons(json, travelTimeControl.getValues());
+                    cpl.addLayer(polygons)
+
+                    if ( polygons.length > 0 ) map.fitBounds(cpl.getBoundingBox());
+                    else{
+
+                        cpl.clearLayers();
+                        alert("The given point should be nearby a road inside Brandenburg!");
+                    }
+                }); 
+            };
+
+            function getTravelOptionsFromControls(){
+                var travelOptions = {
+                    sources     : [sourceMarker],
+                    targets     : [targetMarker],
+                    travelTimes : travelTimeControl.getValues(),
+                    travelMode  : {},
+                    uphill      : uphill,
+                    downhill    : downhill
+                };
+
+                // travelOptions.travelMode.type = travelModeButtons.getValue();
+                travelOptions.travelMode.type = "transit";
+
+                if ( travelOptions.travelMode.type == "bike" )    travelOptions.speed = cycleSpeedButtons.getValue();
+                if ( travelOptions.travelMode.type == "walk")     travelOptions.speed = walkSpeedButtons.getValue();
+                if ( travelOptions.travelMode.type == "transit")  {
+
+                    // travelOptions.time = travelStartTimeControl.getValue() * 60;
+                    // travelOptions.date = travelStartDateControl.getValue();
+                    travelOptions.time = 720;
+                    travelOptions.date = 20140612;
+                }
+
+                return travelOptions;
+            };
 
+        });
     </script>
 </body>
 </html>
diff --git a/debug/images/animated-overlay.gif b/debug/images/animated-overlay.gif
diff --git a/debug/images/ui-bg_diagonals-thick_18_b81900_40x40.png b/debug/images/ui-bg_diagonals-thick_18_b81900_40x40.png
diff --git a/debug/images/ui-bg_diagonals-thick_20_666666_40x40.png b/debug/images/ui-bg_diagonals-thick_20_666666_40x40.png
diff --git a/debug/images/ui-bg_flat_10_000000_40x100.png b/debug/images/ui-bg_flat_10_000000_40x100.png
diff --git a/debug/images/ui-bg_glass_100_f6f6f6_1x400.png b/debug/images/ui-bg_glass_100_f6f6f6_1x400.png
diff --git a/debug/images/ui-bg_glass_100_fdf5ce_1x400.png b/debug/images/ui-bg_glass_100_fdf5ce_1x400.png
diff --git a/debug/images/ui-bg_glass_65_ffffff_1x400.png b/debug/images/ui-bg_glass_65_ffffff_1x400.png
diff --git a/debug/images/ui-bg_gloss-wave_35_f6a828_500x100.png b/debug/images/ui-bg_gloss-wave_35_f6a828_500x100.png
diff --git a/debug/images/ui-bg_highlight-soft_100_eeeeee_1x100.png b/debug/images/ui-bg_highlight-soft_100_eeeeee_1x100.png
diff --git a/debug/images/ui-bg_highlight-soft_75_ffe45c_1x100.png b/debug/images/ui-bg_highlight-soft_75_ffe45c_1x100.png
diff --git a/debug/images/ui-icons_222222_256x240.png b/debug/images/ui-icons_222222_256x240.png
diff --git a/debug/images/ui-icons_228ef1_256x240.png b/debug/images/ui-icons_228ef1_256x240.png
diff --git a/debug/images/ui-icons_ef8c08_256x240.png b/debug/images/ui-icons_ef8c08_256x240.png
diff --git a/debug/images/ui-icons_ffd27a_256x240.png b/debug/images/ui-icons_ffd27a_256x240.png
diff --git a/debug/images/ui-icons_ffffff_256x240.png b/debug/images/ui-icons_ffffff_256x240.png
diff --git a/debug/jquery_ui_1_10_4.js b/debug/jquery_ui_1_10_4.js