An idea for Android/iOS apps linked to Node-RED

[stefan...@bluewind.it]

For those thinking about how to build prototypes (and production ready) apps served by data originated in a Node-RED flow, have a look at this clever idea of a Json based framework for a native approach:

http://jasonette.com/

Looks to me as a perfect fit for Node-RED workflow: change the app UI behaviour (and data of course) by trimming the flow generating Json at server side.

In the past a generic free Jasonette app existed in both Android and iOS stores ready to be installed, now you need to build your own from the examples but seems trivial.

--
Stefano Costa
R&D, Managing Director
Bluewind Embedded Systems
M. +39 335 6565749
https://t.me/stefanoco
http://www.bluewind.it

[Dave C-J]

Interesting.... But as it has to go fetch the main json definition of the app, why is this better than a web app, that can also be cached, and has websockets for live data updates ?

Seems like it's just rewriting HTML in a json structure. What am I missing?

[stefan...@bluewind.it]

The main advantage is its nature of being native and so use experience can be much better, and interaction with other device peripherals/data more complete than HTML apps

22 gen 2017, 10:46 +0100, Dave C-J <dce...@gmail.com>, ha scritto:

Interesting.... But as it has to go fetch the main json definition of the app, why is this better than a web app, that can also be cached, and has websockets for live data updates ?

Seems like it's just rewriting HTML in a json structure. What am I missing?

--
http://nodered.org
 
Join us on Slack to continue the conversation: http://nodered.org/slack
---
You received this message because you are subscribed to the Google Groups "Node-RED" group.
To unsubscribe from this group and stop receiving emails from it, send an email to node-red+u...@googlegroups.com.
To post to this group, send email to node...@googlegroups.com.
Visit this group at https://groups.google.com/group/node-red.
To view this discussion on the web, visit https://groups.google.com/d/msgid/node-red/CACXWFw%2BjO8nco72%3D9Yo%2B45yw7U_Z_c-7635usx3vqG9RSZdBSQ%40mail.gmail.com.
For more options, visit https://groups.google.com/d/optout.

[Dave C-J]

in theory yes - as long as all those device APIs are exposed... and more and more of them are available to web apps also.

Can you find websockets ? or does it have to poll for data ?

[stefan...@bluewind.it]

Good point: didn't experiment yet but can't find reference to any other communication channel than http post/get, so this can be a serious weakness. Extending with websockets is a must.

22 gen 2017, 11:19 +0100, Dave C-J <dce...@gmail.com>, ha scritto:

in theory yes - as long as all those device APIs are exposed... and more and more of them are available to web apps also.

Can you find websockets ? or does it have to poll for data ?

--

http://nodered.org
 
Join us on Slack to continue the conversation: http://nodered.org/slack
---
You received this message because you are subscribed to the Google Groups "Node-RED" group.
To unsubscribe from this group and stop receiving emails from it, send an email to node-red+u...@googlegroups.com.
To post to this group, send email to node...@googlegroups.com.
Visit this group at https://groups.google.com/group/node-red.

To view this discussion on the web, visit https://groups.google.com/d/msgid/node-red/CACXWFwLduWd8%2BpdpUL4V7Eo_8WZ0fwgKhFdHAo0oKR7XcLrJzQ%40mail.gmail.com.

[Julian Knight]

Sadly, you would still need both XCode (which requires a Mac) and Android Studio to build supposedly cross-platform apps. This stretches the definition of cross-platform to my simple mind.

Though a little more work to get right, I think that building a single-page web app that supports offline mode would be a better cross-platform bet and it would support ALL modern platforms as well, desktop and mobile, even Windows Phone.

[Librae]

Great point, IMHO, the connectivity ability will be more and more indispensable to apps in the future, so I guess web app might be leading the trend.

Is it possible to use web app so we won't rely on "Native" developing environment like Xcode or Android Studio? (Although the experience of native app is much better than web app for now)

As of now, the way that I use node red UI  on mobile device is to tap "Add to home screen" button in browser, and then I can open it just as a normal app.

And I think the editor UI of blynk is also great, guess it does similar things as node-red in the cloud server.

Librae

To unsubscribe from this group and stop receiving emails from it, send an email to node-red+unsubscribe@googlegroups.com.

To post to this group, send email to node...@googlegroups.com.
Visit this group at https://groups.google.com/group/node-red.

To view this discussion on the web, visit https://groups.google.com/d/msgid/node-red/b82de597-a9ab-4a8d-933f-1817c5fb2b51%40googlegroups.com.

[PM]

Very interesting to me, because of notifications.
Did you manage to make it work? Can you show me?

[Baptiste Doucerain]

Le lundi 23 janvier 2017 04:05:32 UTC+1, Librae L a écrit :

As of now, the way that I use node red UI  on mobile device is to tap "Add to home screen" button in browser, and then I can open it just as a normal app.

Hi there, Hi Librae L im reading several topic about turning my dashboard into a web app on my phone with the "add to homescreen" option on Chrome. But my issue is : 

Do you know how to set your own icon when you do "add to home screen" ?

I found several icon.png on my local files, in the folder : ~/.node-red/node_modules/node-red-dashboard/dist i tried to put my own icon.png instead of these ones but nothing changed :'(

Any ideas ?

[Glenn]

It might be in the config file but haven't tried myself

[Librae]

Hi Baptiste,

Basically the icon is loaded according to the html head.

I use http://realfavicongenerator.net/ to generate icons and corresponding html code.

e.g.

<link rel="apple-touch-icon" sizes="57x57" href="/apple-touch-icon-57x57.png">

<link rel="apple-touch-icon" sizes="60x60" href="/apple-touch-icon-60x60.png">

<link rel="apple-touch-icon" sizes="72x72" href="/apple-touch-icon-72x72.png">

<link rel="apple-touch-icon" sizes="76x76" href="/apple-touch-icon-76x76.png">

<link rel="apple-touch-icon" sizes="114x114" href="/apple-touch-icon-114x114.png">

<link rel="apple-touch-icon" sizes="120x120" href="/apple-touch-icon-120x120.png">

<link rel="apple-touch-icon" sizes="144x144" href="/apple-touch-icon-144x144.png">

<link rel="apple-touch-icon" sizes="152x152" href="/apple-touch-icon-152x152.png">

<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon-180x180.png">

<link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32">

<link rel="icon" type="image/png" href="/android-chrome-192x192.png" sizes="192x192">

<link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16">

<link rel="manifest" href="/manifest.json">

<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#2f3f75">

<meta name="msapplication-TileColor" content="#2f3f75">

<meta name="msapplication-TileImage" content="/mstile-144x144.png">

<meta name="theme-color" content="#ffffff">

So I guess you can serve corresponding images for android/ios icons by add 'http in' nodes in Node RED.

Well I haven't tested it yet, please share your result or updates.

Thanks,

Librae

On Fri, May 12, 2017 at 11:13 AM, Glenn <glo...@gmail.com> wrote:

It might be in the config file but haven't tried myself

--
http://nodered.org

Join us on Slack to continue the conversation: http://nodered.org/slack
---
You received this message because you are subscribed to the Google Groups "Node-RED" group.
To unsubscribe from this group and stop receiving emails from it, send an email to node-red+unsubscribe@googlegroups.com.

To post to this group, send an email to node...@googlegroups.com.

Visit this group at https://groups.google.com/group/node-red.

To view this discussion on the web, visit https://groups.google.com/d/msgid/node-red/d75f5c08-2272-41be-ad81-6a2f1428d16d%40googlegroups.com.

[Baptiste Doucerain]

Wow nice link Librae ! Very useful ! I will double check the "http in" node.

To unsubscribe from this group and stop receiving emails from it, send an email to node-red+u...@googlegroups.com.

[Baptiste Doucerain]

Allright folks i changed the icon in the node-red-dashboard/dist (smthing like that) folder and it didnt worked at the first try because i didnt clear the cache on my phone. I cleared the cache and i did "add to homescreen" again and it looked the way a wanted to. The .png file to modify is named icon64x64.png or icon192x192.png and i believe if you are iOS youll need to add an icon120x120.png in the same directory

[Baptiste Doucerain]

No need to use "http in" node

[Mark Setrem]

The iOS icon size info is listed here https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html

[Librae]

Great and thanks for your go, Baptiste, I'd apply it in my next project then.

On Tue, May 16, 2017 at 4:42 PM, Mark Setrem <mse...@gmail.com> wrote:

The iOS icon size info is listed here https://developer.apple.com/library/content/documentation/AppleApplications/Reference/SafariWebContent/ConfiguringWebApplications/ConfiguringWebApplications.html

--
http://nodered.org

Join us on Slack to continue the conversation: http://nodered.org/slack
---
You received this message because you are subscribed to the Google Groups "Node-RED" group.

To unsubscribe from this group and stop receiving emails from it, send an email to node-red+unsubscribe@googlegroups.com.

To post to this group, send an email to node...@googlegroups.com.
Visit this group at https://groups.google.com/group/node-red.

To view this discussion on the web, visit https://groups.google.com/d/msgid/node-red/6a075cb3-3186-443e-b08d-fc9e9a3ed23d%40googlegroups.com.