Advertisement
Guest User

Untitled

a guest
May 27th, 2015
260
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. //6p1
  2. //added two new public variables that ill be using for the smoothing function
  3. //have began to do math for collinear points but i dont think its quite there yet.
  4. //Jake
  5.  
  6. //6p2
  7. //finished step 6, took hours..  but did go to consultation on the last day which helped
  8. //But having a problem veiwing the actual simplified route, i know code works and i can see changes
  9. //in route but very very small changes
  10. //Jake
  11.  
  12. // This file contains some delegate classes for you to extend.
  13.  
  14. function NewRoutePageControllerDelegate()
  15. {
  16.     // Save 'this' so we can refer to public attributes and methods.
  17.     var self = this;
  18.     self.latitude = null;
  19.     self.longitude = null;
  20.     self.accuracy = null;
  21.     self.x = null;
  22.     self.y = null;
  23.     self.locations = [];
  24.     self.lastUpdate = 0;
  25.     var newRoutePageController = null;
  26.     self.Route= null;
  27.     self.plotRoute= null;
  28.     //Created a new variable called mode, we use this as a marker for functions to either stop or go when pushing locations into our array
  29.     var mode = "notRecording";
  30.  
  31.     // The MapPageController class controls the 'New Route' page.
  32.     // This class provides a couple of useful methods:
  33.     //     displayMessage(message):
  34.     //         Causes a short message string to be displayed on the
  35.     //         page for a brief period.  Useful for showing quick
  36.     //         notifications to the user.
  37.     //     panToLocation(latitude, longitude):
  38.     //         Pans the map to the given latitude and longitude.
  39.     //     repaintOverlay():
  40.     //         Causes the map overlay to be redrawn, triggering a
  41.     //         call to our mapPageDrawOverlay() method.  You might
  42.     //         wish to call this when you update information that
  43.     //         is displayed on the canvas overlay.
  44.     //     canvasPointFromLocation(latitude, longitude):
  45.     //         Given a latitude and longitude, returns the
  46.     //         corresponding point on the canvas overlay.
  47.     //         The return value is an object with an 'x' and a 'y'
  48.     //         property.
  49.     var newRoutePageController = null;
  50.  
  51.     // NOTE: You should not remove any of the five public methods below.
  52.  
  53.     // This method is called by the MapPageController when the user
  54.     // has switched to the page and it has been intialised.
  55.  
  56.     this.mapPageInitialisedWithOptions = function(controller, options)
  57.     {
  58.         console.log("Record Route - mapPageInitialisedWithOptions");
  59.         newRoutePageController = controller;
  60.  
  61.  
  62.         function geoSuccess(position)
  63.         {
  64.  
  65.             self.latitude = position.coords.latitude;
  66.             self.longitude = position.coords.longitude;
  67.             self.accuracy = position.coords.accuracy;
  68.  
  69.             self.Route =
  70.             {
  71.                 Longitude:self.longitude,
  72.                 Latitude:self.latitude,
  73.                 Accuracy:self.accuracy,
  74.                 time: new Date().getTime()
  75.             };
  76.             if ((new Date()).getTime() - self.lastUpdate >= 1000) {
  77.                 newRoutePageController.panToLocation(position.coords.latitude, position.coords.longitude);
  78.                 self.lastUpdate = (new Date()).getTime();
  79.                 if (mode == "recording") {
  80.                     self.locations.push(self.Route);
  81.                 }
  82.             }
  83.         }
  84.  
  85.         function geoError()
  86.         {
  87.             alert("Sorry, no position available.");
  88.  
  89.         }
  90.  
  91.         var geoOptions =
  92.         {
  93.             enableHighAccuracy: true,
  94.         };
  95.  
  96.         navigator.geolocation.watchPosition(geoSuccess, geoError, geoOptions);
  97.  
  98.         newRoutePageController.repaintOverlay();
  99.     };
  100.  
  101.     // The MapPageController calls this when loading its page.
  102.     // You should return an array of objects specifying buttons you
  103.     // would like to display at the bottom of the map, e.g.,
  104.     //    {
  105.     //        title:   "Start",
  106.     //        id:      "startButton",  (optional)
  107.     //    }
  108.     // Note: This doesn't support an "onClick" property like in
  109.     // Assignment 1.
  110.     this.mapPageButtonControls = function()
  111.     {
  112.         console.log("Record Route - mapPageButtonControls");
  113.         var find = {
  114.             title: "Locate current position"
  115.             //CurrentPos
  116.         };
  117.         var startRecording = {
  118.             title: "Start"
  119.             //RECORD
  120.         };
  121.         var stopRecording = {
  122.             title: "Save"
  123.             //END
  124.         };
  125.         var reset = {
  126.             title: "Reset"
  127.             //RESET
  128.         };
  129.         return [find, startRecording, stopRecording, reset];
  130.     };
  131.  
  132.     // The MapPageController calls this when user taps on a button
  133.     // specified by mapPageButtonControls().  The buttonIndex will
  134.     // be the index of the button in the aray you returned.
  135.     this.mapPageButtonTapped = function(buttonIndex)
  136.     {
  137.         if (buttonIndex== 0)
  138.         {
  139.             newRoutePageController.panToLocation(self.latitude,  self.longitude);
  140.  
  141.             newRoutePageController.displayMessage("Latitude " + self.latitude.toFixed(2) + " Longitude " +self.longitude.toFixed(2) + " Accuracy " + self.accuracy.toFixed(2)
  142.                 +"m");
  143.  
  144.         }
  145.  
  146.         else if (buttonIndex == 1)
  147.         {
  148.             console.log("accuracy: " + self.accuracy);
  149.             if(self.accuracy >= 25)
  150.             {
  151.                 newRoutePageController.displayMessage("Your location is not accurate enough, please wait for a better location")
  152.             }
  153.             mode = "recording";
  154.             console.log(mode);
  155.  
  156.         }
  157.         else if (buttonIndex == 2)
  158.         {
  159.             mode = "notRecording";
  160.             console.log(mode);
  161.             var newRoute = {
  162.                 locations: self.locations,
  163.                 dateCreated: self.locations[0].time
  164.             }
  165.  
  166.             var json = JSON.stringify(newRoute)
  167.             localStorage.setItem("route-" + Date.now(), json);
  168.  
  169.         }
  170.  
  171.         else if (buttonIndex == 3)
  172.         {
  173.             self.locations = [];
  174.             newRoutePageController.displayMessage( " Location Array Cleared " );
  175.             console.log(self.locations);
  176.         }
  177.         console.log("Record Route - mapPageButtonTapped(" + buttonIndex + ")");
  178.     }
  179.     // The MapPageController calls this when the canvas needs to be
  180.     // redrawn, such as due to the user panning or zooming the map.
  181.     // It clears the canvas before calling this method.
  182.     // 'context' is an HTML canvas element context.  This is a
  183.     // transparent layer that sits above the map and is redrawn
  184.     // whenever the map is panned or zoomed. It can be used to
  185.     // draw annotations on the map or display other information.
  186.     this.mapPageDrawOverlay = function(context)
  187.  
  188.     {
  189.         var startingPoint = newRoutePageController.canvasPointFromLocation(self.latitude, self.longitude)
  190.         context.beginPath();
  191.         context.arc(startingPoint.x, startingPoint.y ,10 ,0 ,2*Math.PI, false);
  192.         context.fillStyle = 'pink';
  193.         context.fill();
  194.         context.lineWidth = 5;
  195.         //http://www.w3schools.com/tags/ref_colorpicker.asp
  196.         context.strokeStyle = '#8A00B8';
  197.         context.stroke();
  198.  
  199.  
  200.  
  201.         self.plotRoute = function(LocationArray)
  202.         {
  203.             for(var i=0; i +1 <LocationArray.length; i++)
  204.             {
  205.                 //Routes[i][0] //latitude values
  206.                 //Routes[i][1] //longitude values
  207.  
  208.                 var point = newRoutePageController.canvasPointFromLocation(LocationArray[i].Latitude, LocationArray[i].Longitude);
  209.  
  210.                 //Draws a circle for every updated point
  211.                 context.beginPath();
  212.                 context.arc(point.x,point.y,1,0,2*Math.PI);
  213.                 context.strokeStyle = '#8A00B8';
  214.                 context.stroke();
  215.  
  216.                 //basically just draws a line a new point and its preceeding point
  217.                 context.beginPath();
  218.                 context.moveTo(point.x, point.y);
  219.                 point = newRoutePageController.canvasPointFromLocation(LocationArray[i + 1].Latitude, LocationArray[i + 1].Longitude);
  220.                 context.lineTo(point.x, point.y);
  221.                 context.strokeStyle = '#8A00B8';
  222.                 context.stroke();
  223.  
  224.             }
  225.         }
  226.         self.plotRoute(self.locations);
  227.  
  228.         console.log("Record Route - mapPageDrawOverlay");
  229.     }
  230.  
  231.     // The MapPageController calls this to ask if it should return
  232.     // back to the start screen of the app when the user taps the
  233.     // done button.  If you are not letting the user return, you
  234.     // should probably call displayMessage() to inform them why.
  235.     this.mapPageShouldReturnFromDoneButtonTap = function()
  236.     {
  237.         console.log("Record Route - mapPageShouldReturnFromDoneButtonTap");
  238.         // Let the user return.
  239.         return true;
  240.     }
  241. }
  242.  
  243.  
  244. function ViewRoutePageControllerDelegate()
  245. {
  246.     // Save 'this' so we can refer to public attributes and methods.
  247.     var self = this;
  248.     self.TotalDistance= null;
  249.     self.distanceBetweenTwoPoints = null;
  250.     self.totalTime = null;
  251.     self.simplifiedRoute = null;
  252.     this.simplifyRoute = null;
  253.     self.angleBetweenLines = null;
  254.     var secondMode = "oRoute";
  255.     var decoyRoute = null;
  256.  
  257.     // The MapPageController class controls the 'View Route' page.
  258.     // This class provides a couple of useful methods:
  259.     //     displayMessage(message):
  260.     //         Causes a short message string to be displayed on the
  261.     //         page for a brief period.  Useful for showing quick
  262.     //         notifications to the user.
  263.     //     panToLocation(latitude, longitude):
  264.     //         Pans the map to the given latitude and longitude.
  265.     //     repaintOverlay():
  266.     //         Causes the map overlay to be redrawn, triggering a
  267.     //         call to our mapPageDrawOverlay() method.  You might
  268.     //         wish to call this when you update information that
  269.     //         is displayed on the canvas overlay.
  270.     //     canvasPointFromLocation(latitude, longitude):
  271.     //         Given a latitude and longitude, returns the
  272.     //         corresponding point on the canvas overlay.
  273.     //         The return value is an object with an 'x' and a 'y'
  274.     //         property.
  275.  
  276.     self.distanceBetweenTwoPoints = function(point1, point2)
  277.     {
  278.         //got from http://www.movable-type.co.uk/scripts/latlong.html
  279.         var lat1 =  point1.Latitude;
  280.         var lat2 =  point2.Latitude;
  281.         var lon1 =  point1.Longitude;
  282.         var lon2 =  point2.Longitude;
  283.         var R = 6371000; // metres
  284.         var φ1 = lat1*Math.PI/180;
  285.         var φ2 = lat2*Math.PI/180;
  286.         var Δφ = (lat2-lat1)*Math.PI/180;
  287.         var Δλ = (lon2-lon1)*Math.PI/180;
  288.  
  289.         var a = Math.sin(Δφ/2) * Math.sin(Δφ/2) +
  290.             Math.cos(φ1) * Math.cos(φ2) *
  291.             Math.sin(Δλ/2) * Math.sin(Δλ/2);
  292.  
  293.         var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a));
  294.  
  295.         var d = R * c;
  296.  
  297.         return d;
  298.     };
  299.  
  300.     self.TotalDistance = function(LocationArray)
  301.     {
  302.         var totalD = 0;
  303.         for(var i = 0; i<LocationArray.length-1;i++)
  304.         {
  305.             totalD += self.distanceBetweenTwoPoints(LocationArray[i],LocationArray[i+1]);
  306.         }
  307.         return Math.round(totalD);
  308.     }
  309.     self.timeBetweenTwoPoints = function(point1,point2)
  310.     {
  311.         var start = point1.time;
  312.         var end = point2.time;
  313.  
  314.         return end - start;
  315.     };
  316.     self.totalTime = function(LocationArray)
  317.     {
  318.         var totalT = 0;
  319.         for(var i = 0; i<LocationArray.length-1;i++)
  320.         {
  321.             totalT += self.timeBetweenTwoPoints(LocationArray[i],LocationArray[i+1]);
  322.         }
  323.         return Math.round(totalT)/1000;
  324.     }
  325.  
  326.     this.simplifyRoute = function(LocationArray)
  327.     {
  328.         decoyRoute = originalRoute.locations.slice();
  329.         if(LocationArray.length > 3)
  330.         {
  331.  
  332.             for(var i = 0; i < LocationArray.length-3;i++)
  333.             {
  334.                 var Point1 = viewRoutePageController.canvasPointFromLocation(LocationArray[i].Latitude, LocationArray[i].Longitude);
  335.                 var Point2 = viewRoutePageController.canvasPointFromLocation(LocationArray[i+1].Latitude, LocationArray[i+1].Longitude);
  336.                 var Point3 = viewRoutePageController.canvasPointFromLocation(LocationArray[i+2].Latitude, LocationArray[i+2].Longitude);
  337.                 var m1 = (Point2.y-Point1.y)/(Point2.x-Point1.x);
  338.                 var m2 = (Point3.y- Point2.y)/(Point3.x-Point2.x);
  339.                 var angle1 = Math.atan(m1)
  340.                 var angle2 = Math.atan(m2)
  341.                 var refAngle1 = Math.atan(m1)
  342.                 var refAngle2 = Math.atan(m2)
  343.  
  344.                 if(angle1<0)
  345.                 {
  346.                     angle1 = Math.PI- Math.abs(refAngle1);
  347.                 }
  348.                 if(angle2<0)
  349.                 {
  350.                     angle2 = Math.PI- Math.abs(refAngle2);
  351.                 }
  352.  
  353.  
  354.  
  355.                 if(Math.abs(angle2 - angle1)<= 5*Math.PI/2)
  356.                 {
  357.                     LocationArray.splice(i+1 , 1)
  358.                     return self.simplifyRoute(LocationArray);
  359.                 }
  360.  
  361.             }
  362.             return  LocationArray;
  363.         }
  364.     }
  365.  
  366.     var viewRoutePageController = null;
  367.  
  368.     // The originally recorded route being displayed by the viewRoute page.
  369.     var originalRoute;
  370.  
  371.     // NOTE: You should not remove any of the five public methods below.
  372.  
  373.     // This method is called by the MapPageController when the user
  374.     // has switched to the page and it has been intialised.  If the
  375.     // MapPageController is displaying an existing route, then options
  376.     // will contain a 'routeIndex' property which gives the index of
  377.     // the selected route in the Routes array.
  378.     this.mapPageInitialisedWithOptions = function(controller, options)
  379.     {
  380.         console.log("View Route - mapPageInitialisedWithOptions");
  381.         viewRoutePageController = controller;
  382.         originalRoute = Routes[options.routeIndex];
  383.     }
  384.  
  385.     // The MapPageController calls this when loading its page.
  386.     // You should return an array of objects specifying buttons you
  387.     // would like to display at the bottom of the map, e.g.,
  388.     //    {
  389.     //        title:   "Start",
  390.     //        id:      "startButton",  (optional)
  391.     //    }
  392.     // Note: This doesn't support an "onClick" property like in
  393.     // Assignment 1.
  394.     this.mapPageButtonControls = function()
  395.     {
  396.         var panToRoute =
  397.         {
  398.             title: "Find Route",
  399.         };
  400.         var routeStats =
  401.         {
  402.             title: "Route Stats",
  403.         };
  404.         var simplified =
  405.         {
  406.             title: "Simplified Route"
  407.         };
  408.  
  409.         console.log("View Route - mapPageButtonControls");
  410.         return [panToRoute, routeStats, simplified];
  411.     }
  412.  
  413.     // The MapPageController calls this when user taps on a button
  414.     // specified by mapPageButtonControls().  The buttonIndex will
  415.     // be the index of the button in the aray you returned.
  416.     this.mapPageButtonTapped = function(buttonIndex)
  417.     {
  418.         if (buttonIndex == 0)
  419.         {
  420.             viewRoutePageController.panToLocation(originalRoute.locations[0].Latitude, originalRoute.locations[0].Longitude)
  421.             secondMode = "oRoute";
  422.         }
  423.  
  424.         else if (buttonIndex == 1)
  425.         {
  426.             viewRoutePageController.displayMessage("You've embarked on such a journey for " + self.TotalDistance(originalRoute.locations) + " metres." + "<br/ >" + "The average speed was " +  (self.TotalDistance(originalRoute.locations)/self.totalTime(originalRoute.locations)).toFixed(1) + "m/s");
  427.         }
  428.  
  429.         else if(buttonIndex == 2)
  430.         {
  431.             if(secondMode == "oRoute")
  432.             {
  433.                 secondMode = "sRoute";
  434.                 console.log("sRoute");
  435.                 viewRoutePageController.displayMessage("Simplified route");
  436.  
  437.                 self.simplifiedRoute = this.simplifyRoute(originalRoute.locations.slice());
  438.                 viewRoutePageController.repaintOverlay();
  439.             }
  440.             else if(secondMode == "sRoute")
  441.             {
  442.                 secondMode = "oRoute";
  443.                 console.log("oRoute");
  444.                 viewRoutePageController.displayMessage("Original route");
  445.                 viewRoutePageController.repaintOverlay();
  446.             }
  447.         }
  448.         console.log("View Route - mapPageButtonTapped(" + buttonIndex + ")");
  449.     }
  450.  
  451.     // The MapPageController calls this when the canvas needs to be
  452.     // redrawn, such as due to the user panning or zooming the map.
  453.     // It clears the canvas before calling this method.
  454.     // 'context' is an HTML canvas element context.  This is a
  455.     // transparent layer that sits above the map and is redrawn
  456.     // whenever the map is panned or zoomed. It can be used to
  457.     // draw annotations on the map or display other information.
  458.  
  459.     this.mapPageDrawOverlay = function(context)
  460.     {
  461.  
  462.         //Drawing the line of the route without the dots
  463.         if(secondMode== "oRoute")
  464.         {
  465.             loc = originalRoute.locations.slice(0);
  466.         } else {
  467.             loc = self.simplifiedRoute.slice(0);
  468.         }
  469.             for(var i=0; i +1 <loc.length; i++)
  470.             {
  471.                 var pointFrom = loc[i];
  472.                 var pointTo = loc[i+1];
  473.                 var posFrom = viewRoutePageController.canvasPointFromLocation(pointFrom.Latitude,pointFrom.Longitude);
  474.                 var posTo= viewRoutePageController.canvasPointFromLocation(pointTo.Latitude,pointTo.Longitude);
  475.  
  476.                 context.beginPath();
  477.                 context.moveTo(posFrom.x,posFrom.y);
  478.                 context.lineTo(posTo.x,posTo.y);
  479.                 context.strokeStyle = '#8A00B8';
  480.                 context.stroke();
  481.             }
  482.  
  483.             //Takes the first point (of index 0) and draws that as a dot
  484.         for (var p = 0; p < loc.length; p++) {
  485.         firstPoint = viewRoutePageController.canvasPointFromLocation(loc[p].Latitude,loc[p].Longitude)
  486.  
  487.         context.beginPath();
  488.         context.arc(firstPoint.x  , firstPoint.y , 10, 0, 2 * Math.PI, false);
  489.         context.fillStyle = 'pink';
  490.         context.fill();
  491.         context.lineWidth = 5;
  492.         context.strokeStyle = '#8A00B8';
  493.         context.stroke();
  494.         }
  495.        
  496.        
  497.  
  498.         console.log("View Route - mapPageDrawOverlay");
  499.     }
  500.  
  501.     // The MapPageController calls this to ask if it should return
  502.     // back to the start screen of the app when the user taps the
  503.     // done button.  If you are not letting the user return, you
  504.     // should probably call displayMessage() to inform them why.
  505.     this.mapPageShouldReturnFromDoneButtonTap = function()
  506.     {
  507.         console.log("viewPage mapShouldReturnFromDoneButtonTap");
  508.         return true;
  509.     }
  510. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement