Starting with nw: Problems, questions and suggestions (I)

[Udo Weik]

A very first hello,

I just started to work with node-webkit, newest Windows binary (v0.8.4).
I have some problems (P), questions (Q) and suggestions (S). Concerning
the problems (P), I'm not sure whether I'm the bug or there is really a
bug. Therefore I would be really happy when somebody could verify my
issues.

I'm using WIN 7 64-bit.


Let's start. That is my current tutorial:
http://net.tutsplus.com/tutorials/javascript-ajax/introduction-to-html5-desktop-apps-with-node-webkit/
The root folder structure looks like:
\html
+- index.html
\js
+- main.js
\node_modules
+- file.js

I launch that app from its folder. I start the debugger and try
to load the sources with [Ctrl+o]. The dialog shows
main.js
index.html
...
...
...
file.js
...

I load all three files.
P1: The index.html editor is empty, the other two files are loaded.
Q1: The file names "main.js" and "index.html" are shown in their
appropriate tab. But "file.js" with its path at the beginning.
Why?
P2: I edit something in the sources.
a. Context menu "Save" - why is the "Save as"-dialog shown?
b. Hotkey [Ctrl+s] - first a yellow '!' icon is shown in the
tab with the hint like "not saved to the local file system".
Why not? Second try the "Save as"-dialog is shown. Confusing.
Q2: After changes in my sources, I want to reload the project.
How can I accomplish that?
S1: All project (user) files should be shown in the source dialog
at the very beginning.
S2: The source dialog must be resizable. And that setting must be
stored. I can't see the path of my files completely.
S3: Pls. add accelerator keys/shortcuts ([Alt+_]] to the debugger
main menu. I'm working with automation. And there are a lot of
handicapped people in the universe:
http://en.wikipedia.org/wiki/Accessibility

P3: Pls. check all the shorcuts:
https://developers.google.com/chrome-developer-tools/docs/shortcuts
E. g. "Open Developer Tools", [F12] or [Ctrl+Shift+l] doesn't work.
There should be a printable list (PDF) of all the shorcuts for
- node-webkit
- Chrome browser itself.
S4: All the shortcuts should be customizable, especially for non-english
keyboard users.

S5: Add hints to the buttons in the browser page.
Q3: The reload-button is two times shown in the browser page. Why?
S6: A system menu would be usefull (starting the debugger, reload...).

S7: It should be possible to determine the current version of nw via
the GUI (system menu).


That's it. Many thanks for all your efforts and greetings
Udo

---
Diese E-Mail ist frei von Viren und Malware, denn der avast! Antivirus Schutz ist aktiv.
http://www.avast.com

[rolo...@gmail.com]

I think you are confusing the example (a simple editor) with the application (node-webkit)

Maybe you should start with a simple static webpage without javascript to study the Developer Tools.

When I started I zipped and renamed the source every time, now finally I understood you can simply drag the folder with your source scripts (package.json should be in it) on nw.exe

Do this for reloading scripts.

Op zaterdag 18 januari 2014 00:27:51 UTC+1 schreef weikengoff:

[Udo Weik]

Hello rolograaf,

many thanks for your answer.

> I think you are confusing the example (a simple editor) with the application (node-webkit)
> Maybe you should start with a simple static webpage without javascript to study the Developer Tools.

And what is the difference when I only use a simple html-file (index.html)?
I can select that file in the file explorer in the sources tab and when that
file is loaded the editor (I mean the editor in that tab) is empty. The Java-
Script files from the mentioned tutorial are shown and are editable. When for
some unthinkable reason it shouldn't be possible that .html files are editiable
in that debugger why isn't a corresponding message shown?

> When I started I zipped and renamed the source every time, now finally I understood you can simply drag the folder with your source scripts (package.json should be in it) on nw.exe

Maybe that is a new feature of node-webkit, see:
https://github.com/rogerwang/node-webkit/wiki/How-to-run-apps
node-webkit can load an app in two ways:
- From a folder. The startup path specifies this folder.
- From a .nw file (a renamed .zip-file). The startup path specifies the file.
Of course there must be a .json file. But avoiding creating the archive is
really an important and necessary option. I would say a "must have".

> Do this for reloading scripts.

From a "modern" IDE I expect that changes in the sources are detected automati-
cally and the appropriate actions are started.


Many thanks and greetings
Udo

> http://en.wikipedia.org/wiki/Accessibility <http://en.wikipedia.org/wiki/Accessibility>

>
> P3: Pls. check all the shorcuts:

> https://developers.google.com/chrome-developer-tools/docs/shortcuts <https://developers.google.com/chrome-developer-tools/docs/shortcuts>

> E. g. "Open Developer Tools", [F12] or [Ctrl+Shift+l] doesn't work.
> There should be a printable list (PDF) of all the shorcuts for
> - node-webkit
> - Chrome browser itself.
> S4: All the shortcuts should be customizable, especially for non-english
> keyboard users.
>
> S5: Add hints to the buttons in the browser page.
> Q3: The reload-button is two times shown in the browser page. Why?
> S6: A system menu would be usefull (starting the debugger, reload...).
>
> S7: It should be possible to determine the current version of nw via
> the GUI (system menu).
>
>
> That's it. Many thanks for all your efforts and greetings
> Udo
>
> ---
> Diese E-Mail ist frei von Viren und Malware, denn der avast! Antivirus Schutz ist aktiv.
> http://www.avast.com
>

> --
> You received this message because you are subscribed to the Google Groups "node-webkit" group.
> To unsubscribe from this group and stop receiving emails from it, send an email to node-webkit...@googlegroups.com.
> For more options, visit https://groups.google.com/groups/opt_out.

[Chris Turnbull]

Hi there! I'll try and chip in and answer some of the more obvious questions where I can!

On Friday, 17 January 2014 23:27:51 UTC, weikengoff wrote:

Q2: After changes in my sources, I want to reload the project.
     How can I accomplish that?

If you've not hidden it, press the reload button at the top of the window.

Otherwise you can do document.location.href = document.location.href; in your code or in the console.

 

S1: All project (user) files should be shown in the source dialog
     at the very beginning.

Personally I'd rather they not be; I've usually got everything that I'm working on open in an editor, and it's much less clutter to only see the files that I'm currently debugging open in the source.

You can easily open them from the list by pressing Ctrl-o if you need to look at one.

 

P3: Pls. check all the shorcuts:
     https://developers.google.com/chrome-developer-tools/docs/shortcuts
     E. g. "Open Developer Tools", [F12] or [Ctrl+Shift+l] doesn't work.
     There should be a printable list (PDF) of all the shorcuts for
     - node-webkit
     - Chrome browser itself.

Node-webkit is designed for making web-apps that run in kiosk mode. These shortcuts are not bound by default for a good reason.

If you need them then listen for the keypresses and then fire the JavaScript command to open the dev tools - see https://github.com/rogerwang/node-webkit/wiki/Debugging-with-devtools for more information.

 

S4: All the shortcuts should be customizable, especially for non-english
     keyboard users.

As above, I think it's up to you to implement this yourself. Maybe you can find a good JS library to do it for you? E.g. something like Mousetrap (http://craig.is/killing/mice) - though that was just the first example I found on Google, there may be better ones.

[Udo Weik]

Hello Chris,

many thanks for all your infos!

> You can easily open them from the list by pressing Ctrl-o if you need to look at one.

But why is the index.hmtl not shown in the new opened editor tab? Empty! JavaScript
files are loaded and can be edited.

> ...E.g. something like Mousetrap (http://craig.is/killing/mice)...

Great, didn't know it. A really valuable hint, looked for something like that since
some time. You know, the internet is an universe!


Many thanks and greetings

[Chris Turnbull]

On Tuesday, 21 January 2014 00:05:10 UTC, weikengoff wrote:

> You can easily open them from the list by pressing Ctrl-o if you need to look at one.

But why is the index.hmtl not shown in the new opened editor tab? Empty! JavaScript
files are loaded and can be edited.

Wait, editor? Chromium doesn't have an editor. What editor are you talking about?

It has a debugging tool for JavaScript, but there's no text editor there.