• Tags
  • Documentation
  • Order
  • Register
  • Login
Duet3D Logo Duet3D
  • Tags
  • Documentation
  • Order
  • Register
  • Login

Hack: create a standalone desktop application out of the web UI.

Scheduled Pinned Locked Moved
Duet Web Control
web ui nativefied
6
14
2.3k
Loading More Posts
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • undefined
    svenyonson
    last edited by svenyonson 4 Jan 2019, 22:51 1 Apr 2019, 21:03

    If you are running the Web UI on a Mac, PC, or Windows here is a cool trick to create a native application for controlling the Duet WiFi. The advantage is that your control interface doesn't get lost in a sea of browser tabs, and you can keep it in your dock for easy access. I little techie experience is useful but not too difficult.

    I installed this for my Ender 3. If you have multiple printers, create an app for each!

    Note: These instructions are for macOS. Yours may be slightly different on other platforms.

    More info: https://github.com/jiahaog/nativefier
    You'll need node.js and npm installed on your machine. Then, it is easy:

    From the terminal app:

    # Install nativefier
    $ sudo npm install nativefier -g
    
    # Lots of options for the application frame, like sizing, fullscreen, single-instance, etc.
    $ nativefier --help         
    
    # Create the application frame. (substitute your IP address)
    $ nativefier -f -n "Duet Ender 3" --single-instance http://192.168.0.34/
    
    # "Duet Ender 3.app" created. Move to where you want it and run.
    

    0_1554153030285_Screenshot 2019-03-28 18.36.16.png

    undefined undefined 2 Replies Last reply 2 Apr 2019, 14:12 Reply Quote 6
    • undefined
      Phaedrux Moderator
      last edited by 2 Apr 2019, 01:19

      That's great. I'll have to try that out.

      Z-Bot CoreXY Build | Thingiverse Profile

      1 Reply Last reply Reply Quote 0
      • undefined
        gtj0
        last edited by 2 Apr 2019, 11:29

        It's a handy little app. If you use Chrome, you can also do this directly in Chrome under "More Tools", "Create Shortcut" or by starting chrome with google-chrome --app=http://<address>

        undefined 1 Reply Last reply 3 Apr 2019, 16:58 Reply Quote 3
        • undefined
          kungpaoshizi @svenyonson
          last edited by 2 Apr 2019, 14:12

          @svenyonson I just make my printer address my home page so whenever I open a web browser, there I am.. 🙂
          This does make me want to program an application in c#. Could add a few more things so it would be like dwc supports more.

          undefined 1 Reply Last reply 2 Apr 2019, 19:10 Reply Quote 1
          • undefined
            svenyonson @kungpaoshizi
            last edited by 2 Apr 2019, 19:10

            @kungpaoshizi I suppose - but then you'd get a 404 every time you use a browser and your printer is turned off - which in my case is 99% of the time. And what if you have more than one printer? (everyone should have at least 2 :).

            1 Reply Last reply Reply Quote 0
            • undefined
              kungpaoshizi
              last edited by 3 Apr 2019, 12:18

              Secondary tabs 😛

              1 Reply Last reply Reply Quote 0
              • undefined
                zapta @gtj0
                last edited by 3 Apr 2019, 16:58

                @gtj0 said in Hack: create a standalone desktop application out of the web UI.:

                you can also do this directly in Chrome under "More Tools", "Create Shortcut"

                Worked for me. Thanks for posting.

                undefined 2 Replies Last reply 3 Apr 2019, 17:14 Reply Quote 0
                • undefined
                  svenyonson @zapta
                  last edited by 3 Apr 2019, 17:14

                  @zapta Yes that works - I was running an older version of chrome which didn't have the Create Shortcut feature. Even easier than using nativefier. That said, there may be more possibilities, such as tab support, window size, full screen mode with the nativefier method. Probably not needed for Duet Wifi control though.

                  1 Reply Last reply Reply Quote 0
                  • undefined
                    svenyonson @zapta
                    last edited by 3 Apr 2019, 17:22

                    @zapta Also, for some applications where you want to download to a specific location on your file system, since nativefier uses a privileged webview, you can make it open a File Save As dialog instead of just downloading to your downloads directory (--file-download-options). Anyway, for some applications it might make a difference. FYI here are the available options when creating the application frame.

                    Options:
                      -V, --version                         
                      -n, --name <value>                    
                      -p, --platform <value>                
                      -a, --arch <value>                    
                      --app-version <value>                 
                      --build-version <value>               
                      --app-copyright <value>               
                      --win32metadata <json-string>         
                      -e, --electron-version <value>        
                      --no-overwrite                        
                      -c, --conceal                         
                      --counter                             
                      --bounce                              
                      -i, --icon <value>                    
                      --width <value>                       
                      --height <value>                      
                      --min-width <value>                   
                      --min-height <value>                  
                      --max-width <value>                   
                      --max-height <value>                  
                      --x <value>                           
                      --y <value>                           
                      -m, --show-menu-bar                   
                      -f, --fast-quit                       
                      -u, --user-agent <value>              
                      --honest                              
                      --ignore-certificate                  
                      --disable-gpu                         
                      --ignore-gpu-blacklist                
                      --enable-es3-apis                     
                      --insecure                            
                      --flash                               
                      --flash-path <value>                  
                      --disk-cache-size <value>             
                      --inject <value>                      
                      --full-screen                         
                      --maximize                            
                      --hide-window-frame                   
                      --verbose                             
                      --disable-context-menu                
                      --disable-dev-tools                   
                      --zoom <value>                        
                      --internal-urls <value>               
                      --crash-reporter <value>              
                      --single-instance                     
                      --processEnvs <json-string>           
                      --file-download-options <json-string> 
                      --tray                                
                      --basic-auth-username <value>         
                      --basic-auth-password <value>         
                      --always-on-top                       
                      -h, --help
                    
                    1 Reply Last reply Reply Quote 0
                    • undefined
                      zapta
                      last edited by 3 Apr 2019, 23:15

                      @svenyonson, yes, that approach has more option but it requires downloading third party executable that I try to avoid on my go-to computer.

                      I also saw this approach that doesn't require third party binaries https://developer.chrome.com/apps/app_codelab_basics

                      Anyway, thanks for sharing the app idea with us.

                      undefined 1 Reply Last reply 5 Apr 2019, 01:52 Reply Quote 0
                      • undefined
                        svenyonson @zapta
                        last edited by 5 Apr 2019, 01:52

                        @zapta Thanks for the link - always looking for new ways to do things. As far as the third party executable, it's open source and what you are actually running is javascript so you can see the source if you want to.

                        1 Reply Last reply Reply Quote 0
                        • undefined
                          zapta
                          last edited by 5 Apr 2019, 05:02

                          @svenyonson said in Hack: create a standalone desktop application out of the web UI.:

                          it's open source and what you are actually running is javascript so you can see the source if you want to

                          I was referring to the tools, npm and nativefier, I don't have them installed on my machine.

                          Your idea of a duet app is very good. I just need to figure out how to achieve it within the security constraints of my machine of choice.

                          undefined 1 Reply Last reply 10 Apr 2019, 01:24 Reply Quote 0
                          • undefined
                            svenyonson @zapta
                            last edited by 10 Apr 2019, 01:24

                            @zapta I always err on the side of caution so I do appreciate your security concerns. However, both npm and nativefier are interpreted javascript applications and you could explore the code if you so wished - not even minified or obfuscated so you can actually read it. While nativefier is not a mainstream tool, npm is a pretty universal package manager, like apt for linux. Both npm and nativefier do require node.js to be installed, as it is the javascript interpreter for non-browser applications.

                            npm -> ../lib/node_modules/npm/bin/npm-cli.js
                            

                            and

                            nativefier -> ../lib/node_modules/nativefier/lib/cli.js
                            

                            Not that you'd want to spend an evening looking at the code, but it's not opaque like a binary.

                            1 Reply Last reply Reply Quote 2
                            • undefined
                              Rudy2A @svenyonson
                              last edited by 2 Oct 2019, 21:39

                              @svenyonson Thank you for sharing ... it's great and practical!

                              1 Reply Last reply Reply Quote 0
                              • First post
                                Last post
                              Unless otherwise noted, all forum content is licensed under CC-BY-SA