if you need to upload a Web or Mobile Application into a Web Server space it can be done on: (i) your IOT Application space/docker as explained below, or (ii) ask to Snap4City@disit.org to provide you a space on GitHUB, so that any time you upload on Github a copy is automatically copied on an online server for you.
In Snap4City you can embed HTML CSS into dashboards in two different manners:
1) the simple solution may consists in producing your HTML/CSS code and post on some your server. Then you can use ExternalContent widget to visualize it. You can register your web page as ExternalService. It has to be accessible via HTTPS to be directly opened.
2) a more direct dynamic solution: you can create your HTML code and send to a Dashboard Single Content widget that you can find the collection of the SC4 Dashboard widgets. It also accpet HTML code on imput and not only number, string, float, etc.
3a) a more dynamic solution would be to create dynamically your HTML/CSS web page by using some web page designer and change some parameter into an IOT Application. The IOT Application can produce dynamic HTML code in its own reserved space for example:
The code can be saved into node "html code"
and the final web page recovered from: https://iot-app.snap4city.org/nodered/nrwja32/simple according to the first block.
The HTML code was
<HTML>
<HEAD>
<TITLE>Your Title Here</TITLE>
</HEAD>
<BODY BGCOLOR="FFFFFF">
<CENTER><IMG SRC="clouds.jpg" ALIGN="BOTTOM"> </CENTER>
<HR>
<a href="https://www.snap4city.org">Link Name</a>
is a link to another site
<H1>This is a Header</H1>
<H2>This is a Medium Header</H2>
Send me mail at <a href="mailto:support@yourcompany.com">
<P> This is a new paragraph!
<P> <B>This is a new paragraph!</B>
<BR> <B><I>This is a new sentence without a paragraph break, in bold italics.</I></B>
<HR>
</BODY>
</HTML>
CSS can be added/embedded as well into the HTML code and also images in base 64.
In alternative, other files can be generated and saved in the same space by using NODE file save.
3b) once created the html page it can be dynamically changed by some IOT App processing, and can be embedded into snap4city dashboard by using an External Content widget as in the first case (1). For example obtaining: https://www.snap4city.org/dashboardSmartCity/view/index.php?iddasboard=MTUxNg==
click on the link to see more complex view.
--------------------------------
JS NODEred of the flow: you can import (copy past in the import menu item) in your IOT App to have it and test
[{"id":"8054c265.3fd32","type":"template","z":"aa867fa0.ac834","name":"html code","field":"payload","fieldType":"msg","format":"handlebars","syntax":"plain","template":"<HTML>\n\n<HEAD>\n\n<TITLE>Your Title Here</TITLE>\n\n</HEAD>\n\n<BODY BGCOLOR=\"FFFFFF\">\n\n<CENTER><IMG SRC=\"clouds.jpg\" ALIGN=\"BOTTOM\"> </CENTER>\n\n<HR>\n\n<a href=\"https://www.snap4city.org\">Link Name</a>\n\nis a link to another site\n\n<H1>This is a Header</H1>\n\n<H2>This is a Medium Header</H2>\n\nSend me mail at <a href=\"mailto:support@yourcompany.com\">\n\nsupport@yourcompany.com</a>.\n\n<P> This is a new paragraph!\n\n<P> <B>This is a new paragraph!</B>\n\n<BR> <B><I>This is a new sentence without a paragraph break, in bold italics.</I></B>\n\n<HR>\n\n</BODY>\n\n</HTML>","output":"str","x":440,"y":300,"wires":[["c982bd4f.6bdbb","8f7cdbc9.ce0698"]]},{"id":"c982bd4f.6bdbb","type":"http response","z":"aa867fa0.ac834","name":"","statusCode":"","headers":{},"x":670,"y":200,"wires":[]},{"id":"8f7cdbc9.ce0698","type":"debug","z":"aa867fa0.ac834","name":"","active":true,"console":"false","complete":"false","x":690,"y":380,"wires":[]},{"id":"5dc35726.31bee8","type":"http in","z":"aa867fa0.ac834","name":"","url":"/simple","method":"get","upload":false,"swaggerDoc":"","x":200,"y":300,"wires":[["8054c265.3fd32"]]}]
