Eheka Pytyvõha

Emboyke pytyvõha apovai. Ndorojeruremo’ãi ehenói térã eñe’ẽmondóvo pumbyrýpe ha emoherakuãvo marandu nemba’etéva. Emombe’u tembiapo imarãkuaáva ko “Marandu iñañáva” rupive.

Kuaave

Inline JavaScript to hide bookmarks sidebar upon opening new browser instance

  • 1 Mbohovái
  • 0 oguereko ko apañuãi
  • 3 Hecha
  • Mbohovái ipaháva EricM

more options

Does anybody know which options to use on the command-line start of Firefox such that the only thing displayed is the area within which an HTML page would be presented?

I want to have it start with everything else turned off or hidden, namely

   memu bar
   page tabs bar
   address bar along all add-on buttons
   bookmarks sidebar

The "-kiosk" option is not appropriate for my needs.

-kiosk doesn't hide the sidebar (Bookmarks or not) if that sidebar was visible during last session before exit ... so ... no, "-kiosk" is not a proper implementation of a "page-only" display mode.

"-private-window" gives no benefit, display-wise, over and above what the "-new-window" option provides.

Everything I've read (even on the Mozilla support site) seems to point to creating a special profile for just that mode, and then to modify the "userChrome.css" file with custom properties to ensure the desired "off" setting for the GUI elements. That seems a rather "small-minded" view, ignoring the potential for huge market of self-contained hard-coded applications that would need only use the Firefox rendering engine, and nothing else!

One comment on Reddit indicated that the functionality was there ("-app" option working with XULrunner), but discontinued!


As a test, I did close all my browsers, leaving the bookmark sidebar visible before closing. I then entered:

firefox -kiosk -safe-mode -private-window ${URL}

I still get the bookmark-sidebar visible, with everything else "hidden" or "disabled", because visible sidebar is my default mode for normal browsing.

Is there no command-line startup switch to force that sidebar to "hide", equivalent to clicking on the "X" on the top-right corner?

OR ...

Is there any programmatic way to tell that to hide using JavaScript in the HTML page that is loaded? Everything I seem to locate refer to in-page Elements only, not Browser Elements. :frowning:

But "kiosk"(fullscreen-mode) is not the mode I want, because I want users to be able to have the simplified browser-based HTML App co-exist on the desktop with other windows, like a normal App.



    • Basic HTML test page** *(myHtmlGame.html)* **:**

``` <meta charset="UTF-8"> <title>myHtmlGame.html</title> <link href="myHtmlGame_bookmarks.css" rel="stylesheet" type="text/css"> <script src="myHtmlGame_bookmarks.js" type="text/javascript"> </script>

Box A
Box B
Box C
Box D
Box E
<script> {what to I place here } </script> ```



    • Basic Javascript file** (*myHtmlGame_bookmarks.js*) **:**

```

// REF: https://stackoverflow.com/questions/1690002/how-can-i-prevent-firefox-showing-my-extensions-sidebar-on-startup var current = this;

var quitObserver = {

  QueryInterface: function(aIID) {
     if (aIID.equals(Components.interfaces.nsIObserver) || aIID.equals(Components.interfaces.nsISupports)) {
        return this;
     }
     throw Components.results.NS_NOINTERFACE;
  },
  observe: function(aSubject,aTopic,aData ) {
     var mainWindow = current._windowMediator.getMostRecentWindow("navigator:browser");
     var sidebar  = mainWindow.document.getElementById("sidebar");
     if (sidebar.contentWindow.location.href == "chrome://daisy/content/sidebar.xul") {
        mainWindow.toggleSidebar('openDaisySidebar', false);
     }
  }

};

setTimeout(function() {

  var mainWindow = current._windowMediator.getMostRecentWindow("navigator:browser");
  var observerService = Components.classes["@mozilla.org/observer-service;1"].getService(Components.interfaces.nsIObserverService);
  observerService.addObserver(quitObserver,"quit-application-granted",false);

},2000); ```


I've tried using this alternative content for the JavaScript file, but that also failed (using '*hideSidebarBookmarks()*' call in the in-line script segment):

``` function hideSidebarBookmarks() { const sidebar = document.getElementById("CustomizableUI.AREA_BOOKMARKS") ; sidebar.hide() ; } ```

I even tried replacing the word "document" with "browser" in the above, still with no success. :-(



    • Startup command :**

``` firefox -new-window ./myHtmlGame.html & ```



    • Basic CSS file** *(myHtmlGame_bookmarks.css)* **:**

``` html { font-size: 14px ; font-family: "Liberation Sans", "Aileron", "Archivo", FreeSerif, serif ; line-height: 1.2em ; }

body { display: block ; background-color: #1F1F1F ; color: #FF0000 ;

margin-top: 0 ; margin-right: 0 ; margin-bottom: 0 ; margin-left: 0 ; }

/*

************************************************************************
*/

.game-grid { display: grid ; grid-template-columns: 300px 300px 60px ; grid-template-rows: 40px 300px 150px ; }

.game-item-1 { grid-column: 1 / span 3 ; grid-row: 1 / span 1 ; border: 1px solid #8FCF8F ; background-color: #1F1F1F ; }

.game-item-2 { grid-column: 3 / span 1 ; grid-row: 2 / span 2 ; border: 1px solid #8FCF8F ; background-color: #1F1F1F ; }

.game-item-3 { grid-column: 1 / span 2 ; grid-row: 2 / span 1 ; border: 1px solid #8FCF8F ; background-color: #1F1F1F ; }

.game-item-4 { grid-column: 1 / span 1 ; grid-row: 3 / span 1 ; /* box-sizing: border-box ; */ border: 1px solid #8FCF8F ; background-color: #1F1F1F ;

padding-left: 3 em ;

display: block ; color: #FFCF4F ;

word-wrap: break-word ; /* overflow-y: scroll ; overflow-y: auto ; */ overflow-anchor: none ; scrollbar-color: grey-black ; scrollbar-width: thin ; scroll-padding-bottom: 20px ;

/* In case you need to kick off effect immediately, this plus JS */ /* height: 100.001vh ; */ }


.game-item-5 { grid-column: 2 / span 1 ; grid-row: 3 / span 1 ; border: 1px solid #8FCF8F ; background-color: #1F1F1F ; }

div { padding-top: 1 em ; padding-right: 0 ; padding-bottom: 1 em ; padding-left: 0 ; }

```

The above will display per the attached image.

Does anybody know which options to use on the command-line start of Firefox such that the only thing displayed is the area within which an HTML page would be presented? I want to have it start with everything else turned off or hidden, namely memu bar page tabs bar address bar along all add-on buttons bookmarks sidebar The "-kiosk" option is not appropriate for my needs. -kiosk doesn't hide the sidebar (Bookmarks or not) if that sidebar was visible during last session before exit ... so ... no, "-kiosk" is not a proper implementation of a "page-only" display mode. "-private-window" gives no benefit, display-wise, over and above what the "-new-window" option provides. Everything I've read (even on the Mozilla support site) seems to point to creating a special profile for just that mode, and then to modify the "userChrome.css" file with custom properties to ensure the desired "off" setting for the GUI elements. That seems a rather "small-minded" view, ignoring the potential for huge market of self-contained hard-coded applications that would need only use the Firefox rendering engine, and nothing else! One comment on Reddit indicated that the functionality was there ("-app" option working with XULrunner), but discontinued! As a test, I did close all my browsers, leaving the bookmark sidebar visible before closing. I then entered: <pre>firefox -kiosk -safe-mode -private-window ${URL}</pre> I still get the bookmark-sidebar visible, with everything else "hidden" or "disabled", because visible sidebar is my default mode for normal browsing. Is there no command-line startup switch to force that sidebar to "hide", equivalent to clicking on the "X" on the top-right corner? OR ... Is there any programmatic way to tell that to hide using JavaScript in the HTML page that is loaded? Everything I seem to locate refer to in-page Elements only, not Browser Elements. :frowning: But "kiosk"(fullscreen-mode) is not the mode I want, because I want users to be able to have the simplified browser-based HTML App co-exist on the desktop with other windows, like a normal App. <br/> <hr/> **Basic HTML test page** *(myHtmlGame.html)* **:** ``` <!doctype html> <html lang="en-US"> <head> <meta charset="UTF-8"> <title>myHtmlGame.html</title> <link href="myHtmlGame_bookmarks.css" rel="stylesheet" type="text/css" /> <script src="myHtmlGame_bookmarks.js" type="text/javascript" > </script> </head> <body> <div class="game-grid" > <div id="boxA" class="game-item-1" > Box A </div> <div id="boxB" class="game-item-2" > Box B </div> <div id="boxC" class="game-item-3" > Box C </div> <div id="boxD" class="game-item-4" > Box D </div> <div id="boxE" class="game-item-5" > Box E </div> </div> <script> {what to I place here } </script> </body> </html> ``` <br/> <hr/> **Basic Javascript file** (*myHtmlGame_bookmarks.js*) **:** ``` // REF: https://stackoverflow.com/questions/1690002/how-can-i-prevent-firefox-showing-my-extensions-sidebar-on-startup var current = this; var quitObserver = { QueryInterface: function(aIID) { if (aIID.equals(Components.interfaces.nsIObserver) || aIID.equals(Components.interfaces.nsISupports)) { return this; } throw Components.results.NS_NOINTERFACE; }, observe: function(aSubject,aTopic,aData ) { var mainWindow = current._windowMediator.getMostRecentWindow("navigator:browser"); var sidebar = mainWindow.document.getElementById("sidebar"); if (sidebar.contentWindow.location.href == "chrome://daisy/content/sidebar.xul") { mainWindow.toggleSidebar('openDaisySidebar', false); } } }; setTimeout(function() { var mainWindow = current._windowMediator.getMostRecentWindow("navigator:browser"); var observerService = Components.classes["@mozilla.org/observer-service;1"].getService(Components.interfaces.nsIObserverService); observerService.addObserver(quitObserver,"quit-application-granted",false); },2000); ``` <br/> <hr/> I've tried using this alternative content for the JavaScript file, but that also failed (using '*hideSidebarBookmarks()*' call in the in-line script segment): ``` function hideSidebarBookmarks() { const sidebar = document.getElementById("CustomizableUI.AREA_BOOKMARKS") ; sidebar.hide() ; } ``` I even tried replacing the word "document" with "browser" in the above, still with no success. :-( <br/> <hr/> **Startup command :** ``` firefox -new-window ./myHtmlGame.html & ``` <br/> <hr/> **Basic CSS file** *(myHtmlGame_bookmarks.css)* **:** ``` html { font-size: 14px ; font-family: "Liberation Sans", "Aileron", "Archivo", FreeSerif, serif ; line-height: 1.2em ; } body { display: block ; background-color: #1F1F1F ; color: #FF0000 ; margin-top: 0 ; margin-right: 0 ; margin-bottom: 0 ; margin-left: 0 ; } /* ************************************************************************ */ .game-grid { display: grid ; grid-template-columns: 300px 300px 60px ; grid-template-rows: 40px 300px 150px ; } .game-item-1 { grid-column: 1 / span 3 ; grid-row: 1 / span 1 ; border: 1px solid #8FCF8F ; background-color: #1F1F1F ; } .game-item-2 { grid-column: 3 / span 1 ; grid-row: 2 / span 2 ; border: 1px solid #8FCF8F ; background-color: #1F1F1F ; } .game-item-3 { grid-column: 1 / span 2 ; grid-row: 2 / span 1 ; border: 1px solid #8FCF8F ; background-color: #1F1F1F ; } .game-item-4 { grid-column: 1 / span 1 ; grid-row: 3 / span 1 ; /* box-sizing: border-box ; */ border: 1px solid #8FCF8F ; background-color: #1F1F1F ; padding-left: 3 em ; display: block ; color: #FFCF4F ; word-wrap: break-word ; /* overflow-y: scroll ; overflow-y: auto ; */ overflow-anchor: none ; scrollbar-color: grey-black ; scrollbar-width: thin ; scroll-padding-bottom: 20px ; /* In case you need to kick off effect immediately, this plus JS */ /* height: 100.001vh ; */ } .game-item-5 { grid-column: 2 / span 1 ; grid-row: 3 / span 1 ; border: 1px solid #8FCF8F ; background-color: #1F1F1F ; } div { padding-top: 1 em ; padding-right: 0 ; padding-bottom: 1 em ; padding-left: 0 ; } ``` The above will display per the attached image.
Mba’erechaha japyhypyre oñondivegua

Opaite Mbohovái (1)

more options

I will also ask that you glance at the discussion at the following page:

  • https://ubuntu-mate.community/t/how-to-start-firefox-as-display-only-window-for-html-interactive-javascript/28973/11

where there is additional discussion of this issue.

¿Imba’eporãva?

Eporandumína

Nde eikéke nde mba’etepe embohovái hag̃ua ñe’ẽmondo. Ikatúpa, emoñepyrũ peteĩ porandu, ndereguerekói gueteriramo nemba’ete.