Source: widget/LegendWidget.js

/**
 * Widget that shows the legends of the layers (currently not dynamic)
 * @module app/widget/LegendWidget
 * @requires module:app/widget/MapWidget
 * @author David Kristiansen <david.kristiansen@nscc.ca>
 * @copyright Nova Scotia Community College 2017
 */
define([
     "dojo/_base/declare",
     "dojo/_base/lang",
     "dojo/on",
     "dijit/_WidgetBase",
     "dijit/_OnDijitClickMixin"
     ],
    function (
        declare,
        lang,
        on,
        _WidgetBase,
        _OnDijitClickMixin
    ) {
        return declare([_WidgetBase, _OnDijitClickMixin], {
            baseClass: "LegendWidget",
            title: null,

            options: {
                map: null,
                pane: null
            },
            /** @constructor
             * @param {object} args Object of properties to mixin
             * @param {object} srcRefNode Dom node for the widget to attach to
             **/
            constructor: function (param, srcRefNode) {
                /** mix in settings and defaults
                 * @mixin args
                 */
                declare.safeMixin(this.options, param);
                /** Dom widget node */
                this.domNode = srcRefNode;
                // store localized strings
                this.title = this.options.title || "Legend";
                this.set("map", this.options.map);
                this.set("pane", this.options.pane);
            },
            /**
             * Sets title and html content of the base class content pane.
             * Occurs after the constructor has run and dom elements have been created.
             *
             **/
            postCreate: function () {
                //                 console.log("LegendWidget::postCreate");
                if (this.pane) {
                    this.pane.set("title", this.title);
                    this.pane.set("content", "<div id='legend'><h3 class='lyrName'>Tide Stations</h3><img class='lyrLegend' src='./app/resources/legends/tide_stn_legend.jpg' alt='Tide Station' width='120px' ><h3 class='lyrName'>Critical Facilities</h3><img class='lyrLegend' src='./app/resources/legends/critical_facilities_legend.JPG' alt='Critical Facilities' width='200px' ><h3 class='lyrName'>Roads</h3><img class='lyrLegend' src='./app/resources/legends/roads_legend.jpg' alt='Roads Legend' width='200px' ></div>");
                }
            },
            /**
             * Starts the widget after it has been constructed.
             * Checks to make sure the required map is loaded.
             * @public
             *
             **/
            startup: function () {
                //                 console.log("LegendWidget::startup");
                // map not defined
                if (!this.map) {
                    this.destroy();
                    console.warn("LegendWidget::map required");
                }
                // when map is loaded
                if (this.map.loaded) {
                    this._init();
                } else {
                    on(this.map, "load", lang.hitch(this, function () {
                        this._init();
                    }));
                }
            },
            /**
             * Destroys widget
             * @public
             *
             **/
            destroy: function () {
                //                 console.log("LegendWidget::destroy");
                this.inherited(arguments);
            },
            /**
             * No JavaScript logic needed currently for the widget.
             * @todo dynamicall create appropriate legends.
             * @private
             *
             **/
            _init: function () {
                //                 console.log("LegendWidget::_init");


            }
        });
    });