direction services enyo kind

gistfile1.js

/**
 * The maps api is loaded using the Google Loader. Include
 * <script type="text/javascript" src="https://www.google.com/jsapi"></script>
 * in your index.html to use this component.
 */

enyo.kind({
    name: 'Google.DirectionsService',
    kind: 'Control',
    published: {
        apiVersion: '3.8',
        otherMapParams: 'sensor=true&libraries=geometry,places',
        zoom: 16,
        center: null,
        latitude: 37.787186,
        longitude: -122.401037,
        origin: {},
        destination: {}
    },
    events: {
        onMapCreated: '',
        onResultError: ''
    },
    constructor: function() {
        this.inherited(arguments);
        this.log("lat: " + this.latitude);
        this.log("lng: " + this.longitude);
        this.center = {
            lat: this.latitude,
            lng: this.longitude
        };
    },
    components: [
        {name: 'map', classes: 'enyo-google-map-map'},
        {kind: "enyo.Scroller", name: "instructionsscroller", components:[
            {name: "instructions", classes: 'enyo-google-map-map enyo-google-map-hide'}
        ]},
        {name: 'client'}
    ],
    //* @protected
    create: function() {
        this.inherited(arguments);
        this.log("lat: " + this.latitude);
        this.log("lng: " + this.longitude);
        this.center = {
            lat: this.latitude,
            lng: this.longitude
        };
        this.load();
    },
    load: function() {
        google.load('maps', this.apiVersion, {
            callback: enyo.bind(this, 'apiLoadHandler'),
            other_params: this.otherMapParams});
    },
    apiLoadHandler: function() {
        this.log("loaded. node: "+this.hasNode());
        this.apiLoaded = true;
        if (this.hasNode()) {
            this.createMap();
        }
    },
    createMap: function() {
        if (this.map) {
            this.destroyMap();
        }
        if (this.$.map.hasNode()) {
            this.log("Creating map!");
            this.directionsService = new google.maps.DirectionsService();
            this.directionsDisplay = new google.maps.DirectionsRenderer();



            var latlng = new google.maps.LatLng(this.center.lat, this.center.lng);

            this.map = new google.maps.Map(this.$.map.node, {
                center: new google.maps.LatLng(this.center.lat, this.center.lng),
                zoom: this.zoom,
                disableDefaultUI: false,
                mapTypeId: google.maps.MapTypeId.ROADMAP,
                modeDiagnostics: false
            });

            this.directionsDisplay.setMap(this.map);
            this.directionsDisplay.setPanel(this.$.instructions.hasNode());

            this.log("Display and Service created.");

            this.doMapCreated();
        }
    },
    destroyMap: function() {
        this.log("destroying display and service");
        this.directionsDisplay = null;
        this.directionsService = null;
        this.map = null;
    },
    showInstructions: function() {
        //this.$.map.hide();
        //this.$.instructions.show();
        this.$.instructions.setClassAttribute("enyo-google-map-map enyo-google-map-show");
        this.$.map.setClassAttribute("enyo-google-map-map enyo-google-map-hide");
        var bounds = this.getBounds();
        this.$.instructionsscroller.setBounds({height: bounds.height}, "px");


    },
    showMap: function() {
        //this.$.instructions.hide();
        this.$.instructions.setClassAttribute("enyo-google-map-map enyo-google-map-hide");
        this.$.map.setClassAttribute("enyo-google-map-map enyo-google-map-show");
        //this.$.map.show();
        this.updateCenter();
    },
    calculateRoute: function(inData) {

        this.log("params are " + inData);

        var theTravelMode = google.maps.TravelMode.DRIVING;
        switch (inData.mode) {
            case "WALK":
                theTravelMode = google.maps.TravelMode.WALKING;
                break;
            case "CAR":
                theTravelMode = google.maps.TravelMode.DRIVING;
                break;
            case "BICYCLE":
                theTravelMode = google.maps.TravelMode.BICYCLING;
                break;
            case "MASSTRANSIT":
                theTravelMode = google.maps.TravelMode.TRANSIT;
        };

        this.log("Travel Mode is " + theTravelMode);

        var originLatLng = new google.maps.LatLng(inData.origin.latitude, inData.origin.longitude);
        var destinationLatLng = new google.maps.LatLng(inData.destination.latitude, inData.destination.longitude);

        this.log("origin and destination");
        this.log(originLatLng);
        this.log(destinationLatLng);

        /*
        this.originMarker = new google.maps.Marker({
            position: originLatLng,
            draggable: true,
            map: this.map,
            title:"Origin!"
        });

        this.destinationMarker = new google.maps.Marker({
            position: destinationLatLng,
            draggable: true,
            map: this.map,
            title:"Destination!"
        });
        */

        var request = {
            origin: originLatLng,
            destination: destinationLatLng,
            travelMode: theTravelMode
        };
        this.directionsService.route(request, enyo.bind(this, function(result, status) {
            this.log("inside direction service callback");
            this.log(result);
            this.log("status: " + status);
            if (status == google.maps.DirectionsStatus.OK) {
                this.log("status is OK");
                this.directionsDisplay.setDirections(result);
            } else {
                this.log("status is NOT OK");
                var data = {"result": result, "status": status};
                this.doResultError(data);
            }
        }));

    },
    updateCenter: function() {
        var latlng = new google.maps.LatLng(this.center.lat, this.center.lng);
        this.map.panTo(latlng);
    },
    setCenter: function(inLat, inLng) {
        this.center.lat = inLat;
        this.center.lng = inLng;
        this.updateCenter();
    },
    getUserPosition: function() {
        var position = {lat: this.marker.position.lat(), lng: this.marker.position.lng()};

        return position;
    }

});