Skip to content

Latest commit

 

History

History
5 lines (4 loc) · 8.92 KB

Master Page Subflow.md

File metadata and controls

5 lines (4 loc) · 8.92 KB

Load the following into a subflow called "Master Page":

[{"id":"a8053ede.4604d","type":"template","name":"Master Page Template","field":"payload","format":"handlebars","template":"<!DOCTYPE html> \n<html>\n<head>\n\t<title>{{payload.pgTitle}}</title>\n\t<meta name=\"viewport\" content=\"width=device-width, initial-scale=1\">\n\t<meta charset=\"utf-8\">\n\t<meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\" />\n\t<link href=\"https://cdnjs.cloudflare.com/ajax/libs/foundation/5.5.1/css/normalize.min.css\" rel=\"stylsheet\">\n\t<link href=\"https://cdnjs.cloudflare.com/ajax/libs/foundation/5.5.1/css/foundation.min.css\" rel=\"stylesheet\">\n\t<link href=\"https://cdnjs.cloudflare.com/ajax/libs/foundicons/3.0.0/foundation-icons.css\" rel=\"stylesheet\">\n\t{{! Supports old browsers AND detects mobile browsers: install via Bower }}\n\t<script src=\"/bower_components/modernizer/modernizr.js\"></script>\n</head>\n\n<body>\n    <div class=\"contain-to-grid sticky\"><nav class=\"top-bar\" data-topbar role=\"navigation\" data-options=\"sticky_on: [medium,large]\">\n        <ul class=\"title-area\">\n            <li class=\"name\">\n                <h1><a href=\"/\">{{payload.pgTitle}}</a></h1>\n            </li>\n            <!-- Remove the class \"menu-icon\" to get rid of menu icon. Take out \"Menu\" to just have icon alone -->\n            <li class=\"toggle-topbar menu-icon\"><a href=\"#\"><span>Menu</span></a></li>\n        </ul>\n        <section class=\"top-bar-section\">\n            <ul class=\"right\">\n                <li class=\"divider\"></li>\n                <li class=\"has-dropdown\">\n                    <a href=\"#\">Sensors</a>\n                    <ul class=\"dropdown\">\n                        <li><a href=\"/hall\">Hall</a></li>\n                        <li><a href=\"/loft\">Loft</a></li>\n                        <li><a href=\"/pir\">PIR</a></li>\n                        <li><a href=\"/latest\">Latest Sensor Readings</a></li>\n                        <li><a href=\"/details\">Sensor Details</a></li>\n                    </ul>\n                </li>\n                <li class=\"has-dropdown\">\n                    <a href=\"#\">Weather</a>\n                    <ul class=\"dropdown\">\n                        <li><a href=\"/weather\">Forecasts</a></li>\n                        <li><a href=\"/wCurrent\">Current Conditions</a></li>\n                        <li class=\"has-dropdown\">\n                            <a href=\"#\">WU Raw</a>\n                            <ul class=\"dropdown\">\n                                <li><a href=\"http://api.wunderground.com/api/5cc2ade61d20a937/geolookup/q/UK/Sheffield.json\">Sheffield Stations</a></li>\n                                <li><a href=\"http://www.wunderground.com/personal-weather-station/dashboard?ID=ISHEFFIE15\">Lodgemoor Dashboard</a></li>\n                                <li><a href=\"http://api.wunderground.com/api/5cc2ade61d20a937/conditions/q/pws:ISHEFFIE15.json\">Current Conditions: Lodgemoor: JSON</a></li>\n                                <li><a href=\"http://api.wunderground.com/api/5cc2ade61d20a937/conditions/q/pws:ISHEFFIE22.json\">Current Conditions: Endcliffe Vale Road: JSON</a></li>\n                                <li><a href=\"http://api.wunderground.com/api/5cc2ade61d20a937/conditions/q/pws:ISHEFFIE8.json\">Current Conditions: Endcliffe Corner: JSON</a></li>\n                            </ul>\n                        </li>\n                    </ul>\n                </li>\n                <li class=\"has-dropdown\">\n                    <a href=\"#\">Misc</a>\n                    <ul class=\"dropdown\">\n                        <li><a href=\"/\">Home page</a></li>\n                        <li><a href=\"http://{{global.nrSrv}}:6680/\">Audio Player (Mopidy)</a></li>\n                        <li><a href=\"/red\">Admin interface</a></li>\n                        <li><a href=\"/places\">Places (location information)</a></li>\n                        <li class=\"divider\"></li>\n                        <li><a href=\"jqmobile\">Test Mobile Page</a></li>\n                        <li><a href=\"/freeboard/#start-85157\">Freeboard Test</a></li>\n                        <li class=\"has-dropdown\">\n                            <a href=\"#\">Vis</a>\n                            <ul class=\"dropdown\">\n                                <li><a href=\"/vis/index.html#DemoView\">DemoView</a></li>\n                                <li><a href=\"/vis/edit.html#DemoView\">DemoView (Edit)</a></li>\n                            </ul>\n                        </li>\n                    </ul>\n                </li>\n                <li class=\"has-dropdown\">\n                    <a href=\"#\">Docs</a>\n                    <ul class=\"dropdown\">\n                        <li><a href=\"http://nodered.org/docs/\" target=\"_blank\" title=\"New Window\">Node-Red</a></li>\n                        <li><a href=\"http://mustache.github.io/mustache.5.html\" target=\"_blank\" title=\"New Window\">Mustache</a></li>\n                        <li><a href=\"https://nodejs.org/docs/v0.10.0/api/\" target=\"_blank\" title=\"New Window\">Node v10 API</a></li>\n                        <li><a href=\"http://foundation.zurb.com/docs/\" target=\"_blank\" title=\"New Window\">Zurb Foundation</a></li>\n                        <li><a href=\"https://princessdesign.net/foundation-cheat-sheet/\" target=\"_blank\" title=\"New Window\">Foundation Cheat Sheet</a></li>\n                        <li class=\"divider\"></li>\n                        <li><a href=\"http://flows.nodered.org/\" target=\"_blank\" title=\"New Window\">NR Node Library</a></li>\n                        <li><a href=\"http://red-nodes.org/\" target=\"_blank\" title=\"New Window\">NR Nodes on NPM (red.nodes)</a></li>\n                        <li><a href=\"http://cnpmjs.org/browse/keyword/node-red\" target=\"_blank\" title=\"New Window\">NR Nodes on NPM (CNPM)</a></li>\n                        <li class=\"divider\"></li>\n                        <li><a href=\"https://github.com/node-red/node-red-nodes/wiki/Node-Ideas\" target=\"_blank\" title=\"New Window\">NR Node Ideas (NR WIKI)</a></li>\n                    </ul>\n                </li>\n                \n        </ul></section>\n    </nav></div>\n    {{! Main content - HTML must be in msg.payload.content }}\n    <section role=\"main\" class=\"scroll-container\"><div class=\"row\">\n        {{{payload.content}}}\n    </div></section>\n    <script src=\"https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js\"></script>\n    {{! rws auto reconnects websockets: install via bower }}\n    <script src=\"/bower_components/reconnectingWebsocket/reconnecting-websocket.min.js\"></script>\n    {{! foundation.min.js loads ALL plugins }}\n    <script src=\"https://cdnjs.cloudflare.com/ajax/libs/foundation/5.5.1/js/foundation.min.js\"></script>\n    {{! Load mqtt.js to get MQTT over web services - TODO: make this optional & pass addr of mqtt server }}\n    {{! @see http://git.eclipse.org/c/paho/org.eclipse.paho.mqtt.javascript.git/plain/src/mqttws31.js }}\n    <script src=\"/js/mqttws31.js\"></script>\n    {{! Load any additional scripts if reqd, including inline code - the activation code for optional ws support should be in this }}\n    {{{payload.script1}}}\n    {{! Load my standard code for all pages, see ./public/ }}\n    <script src=\"/js/ws.js\"></script>\n</body>\n</html>","x":462.1666564941406,"y":152.1666717529297,"z":"59f72869.760188","wires":[["4421c323.72baa4"]]},{"id":"3cd8a2a6.be6bce","type":"comment","name":"Defines a common page layout to be used for all pages","info":"The following entities are expected on the msg.payload object:\n\n- pageTitle [Used in the head/title & menu]\n- menu [creates the menu]\n- content [must be HTML formatted output]\n- script1 [HTML formatted - usually a scirpt block]","x":364.1666717529297,"y":101.16667175292969,"z":"59f72869.760188","wires":[]},{"id":"4421c323.72baa4","type":"http response","name":"","x":641.1666259765625,"y":152.16665649414062,"z":"59f72869.760188","wires":[]},{"id":"b9728f9e.242658","type":"e-mail","server":"smtp.gmail.com","port":"465","name":"[email protected]","dname":"To Gmail","x":648.88330078125,"y":239.88333129882812,"z":"59f72869.760188","wires":[]},{"id":"78413c13.b6044c","type":"comment","name":"This works except for JS so no charts","info":"","x":643.88330078125,"y":204.88333129882812,"z":"59f72869.760188","wires":[]},{"id":"ec121b2b.503b5","type":"function","name":"Cp globals to payload","func":"msg.payload.global = {\n    'mqttSrv'       : context.globalmqttSrv,\n    'mqttWsPort'    : context.globalmqttWsPort,\n    'nrSrv'         : context.globalnrSrv,\n    'nrPort'        : context.globalnrPort,\n    'wanMqttSrv'    : context.globalwanMqttSrv,\n    'wanMqttWsPort' : context.globalwanMqttWsPort,\n    'wanNrSrv'      : context.globalwanNrSrv,\n    'wanNrPort'     : context.globalwanNrPort\n};\n\nreturn msg;","outputs":1,"valid":true,"x":232.88333129882812,"y":151.88333129882812,"z":"59f72869.760188","wires":[["a8053ede.4604d"]]}]