@ambl-on/lcu-ambl-on-common - npm Package Compare versions

Comparing version 0.1.22-landing-page to 0.1.23-google-map

ambl-on-lcu-ambl-on-common.metadata.json

@@ -1,1 +0,1 @@
-{"__symbolic":"module","version":4,"metadata":{"UsersStateManagerContext":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@lcu-ide/common","name":"StateManagerContext","line":7,"character":46},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":4,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":14,"character":34}]}],"SetActive":[{"__symbolic":"method"}],"defaultValue":[{"__symbolic":"method"}],"loadStateKey":[{"__symbolic":"method"}],"loadStateName":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"UsersState":{"__symbolic":"class","members":{}},"HamburgerMenuComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"lcu-hamburger-menu","template":"<nav class=\"hamburger-nav\">\r\n  <button class=\"hamburger-menu\" mat-icon-button [matMenuTriggerFor]=\"menu\">\r\n    <mat-icon>menu</mat-icon>\r\n  </button>\r\n  <!-- Builds the hamburger menu from the item in the constants.ts file-->\r\n  <mat-menu #menu=\"matMenu\">\r\n    <button class=\"item-button\" mat-menu-item  *ngFor= \"let item of MenuItems\" [disabled]= item.Disabled>\r\n      <mat-icon>{{ item.Icon }}</mat-icon>\r\n      <span>{{ item.Label }}</span>\r\n    </button>\r\n  </mat-menu>\r\n</nav>","styles":[".hamburger-menu{background-color:transparent;border-width:0;outline:0}"]}]}],"members":{"ngOnInit":[{"__symbolic":"method"}]}},"LandingPageComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"lcu-landing-page","template":"  <div class=\"container\" fxFlex=\"100%\"\r\n      fxLayout=\"column\" fxLayoutAlign=\"center start\"\r\n      fxLayout.sm=\"column\" fxLayoutAlign.sm=\"center center\"\r\n      fxLayout.xs=\"column\" fxLayoutAlign.xs=\"center center\">\r\n      <div class=\"title\">\r\n        <h1>\r\n          {{ Title }}\r\n        </h1>\r\n      </div>\r\n      <div class=\"slogan\">\r\n          <h3>\r\n            {{ Slogan }}\r\n          </h3>\r\n      </div>\r\n  </div>\r\n","styles":[".container{margin-top:19em;margin-left:1em;text-align:center}.container h1{margin:0}.container .slogan,.container .title{color:#fff}"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}},"Constants":{"__symbolic":"class","members":{},"statics":{"VAR_NAMES_MENU":[{"Label":"My Atlas","Icon":"public","Url":"www","Disabled":"false"},{"Label":"My Itenerarries","Icon":"map","Url":"www","Disabled":"true"},{"Label":"My Top Lists","Icon":"sort","Url":"www","Disabled":"true"},{"Label":"My Albums","Icon":"photo_library","Url":"www","Disabled":"true"},{"Label":"My Friends","Icon":"group","Url":"www","Disabled":"true"},{"Label":"My Profile","Icon":"person","Url":"www","Disabled":"true"}]}},"HamburgerMenuModel":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"string"},{"__symbolic":"reference","name":"string"},{"__symbolic":"reference","name":"string"},{"__symbolic":"reference","name":"string"}]}]}},"LcuAmblOnModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":12,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"LandingPageComponent"},{"__symbolic":"reference","name":"HamburgerMenuComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":15,"character":4},{"__symbolic":"reference","module":"@angular/flex-layout","name":"FlexLayoutModule","line":16,"character":4},{"__symbolic":"reference","module":"@angular/platform-browser/animations","name":"BrowserAnimationsModule","line":17,"character":4},{"__symbolic":"reference","module":"@angular/material/menu","name":"MatMenuModule","line":18,"character":4},{"__symbolic":"reference","module":"@angular/material","name":"MatIconModule","line":19,"character":4}],"exports":[{"__symbolic":"reference","name":"LandingPageComponent"},{"__symbolic":"reference","name":"HamburgerMenuComponent"}],"entryComponents":[{"__symbolic":"reference","name":"LandingPageComponent"},{"__symbolic":"reference","name":"HamburgerMenuComponent"}]}]}],"members":{},"statics":{"forRoot":{"__symbolic":"function","parameters":[],"value":{"ngModule":{"__symbolic":"reference","name":"LcuAmblOnModule"},"providers":[{"__symbolic":"reference","name":"UsersStateManagerContext"}]}}}}},"origins":{"UsersStateManagerContext":"./lib/state/users/users-state-manager.context","UsersState":"./lib/state/users/users-state.model","HamburgerMenuComponent":"./lib/controls/hamburger-menu/hamburger-menu.component","LandingPageComponent":"./lib/controls/landing-page/landing-page.component","Constants":"./lib/utils/constants/constants","HamburgerMenuModel":"./lib/models/hamburger-menu.model","LcuAmblOnModule":"./lib/lcu-ambl-on.module"},"importAs":"@ambl-on/lcu-ambl-on-common"}
+{"__symbolic":"module","version":4,"metadata":{"UsersStateManagerContext":{"__symbolic":"class","extends":{"__symbolic":"reference","module":"@lcu-ide/common","name":"StateManagerContext","line":7,"character":46},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":4,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"Injector","line":14,"character":34}]}],"SetActive":[{"__symbolic":"method"}],"defaultValue":[{"__symbolic":"method"}],"loadStateKey":[{"__symbolic":"method"}],"loadStateName":[{"__symbolic":"method"}]},"statics":{"ngInjectableDef":{}}},"UsersState":{"__symbolic":"class","members":{}},"HamburgerMenuComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"lcu-hamburger-menu","template":"<nav class=\"hamburger-nav\">\r\n  <button class=\"hamburger-menu\" mat-icon-button [matMenuTriggerFor]=\"menu\">\r\n    <mat-icon>menu</mat-icon>\r\n  </button>\r\n  <!-- Builds the hamburger menu from the item in the constants.ts file-->\r\n  <mat-menu #menu=\"matMenu\">\r\n    <button class=\"item-button\" mat-menu-item  *ngFor= \"let item of MenuItems\" [disabled]= item.Disabled>\r\n      <mat-icon>{{ item.Icon }}</mat-icon>\r\n      <span>{{ item.Label }}</span>\r\n    </button>\r\n  </mat-menu>\r\n</nav>","styles":[".hamburger-menu{background-color:transparent;border-width:0;outline:0}"]}]}],"members":{"ngOnInit":[{"__symbolic":"method"}]}},"LandingPageComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"lcu-landing-page","template":"  <div class=\"container\" fxFlex=\"100%\"\r\n      fxLayout=\"column\" fxLayoutAlign=\"center start\"\r\n      fxLayout.sm=\"column\" fxLayoutAlign.sm=\"center center\"\r\n      fxLayout.xs=\"column\" fxLayoutAlign.xs=\"center center\">\r\n      <div class=\"title\">\r\n        <h1>\r\n          {{ Title }}\r\n        </h1>\r\n      </div>\r\n      <div class=\"slogan\">\r\n          <h3>\r\n            {{ Slogan }}\r\n          </h3>\r\n      </div>\r\n  </div>\r\n","styles":[".container{margin-top:19em;margin-left:1em;margin-bottom:9.3em;text-align:center}.container h1{margin:0}.container .slogan,.container .title{color:#fff}"]}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}},"Constants":{"__symbolic":"class","members":{},"statics":{"VAR_NAMES_MENU":[{"Label":"My Atlas","Icon":"public","Url":"www","Disabled":"false"},{"Label":"My Itenerarries","Icon":"map","Url":"www","Disabled":"true"},{"Label":"My Top Lists","Icon":"sort","Url":"www","Disabled":"true"},{"Label":"My Albums","Icon":"photo_library","Url":"www","Disabled":"true"},{"Label":"My Friends","Icon":"group","Url":"www","Disabled":"true"},{"Label":"My Profile","Icon":"person","Url":"www","Disabled":"true"}]}},"HamburgerMenuModel":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"string"},{"__symbolic":"reference","name":"string"},{"__symbolic":"reference","name":"string"},{"__symbolic":"reference","name":"string"}]}]}},"LcuAmblOnModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":16,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"LandingPageComponent"},{"__symbolic":"reference","name":"HamburgerMenuComponent"},{"__symbolic":"reference","name":"MapComponent"},{"__symbolic":"reference","name":"AddMapMarkerComponent"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":19,"character":4},{"__symbolic":"reference","module":"@angular/flex-layout","name":"FlexLayoutModule","line":20,"character":4},{"__symbolic":"reference","module":"@angular/platform-browser/animations","name":"BrowserAnimationsModule","line":21,"character":4},{"__symbolic":"reference","module":"@angular/material/menu","name":"MatMenuModule","line":22,"character":4},{"__symbolic":"reference","module":"@angular/material","name":"MatIconModule","line":23,"character":4},{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@agm/core","name":"AgmCoreModule","line":24,"character":4},"member":"forRoot"},"arguments":[{"apiKey":"AIzaSyCvvqYY9pMUpRSKl721rPEiN4KlKIpCImg"}]},{"__symbolic":"reference","module":"@angular/material","name":"MatIconModule","line":25,"character":4},{"__symbolic":"reference","module":"@angular/material","name":"MatSelectModule","line":26,"character":4},{"__symbolic":"reference","module":"@angular/material","name":"MatDialogModule","line":27,"character":4},{"__symbolic":"reference","module":"@angular/material","name":"MatButtonModule","line":28,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":29,"character":4},{"__symbolic":"reference","module":"@angular/material","name":"MatInputModule","line":30,"character":4},{"__symbolic":"reference","module":"@angular/material","name":"MatFormFieldModule","line":31,"character":4}],"exports":[{"__symbolic":"reference","name":"LandingPageComponent"},{"__symbolic":"reference","name":"HamburgerMenuComponent"},{"__symbolic":"reference","name":"MapComponent"},{"__symbolic":"reference","name":"AddMapMarkerComponent"}],"entryComponents":[{"__symbolic":"reference","name":"LandingPageComponent"},{"__symbolic":"reference","name":"HamburgerMenuComponent"}]}]}],"members":{},"statics":{"forRoot":{"__symbolic":"function","parameters":[],"value":{"ngModule":{"__symbolic":"reference","name":"LcuAmblOnModule"},"providers":[{"__symbolic":"reference","name":"UsersStateManagerContext"}]}}}},"IndividualMap":{"__symbolic":"class","members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"IndividualMap"}]}]}},"MapMarker":{"__symbolic":"class","members":{}},"MapComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":6,"character":1},"arguments":[{"selector":"lcu-map","template":"<div class=\"icon-list\">\r\n  <div>\r\n    <div class=\"top-icon-set\">\r\n      <mat-icon class=\"hamburger-icon\">menu</mat-icon>\r\n      <mat-icon class=\"chevron-icon\">chevron_left</mat-icon>\r\n    </div>\r\n    <div class=\"bottom-icon-set\" fxLayoutAlign.lt-sm=\"flex-start\" fxLayoutAlign=\"space-around\" fxLayoutGap.lt-sm=\"50px\">\r\n      <mat-icon>search</mat-icon>\r\n      <mat-icon >add</mat-icon>\r\n      <mat-icon>layers</mat-icon>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<agm-map [latitude]=\"CurrentMapModel.origin.lat\" [longitude]=\"CurrentMapModel.origin.lng\" [title]=\"CurrentMapModel.title\" [zoom]=\"CurrentMapModel.zoom\"\r\n  (mapClick)=\"OnChoseLocation($event)\">\r\n  <div *ngFor=\"let marker of CurrentMapModel.locationList\">\r\n    <agm-marker [latitude]=\"marker.lat\" [longitude]=\"marker.lng\" [title]=\"marker.title\" [iconUrl]=\"marker.icon\"></agm-marker>\r\n  </div>\r\n</agm-map>\r\n\r\n","styles":["mat-icon{font-size:30px}.icon-list{padding:5px}.hamburger-icon{position:absolute;left:10px}@media (max-width:600px){.hamburger-icon{position:relative}}.chevron-icon{position:absolute;right:10px}.bottom-icon-set{width:80%;margin:auto}@media (max-width:600px){.bottom-icon-set{margin-left:10px}}agm-map{height:700px}"]}]}],"members":{"mapModel":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":25,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/material","name":"MatDialog","line":36,"character":30}]}],"ngOnInit":[{"__symbolic":"method"}],"OnChoseLocation":[{"__symbolic":"method"}],"convertMarkerUrls":[{"__symbolic":"method"}]}},"AddMapMarkerComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":5,"character":1},"arguments":[{"selector":"lcu-add-map-marker","template":"<h1 mat-dialog-title>Add a marker here?</h1>\r\n\r\n\r\n<mat-dialog-content>\r\n  <form fxLayout=\"column\" fxLayoutAlign=\"center center\" [formGroup]=\"NewMarkerForm\" fxLayoutGap=\"30px\">\r\n    <h4>Marker Title:</h4>\r\n    <mat-form-field>\r\n      <input type=\"text\" matInput formControlName=\"title\">\r\n      <mat-hint>The title for the map marker</mat-hint>\r\n      <mat-error>Invalid or missing title</mat-error>\r\n    </mat-form-field>\r\n\r\n    <h4>Choose Icon:</h4>\r\n    <mat-form-field>\r\n      <mat-label>Icon</mat-label>\r\n      <mat-select formControlName=\"icon\">\r\n        <mat-option *ngFor=\"let icon of IconList\" [value]=\"icon\">{{icon}}</mat-option>\r\n      </mat-select>\r\n    </mat-form-field>\r\n\r\n  </form>\r\n</mat-dialog-content>\r\n\r\n\r\n<button mat-raised-button color=\"primary\" [mat-dialog-close]=\"NewMarker\" (click)=\"SetMarkerData()\"\r\n  [disabled]=\"NewMarkerForm.invalid\">Add Marker</button>\r\n<button mat-raised-button color=\"accent\" [mat-dialog-close]=\"false\">Cancel</button>","styles":[""]}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameterDecorators":[[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Inject","line":31,"character":15},"arguments":[{"__symbolic":"reference","module":"@angular/material","name":"MAT_DIALOG_DATA","line":31,"character":22}]}]],"parameters":[{"__symbolic":"reference","name":"any"}]}],"ngOnInit":[{"__symbolic":"method"}],"SetMarkerData":[{"__symbolic":"method"}],"convertIconUrl":[{"__symbolic":"method"}]}}},"origins":{"UsersStateManagerContext":"./lib/state/users/users-state-manager.context","UsersState":"./lib/state/users/users-state.model","HamburgerMenuComponent":"./lib/controls/hamburger-menu/hamburger-menu.component","LandingPageComponent":"./lib/controls/landing-page/landing-page.component","Constants":"./lib/utils/constants/constants","HamburgerMenuModel":"./lib/models/hamburger-menu.model","LcuAmblOnModule":"./lib/lcu-ambl-on.module","IndividualMap":"./lib/models/individual-map.model","MapMarker":"./lib/models/map-marker.model","MapComponent":"./lib/controls/map/map.component","AddMapMarkerComponent":"./lib/controls/map/add-map-marker/add-map-marker.component"},"importAs":"@ambl-on/lcu-ambl-on-common"}

bundles/ambl-on-lcu-ambl-on-common.umd.js

 (function (global, factory) {
-    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@lcu-ide/common'), require('@angular/core'), require('@angular/common'), require('@angular/material/menu'), require('@angular/material'), require('@angular/flex-layout'), require('@angular/platform-browser/animations')) :
-    typeof define === 'function' && define.amd ? define('@ambl-on/lcu-ambl-on-common', ['exports', '@lcu-ide/common', '@angular/core', '@angular/common', '@angular/material/menu', '@angular/material', '@angular/flex-layout', '@angular/platform-browser/animations'], factory) :
-    (factory((global['ambl-on'] = global['ambl-on'] || {}, global['ambl-on']['lcu-ambl-on-common'] = {}),global.common,global.ng.core,global.ng.common,global.ng.material.menu,global.ng.material,global.ng['flex-layout'],global.ng.platformBrowser.animations));
-}(this, (function (exports,common,i0,common$1,menu,material,flexLayout,animations) { 'use strict';
+    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@lcu-ide/common'), require('@angular/common'), require('@angular/material/menu'), require('@angular/flex-layout'), require('@angular/platform-browser/animations'), require('@agm/core'), require('@angular/core'), require('@angular/material'), require('@angular/forms')) :
+    typeof define === 'function' && define.amd ? define('@ambl-on/lcu-ambl-on-common', ['exports', '@lcu-ide/common', '@angular/common', '@angular/material/menu', '@angular/flex-layout', '@angular/platform-browser/animations', '@agm/core', '@angular/core', '@angular/material', '@angular/forms'], factory) :
+    (factory((global['ambl-on'] = global['ambl-on'] || {}, global['ambl-on']['lcu-ambl-on-common'] = {}),global.common,global.ng.common,global.ng.material.menu,global.ng['flex-layout'],global.ng.platformBrowser.animations,global.core,global.ng.core,global.ng.material,global.ng.forms));
+}(this, (function (exports,common,common$1,menu,flexLayout,animations,core,i0,material,forms) { 'use strict';
 
@@ -298,3 +298,3 @@ /*! *****************************************************************************
                         template: "  <div class=\"container\" fxFlex=\"100%\"\r\n      fxLayout=\"column\" fxLayoutAlign=\"center start\"\r\n      fxLayout.sm=\"column\" fxLayoutAlign.sm=\"center center\"\r\n      fxLayout.xs=\"column\" fxLayoutAlign.xs=\"center center\">\r\n      <div class=\"title\">\r\n        <h1>\r\n          {{ Title }}\r\n        </h1>\r\n      </div>\r\n      <div class=\"slogan\">\r\n          <h3>\r\n            {{ Slogan }}\r\n          </h3>\r\n      </div>\r\n  </div>\r\n",
-                        styles: [".container{margin-top:19em;margin-left:1em;text-align:center}.container h1{margin:0}.container .slogan,.container .title{color:#fff}"]
+                        styles: [".container{margin-top:19em;margin-left:1em;margin-bottom:9.3em;text-align:center}.container h1{margin:0}.container .slogan,.container .title{color:#fff}"]
                     }] }
@@ -335,2 +335,249 @@ ];
      */
+    var AddMapMarkerComponent = /** @class */ (function () {
+        // PROPERTIES
+        // CONSTRUCTORS
+        function AddMapMarkerComponent(passedData) {
+            this.passedData = passedData;
+        }
+        // LIFE CYCLE
+        // LIFE CYCLE
+        /**
+         * @return {?}
+         */
+        AddMapMarkerComponent.prototype.ngOnInit =
+            // LIFE CYCLE
+            /**
+             * @return {?}
+             */
+            function () {
+                this.NewMarkerForm = new forms.FormGroup({
+                    title: new forms.FormControl('', { validators: [forms.Validators.required] }),
+                    icon: new forms.FormControl('', { validators: [forms.Validators.required] })
+                });
+                this.NewMarker = {
+                    title: '',
+                    icon: null,
+                    lat: 40.00,
+                    lng: -100
+                };
+                // make these into a constants file somewhere because this list is written somewhere else as well
+                this.IconList = ['bar', 'brewery', 'golf course', 'lodging', 'museum', 'national park', 'restaurant', 'ski area', 'UNESCO', 'vineyard'];
+            };
+        // API METHODS
+        /**
+         * Converts data from the form to an icon to be placed on the map
+         */
+        // API METHODS
+        /**
+         * Converts data from the form to an icon to be placed on the map
+         * @return {?}
+         */
+        AddMapMarkerComponent.prototype.SetMarkerData =
+            // API METHODS
+            /**
+             * Converts data from the form to an icon to be placed on the map
+             * @return {?}
+             */
+            function () {
+                this.NewMarker.title = this.NewMarkerForm.value.title;
+                this.NewMarker.icon = this.NewMarkerForm.value.icon;
+                this.NewMarker.lat = this.passedData.lat;
+                this.NewMarker.lng = this.passedData.lng;
+                this.NewMarker.icon = this.convertIconUrl(this.NewMarker.icon);
+                console.log(this.NewMarker.icon);
+            };
+        // HELPERS
+        /**
+         *
+         * @param icon The icon to be converted to a path
+         *
+         * Converts icon to path for use in displaying custom icon as map location marker
+         * Best to find a more abstract way of doing this for re-usability (service?)
+         */
+        // HELPERS
+        /**
+         *
+         * @private
+         * @param {?} icon The icon to be converted to a path
+         *
+         * Converts icon to path for use in displaying custom icon as map location marker
+         * Best to find a more abstract way of doing this for re-usability (service?)
+         * @return {?}
+         */
+        AddMapMarkerComponent.prototype.convertIconUrl =
+            // HELPERS
+            /**
+             *
+             * @private
+             * @param {?} icon The icon to be converted to a path
+             *
+             * Converts icon to path for use in displaying custom icon as map location marker
+             * Best to find a more abstract way of doing this for re-usability (service?)
+             * @return {?}
+             */
+            function (icon) {
+                // later - turn this into service because it's also being done in map.component.ts
+                /** @type {?} */
+                var orig = icon;
+                /** @type {?} */
+                var iconUrl = "./assets/" + orig + ".png";
+                return { url: iconUrl, scaledSize: { width: 40, height: 60 } };
+            };
+        AddMapMarkerComponent.decorators = [
+            { type: i0.Component, args: [{
+                        selector: 'lcu-add-map-marker',
+                        template: "<h1 mat-dialog-title>Add a marker here?</h1>\r\n\r\n\r\n<mat-dialog-content>\r\n  <form fxLayout=\"column\" fxLayoutAlign=\"center center\" [formGroup]=\"NewMarkerForm\" fxLayoutGap=\"30px\">\r\n    <h4>Marker Title:</h4>\r\n    <mat-form-field>\r\n      <input type=\"text\" matInput formControlName=\"title\">\r\n      <mat-hint>The title for the map marker</mat-hint>\r\n      <mat-error>Invalid or missing title</mat-error>\r\n    </mat-form-field>\r\n\r\n    <h4>Choose Icon:</h4>\r\n    <mat-form-field>\r\n      <mat-label>Icon</mat-label>\r\n      <mat-select formControlName=\"icon\">\r\n        <mat-option *ngFor=\"let icon of IconList\" [value]=\"icon\">{{icon}}</mat-option>\r\n      </mat-select>\r\n    </mat-form-field>\r\n\r\n  </form>\r\n</mat-dialog-content>\r\n\r\n\r\n<button mat-raised-button color=\"primary\" [mat-dialog-close]=\"NewMarker\" (click)=\"SetMarkerData()\"\r\n  [disabled]=\"NewMarkerForm.invalid\">Add Marker</button>\r\n<button mat-raised-button color=\"accent\" [mat-dialog-close]=\"false\">Cancel</button>",
+                        styles: [""]
+                    }] }
+        ];
+        /** @nocollapse */
+        AddMapMarkerComponent.ctorParameters = function () {
+            return [
+                { type: undefined, decorators: [{ type: i0.Inject, args: [material.MAT_DIALOG_DATA,] }] }
+            ];
+        };
+        return AddMapMarkerComponent;
+    }());
+
+    /**
+     * @fileoverview added by tsickle
+     * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+     */
+    var MapComponent = /** @class */ (function () {
+        // CONSTRUCTORS
+        function MapComponent(dialog) {
+            this.dialog = dialog;
+            // PROPERTIES
+            /**
+             * The map model object (IndividualMap model) containing all the settings for the map to be displayed
+             */
+            this.mapModel = {
+                title: 'Default Title',
+                origin: { lat: 40.037757, lng: -105.278324 },
+                zoom: 13,
+                locationList: [],
+                thumbnailUrl: "https://maps.googleapis.com/maps/api/staticmap?center=63.259591,-144.667969&zoom=6&size=400x400\n      &markers=color:blue%7Clabel:S%7C62.107733,-145.541936&markers=size:tiny%7Ccolor:green%7CDelta+Junction,AK\n      &markers=size:mid%7Ccolor:0xFFFF00%7Clabel:C%7CTok,AK\"&key=AIzaSyCvvqYY9pMUpRSKl721rPEiN4KlKIpCImg"
+            };
+        }
+        // LIFE CYCLE
+        // LIFE CYCLE
+        /**
+         * @return {?}
+         */
+        MapComponent.prototype.ngOnInit =
+            // LIFE CYCLE
+            /**
+             * @return {?}
+             */
+            function () {
+                this.CurrentMapModel = this.mapModel;
+                this.CurrentMapModel.locationList = this.convertMarkerUrls(this.CurrentMapModel.locationList);
+            };
+        // API METHODS
+        /**
+         *
+         * @param event The event passed in upon user clicking the map
+         *
+         * Runs when user clicks location on map. Modal displays prompting user to enter info about custom location marker
+         */
+        // API METHODS
+        /**
+         *
+         * @param {?} event The event passed in upon user clicking the map
+         *
+         * Runs when user clicks location on map. Modal displays prompting user to enter info about custom location marker
+         * @return {?}
+         */
+        MapComponent.prototype.OnChoseLocation =
+            // API METHODS
+            /**
+             *
+             * @param {?} event The event passed in upon user clicking the map
+             *
+             * Runs when user clicks location on map. Modal displays prompting user to enter info about custom location marker
+             * @return {?}
+             */
+            function (event) {
+                var _this = this;
+                /** @type {?} */
+                var dialogRef = this.dialog.open(AddMapMarkerComponent, {
+                    data: {
+                        lat: event.coords.lat,
+                        lng: event.coords.lng
+                    }
+                });
+                dialogRef.afterClosed().subscribe(( /**
+                 * @param {?} res
+                 * @return {?}
+                 */function (res) {
+                    if (res) {
+                        _this.CurrentMapModel.locationList.push(res);
+                    }
+                }));
+            };
+        // HELPERS
+        /**
+         *
+         * @param list The list of icons to convert to paths
+         *
+         * Converts list of icons to paths for use in displaying custom icons as map location markers
+         * Best to find a more abstract way of doing this for re-usability (service?)
+         */
+        // HELPERS
+        /**
+         *
+         * @private
+         * @param {?} list The list of icons to convert to paths
+         *
+         * Converts list of icons to paths for use in displaying custom icons as map location markers
+         * Best to find a more abstract way of doing this for re-usability (service?)
+         * @return {?}
+         */
+        MapComponent.prototype.convertMarkerUrls =
+            // HELPERS
+            /**
+             *
+             * @private
+             * @param {?} list The list of icons to convert to paths
+             *
+             * Converts list of icons to paths for use in displaying custom icons as map location markers
+             * Best to find a more abstract way of doing this for re-usability (service?)
+             * @return {?}
+             */
+            function (list) {
+                list.forEach(( /**
+                 * @param {?} element
+                 * @return {?}
+                 */function (element) {
+                    /** @type {?} */
+                    var icon = element.icon;
+                    /** @type {?} */
+                    var iconUrl = "./assets/" + icon + ".png";
+                    element.icon = { url: iconUrl, scaledSize: { width: 40, height: 60 } };
+                }));
+                return list;
+            };
+        MapComponent.decorators = [
+            { type: i0.Component, args: [{
+                        selector: 'lcu-map',
+                        template: "<div class=\"icon-list\">\r\n  <div>\r\n    <div class=\"top-icon-set\">\r\n      <mat-icon class=\"hamburger-icon\">menu</mat-icon>\r\n      <mat-icon class=\"chevron-icon\">chevron_left</mat-icon>\r\n    </div>\r\n    <div class=\"bottom-icon-set\" fxLayoutAlign.lt-sm=\"flex-start\" fxLayoutAlign=\"space-around\" fxLayoutGap.lt-sm=\"50px\">\r\n      <mat-icon>search</mat-icon>\r\n      <mat-icon >add</mat-icon>\r\n      <mat-icon>layers</mat-icon>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<agm-map [latitude]=\"CurrentMapModel.origin.lat\" [longitude]=\"CurrentMapModel.origin.lng\" [title]=\"CurrentMapModel.title\" [zoom]=\"CurrentMapModel.zoom\"\r\n  (mapClick)=\"OnChoseLocation($event)\">\r\n  <div *ngFor=\"let marker of CurrentMapModel.locationList\">\r\n    <agm-marker [latitude]=\"marker.lat\" [longitude]=\"marker.lng\" [title]=\"marker.title\" [iconUrl]=\"marker.icon\"></agm-marker>\r\n  </div>\r\n</agm-map>\r\n\r\n",
+                        styles: ["mat-icon{font-size:30px}.icon-list{padding:5px}.hamburger-icon{position:absolute;left:10px}@media (max-width:600px){.hamburger-icon{position:relative}}.chevron-icon{position:absolute;right:10px}.bottom-icon-set{width:80%;margin:auto}@media (max-width:600px){.bottom-icon-set{margin-left:10px}}agm-map{height:700px}"]
+                    }] }
+        ];
+        /** @nocollapse */
+        MapComponent.ctorParameters = function () {
+            return [
+                { type: material.MatDialog }
+            ];
+        };
+        MapComponent.propDecorators = {
+            mapModel: [{ type: i0.Input }]
+        };
+        return MapComponent;
+    }());
+
+    /**
+     * @fileoverview added by tsickle
+     * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+     */
     var LcuAmblOnModule = /** @class */ (function () {
@@ -353,3 +600,3 @@ function LcuAmblOnModule() {
             { type: i0.NgModule, args: [{
-                        declarations: [LandingPageComponent, HamburgerMenuComponent],
+                        declarations: [LandingPageComponent, HamburgerMenuComponent, MapComponent, AddMapMarkerComponent],
                         imports: [
@@ -361,4 +608,12 @@ common$1.CommonModule,
                             material.MatIconModule,
+                            core.AgmCoreModule.forRoot({ apiKey: 'AIzaSyCvvqYY9pMUpRSKl721rPEiN4KlKIpCImg' }),
+                            material.MatIconModule,
+                            material.MatSelectModule,
+                            material.MatDialogModule,
+                            material.MatButtonModule,
+                            forms.ReactiveFormsModule,
+                            material.MatInputModule,
+                            material.MatFormFieldModule
                         ],
-                        exports: [LandingPageComponent, HamburgerMenuComponent],
+                        exports: [LandingPageComponent, HamburgerMenuComponent, MapComponent, AddMapMarkerComponent],
                         entryComponents: [LandingPageComponent, HamburgerMenuComponent]
@@ -374,2 +629,12 @@ },] }
      */
+    var IndividualMap = /** @class */ (function () {
+        function IndividualMap(mapInfo) {
+            this.title = mapInfo.title;
+            this.origin = mapInfo.origin;
+            this.zoom = mapInfo.zoom;
+            this.locationList = mapInfo.locationList;
+            this.thumbnailUrl = mapInfo.thumbnailUrl;
+        }
+        return IndividualMap;
+    }());
 
@@ -380,3 +645,18 @@ /**
      */
+    var MapMarker = /** @class */ (function () {
+        function MapMarker() {
+        }
+        return MapMarker;
+    }());
 
+    /**
+     * @fileoverview added by tsickle
+     * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+     */
+
+    /**
+     * @fileoverview added by tsickle
+     * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+     */
+
     exports.UsersStateManagerContext = UsersStateManagerContext;
@@ -389,2 +669,6 @@ exports.UsersState = UsersState;
     exports.LcuAmblOnModule = LcuAmblOnModule;
+    exports.IndividualMap = IndividualMap;
+    exports.MapMarker = MapMarker;
+    exports.MapComponent = MapComponent;
+    exports.AddMapMarkerComponent = AddMapMarkerComponent;
 
@@ -391,0 +675,0 @@ Object.defineProperty(exports, '__esModule', { value: true });

bundles/ambl-on-lcu-ambl-on-common.umd.min.js

@@ -1,2 +0,2 @@
-!function(n,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@lcu-ide/common"),require("@angular/core"),require("@angular/common"),require("@angular/material/menu"),require("@angular/material"),require("@angular/flex-layout"),require("@angular/platform-browser/animations")):"function"==typeof define&&define.amd?define("@ambl-on/lcu-ambl-on-common",["exports","@lcu-ide/common","@angular/core","@angular/common","@angular/material/menu","@angular/material","@angular/flex-layout","@angular/platform-browser/animations"],e):e((n["ambl-on"]=n["ambl-on"]||{},n["ambl-on"]["lcu-ambl-on-common"]={}),n.common,n.ng.core,n.ng.common,n.ng.material.menu,n.ng.material,n.ng["flex-layout"],n.ng.platformBrowser.animations)}(this,function(n,e,t,r,o,a,i,u){"use strict";var l=function(n,e){return(l=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(n,e){n.__proto__=e}||function(n,e){for(var t in e)e.hasOwnProperty(t)&&(n[t]=e[t])})(n,e)};function c(e,i,u,l){return new(u||(u=Promise))(function(n,t){function r(n){try{a(l.next(n))}catch(e){t(e)}}function o(n){try{a(l["throw"](n))}catch(e){t(e)}}function a(e){e.done?n(e.value):new u(function(n){n(e.value)}).then(r,o)}a((l=l.apply(e,i||[])).next())})}function s(r,o){var a,i,u,n,l={label:0,sent:function(){if(1&u[0])throw u[1];return u[1]},trys:[],ops:[]};return n={next:e(0),"throw":e(1),"return":e(2)},"function"==typeof Symbol&&(n[Symbol.iterator]=function(){return this}),n;function e(e){return function(n){return function t(n){if(a)throw new TypeError("Generator is already executing.");for(;l;)try{if(a=1,i&&(u=2&n[0]?i["return"]:n[0]?i["throw"]||((u=i["return"])&&u.call(i),0):i.next)&&!(u=u.call(i,n[1])).done)return u;switch(i=0,u&&(n=[2&n[0],u.value]),n[0]){case 0:case 1:u=n;break;case 4:return l.label++,{value:n[1],done:!1};case 5:l.label++,i=n[1],n=[0];continue;case 7:n=l.ops.pop(),l.trys.pop();continue;default:if(!(u=0<(u=l.trys).length&&u[u.length-1])&&(6===n[0]||2===n[0])){l=0;continue}if(3===n[0]&&(!u||n[1]>u[0]&&n[1]<u[3])){l.label=n[1];break}if(6===n[0]&&l.label<u[1]){l.label=u[1],u=n;break}if(u&&l.label<u[2]){l.label=u[2],l.ops.push(n);break}u[2]&&l.ops.pop(),l.trys.pop();continue}n=o.call(r,l)}catch(e){n=[6,e],i=0}finally{a=u=0}if(5&n[0])throw n[1];return{value:n[0]?n[1]:void 0,done:!0}}([e,n])}}}var m,f=(function L(n,e){function t(){this.constructor=n}l(n,e),n.prototype=null===e?Object.create(e):(t.prototype=e.prototype,new t)}(p,m=e.StateManagerContext),p.prototype.SetActive=function(){},p.prototype.defaultValue=function(){return{Loading:!0}},p.prototype.loadStateKey=function(){return c(this,void 0,void 0,function(){return s(this,function(n){return[2,"main"]})})},p.prototype.loadStateName=function(){return c(this,void 0,void 0,function(){return s(this,function(n){return[2,"users "]})})},p.decorators=[{type:t.Injectable,args:[{providedIn:"root"}]}],p.ctorParameters=function(){return[{type:t.Injector}]},p.ngInjectableDef=t.defineInjectable({factory:function(){return new p(t.inject(t.INJECTOR))},token:p,providedIn:"root"}),p);function p(n){var e=m.call(this,n)||this;return e.injector=n,e}function d(){}var b=(g.VAR_NAMES_MENU=[{Label:"My Atlas",Icon:"public",Url:"www",Disabled:"false"},{Label:"My Itenerarries",Icon:"map",Url:"www",Disabled:"true"},{Label:"My Top Lists",Icon:"sort",Url:"www",Disabled:"true"},{Label:"My Albums",Icon:"photo_library",Url:"www",Disabled:"true"},{Label:"My Friends",Icon:"group",Url:"www",Disabled:"true"},{Label:"My Profile",Icon:"person",Url:"www",Disabled:"true"}],g);function g(){}var y=(h.prototype.ngOnInit=function(){this.MenuItems=b.VAR_NAMES_MENU},h.decorators=[{type:t.Component,args:[{selector:"lcu-hamburger-menu",template:'<nav class="hamburger-nav">\r\n  <button class="hamburger-menu" mat-icon-button [matMenuTriggerFor]="menu">\r\n    <mat-icon>menu</mat-icon>\r\n  </button>\r\n  \x3c!-- Builds the hamburger menu from the item in the constants.ts file--\x3e\r\n  <mat-menu #menu="matMenu">\r\n    <button class="item-button" mat-menu-item  *ngFor= "let item of MenuItems" [disabled]= item.Disabled>\r\n      <mat-icon>{{ item.Icon }}</mat-icon>\r\n      <span>{{ item.Label }}</span>\r\n    </button>\r\n  </mat-menu>\r\n</nav>',styles:[".hamburger-menu{background-color:transparent;border-width:0;outline:0}"]}]}],h);function h(){}var w=(v.prototype.ngOnInit=function(){},v.decorators=[{type:t.Component,args:[{selector:"lcu-landing-page",template:'  <div class="container" fxFlex="100%"\r\n      fxLayout="column" fxLayoutAlign="center start"\r\n      fxLayout.sm="column" fxLayoutAlign.sm="center center"\r\n      fxLayout.xs="column" fxLayoutAlign.xs="center center">\r\n      <div class="title">\r\n        <h1>\r\n          {{ Title }}\r\n        </h1>\r\n      </div>\r\n      <div class="slogan">\r\n          <h3>\r\n            {{ Slogan }}\r\n          </h3>\r\n      </div>\r\n  </div>\r\n',styles:[".container{margin-top:19em;margin-left:1em;text-align:center}.container h1{margin:0}.container .slogan,.container .title{color:#fff}"]}]}],v.ctorParameters=function(){return[]},v);function v(){this.Title="Ambl On",this.Slogan="Down the Road, Around the World!"}function M(n,e,t,r){this.Label=n,this.Icon=e,this.Url=t,this.Disabled=r}var x=(I.forRoot=function(){return{ngModule:I,providers:[f]}},I.decorators=[{type:t.NgModule,args:[{declarations:[w,y],imports:[r.CommonModule,i.FlexLayoutModule,u.BrowserAnimationsModule,o.MatMenuModule,a.MatIconModule],exports:[w,y],entryComponents:[w,y]}]}],I);function I(){}n.UsersStateManagerContext=f,n.UsersState=d,n.HamburgerMenuComponent=y,n.LandingPageComponent=w,n.Constants=b,n.HamburgerMenuModel=M,n.LcuAmblOnModule=x,Object.defineProperty(n,"__esModule",{value:!0})});
+!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("@lcu-ide/common"),require("@angular/common"),require("@angular/material/menu"),require("@angular/flex-layout"),require("@angular/platform-browser/animations"),require("@agm/core"),require("@angular/core"),require("@angular/material"),require("@angular/forms")):"function"==typeof define&&define.amd?define("@ambl-on/lcu-ambl-on-common",["exports","@lcu-ide/common","@angular/common","@angular/material/menu","@angular/flex-layout","@angular/platform-browser/animations","@agm/core","@angular/core","@angular/material","@angular/forms"],e):e((t["ambl-on"]=t["ambl-on"]||{},t["ambl-on"]["lcu-ambl-on-common"]={}),t.common,t.ng.common,t.ng.material.menu,t.ng["flex-layout"],t.ng.platformBrowser.animations,t.core,t.ng.core,t.ng.material,t.ng.forms)}(this,function(t,e,n,r,o,a,i,l,c,u){"use strict";var s=function(t,e){return(s=Object.setPrototypeOf||{__proto__:[]}instanceof Array&&function(t,e){t.__proto__=e}||function(t,e){for(var n in e)e.hasOwnProperty(n)&&(t[n]=e[n])})(t,e)};function m(e,i,l,c){return new(l||(l=Promise))(function(t,n){function r(t){try{a(c.next(t))}catch(e){n(e)}}function o(t){try{a(c["throw"](t))}catch(e){n(e)}}function a(e){e.done?t(e.value):new l(function(t){t(e.value)}).then(r,o)}a((c=c.apply(e,i||[])).next())})}function p(r,o){var a,i,l,t,c={label:0,sent:function(){if(1&l[0])throw l[1];return l[1]},trys:[],ops:[]};return t={next:e(0),"throw":e(1),"return":e(2)},"function"==typeof Symbol&&(t[Symbol.iterator]=function(){return this}),t;function e(e){return function(t){return function n(t){if(a)throw new TypeError("Generator is already executing.");for(;c;)try{if(a=1,i&&(l=2&t[0]?i["return"]:t[0]?i["throw"]||((l=i["return"])&&l.call(i),0):i.next)&&!(l=l.call(i,t[1])).done)return l;switch(i=0,l&&(t=[2&t[0],l.value]),t[0]){case 0:case 1:l=t;break;case 4:return c.label++,{value:t[1],done:!1};case 5:c.label++,i=t[1],t=[0];continue;case 7:t=c.ops.pop(),c.trys.pop();continue;default:if(!(l=0<(l=c.trys).length&&l[l.length-1])&&(6===t[0]||2===t[0])){c=0;continue}if(3===t[0]&&(!l||t[1]>l[0]&&t[1]<l[3])){c.label=t[1];break}if(6===t[0]&&c.label<l[1]){c.label=l[1],l=t;break}if(l&&c.label<l[2]){c.label=l[2],c.ops.push(t);break}l[2]&&c.ops.pop(),c.trys.pop();continue}t=o.call(r,c)}catch(e){t=[6,e],i=0}finally{a=l=0}if(5&t[0])throw t[1];return{value:t[0]?t[1]:void 0,done:!0}}([e,t])}}}var d,f=(function U(t,e){function n(){this.constructor=t}s(t,e),t.prototype=null===e?Object.create(e):(n.prototype=e.prototype,new n)}(g,d=e.StateManagerContext),g.prototype.SetActive=function(){},g.prototype.defaultValue=function(){return{Loading:!0}},g.prototype.loadStateKey=function(){return m(this,void 0,void 0,function(){return p(this,function(t){return[2,"main"]})})},g.prototype.loadStateName=function(){return m(this,void 0,void 0,function(){return p(this,function(t){return[2,"users "]})})},g.decorators=[{type:l.Injectable,args:[{providedIn:"root"}]}],g.ctorParameters=function(){return[{type:l.Injector}]},g.ngInjectableDef=l.defineInjectable({factory:function(){return new g(l.inject(l.INJECTOR))},token:g,providedIn:"root"}),g);function g(t){var e=d.call(this,t)||this;return e.injector=t,e}function h(){}var M=(b.VAR_NAMES_MENU=[{Label:"My Atlas",Icon:"public",Url:"www",Disabled:"false"},{Label:"My Itenerarries",Icon:"map",Url:"www",Disabled:"true"},{Label:"My Top Lists",Icon:"sort",Url:"www",Disabled:"true"},{Label:"My Albums",Icon:"photo_library",Url:"www",Disabled:"true"},{Label:"My Friends",Icon:"group",Url:"www",Disabled:"true"},{Label:"My Profile",Icon:"person",Url:"www",Disabled:"true"}],b);function b(){}var y=(v.prototype.ngOnInit=function(){this.MenuItems=M.VAR_NAMES_MENU},v.decorators=[{type:l.Component,args:[{selector:"lcu-hamburger-menu",template:'<nav class="hamburger-nav">\r\n  <button class="hamburger-menu" mat-icon-button [matMenuTriggerFor]="menu">\r\n    <mat-icon>menu</mat-icon>\r\n  </button>\r\n  \x3c!-- Builds the hamburger menu from the item in the constants.ts file--\x3e\r\n  <mat-menu #menu="matMenu">\r\n    <button class="item-button" mat-menu-item  *ngFor= "let item of MenuItems" [disabled]= item.Disabled>\r\n      <mat-icon>{{ item.Icon }}</mat-icon>\r\n      <span>{{ item.Label }}</span>\r\n    </button>\r\n  </mat-menu>\r\n</nav>',styles:[".hamburger-menu{background-color:transparent;border-width:0;outline:0}"]}]}],v);function v(){}var w=(x.prototype.ngOnInit=function(){},x.decorators=[{type:l.Component,args:[{selector:"lcu-landing-page",template:'  <div class="container" fxFlex="100%"\r\n      fxLayout="column" fxLayoutAlign="center start"\r\n      fxLayout.sm="column" fxLayoutAlign.sm="center center"\r\n      fxLayout.xs="column" fxLayoutAlign.xs="center center">\r\n      <div class="title">\r\n        <h1>\r\n          {{ Title }}\r\n        </h1>\r\n      </div>\r\n      <div class="slogan">\r\n          <h3>\r\n            {{ Slogan }}\r\n          </h3>\r\n      </div>\r\n  </div>\r\n',styles:[".container{margin-top:19em;margin-left:1em;margin-bottom:9.3em;text-align:center}.container h1{margin:0}.container .slogan,.container .title{color:#fff}"]}]}],x.ctorParameters=function(){return[]},x);function x(){this.Title="Ambl On",this.Slogan="Down the Road, Around the World!"}function k(t,e,n,r){this.Label=t,this.Icon=e,this.Url=n,this.Disabled=r}var C=(I.prototype.ngOnInit=function(){this.NewMarkerForm=new u.FormGroup({title:new u.FormControl("",{validators:[u.Validators.required]}),icon:new u.FormControl("",{validators:[u.Validators.required]})}),this.NewMarker={title:"",icon:null,lat:40,lng:-100},this.IconList=["bar","brewery","golf course","lodging","museum","national park","restaurant","ski area","UNESCO","vineyard"]},I.prototype.SetMarkerData=function(){this.NewMarker.title=this.NewMarkerForm.value.title,this.NewMarker.icon=this.NewMarkerForm.value.icon,this.NewMarker.lat=this.passedData.lat,this.NewMarker.lng=this.passedData.lng,this.NewMarker.icon=this.convertIconUrl(this.NewMarker.icon),console.log(this.NewMarker.icon)},I.prototype.convertIconUrl=function(t){return{url:"./assets/"+t+".png",scaledSize:{width:40,height:60}}},I.decorators=[{type:l.Component,args:[{selector:"lcu-add-map-marker",template:'<h1 mat-dialog-title>Add a marker here?</h1>\r\n\r\n\r\n<mat-dialog-content>\r\n  <form fxLayout="column" fxLayoutAlign="center center" [formGroup]="NewMarkerForm" fxLayoutGap="30px">\r\n    <h4>Marker Title:</h4>\r\n    <mat-form-field>\r\n      <input type="text" matInput formControlName="title">\r\n      <mat-hint>The title for the map marker</mat-hint>\r\n      <mat-error>Invalid or missing title</mat-error>\r\n    </mat-form-field>\r\n\r\n    <h4>Choose Icon:</h4>\r\n    <mat-form-field>\r\n      <mat-label>Icon</mat-label>\r\n      <mat-select formControlName="icon">\r\n        <mat-option *ngFor="let icon of IconList" [value]="icon">{{icon}}</mat-option>\r\n      </mat-select>\r\n    </mat-form-field>\r\n\r\n  </form>\r\n</mat-dialog-content>\r\n\r\n\r\n<button mat-raised-button color="primary" [mat-dialog-close]="NewMarker" (click)="SetMarkerData()"\r\n  [disabled]="NewMarkerForm.invalid">Add Marker</button>\r\n<button mat-raised-button color="accent" [mat-dialog-close]="false">Cancel</button>',styles:[""]}]}],I.ctorParameters=function(){return[{type:undefined,decorators:[{type:l.Inject,args:[c.MAT_DIALOG_DATA]}]}]},I);function I(t){this.passedData=t}var L=(A.prototype.ngOnInit=function(){this.CurrentMapModel=this.mapModel,this.CurrentMapModel.locationList=this.convertMarkerUrls(this.CurrentMapModel.locationList)},A.prototype.OnChoseLocation=function(t){var e=this;this.dialog.open(C,{data:{lat:t.coords.lat,lng:t.coords.lng}}).afterClosed().subscribe(function(t){t&&e.CurrentMapModel.locationList.push(t)})},A.prototype.convertMarkerUrls=function(t){return t.forEach(function(t){var e="./assets/"+t.icon+".png";t.icon={url:e,scaledSize:{width:40,height:60}}}),t},A.decorators=[{type:l.Component,args:[{selector:"lcu-map",template:'<div class="icon-list">\r\n  <div>\r\n    <div class="top-icon-set">\r\n      <mat-icon class="hamburger-icon">menu</mat-icon>\r\n      <mat-icon class="chevron-icon">chevron_left</mat-icon>\r\n    </div>\r\n    <div class="bottom-icon-set" fxLayoutAlign.lt-sm="flex-start" fxLayoutAlign="space-around" fxLayoutGap.lt-sm="50px">\r\n      <mat-icon>search</mat-icon>\r\n      <mat-icon >add</mat-icon>\r\n      <mat-icon>layers</mat-icon>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<agm-map [latitude]="CurrentMapModel.origin.lat" [longitude]="CurrentMapModel.origin.lng" [title]="CurrentMapModel.title" [zoom]="CurrentMapModel.zoom"\r\n  (mapClick)="OnChoseLocation($event)">\r\n  <div *ngFor="let marker of CurrentMapModel.locationList">\r\n    <agm-marker [latitude]="marker.lat" [longitude]="marker.lng" [title]="marker.title" [iconUrl]="marker.icon"></agm-marker>\r\n  </div>\r\n</agm-map>\r\n\r\n',styles:["mat-icon{font-size:30px}.icon-list{padding:5px}.hamburger-icon{position:absolute;left:10px}@media (max-width:600px){.hamburger-icon{position:relative}}.chevron-icon{position:absolute;right:10px}.bottom-icon-set{width:80%;margin:auto}@media (max-width:600px){.bottom-icon-set{margin-left:10px}}agm-map{height:700px}"]}]}],A.ctorParameters=function(){return[{type:c.MatDialog}]},A.propDecorators={mapModel:[{type:l.Input}]},A);function A(t){this.dialog=t,this.mapModel={title:"Default Title",origin:{lat:40.037757,lng:-105.278324},zoom:13,locationList:[],thumbnailUrl:'https://maps.googleapis.com/maps/api/staticmap?center=63.259591,-144.667969&zoom=6&size=400x400\n      &markers=color:blue%7Clabel:S%7C62.107733,-145.541936&markers=size:tiny%7Ccolor:green%7CDelta+Junction,AK\n      &markers=size:mid%7Ccolor:0xFFFF00%7Clabel:C%7CTok,AK"&key=AIzaSyCvvqYY9pMUpRSKl721rPEiN4KlKIpCImg'}}var N=(S.forRoot=function(){return{ngModule:S,providers:[f]}},S.decorators=[{type:l.NgModule,args:[{declarations:[w,y,L,C],imports:[n.CommonModule,o.FlexLayoutModule,a.BrowserAnimationsModule,r.MatMenuModule,c.MatIconModule,i.AgmCoreModule.forRoot({apiKey:"AIzaSyCvvqYY9pMUpRSKl721rPEiN4KlKIpCImg"}),c.MatIconModule,c.MatSelectModule,c.MatDialogModule,c.MatButtonModule,u.ReactiveFormsModule,c.MatInputModule,c.MatFormFieldModule],exports:[w,y,L,C],entryComponents:[w,y]}]}],S);function S(){}function D(t){this.title=t.title,this.origin=t.origin,this.zoom=t.zoom,this.locationList=t.locationList,this.thumbnailUrl=t.thumbnailUrl}function F(){}t.UsersStateManagerContext=f,t.UsersState=h,t.HamburgerMenuComponent=y,t.LandingPageComponent=w,t.Constants=M,t.HamburgerMenuModel=k,t.LcuAmblOnModule=N,t.IndividualMap=D,t.MapMarker=F,t.MapComponent=L,t.AddMapMarkerComponent=C,Object.defineProperty(t,"__esModule",{value:!0})});
 //# sourceMappingURL=ambl-on-lcu-ambl-on-common.umd.min.js.map

esm2015/ambl-on-lcu-ambl-on-common.js

@@ -8,3 +8,3 @@ /**
  */
-export { UsersStateManagerContext, UsersState, HamburgerMenuComponent, LandingPageComponent, Constants, HamburgerMenuModel, LcuAmblOnModule } from './lcu.api';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYW1ibC1vbi1sY3UtYW1ibC1vbi1jb21tb24uanMiLCJzb3VyY2VSb290Ijoibmc6Ly9AYW1ibC1vbi9sY3UtYW1ibC1vbi1jb21tb24vIiwic291cmNlcyI6WyJhbWJsLW9uLWxjdS1hbWJsLW9uLWNvbW1vbi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7O0FBSUEsbUpBQWMsV0FBVyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBHZW5lcmF0ZWQgYnVuZGxlIGluZGV4LiBEbyBub3QgZWRpdC5cbiAqL1xuXG5leHBvcnQgKiBmcm9tICcuL2xjdS5hcGknO1xuIl19
+export { UsersStateManagerContext, UsersState, HamburgerMenuComponent, LandingPageComponent, Constants, HamburgerMenuModel, LcuAmblOnModule, IndividualMap, MapMarker, MapComponent, AddMapMarkerComponent } from './lcu.api';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYW1ibC1vbi1sY3UtYW1ibC1vbi1jb21tb24uanMiLCJzb3VyY2VSb290Ijoibmc6Ly9AYW1ibC1vbi9sY3UtYW1ibC1vbi1jb21tb24vIiwic291cmNlcyI6WyJhbWJsLW9uLWxjdS1hbWJsLW9uLWNvbW1vbi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7O0FBSUEsa05BQWMsV0FBVyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBHZW5lcmF0ZWQgYnVuZGxlIGluZGV4LiBEbyBub3QgZWRpdC5cbiAqL1xuXG5leHBvcnQgKiBmcm9tICcuL2xjdS5hcGknO1xuIl19

esm2015/lcu.api.js

@@ -12,2 +12,7 @@ /**
 export { LcuAmblOnModule } from './lib/lcu-ambl-on.module';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGN1LmFwaS5qcyIsInNvdXJjZVJvb3QiOiJuZzovL0BhbWJsLW9uL2xjdS1hbWJsLW9uLWNvbW1vbi8iLCJzb3VyY2VzIjpbImxjdS5hcGkudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7OztBQUFBLHlDQUFjLCtDQUErQyxDQUFDO0FBQzlELDJCQUFjLHFDQUFxQyxDQUFDO0FBQ3BELHVDQUFjLHdEQUF3RCxDQUFDO0FBQ3ZFLHFDQUFjLG9EQUFvRCxDQUFDO0FBQ25FLDBCQUFjLGlDQUFpQyxDQUFDO0FBQ2hELG1DQUFjLG1DQUFtQyxDQUFDO0FBQ2xELGdDQUFjLDBCQUEwQixDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiZXhwb3J0ICogZnJvbSAnLi9saWIvc3RhdGUvdXNlcnMvdXNlcnMtc3RhdGUtbWFuYWdlci5jb250ZXh0JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvc3RhdGUvdXNlcnMvdXNlcnMtc3RhdGUubW9kZWwnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb250cm9scy9oYW1idXJnZXItbWVudS9oYW1idXJnZXItbWVudS5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb250cm9scy9sYW5kaW5nLXBhZ2UvbGFuZGluZy1wYWdlLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL3V0aWxzL2NvbnN0YW50cy9jb25zdGFudHMnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9tb2RlbHMvaGFtYnVyZ2VyLW1lbnUubW9kZWwnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9sY3UtYW1ibC1vbi5tb2R1bGUnOyJdfQ==
+// map stuff:
+export { IndividualMap } from './lib/models/individual-map.model';
+export { MapMarker } from './lib/models/map-marker.model';
+export { MapComponent } from './lib/controls/map/map.component';
+export { AddMapMarkerComponent } from './lib/controls/map/add-map-marker/add-map-marker.component';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGN1LmFwaS5qcyIsInNvdXJjZVJvb3QiOiJuZzovL0BhbWJsLW9uL2xjdS1hbWJsLW9uLWNvbW1vbi8iLCJzb3VyY2VzIjpbImxjdS5hcGkudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7OztBQUFBLHlDQUFjLCtDQUErQyxDQUFDO0FBQzlELDJCQUFjLHFDQUFxQyxDQUFDO0FBQ3BELHVDQUFjLHdEQUF3RCxDQUFDO0FBQ3ZFLHFDQUFjLG9EQUFvRCxDQUFDO0FBQ25FLDBCQUFjLGlDQUFpQyxDQUFDO0FBQ2hELG1DQUFjLG1DQUFtQyxDQUFDO0FBQ2xELGdDQUFjLDBCQUEwQixDQUFDOztBQUV6Qyw4QkFBYyxtQ0FBbUMsQ0FBQztBQUNsRCwwQkFBYywrQkFBK0IsQ0FBQztBQUM5Qyw2QkFBYyxrQ0FBa0MsQ0FBQztBQUNqRCxzQ0FBYyw0REFBNEQsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCAqIGZyb20gJy4vbGliL3N0YXRlL3VzZXJzL3VzZXJzLXN0YXRlLW1hbmFnZXIuY29udGV4dCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL3N0YXRlL3VzZXJzL3VzZXJzLXN0YXRlLm1vZGVsJztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvY29udHJvbHMvaGFtYnVyZ2VyLW1lbnUvaGFtYnVyZ2VyLW1lbnUuY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvY29udHJvbHMvbGFuZGluZy1wYWdlL2xhbmRpbmctcGFnZS5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi91dGlscy9jb25zdGFudHMvY29uc3RhbnRzJztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvbW9kZWxzL2hhbWJ1cmdlci1tZW51Lm1vZGVsJztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvbGN1LWFtYmwtb24ubW9kdWxlJztcclxuLy8gbWFwIHN0dWZmOlxyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9tb2RlbHMvaW5kaXZpZHVhbC1tYXAubW9kZWwnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9tb2RlbHMvbWFwLW1hcmtlci5tb2RlbCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbnRyb2xzL21hcC9tYXAuY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvY29udHJvbHMvbWFwL2FkZC1tYXAtbWFya2VyL2FkZC1tYXAtbWFya2VyLmNvbXBvbmVudCc7Il19

esm2015/lib/controls/landing-page/landing-page.component.js

@@ -21,3 +21,3 @@ /**
                 template: "  <div class=\"container\" fxFlex=\"100%\"\r\n      fxLayout=\"column\" fxLayoutAlign=\"center start\"\r\n      fxLayout.sm=\"column\" fxLayoutAlign.sm=\"center center\"\r\n      fxLayout.xs=\"column\" fxLayoutAlign.xs=\"center center\">\r\n      <div class=\"title\">\r\n        <h1>\r\n          {{ Title }}\r\n        </h1>\r\n      </div>\r\n      <div class=\"slogan\">\r\n          <h3>\r\n            {{ Slogan }}\r\n          </h3>\r\n      </div>\r\n  </div>\r\n",
-                styles: [".container{margin-top:19em;margin-left:1em;text-align:center}.container h1{margin:0}.container .slogan,.container .title{color:#fff}"]
+                styles: [".container{margin-top:19em;margin-left:1em;margin-bottom:9.3em;text-align:center}.container h1{margin:0}.container .slogan,.container .title{color:#fff}"]
             }] }
@@ -24,0 +24,0 @@ ];

esm2015/lib/lcu-ambl-on.module.js

@@ -11,5 +11,9 @@ /**
 import { MatMenuModule } from '@angular/material/menu';
-import { MatIconModule } from '@angular/material';
+import { MatIconModule, MatSelectModule, MatDialogModule, MatButtonModule, MatInputModule, MatFormFieldModule } from '@angular/material';
 import { FlexLayoutModule } from '@angular/flex-layout';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import { AgmCoreModule } from '@agm/core';
+import { ReactiveFormsModule } from '@angular/forms';
+import { MapComponent } from './controls/map/map.component';
+import { AddMapMarkerComponent } from './controls/map/add-map-marker/add-map-marker.component';
 export class LcuAmblOnModule {
@@ -28,3 +32,3 @@ /**
     { type: NgModule, args: [{
-                declarations: [LandingPageComponent, HamburgerMenuComponent],
+                declarations: [LandingPageComponent, HamburgerMenuComponent, MapComponent, AddMapMarkerComponent],
                 imports: [
@@ -36,7 +40,15 @@ CommonModule,
                     MatIconModule,
+                    AgmCoreModule.forRoot({ apiKey: 'AIzaSyCvvqYY9pMUpRSKl721rPEiN4KlKIpCImg' }),
+                    MatIconModule,
+                    MatSelectModule,
+                    MatDialogModule,
+                    MatButtonModule,
+                    ReactiveFormsModule,
+                    MatInputModule,
+                    MatFormFieldModule
                 ],
-                exports: [LandingPageComponent, HamburgerMenuComponent],
+                exports: [LandingPageComponent, HamburgerMenuComponent, MapComponent, AddMapMarkerComponent],
                 entryComponents: [LandingPageComponent, HamburgerMenuComponent]
             },] }
 ];
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGN1LWFtYmwtb24ubW9kdWxlLmpzIiwic291cmNlUm9vdCI6Im5nOi8vQGFtYmwtb24vbGN1LWFtYmwtb24tY29tbW9uLyIsInNvdXJjZXMiOlsibGliL2xjdS1hbWJsLW9uLm1vZHVsZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7O0FBQUEsT0FBTyxFQUFFLFFBQVEsRUFBdUIsTUFBTSxlQUFlLENBQUM7QUFDOUQsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSx3QkFBd0IsRUFBRSxNQUFNLDJDQUEyQyxDQUFDO0FBQ3JGLE9BQU8sRUFBRSxvQkFBb0IsRUFBRSxNQUFNLGdEQUFnRCxDQUFDO0FBQ3RGLE9BQU8sRUFBRSxzQkFBc0IsRUFBRSxNQUFNLG9EQUFvRCxDQUFDO0FBQzVGLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQztBQUN2RCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sbUJBQW1CLENBQUM7QUFDbEQsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0sc0JBQXNCLENBQUM7QUFDeEQsT0FBTyxFQUFFLHVCQUF1QixFQUFFLE1BQU0sc0NBQXNDLENBQUM7QUFnQi9FLE1BQU0sT0FBTyxlQUFlOzs7O0lBQzFCLE1BQU0sQ0FBQyxPQUFPO1FBQ1osT0FBTztZQUNMLFFBQVEsRUFBRSxlQUFlO1lBQ3pCLFNBQVMsRUFBRSxDQUFDLHdCQUF3QixDQUFDO1NBQ3RDLENBQUM7SUFDSixDQUFDOzs7WUFsQkYsUUFBUSxTQUFDO2dCQUNSLFlBQVksRUFBRSxDQUFDLG9CQUFvQixFQUFFLHNCQUFzQixDQUFDO2dCQUM1RCxPQUFPLEVBQUU7b0JBQ1AsWUFBWTtvQkFDWixnQkFBZ0I7b0JBQ2hCLHVCQUF1QjtvQkFDdkIsYUFBYTtvQkFDYixhQUFhO2lCQUNkO2dCQUNELE9BQU8sRUFBRSxDQUFDLG9CQUFvQixFQUFFLHNCQUFzQixDQUFDO2dCQUN2RCxlQUFlLEVBQUUsQ0FBQyxvQkFBb0IsRUFBRSxzQkFBc0IsQ0FBQzthQUNoRSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IE5nTW9kdWxlLCBNb2R1bGVXaXRoUHJvdmlkZXJzIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XHJcbmltcG9ydCB7IFVzZXJzU3RhdGVNYW5hZ2VyQ29udGV4dCB9IGZyb20gJy4vc3RhdGUvdXNlcnMvdXNlcnMtc3RhdGUtbWFuYWdlci5jb250ZXh0JztcclxuaW1wb3J0IHsgTGFuZGluZ1BhZ2VDb21wb25lbnQgfSBmcm9tICcuL2NvbnRyb2xzL2xhbmRpbmctcGFnZS9sYW5kaW5nLXBhZ2UuY29tcG9uZW50JztcclxuaW1wb3J0IHsgSGFtYnVyZ2VyTWVudUNvbXBvbmVudCB9IGZyb20gJy4vY29udHJvbHMvaGFtYnVyZ2VyLW1lbnUvaGFtYnVyZ2VyLW1lbnUuY29tcG9uZW50JztcclxuaW1wb3J0IHsgTWF0TWVudU1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL21hdGVyaWFsL21lbnUnO1xyXG5pbXBvcnQgeyBNYXRJY29uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwnO1xyXG5pbXBvcnQgeyBGbGV4TGF5b3V0TW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvZmxleC1sYXlvdXQnO1xyXG5pbXBvcnQgeyBCcm93c2VyQW5pbWF0aW9uc01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL3BsYXRmb3JtLWJyb3dzZXIvYW5pbWF0aW9ucyc7XHJcblxyXG5cclxuXHJcbkBOZ01vZHVsZSh7XHJcbiAgZGVjbGFyYXRpb25zOiBbTGFuZGluZ1BhZ2VDb21wb25lbnQsIEhhbWJ1cmdlck1lbnVDb21wb25lbnRdLFxyXG4gIGltcG9ydHM6IFtcclxuICAgIENvbW1vbk1vZHVsZSxcclxuICAgIEZsZXhMYXlvdXRNb2R1bGUsXHJcbiAgICBCcm93c2VyQW5pbWF0aW9uc01vZHVsZSxcclxuICAgIE1hdE1lbnVNb2R1bGUsXHJcbiAgICBNYXRJY29uTW9kdWxlLFxyXG4gIF0sXHJcbiAgZXhwb3J0czogW0xhbmRpbmdQYWdlQ29tcG9uZW50LCBIYW1idXJnZXJNZW51Q29tcG9uZW50XSxcclxuICBlbnRyeUNvbXBvbmVudHM6IFtMYW5kaW5nUGFnZUNvbXBvbmVudCwgSGFtYnVyZ2VyTWVudUNvbXBvbmVudF1cclxufSlcclxuZXhwb3J0IGNsYXNzIExjdUFtYmxPbk1vZHVsZSB7XHJcbiAgc3RhdGljIGZvclJvb3QoKTogTW9kdWxlV2l0aFByb3ZpZGVycyB7XHJcbiAgICByZXR1cm4ge1xyXG4gICAgICBuZ01vZHVsZTogTGN1QW1ibE9uTW9kdWxlLFxyXG4gICAgICBwcm92aWRlcnM6IFtVc2Vyc1N0YXRlTWFuYWdlckNvbnRleHRdXHJcbiAgICB9O1xyXG4gIH1cclxufVxyXG4iXX0=
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGN1LWFtYmwtb24ubW9kdWxlLmpzIiwic291cmNlUm9vdCI6Im5nOi8vQGFtYmwtb24vbGN1LWFtYmwtb24tY29tbW9uLyIsInNvdXJjZXMiOlsibGliL2xjdS1hbWJsLW9uLm1vZHVsZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7O0FBQUEsT0FBTyxFQUFFLFFBQVEsRUFBdUIsTUFBTSxlQUFlLENBQUM7QUFDOUQsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSx3QkFBd0IsRUFBRSxNQUFNLDJDQUEyQyxDQUFDO0FBQ3JGLE9BQU8sRUFBRSxvQkFBb0IsRUFBRSxNQUFNLGdEQUFnRCxDQUFDO0FBQ3RGLE9BQU8sRUFBRSxzQkFBc0IsRUFBRSxNQUFNLG9EQUFvRCxDQUFDO0FBQzVGLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQztBQUN2RCxPQUFPLEVBQUUsYUFBYSxFQUFFLGVBQWUsRUFBRSxlQUFlLEVBQUUsZUFBZSxFQUFFLGNBQWMsRUFBRSxrQkFBa0IsRUFBRSxNQUFNLG1CQUFtQixDQUFDO0FBQ3pJLE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSxNQUFNLHNCQUFzQixDQUFDO0FBQ3hELE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxNQUFNLHNDQUFzQyxDQUFDO0FBQy9FLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxXQUFXLENBQUM7QUFDMUMsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDckQsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLDhCQUE4QixDQUFDO0FBQzVELE9BQU8sRUFBRSxxQkFBcUIsRUFBRSxNQUFNLHdEQUF3RCxDQUFDO0FBd0IvRixNQUFNLE9BQU8sZUFBZTs7OztJQUMxQixNQUFNLENBQUMsT0FBTztRQUNaLE9BQU87WUFDTCxRQUFRLEVBQUUsZUFBZTtZQUN6QixTQUFTLEVBQUUsQ0FBQyx3QkFBd0IsQ0FBQztTQUN0QyxDQUFDO0lBQ0osQ0FBQzs7O1lBMUJGLFFBQVEsU0FBQztnQkFDUixZQUFZLEVBQUUsQ0FBQyxvQkFBb0IsRUFBRSxzQkFBc0IsRUFBRSxZQUFZLEVBQUUscUJBQXFCLENBQUM7Z0JBQ2pHLE9BQU8sRUFBRTtvQkFDUCxZQUFZO29CQUNaLGdCQUFnQjtvQkFDaEIsdUJBQXVCO29CQUN2QixhQUFhO29CQUNiLGFBQWE7b0JBQ2IsYUFBYSxDQUFDLE9BQU8sQ0FBQyxFQUFDLE1BQU0sRUFBRSx5Q0FBeUMsRUFBQyxDQUFDO29CQUMxRSxhQUFhO29CQUNiLGVBQWU7b0JBQ2YsZUFBZTtvQkFDZixlQUFlO29CQUNmLG1CQUFtQjtvQkFDbkIsY0FBYztvQkFDZCxrQkFBa0I7aUJBQ25CO2dCQUNELE9BQU8sRUFBRSxDQUFDLG9CQUFvQixFQUFFLHNCQUFzQixFQUFFLFlBQVksRUFBRSxxQkFBcUIsQ0FBQztnQkFDNUYsZUFBZSxFQUFFLENBQUMsb0JBQW9CLEVBQUUsc0JBQXNCLENBQUM7YUFDaEUiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBOZ01vZHVsZSwgTW9kdWxlV2l0aFByb3ZpZGVycyB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xyXG5pbXBvcnQgeyBVc2Vyc1N0YXRlTWFuYWdlckNvbnRleHQgfSBmcm9tICcuL3N0YXRlL3VzZXJzL3VzZXJzLXN0YXRlLW1hbmFnZXIuY29udGV4dCc7XHJcbmltcG9ydCB7IExhbmRpbmdQYWdlQ29tcG9uZW50IH0gZnJvbSAnLi9jb250cm9scy9sYW5kaW5nLXBhZ2UvbGFuZGluZy1wYWdlLmNvbXBvbmVudCc7XHJcbmltcG9ydCB7IEhhbWJ1cmdlck1lbnVDb21wb25lbnQgfSBmcm9tICcuL2NvbnRyb2xzL2hhbWJ1cmdlci1tZW51L2hhbWJ1cmdlci1tZW51LmNvbXBvbmVudCc7XHJcbmltcG9ydCB7IE1hdE1lbnVNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9tZW51JztcclxuaW1wb3J0IHsgTWF0SWNvbk1vZHVsZSwgTWF0U2VsZWN0TW9kdWxlLCBNYXREaWFsb2dNb2R1bGUsIE1hdEJ1dHRvbk1vZHVsZSwgTWF0SW5wdXRNb2R1bGUsIE1hdEZvcm1GaWVsZE1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL21hdGVyaWFsJztcclxuaW1wb3J0IHsgRmxleExheW91dE1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2ZsZXgtbGF5b3V0JztcclxuaW1wb3J0IHsgQnJvd3NlckFuaW1hdGlvbnNNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9wbGF0Zm9ybS1icm93c2VyL2FuaW1hdGlvbnMnO1xyXG5pbXBvcnQgeyBBZ21Db3JlTW9kdWxlIH0gZnJvbSAnQGFnbS9jb3JlJztcclxuaW1wb3J0IHsgUmVhY3RpdmVGb3Jtc01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2Zvcm1zJztcclxuaW1wb3J0IHsgTWFwQ29tcG9uZW50IH0gZnJvbSAnLi9jb250cm9scy9tYXAvbWFwLmNvbXBvbmVudCc7XHJcbmltcG9ydCB7IEFkZE1hcE1hcmtlckNvbXBvbmVudCB9IGZyb20gJy4vY29udHJvbHMvbWFwL2FkZC1tYXAtbWFya2VyL2FkZC1tYXAtbWFya2VyLmNvbXBvbmVudCc7XHJcblxyXG5cclxuXHJcbkBOZ01vZHVsZSh7XHJcbiAgZGVjbGFyYXRpb25zOiBbTGFuZGluZ1BhZ2VDb21wb25lbnQsIEhhbWJ1cmdlck1lbnVDb21wb25lbnQsIE1hcENvbXBvbmVudCwgQWRkTWFwTWFya2VyQ29tcG9uZW50XSxcclxuICBpbXBvcnRzOiBbXHJcbiAgICBDb21tb25Nb2R1bGUsXHJcbiAgICBGbGV4TGF5b3V0TW9kdWxlLFxyXG4gICAgQnJvd3NlckFuaW1hdGlvbnNNb2R1bGUsXHJcbiAgICBNYXRNZW51TW9kdWxlLFxyXG4gICAgTWF0SWNvbk1vZHVsZSxcclxuICAgIEFnbUNvcmVNb2R1bGUuZm9yUm9vdCh7YXBpS2V5OiAnQUl6YVN5Q3Z2cVlZOXBNVXBSU0tsNzIxclBFaU40S2xLSXBDSW1nJ30pLFxyXG4gICAgTWF0SWNvbk1vZHVsZSxcclxuICAgIE1hdFNlbGVjdE1vZHVsZSxcclxuICAgIE1hdERpYWxvZ01vZHVsZSxcclxuICAgIE1hdEJ1dHRvbk1vZHVsZSxcclxuICAgIFJlYWN0aXZlRm9ybXNNb2R1bGUsXHJcbiAgICBNYXRJbnB1dE1vZHVsZSxcclxuICAgIE1hdEZvcm1GaWVsZE1vZHVsZVxyXG4gIF0sXHJcbiAgZXhwb3J0czogW0xhbmRpbmdQYWdlQ29tcG9uZW50LCBIYW1idXJnZXJNZW51Q29tcG9uZW50LCBNYXBDb21wb25lbnQsIEFkZE1hcE1hcmtlckNvbXBvbmVudF0sXHJcbiAgZW50cnlDb21wb25lbnRzOiBbTGFuZGluZ1BhZ2VDb21wb25lbnQsIEhhbWJ1cmdlck1lbnVDb21wb25lbnRdXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBMY3VBbWJsT25Nb2R1bGUge1xyXG4gIHN0YXRpYyBmb3JSb290KCk6IE1vZHVsZVdpdGhQcm92aWRlcnMge1xyXG4gICAgcmV0dXJuIHtcclxuICAgICAgbmdNb2R1bGU6IExjdUFtYmxPbk1vZHVsZSxcclxuICAgICAgcHJvdmlkZXJzOiBbVXNlcnNTdGF0ZU1hbmFnZXJDb250ZXh0XVxyXG4gICAgfTtcclxuICB9XHJcbn1cclxuIl19

esm5/ambl-on-lcu-ambl-on-common.js

@@ -8,3 +8,3 @@ /**
  */
-export { UsersStateManagerContext, UsersState, HamburgerMenuComponent, LandingPageComponent, Constants, HamburgerMenuModel, LcuAmblOnModule } from './lcu.api';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYW1ibC1vbi1sY3UtYW1ibC1vbi1jb21tb24uanMiLCJzb3VyY2VSb290Ijoibmc6Ly9AYW1ibC1vbi9sY3UtYW1ibC1vbi1jb21tb24vIiwic291cmNlcyI6WyJhbWJsLW9uLWxjdS1hbWJsLW9uLWNvbW1vbi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7O0FBSUEsbUpBQWMsV0FBVyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBHZW5lcmF0ZWQgYnVuZGxlIGluZGV4LiBEbyBub3QgZWRpdC5cbiAqL1xuXG5leHBvcnQgKiBmcm9tICcuL2xjdS5hcGknO1xuIl19
+export { UsersStateManagerContext, UsersState, HamburgerMenuComponent, LandingPageComponent, Constants, HamburgerMenuModel, LcuAmblOnModule, IndividualMap, MapMarker, MapComponent, AddMapMarkerComponent } from './lcu.api';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYW1ibC1vbi1sY3UtYW1ibC1vbi1jb21tb24uanMiLCJzb3VyY2VSb290Ijoibmc6Ly9AYW1ibC1vbi9sY3UtYW1ibC1vbi1jb21tb24vIiwic291cmNlcyI6WyJhbWJsLW9uLWxjdS1hbWJsLW9uLWNvbW1vbi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7Ozs7O0FBSUEsa05BQWMsV0FBVyxDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiLyoqXG4gKiBHZW5lcmF0ZWQgYnVuZGxlIGluZGV4LiBEbyBub3QgZWRpdC5cbiAqL1xuXG5leHBvcnQgKiBmcm9tICcuL2xjdS5hcGknO1xuIl19

esm5/lcu.api.js

@@ -12,2 +12,7 @@ /**
 export { LcuAmblOnModule } from './lib/lcu-ambl-on.module';
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGN1LmFwaS5qcyIsInNvdXJjZVJvb3QiOiJuZzovL0BhbWJsLW9uL2xjdS1hbWJsLW9uLWNvbW1vbi8iLCJzb3VyY2VzIjpbImxjdS5hcGkudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7OztBQUFBLHlDQUFjLCtDQUErQyxDQUFDO0FBQzlELDJCQUFjLHFDQUFxQyxDQUFDO0FBQ3BELHVDQUFjLHdEQUF3RCxDQUFDO0FBQ3ZFLHFDQUFjLG9EQUFvRCxDQUFDO0FBQ25FLDBCQUFjLGlDQUFpQyxDQUFDO0FBQ2hELG1DQUFjLG1DQUFtQyxDQUFDO0FBQ2xELGdDQUFjLDBCQUEwQixDQUFDIiwic291cmNlc0NvbnRlbnQiOlsiZXhwb3J0ICogZnJvbSAnLi9saWIvc3RhdGUvdXNlcnMvdXNlcnMtc3RhdGUtbWFuYWdlci5jb250ZXh0JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvc3RhdGUvdXNlcnMvdXNlcnMtc3RhdGUubW9kZWwnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb250cm9scy9oYW1idXJnZXItbWVudS9oYW1idXJnZXItbWVudS5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb250cm9scy9sYW5kaW5nLXBhZ2UvbGFuZGluZy1wYWdlLmNvbXBvbmVudCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL3V0aWxzL2NvbnN0YW50cy9jb25zdGFudHMnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9tb2RlbHMvaGFtYnVyZ2VyLW1lbnUubW9kZWwnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9sY3UtYW1ibC1vbi5tb2R1bGUnOyJdfQ==
+// map stuff:
+export { IndividualMap } from './lib/models/individual-map.model';
+export { MapMarker } from './lib/models/map-marker.model';
+export { MapComponent } from './lib/controls/map/map.component';
+export { AddMapMarkerComponent } from './lib/controls/map/add-map-marker/add-map-marker.component';
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGN1LmFwaS5qcyIsInNvdXJjZVJvb3QiOiJuZzovL0BhbWJsLW9uL2xjdS1hbWJsLW9uLWNvbW1vbi8iLCJzb3VyY2VzIjpbImxjdS5hcGkudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7OztBQUFBLHlDQUFjLCtDQUErQyxDQUFDO0FBQzlELDJCQUFjLHFDQUFxQyxDQUFDO0FBQ3BELHVDQUFjLHdEQUF3RCxDQUFDO0FBQ3ZFLHFDQUFjLG9EQUFvRCxDQUFDO0FBQ25FLDBCQUFjLGlDQUFpQyxDQUFDO0FBQ2hELG1DQUFjLG1DQUFtQyxDQUFDO0FBQ2xELGdDQUFjLDBCQUEwQixDQUFDOztBQUV6Qyw4QkFBYyxtQ0FBbUMsQ0FBQztBQUNsRCwwQkFBYywrQkFBK0IsQ0FBQztBQUM5Qyw2QkFBYyxrQ0FBa0MsQ0FBQztBQUNqRCxzQ0FBYyw0REFBNEQsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCAqIGZyb20gJy4vbGliL3N0YXRlL3VzZXJzL3VzZXJzLXN0YXRlLW1hbmFnZXIuY29udGV4dCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL3N0YXRlL3VzZXJzL3VzZXJzLXN0YXRlLm1vZGVsJztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvY29udHJvbHMvaGFtYnVyZ2VyLW1lbnUvaGFtYnVyZ2VyLW1lbnUuY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvY29udHJvbHMvbGFuZGluZy1wYWdlL2xhbmRpbmctcGFnZS5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi91dGlscy9jb25zdGFudHMvY29uc3RhbnRzJztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvbW9kZWxzL2hhbWJ1cmdlci1tZW51Lm1vZGVsJztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvbGN1LWFtYmwtb24ubW9kdWxlJztcclxuLy8gbWFwIHN0dWZmOlxyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9tb2RlbHMvaW5kaXZpZHVhbC1tYXAubW9kZWwnO1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9tb2RlbHMvbWFwLW1hcmtlci5tb2RlbCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbnRyb2xzL21hcC9tYXAuY29tcG9uZW50JztcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvY29udHJvbHMvbWFwL2FkZC1tYXAtbWFya2VyL2FkZC1tYXAtbWFya2VyLmNvbXBvbmVudCc7Il19

esm5/lib/controls/landing-page/landing-page.component.js

@@ -23,3 +23,3 @@ /**
                     template: "  <div class=\"container\" fxFlex=\"100%\"\r\n      fxLayout=\"column\" fxLayoutAlign=\"center start\"\r\n      fxLayout.sm=\"column\" fxLayoutAlign.sm=\"center center\"\r\n      fxLayout.xs=\"column\" fxLayoutAlign.xs=\"center center\">\r\n      <div class=\"title\">\r\n        <h1>\r\n          {{ Title }}\r\n        </h1>\r\n      </div>\r\n      <div class=\"slogan\">\r\n          <h3>\r\n            {{ Slogan }}\r\n          </h3>\r\n      </div>\r\n  </div>\r\n",
-                    styles: [".container{margin-top:19em;margin-left:1em;text-align:center}.container h1{margin:0}.container .slogan,.container .title{color:#fff}"]
+                    styles: [".container{margin-top:19em;margin-left:1em;margin-bottom:9.3em;text-align:center}.container h1{margin:0}.container .slogan,.container .title{color:#fff}"]
                 }] }
@@ -26,0 +26,0 @@ ];

esm5/lib/lcu-ambl-on.module.js

@@ -11,5 +11,9 @@ /**
 import { MatMenuModule } from '@angular/material/menu';
-import { MatIconModule } from '@angular/material';
+import { MatIconModule, MatSelectModule, MatDialogModule, MatButtonModule, MatInputModule, MatFormFieldModule } from '@angular/material';
 import { FlexLayoutModule } from '@angular/flex-layout';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import { AgmCoreModule } from '@agm/core';
+import { ReactiveFormsModule } from '@angular/forms';
+import { MapComponent } from './controls/map/map.component';
+import { AddMapMarkerComponent } from './controls/map/add-map-marker/add-map-marker.component';
 var LcuAmblOnModule = /** @class */ (function () {
@@ -32,3 +36,3 @@ function LcuAmblOnModule() {
         { type: NgModule, args: [{
-                    declarations: [LandingPageComponent, HamburgerMenuComponent],
+                    declarations: [LandingPageComponent, HamburgerMenuComponent, MapComponent, AddMapMarkerComponent],
                     imports: [
@@ -40,4 +44,12 @@ CommonModule,
                         MatIconModule,
+                        AgmCoreModule.forRoot({ apiKey: 'AIzaSyCvvqYY9pMUpRSKl721rPEiN4KlKIpCImg' }),
+                        MatIconModule,
+                        MatSelectModule,
+                        MatDialogModule,
+                        MatButtonModule,
+                        ReactiveFormsModule,
+                        MatInputModule,
+                        MatFormFieldModule
                     ],
-                    exports: [LandingPageComponent, HamburgerMenuComponent],
+                    exports: [LandingPageComponent, HamburgerMenuComponent, MapComponent, AddMapMarkerComponent],
                     entryComponents: [LandingPageComponent, HamburgerMenuComponent]
@@ -49,2 +61,2 @@ },] }
 export { LcuAmblOnModule };
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGN1LWFtYmwtb24ubW9kdWxlLmpzIiwic291cmNlUm9vdCI6Im5nOi8vQGFtYmwtb24vbGN1LWFtYmwtb24tY29tbW9uLyIsInNvdXJjZXMiOlsibGliL2xjdS1hbWJsLW9uLm1vZHVsZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7O0FBQUEsT0FBTyxFQUFFLFFBQVEsRUFBdUIsTUFBTSxlQUFlLENBQUM7QUFDOUQsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSx3QkFBd0IsRUFBRSxNQUFNLDJDQUEyQyxDQUFDO0FBQ3JGLE9BQU8sRUFBRSxvQkFBb0IsRUFBRSxNQUFNLGdEQUFnRCxDQUFDO0FBQ3RGLE9BQU8sRUFBRSxzQkFBc0IsRUFBRSxNQUFNLG9EQUFvRCxDQUFDO0FBQzVGLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQztBQUN2RCxPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sbUJBQW1CLENBQUM7QUFDbEQsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0sc0JBQXNCLENBQUM7QUFDeEQsT0FBTyxFQUFFLHVCQUF1QixFQUFFLE1BQU0sc0NBQXNDLENBQUM7QUFJL0U7SUFBQTtJQW1CQSxDQUFDOzs7O0lBTlEsdUJBQU87OztJQUFkO1FBQ0UsT0FBTztZQUNMLFFBQVEsRUFBRSxlQUFlO1lBQ3pCLFNBQVMsRUFBRSxDQUFDLHdCQUF3QixDQUFDO1NBQ3RDLENBQUM7SUFDSixDQUFDOztnQkFsQkYsUUFBUSxTQUFDO29CQUNSLFlBQVksRUFBRSxDQUFDLG9CQUFvQixFQUFFLHNCQUFzQixDQUFDO29CQUM1RCxPQUFPLEVBQUU7d0JBQ1AsWUFBWTt3QkFDWixnQkFBZ0I7d0JBQ2hCLHVCQUF1Qjt3QkFDdkIsYUFBYTt3QkFDYixhQUFhO3FCQUNkO29CQUNELE9BQU8sRUFBRSxDQUFDLG9CQUFvQixFQUFFLHNCQUFzQixDQUFDO29CQUN2RCxlQUFlLEVBQUUsQ0FBQyxvQkFBb0IsRUFBRSxzQkFBc0IsQ0FBQztpQkFDaEU7O0lBUUQsc0JBQUM7Q0FBQSxBQW5CRCxJQW1CQztTQVBZLGVBQWUiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBOZ01vZHVsZSwgTW9kdWxlV2l0aFByb3ZpZGVycyB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xyXG5pbXBvcnQgeyBVc2Vyc1N0YXRlTWFuYWdlckNvbnRleHQgfSBmcm9tICcuL3N0YXRlL3VzZXJzL3VzZXJzLXN0YXRlLW1hbmFnZXIuY29udGV4dCc7XHJcbmltcG9ydCB7IExhbmRpbmdQYWdlQ29tcG9uZW50IH0gZnJvbSAnLi9jb250cm9scy9sYW5kaW5nLXBhZ2UvbGFuZGluZy1wYWdlLmNvbXBvbmVudCc7XHJcbmltcG9ydCB7IEhhbWJ1cmdlck1lbnVDb21wb25lbnQgfSBmcm9tICcuL2NvbnRyb2xzL2hhbWJ1cmdlci1tZW51L2hhbWJ1cmdlci1tZW51LmNvbXBvbmVudCc7XHJcbmltcG9ydCB7IE1hdE1lbnVNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9tZW51JztcclxuaW1wb3J0IHsgTWF0SWNvbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL21hdGVyaWFsJztcclxuaW1wb3J0IHsgRmxleExheW91dE1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2ZsZXgtbGF5b3V0JztcclxuaW1wb3J0IHsgQnJvd3NlckFuaW1hdGlvbnNNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9wbGF0Zm9ybS1icm93c2VyL2FuaW1hdGlvbnMnO1xyXG5cclxuXHJcblxyXG5ATmdNb2R1bGUoe1xyXG4gIGRlY2xhcmF0aW9uczogW0xhbmRpbmdQYWdlQ29tcG9uZW50LCBIYW1idXJnZXJNZW51Q29tcG9uZW50XSxcclxuICBpbXBvcnRzOiBbXHJcbiAgICBDb21tb25Nb2R1bGUsXHJcbiAgICBGbGV4TGF5b3V0TW9kdWxlLFxyXG4gICAgQnJvd3NlckFuaW1hdGlvbnNNb2R1bGUsXHJcbiAgICBNYXRNZW51TW9kdWxlLFxyXG4gICAgTWF0SWNvbk1vZHVsZSxcclxuICBdLFxyXG4gIGV4cG9ydHM6IFtMYW5kaW5nUGFnZUNvbXBvbmVudCwgSGFtYnVyZ2VyTWVudUNvbXBvbmVudF0sXHJcbiAgZW50cnlDb21wb25lbnRzOiBbTGFuZGluZ1BhZ2VDb21wb25lbnQsIEhhbWJ1cmdlck1lbnVDb21wb25lbnRdXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBMY3VBbWJsT25Nb2R1bGUge1xyXG4gIHN0YXRpYyBmb3JSb290KCk6IE1vZHVsZVdpdGhQcm92aWRlcnMge1xyXG4gICAgcmV0dXJuIHtcclxuICAgICAgbmdNb2R1bGU6IExjdUFtYmxPbk1vZHVsZSxcclxuICAgICAgcHJvdmlkZXJzOiBbVXNlcnNTdGF0ZU1hbmFnZXJDb250ZXh0XVxyXG4gICAgfTtcclxuICB9XHJcbn1cclxuIl19
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGN1LWFtYmwtb24ubW9kdWxlLmpzIiwic291cmNlUm9vdCI6Im5nOi8vQGFtYmwtb24vbGN1LWFtYmwtb24tY29tbW9uLyIsInNvdXJjZXMiOlsibGliL2xjdS1hbWJsLW9uLm1vZHVsZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7O0FBQUEsT0FBTyxFQUFFLFFBQVEsRUFBdUIsTUFBTSxlQUFlLENBQUM7QUFDOUQsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSx3QkFBd0IsRUFBRSxNQUFNLDJDQUEyQyxDQUFDO0FBQ3JGLE9BQU8sRUFBRSxvQkFBb0IsRUFBRSxNQUFNLGdEQUFnRCxDQUFDO0FBQ3RGLE9BQU8sRUFBRSxzQkFBc0IsRUFBRSxNQUFNLG9EQUFvRCxDQUFDO0FBQzVGLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQztBQUN2RCxPQUFPLEVBQUUsYUFBYSxFQUFFLGVBQWUsRUFBRSxlQUFlLEVBQUUsZUFBZSxFQUFFLGNBQWMsRUFBRSxrQkFBa0IsRUFBRSxNQUFNLG1CQUFtQixDQUFDO0FBQ3pJLE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSxNQUFNLHNCQUFzQixDQUFDO0FBQ3hELE9BQU8sRUFBRSx1QkFBdUIsRUFBRSxNQUFNLHNDQUFzQyxDQUFDO0FBQy9FLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSxXQUFXLENBQUM7QUFDMUMsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFDckQsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLDhCQUE4QixDQUFDO0FBQzVELE9BQU8sRUFBRSxxQkFBcUIsRUFBRSxNQUFNLHdEQUF3RCxDQUFDO0FBSS9GO0lBQUE7SUEyQkEsQ0FBQzs7OztJQU5RLHVCQUFPOzs7SUFBZDtRQUNFLE9BQU87WUFDTCxRQUFRLEVBQUUsZUFBZTtZQUN6QixTQUFTLEVBQUUsQ0FBQyx3QkFBd0IsQ0FBQztTQUN0QyxDQUFDO0lBQ0osQ0FBQzs7Z0JBMUJGLFFBQVEsU0FBQztvQkFDUixZQUFZLEVBQUUsQ0FBQyxvQkFBb0IsRUFBRSxzQkFBc0IsRUFBRSxZQUFZLEVBQUUscUJBQXFCLENBQUM7b0JBQ2pHLE9BQU8sRUFBRTt3QkFDUCxZQUFZO3dCQUNaLGdCQUFnQjt3QkFDaEIsdUJBQXVCO3dCQUN2QixhQUFhO3dCQUNiLGFBQWE7d0JBQ2IsYUFBYSxDQUFDLE9BQU8sQ0FBQyxFQUFDLE1BQU0sRUFBRSx5Q0FBeUMsRUFBQyxDQUFDO3dCQUMxRSxhQUFhO3dCQUNiLGVBQWU7d0JBQ2YsZUFBZTt3QkFDZixlQUFlO3dCQUNmLG1CQUFtQjt3QkFDbkIsY0FBYzt3QkFDZCxrQkFBa0I7cUJBQ25CO29CQUNELE9BQU8sRUFBRSxDQUFDLG9CQUFvQixFQUFFLHNCQUFzQixFQUFFLFlBQVksRUFBRSxxQkFBcUIsQ0FBQztvQkFDNUYsZUFBZSxFQUFFLENBQUMsb0JBQW9CLEVBQUUsc0JBQXNCLENBQUM7aUJBQ2hFOztJQVFELHNCQUFDO0NBQUEsQUEzQkQsSUEyQkM7U0FQWSxlQUFlIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgTmdNb2R1bGUsIE1vZHVsZVdpdGhQcm92aWRlcnMgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcclxuaW1wb3J0IHsgVXNlcnNTdGF0ZU1hbmFnZXJDb250ZXh0IH0gZnJvbSAnLi9zdGF0ZS91c2Vycy91c2Vycy1zdGF0ZS1tYW5hZ2VyLmNvbnRleHQnO1xyXG5pbXBvcnQgeyBMYW5kaW5nUGFnZUNvbXBvbmVudCB9IGZyb20gJy4vY29udHJvbHMvbGFuZGluZy1wYWdlL2xhbmRpbmctcGFnZS5jb21wb25lbnQnO1xyXG5pbXBvcnQgeyBIYW1idXJnZXJNZW51Q29tcG9uZW50IH0gZnJvbSAnLi9jb250cm9scy9oYW1idXJnZXItbWVudS9oYW1idXJnZXItbWVudS5jb21wb25lbnQnO1xyXG5pbXBvcnQgeyBNYXRNZW51TW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvbWF0ZXJpYWwvbWVudSc7XHJcbmltcG9ydCB7IE1hdEljb25Nb2R1bGUsIE1hdFNlbGVjdE1vZHVsZSwgTWF0RGlhbG9nTW9kdWxlLCBNYXRCdXR0b25Nb2R1bGUsIE1hdElucHV0TW9kdWxlLCBNYXRGb3JtRmllbGRNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbCc7XHJcbmltcG9ydCB7IEZsZXhMYXlvdXRNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9mbGV4LWxheW91dCc7XHJcbmltcG9ydCB7IEJyb3dzZXJBbmltYXRpb25zTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvcGxhdGZvcm0tYnJvd3Nlci9hbmltYXRpb25zJztcclxuaW1wb3J0IHsgQWdtQ29yZU1vZHVsZSB9IGZyb20gJ0BhZ20vY29yZSc7XHJcbmltcG9ydCB7IFJlYWN0aXZlRm9ybXNNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XHJcbmltcG9ydCB7IE1hcENvbXBvbmVudCB9IGZyb20gJy4vY29udHJvbHMvbWFwL21hcC5jb21wb25lbnQnO1xyXG5pbXBvcnQgeyBBZGRNYXBNYXJrZXJDb21wb25lbnQgfSBmcm9tICcuL2NvbnRyb2xzL21hcC9hZGQtbWFwLW1hcmtlci9hZGQtbWFwLW1hcmtlci5jb21wb25lbnQnO1xyXG5cclxuXHJcblxyXG5ATmdNb2R1bGUoe1xyXG4gIGRlY2xhcmF0aW9uczogW0xhbmRpbmdQYWdlQ29tcG9uZW50LCBIYW1idXJnZXJNZW51Q29tcG9uZW50LCBNYXBDb21wb25lbnQsIEFkZE1hcE1hcmtlckNvbXBvbmVudF0sXHJcbiAgaW1wb3J0czogW1xyXG4gICAgQ29tbW9uTW9kdWxlLFxyXG4gICAgRmxleExheW91dE1vZHVsZSxcclxuICAgIEJyb3dzZXJBbmltYXRpb25zTW9kdWxlLFxyXG4gICAgTWF0TWVudU1vZHVsZSxcclxuICAgIE1hdEljb25Nb2R1bGUsXHJcbiAgICBBZ21Db3JlTW9kdWxlLmZvclJvb3Qoe2FwaUtleTogJ0FJemFTeUN2dnFZWTlwTVVwUlNLbDcyMXJQRWlONEtsS0lwQ0ltZyd9KSxcclxuICAgIE1hdEljb25Nb2R1bGUsXHJcbiAgICBNYXRTZWxlY3RNb2R1bGUsXHJcbiAgICBNYXREaWFsb2dNb2R1bGUsXHJcbiAgICBNYXRCdXR0b25Nb2R1bGUsXHJcbiAgICBSZWFjdGl2ZUZvcm1zTW9kdWxlLFxyXG4gICAgTWF0SW5wdXRNb2R1bGUsXHJcbiAgICBNYXRGb3JtRmllbGRNb2R1bGVcclxuICBdLFxyXG4gIGV4cG9ydHM6IFtMYW5kaW5nUGFnZUNvbXBvbmVudCwgSGFtYnVyZ2VyTWVudUNvbXBvbmVudCwgTWFwQ29tcG9uZW50LCBBZGRNYXBNYXJrZXJDb21wb25lbnRdLFxyXG4gIGVudHJ5Q29tcG9uZW50czogW0xhbmRpbmdQYWdlQ29tcG9uZW50LCBIYW1idXJnZXJNZW51Q29tcG9uZW50XVxyXG59KVxyXG5leHBvcnQgY2xhc3MgTGN1QW1ibE9uTW9kdWxlIHtcclxuICBzdGF0aWMgZm9yUm9vdCgpOiBNb2R1bGVXaXRoUHJvdmlkZXJzIHtcclxuICAgIHJldHVybiB7XHJcbiAgICAgIG5nTW9kdWxlOiBMY3VBbWJsT25Nb2R1bGUsXHJcbiAgICAgIHByb3ZpZGVyczogW1VzZXJzU3RhdGVNYW5hZ2VyQ29udGV4dF1cclxuICAgIH07XHJcbiAgfVxyXG59XHJcbiJdfQ==

fesm2015/ambl-on-lcu-ambl-on-common.js

 import { __awaiter } from 'tslib';
 import { StateManagerContext } from '@lcu-ide/common';
-import { Injectable, Injector, NgModule, Component, defineInjectable, inject, INJECTOR } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { MatMenuModule } from '@angular/material/menu';
-import { MatIconModule } from '@angular/material';
 import { FlexLayoutModule } from '@angular/flex-layout';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import { AgmCoreModule } from '@agm/core';
+import { Injectable, Injector, NgModule, Component, Inject, Input, defineInjectable, inject, INJECTOR } from '@angular/core';
+import { MAT_DIALOG_DATA, MatDialog, MatIconModule, MatSelectModule, MatDialogModule, MatButtonModule, MatInputModule, MatFormFieldModule } from '@angular/material';
+import { FormGroup, FormControl, Validators, ReactiveFormsModule } from '@angular/forms';
 
@@ -144,3 +146,3 @@ /**
                 template: "  <div class=\"container\" fxFlex=\"100%\"\r\n      fxLayout=\"column\" fxLayoutAlign=\"center start\"\r\n      fxLayout.sm=\"column\" fxLayoutAlign.sm=\"center center\"\r\n      fxLayout.xs=\"column\" fxLayoutAlign.xs=\"center center\">\r\n      <div class=\"title\">\r\n        <h1>\r\n          {{ Title }}\r\n        </h1>\r\n      </div>\r\n      <div class=\"slogan\">\r\n          <h3>\r\n            {{ Slogan }}\r\n          </h3>\r\n      </div>\r\n  </div>\r\n",
-                styles: [".container{margin-top:19em;margin-left:1em;text-align:center}.container h1{margin:0}.container .slogan,.container .title{color:#fff}"]
+                styles: [".container{margin-top:19em;margin-left:1em;margin-bottom:9.3em;text-align:center}.container h1{margin:0}.container .slogan,.container .title{color:#fff}"]
             }] }
@@ -178,2 +180,193 @@ ];
  */
+class IndividualMap {
+    /**
+     * @param {?} mapInfo
+     */
+    constructor(mapInfo) {
+        this.title = mapInfo.title;
+        this.origin = mapInfo.origin;
+        this.zoom = mapInfo.zoom;
+        this.locationList = mapInfo.locationList;
+        this.thumbnailUrl = mapInfo.thumbnailUrl;
+    }
+}
+
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+class AddMapMarkerComponent {
+    // PROPERTIES
+    // CONSTRUCTORS
+    /**
+     * @param {?} passedData
+     */
+    constructor(passedData) {
+        this.passedData = passedData;
+    }
+    // LIFE CYCLE
+    /**
+     * @return {?}
+     */
+    ngOnInit() {
+        this.NewMarkerForm = new FormGroup({
+            title: new FormControl('', { validators: [Validators.required] }),
+            icon: new FormControl('', { validators: [Validators.required] })
+        });
+        this.NewMarker = {
+            title: '',
+            icon: null,
+            lat: 40.00,
+            lng: -100
+        };
+        // make these into a constants file somewhere because this list is written somewhere else as well
+        this.IconList = ['bar', 'brewery', 'golf course', 'lodging', 'museum', 'national park', 'restaurant', 'ski area', 'UNESCO', 'vineyard'];
+    }
+    // API METHODS
+    /**
+     * Converts data from the form to an icon to be placed on the map
+     * @return {?}
+     */
+    SetMarkerData() {
+        this.NewMarker.title = this.NewMarkerForm.value.title;
+        this.NewMarker.icon = this.NewMarkerForm.value.icon;
+        this.NewMarker.lat = this.passedData.lat;
+        this.NewMarker.lng = this.passedData.lng;
+        this.NewMarker.icon = this.convertIconUrl(this.NewMarker.icon);
+        console.log(this.NewMarker.icon);
+    }
+    // HELPERS
+    /**
+     *
+     * @private
+     * @param {?} icon The icon to be converted to a path
+     *
+     * Converts icon to path for use in displaying custom icon as map location marker
+     * Best to find a more abstract way of doing this for re-usability (service?)
+     * @return {?}
+     */
+    convertIconUrl(icon) {
+        // later - turn this into service because it's also being done in map.component.ts
+        /** @type {?} */
+        let orig = icon;
+        /** @type {?} */
+        let iconUrl = `./assets/${orig}.png`;
+        return { url: iconUrl, scaledSize: { width: 40, height: 60 } };
+    }
+}
+AddMapMarkerComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'lcu-add-map-marker',
+                template: "<h1 mat-dialog-title>Add a marker here?</h1>\r\n\r\n\r\n<mat-dialog-content>\r\n  <form fxLayout=\"column\" fxLayoutAlign=\"center center\" [formGroup]=\"NewMarkerForm\" fxLayoutGap=\"30px\">\r\n    <h4>Marker Title:</h4>\r\n    <mat-form-field>\r\n      <input type=\"text\" matInput formControlName=\"title\">\r\n      <mat-hint>The title for the map marker</mat-hint>\r\n      <mat-error>Invalid or missing title</mat-error>\r\n    </mat-form-field>\r\n\r\n    <h4>Choose Icon:</h4>\r\n    <mat-form-field>\r\n      <mat-label>Icon</mat-label>\r\n      <mat-select formControlName=\"icon\">\r\n        <mat-option *ngFor=\"let icon of IconList\" [value]=\"icon\">{{icon}}</mat-option>\r\n      </mat-select>\r\n    </mat-form-field>\r\n\r\n  </form>\r\n</mat-dialog-content>\r\n\r\n\r\n<button mat-raised-button color=\"primary\" [mat-dialog-close]=\"NewMarker\" (click)=\"SetMarkerData()\"\r\n  [disabled]=\"NewMarkerForm.invalid\">Add Marker</button>\r\n<button mat-raised-button color=\"accent\" [mat-dialog-close]=\"false\">Cancel</button>",
+                styles: [""]
+            }] }
+];
+/** @nocollapse */
+AddMapMarkerComponent.ctorParameters = () => [
+    { type: undefined, decorators: [{ type: Inject, args: [MAT_DIALOG_DATA,] }] }
+];
+
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+class MapComponent {
+    // CONSTRUCTORS
+    /**
+     * @param {?} dialog
+     */
+    constructor(dialog) {
+        this.dialog = dialog;
+        // PROPERTIES
+        /**
+         * The map model object (IndividualMap model) containing all the settings for the map to be displayed
+         */
+        this.mapModel = {
+            title: 'Default Title',
+            origin: { lat: 40.037757, lng: -105.278324 },
+            zoom: 13,
+            locationList: [],
+            thumbnailUrl: `https://maps.googleapis.com/maps/api/staticmap?center=63.259591,-144.667969&zoom=6&size=400x400
+      &markers=color:blue%7Clabel:S%7C62.107733,-145.541936&markers=size:tiny%7Ccolor:green%7CDelta+Junction,AK
+      &markers=size:mid%7Ccolor:0xFFFF00%7Clabel:C%7CTok,AK"&key=AIzaSyCvvqYY9pMUpRSKl721rPEiN4KlKIpCImg`
+        };
+    }
+    // LIFE CYCLE
+    /**
+     * @return {?}
+     */
+    ngOnInit() {
+        this.CurrentMapModel = this.mapModel;
+        this.CurrentMapModel.locationList = this.convertMarkerUrls(this.CurrentMapModel.locationList);
+    }
+    // API METHODS
+    /**
+     *
+     * @param {?} event The event passed in upon user clicking the map
+     *
+     * Runs when user clicks location on map. Modal displays prompting user to enter info about custom location marker
+     * @return {?}
+     */
+    OnChoseLocation(event) {
+        /** @type {?} */
+        const dialogRef = this.dialog.open(AddMapMarkerComponent, {
+            data: {
+                lat: event.coords.lat,
+                lng: event.coords.lng
+            }
+        });
+        dialogRef.afterClosed().subscribe((/**
+         * @param {?} res
+         * @return {?}
+         */
+        res => {
+            if (res) {
+                this.CurrentMapModel.locationList.push(res);
+            }
+        }));
+    }
+    // HELPERS
+    /**
+     *
+     * @private
+     * @param {?} list The list of icons to convert to paths
+     *
+     * Converts list of icons to paths for use in displaying custom icons as map location markers
+     * Best to find a more abstract way of doing this for re-usability (service?)
+     * @return {?}
+     */
+    convertMarkerUrls(list) {
+        list.forEach((/**
+         * @param {?} element
+         * @return {?}
+         */
+        element => {
+            /** @type {?} */
+            let icon = element.icon;
+            /** @type {?} */
+            let iconUrl = `./assets/${icon}.png`;
+            element.icon = { url: iconUrl, scaledSize: { width: 40, height: 60 } };
+        }));
+        return list;
+    }
+}
+MapComponent.decorators = [
+    { type: Component, args: [{
+                selector: 'lcu-map',
+                template: "<div class=\"icon-list\">\r\n  <div>\r\n    <div class=\"top-icon-set\">\r\n      <mat-icon class=\"hamburger-icon\">menu</mat-icon>\r\n      <mat-icon class=\"chevron-icon\">chevron_left</mat-icon>\r\n    </div>\r\n    <div class=\"bottom-icon-set\" fxLayoutAlign.lt-sm=\"flex-start\" fxLayoutAlign=\"space-around\" fxLayoutGap.lt-sm=\"50px\">\r\n      <mat-icon>search</mat-icon>\r\n      <mat-icon >add</mat-icon>\r\n      <mat-icon>layers</mat-icon>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<agm-map [latitude]=\"CurrentMapModel.origin.lat\" [longitude]=\"CurrentMapModel.origin.lng\" [title]=\"CurrentMapModel.title\" [zoom]=\"CurrentMapModel.zoom\"\r\n  (mapClick)=\"OnChoseLocation($event)\">\r\n  <div *ngFor=\"let marker of CurrentMapModel.locationList\">\r\n    <agm-marker [latitude]=\"marker.lat\" [longitude]=\"marker.lng\" [title]=\"marker.title\" [iconUrl]=\"marker.icon\"></agm-marker>\r\n  </div>\r\n</agm-map>\r\n\r\n",
+                styles: ["mat-icon{font-size:30px}.icon-list{padding:5px}.hamburger-icon{position:absolute;left:10px}@media (max-width:600px){.hamburger-icon{position:relative}}.chevron-icon{position:absolute;right:10px}.bottom-icon-set{width:80%;margin:auto}@media (max-width:600px){.bottom-icon-set{margin-left:10px}}agm-map{height:700px}"]
+            }] }
+];
+/** @nocollapse */
+MapComponent.ctorParameters = () => [
+    { type: MatDialog }
+];
+MapComponent.propDecorators = {
+    mapModel: [{ type: Input }]
+};
+
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
 class LcuAmblOnModule {
@@ -192,3 +385,3 @@ /**
     { type: NgModule, args: [{
-                declarations: [LandingPageComponent, HamburgerMenuComponent],
+                declarations: [LandingPageComponent, HamburgerMenuComponent, MapComponent, AddMapMarkerComponent],
                 imports: [
@@ -200,4 +393,12 @@ CommonModule,
                     MatIconModule,
+                    AgmCoreModule.forRoot({ apiKey: 'AIzaSyCvvqYY9pMUpRSKl721rPEiN4KlKIpCImg' }),
+                    MatIconModule,
+                    MatSelectModule,
+                    MatDialogModule,
+                    MatButtonModule,
+                    ReactiveFormsModule,
+                    MatInputModule,
+                    MatFormFieldModule
                 ],
-                exports: [LandingPageComponent, HamburgerMenuComponent],
+                exports: [LandingPageComponent, HamburgerMenuComponent, MapComponent, AddMapMarkerComponent],
                 entryComponents: [LandingPageComponent, HamburgerMenuComponent]
@@ -211,2 +412,4 @@ },] }
  */
+class MapMarker {
+}
 
@@ -218,4 +421,9 @@ /**
 
-export { UsersStateManagerContext, UsersState, HamburgerMenuComponent, LandingPageComponent, Constants, HamburgerMenuModel, LcuAmblOnModule };
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
 
+export { UsersStateManagerContext, UsersState, HamburgerMenuComponent, LandingPageComponent, Constants, HamburgerMenuModel, LcuAmblOnModule, IndividualMap, MapMarker, MapComponent, AddMapMarkerComponent };
+
 //# sourceMappingURL=ambl-on-lcu-ambl-on-common.js.map

fesm5/ambl-on-lcu-ambl-on-common.js

 import { __extends, __awaiter, __generator } from 'tslib';
 import { StateManagerContext } from '@lcu-ide/common';
-import { Injectable, Injector, NgModule, Component, defineInjectable, inject, INJECTOR } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { MatMenuModule } from '@angular/material/menu';
-import { MatIconModule } from '@angular/material';
 import { FlexLayoutModule } from '@angular/flex-layout';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import { AgmCoreModule } from '@agm/core';
+import { Injectable, Injector, NgModule, Component, Inject, Input, defineInjectable, inject, INJECTOR } from '@angular/core';
+import { MAT_DIALOG_DATA, MatDialog, MatIconModule, MatSelectModule, MatDialogModule, MatButtonModule, MatInputModule, MatFormFieldModule } from '@angular/material';
+import { FormGroup, FormControl, Validators, ReactiveFormsModule } from '@angular/forms';
 
@@ -183,3 +185,3 @@ /**
                     template: "  <div class=\"container\" fxFlex=\"100%\"\r\n      fxLayout=\"column\" fxLayoutAlign=\"center start\"\r\n      fxLayout.sm=\"column\" fxLayoutAlign.sm=\"center center\"\r\n      fxLayout.xs=\"column\" fxLayoutAlign.xs=\"center center\">\r\n      <div class=\"title\">\r\n        <h1>\r\n          {{ Title }}\r\n        </h1>\r\n      </div>\r\n      <div class=\"slogan\">\r\n          <h3>\r\n            {{ Slogan }}\r\n          </h3>\r\n      </div>\r\n  </div>\r\n",
-                    styles: [".container{margin-top:19em;margin-left:1em;text-align:center}.container h1{margin:0}.container .slogan,.container .title{color:#fff}"]
+                    styles: [".container{margin-top:19em;margin-left:1em;margin-bottom:9.3em;text-align:center}.container h1{margin:0}.container .slogan,.container .title{color:#fff}"]
                 }] }
@@ -220,2 +222,262 @@ ];
  */
+var IndividualMap = /** @class */ (function () {
+    function IndividualMap(mapInfo) {
+        this.title = mapInfo.title;
+        this.origin = mapInfo.origin;
+        this.zoom = mapInfo.zoom;
+        this.locationList = mapInfo.locationList;
+        this.thumbnailUrl = mapInfo.thumbnailUrl;
+    }
+    return IndividualMap;
+}());
+
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+var AddMapMarkerComponent = /** @class */ (function () {
+    // PROPERTIES
+    // CONSTRUCTORS
+    function AddMapMarkerComponent(passedData) {
+        this.passedData = passedData;
+    }
+    // LIFE CYCLE
+    // LIFE CYCLE
+    /**
+     * @return {?}
+     */
+    AddMapMarkerComponent.prototype.ngOnInit = 
+    // LIFE CYCLE
+    /**
+     * @return {?}
+     */
+    function () {
+        this.NewMarkerForm = new FormGroup({
+            title: new FormControl('', { validators: [Validators.required] }),
+            icon: new FormControl('', { validators: [Validators.required] })
+        });
+        this.NewMarker = {
+            title: '',
+            icon: null,
+            lat: 40.00,
+            lng: -100
+        };
+        // make these into a constants file somewhere because this list is written somewhere else as well
+        this.IconList = ['bar', 'brewery', 'golf course', 'lodging', 'museum', 'national park', 'restaurant', 'ski area', 'UNESCO', 'vineyard'];
+    };
+    // API METHODS
+    /**
+     * Converts data from the form to an icon to be placed on the map
+     */
+    // API METHODS
+    /**
+     * Converts data from the form to an icon to be placed on the map
+     * @return {?}
+     */
+    AddMapMarkerComponent.prototype.SetMarkerData = 
+    // API METHODS
+    /**
+     * Converts data from the form to an icon to be placed on the map
+     * @return {?}
+     */
+    function () {
+        this.NewMarker.title = this.NewMarkerForm.value.title;
+        this.NewMarker.icon = this.NewMarkerForm.value.icon;
+        this.NewMarker.lat = this.passedData.lat;
+        this.NewMarker.lng = this.passedData.lng;
+        this.NewMarker.icon = this.convertIconUrl(this.NewMarker.icon);
+        console.log(this.NewMarker.icon);
+    };
+    // HELPERS
+    /**
+     *
+     * @param icon The icon to be converted to a path
+     *
+     * Converts icon to path for use in displaying custom icon as map location marker
+     * Best to find a more abstract way of doing this for re-usability (service?)
+     */
+    // HELPERS
+    /**
+     *
+     * @private
+     * @param {?} icon The icon to be converted to a path
+     *
+     * Converts icon to path for use in displaying custom icon as map location marker
+     * Best to find a more abstract way of doing this for re-usability (service?)
+     * @return {?}
+     */
+    AddMapMarkerComponent.prototype.convertIconUrl = 
+    // HELPERS
+    /**
+     *
+     * @private
+     * @param {?} icon The icon to be converted to a path
+     *
+     * Converts icon to path for use in displaying custom icon as map location marker
+     * Best to find a more abstract way of doing this for re-usability (service?)
+     * @return {?}
+     */
+    function (icon) {
+        // later - turn this into service because it's also being done in map.component.ts
+        /** @type {?} */
+        var orig = icon;
+        /** @type {?} */
+        var iconUrl = "./assets/" + orig + ".png";
+        return { url: iconUrl, scaledSize: { width: 40, height: 60 } };
+    };
+    AddMapMarkerComponent.decorators = [
+        { type: Component, args: [{
+                    selector: 'lcu-add-map-marker',
+                    template: "<h1 mat-dialog-title>Add a marker here?</h1>\r\n\r\n\r\n<mat-dialog-content>\r\n  <form fxLayout=\"column\" fxLayoutAlign=\"center center\" [formGroup]=\"NewMarkerForm\" fxLayoutGap=\"30px\">\r\n    <h4>Marker Title:</h4>\r\n    <mat-form-field>\r\n      <input type=\"text\" matInput formControlName=\"title\">\r\n      <mat-hint>The title for the map marker</mat-hint>\r\n      <mat-error>Invalid or missing title</mat-error>\r\n    </mat-form-field>\r\n\r\n    <h4>Choose Icon:</h4>\r\n    <mat-form-field>\r\n      <mat-label>Icon</mat-label>\r\n      <mat-select formControlName=\"icon\">\r\n        <mat-option *ngFor=\"let icon of IconList\" [value]=\"icon\">{{icon}}</mat-option>\r\n      </mat-select>\r\n    </mat-form-field>\r\n\r\n  </form>\r\n</mat-dialog-content>\r\n\r\n\r\n<button mat-raised-button color=\"primary\" [mat-dialog-close]=\"NewMarker\" (click)=\"SetMarkerData()\"\r\n  [disabled]=\"NewMarkerForm.invalid\">Add Marker</button>\r\n<button mat-raised-button color=\"accent\" [mat-dialog-close]=\"false\">Cancel</button>",
+                    styles: [""]
+                }] }
+    ];
+    /** @nocollapse */
+    AddMapMarkerComponent.ctorParameters = function () { return [
+        { type: undefined, decorators: [{ type: Inject, args: [MAT_DIALOG_DATA,] }] }
+    ]; };
+    return AddMapMarkerComponent;
+}());
+
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
+var MapComponent = /** @class */ (function () {
+    // CONSTRUCTORS
+    function MapComponent(dialog) {
+        this.dialog = dialog;
+        // PROPERTIES
+        /**
+         * The map model object (IndividualMap model) containing all the settings for the map to be displayed
+         */
+        this.mapModel = {
+            title: 'Default Title',
+            origin: { lat: 40.037757, lng: -105.278324 },
+            zoom: 13,
+            locationList: [],
+            thumbnailUrl: "https://maps.googleapis.com/maps/api/staticmap?center=63.259591,-144.667969&zoom=6&size=400x400\n      &markers=color:blue%7Clabel:S%7C62.107733,-145.541936&markers=size:tiny%7Ccolor:green%7CDelta+Junction,AK\n      &markers=size:mid%7Ccolor:0xFFFF00%7Clabel:C%7CTok,AK\"&key=AIzaSyCvvqYY9pMUpRSKl721rPEiN4KlKIpCImg"
+        };
+    }
+    // LIFE CYCLE
+    // LIFE CYCLE
+    /**
+     * @return {?}
+     */
+    MapComponent.prototype.ngOnInit = 
+    // LIFE CYCLE
+    /**
+     * @return {?}
+     */
+    function () {
+        this.CurrentMapModel = this.mapModel;
+        this.CurrentMapModel.locationList = this.convertMarkerUrls(this.CurrentMapModel.locationList);
+    };
+    // API METHODS
+    /**
+     *
+     * @param event The event passed in upon user clicking the map
+     *
+     * Runs when user clicks location on map. Modal displays prompting user to enter info about custom location marker
+     */
+    // API METHODS
+    /**
+     *
+     * @param {?} event The event passed in upon user clicking the map
+     *
+     * Runs when user clicks location on map. Modal displays prompting user to enter info about custom location marker
+     * @return {?}
+     */
+    MapComponent.prototype.OnChoseLocation = 
+    // API METHODS
+    /**
+     *
+     * @param {?} event The event passed in upon user clicking the map
+     *
+     * Runs when user clicks location on map. Modal displays prompting user to enter info about custom location marker
+     * @return {?}
+     */
+    function (event) {
+        var _this = this;
+        /** @type {?} */
+        var dialogRef = this.dialog.open(AddMapMarkerComponent, {
+            data: {
+                lat: event.coords.lat,
+                lng: event.coords.lng
+            }
+        });
+        dialogRef.afterClosed().subscribe((/**
+         * @param {?} res
+         * @return {?}
+         */
+        function (res) {
+            if (res) {
+                _this.CurrentMapModel.locationList.push(res);
+            }
+        }));
+    };
+    // HELPERS
+    /**
+     *
+     * @param list The list of icons to convert to paths
+     *
+     * Converts list of icons to paths for use in displaying custom icons as map location markers
+     * Best to find a more abstract way of doing this for re-usability (service?)
+     */
+    // HELPERS
+    /**
+     *
+     * @private
+     * @param {?} list The list of icons to convert to paths
+     *
+     * Converts list of icons to paths for use in displaying custom icons as map location markers
+     * Best to find a more abstract way of doing this for re-usability (service?)
+     * @return {?}
+     */
+    MapComponent.prototype.convertMarkerUrls = 
+    // HELPERS
+    /**
+     *
+     * @private
+     * @param {?} list The list of icons to convert to paths
+     *
+     * Converts list of icons to paths for use in displaying custom icons as map location markers
+     * Best to find a more abstract way of doing this for re-usability (service?)
+     * @return {?}
+     */
+    function (list) {
+        list.forEach((/**
+         * @param {?} element
+         * @return {?}
+         */
+        function (element) {
+            /** @type {?} */
+            var icon = element.icon;
+            /** @type {?} */
+            var iconUrl = "./assets/" + icon + ".png";
+            element.icon = { url: iconUrl, scaledSize: { width: 40, height: 60 } };
+        }));
+        return list;
+    };
+    MapComponent.decorators = [
+        { type: Component, args: [{
+                    selector: 'lcu-map',
+                    template: "<div class=\"icon-list\">\r\n  <div>\r\n    <div class=\"top-icon-set\">\r\n      <mat-icon class=\"hamburger-icon\">menu</mat-icon>\r\n      <mat-icon class=\"chevron-icon\">chevron_left</mat-icon>\r\n    </div>\r\n    <div class=\"bottom-icon-set\" fxLayoutAlign.lt-sm=\"flex-start\" fxLayoutAlign=\"space-around\" fxLayoutGap.lt-sm=\"50px\">\r\n      <mat-icon>search</mat-icon>\r\n      <mat-icon >add</mat-icon>\r\n      <mat-icon>layers</mat-icon>\r\n    </div>\r\n  </div>\r\n</div>\r\n\r\n<agm-map [latitude]=\"CurrentMapModel.origin.lat\" [longitude]=\"CurrentMapModel.origin.lng\" [title]=\"CurrentMapModel.title\" [zoom]=\"CurrentMapModel.zoom\"\r\n  (mapClick)=\"OnChoseLocation($event)\">\r\n  <div *ngFor=\"let marker of CurrentMapModel.locationList\">\r\n    <agm-marker [latitude]=\"marker.lat\" [longitude]=\"marker.lng\" [title]=\"marker.title\" [iconUrl]=\"marker.icon\"></agm-marker>\r\n  </div>\r\n</agm-map>\r\n\r\n",
+                    styles: ["mat-icon{font-size:30px}.icon-list{padding:5px}.hamburger-icon{position:absolute;left:10px}@media (max-width:600px){.hamburger-icon{position:relative}}.chevron-icon{position:absolute;right:10px}.bottom-icon-set{width:80%;margin:auto}@media (max-width:600px){.bottom-icon-set{margin-left:10px}}agm-map{height:700px}"]
+                }] }
+    ];
+    /** @nocollapse */
+    MapComponent.ctorParameters = function () { return [
+        { type: MatDialog }
+    ]; };
+    MapComponent.propDecorators = {
+        mapModel: [{ type: Input }]
+    };
+    return MapComponent;
+}());
+
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
 var LcuAmblOnModule = /** @class */ (function () {
@@ -238,3 +500,3 @@ function LcuAmblOnModule() {
         { type: NgModule, args: [{
-                    declarations: [LandingPageComponent, HamburgerMenuComponent],
+                    declarations: [LandingPageComponent, HamburgerMenuComponent, MapComponent, AddMapMarkerComponent],
                     imports: [
@@ -246,4 +508,12 @@ CommonModule,
                         MatIconModule,
+                        AgmCoreModule.forRoot({ apiKey: 'AIzaSyCvvqYY9pMUpRSKl721rPEiN4KlKIpCImg' }),
+                        MatIconModule,
+                        MatSelectModule,
+                        MatDialogModule,
+                        MatButtonModule,
+                        ReactiveFormsModule,
+                        MatInputModule,
+                        MatFormFieldModule
                     ],
-                    exports: [LandingPageComponent, HamburgerMenuComponent],
+                    exports: [LandingPageComponent, HamburgerMenuComponent, MapComponent, AddMapMarkerComponent],
                     entryComponents: [LandingPageComponent, HamburgerMenuComponent]
@@ -259,2 +529,7 @@ },] }
  */
+var MapMarker = /** @class */ (function () {
+    function MapMarker() {
+    }
+    return MapMarker;
+}());
 
@@ -266,4 +541,9 @@ /**
 
-export { UsersStateManagerContext, UsersState, HamburgerMenuComponent, LandingPageComponent, Constants, HamburgerMenuModel, LcuAmblOnModule };
+/**
+ * @fileoverview added by tsickle
+ * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
+ */
 
+export { UsersStateManagerContext, UsersState, HamburgerMenuComponent, LandingPageComponent, Constants, HamburgerMenuModel, LcuAmblOnModule, IndividualMap, MapMarker, MapComponent, AddMapMarkerComponent };
+
 //# sourceMappingURL=ambl-on-lcu-ambl-on-common.js.map

lcu.api.d.ts

@@ -8,1 +8,5 @@ export * from './lib/state/users/users-state-manager.context';
 export * from './lib/lcu-ambl-on.module';
+export * from './lib/models/individual-map.model';
+export * from './lib/models/map-marker.model';
+export * from './lib/controls/map/map.component';
+export * from './lib/controls/map/add-map-marker/add-map-marker.component';

package.json

 {
   "name": "@ambl-on/lcu-ambl-on-common",
-  "version": "0.1.22-landing-page",
+  "version": "0.1.23-google-map",
   "peerDependencies": {
@@ -5,0 +5,0 @@ "@angular/common": "^7.2.0",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

317361

increased by98.73%

Number of package files

50

increased by31.58%

Lines of code

3122

increased by107.58%

No dependency changes