reptile7's JavaScript blog
Wednesday, September 30, 2009
 
This Window Has No Title, Part 2
Blog Entry #158

Before we get started, and from the In The Name of Completeness Department:

In the first paragraph of the previous post, I said, If you wanted to, say, resize, reshape, reposition, or add some color to the individual chrome bars, neither HTML, CSS, nor JavaScript provides tools for doing so as of this writing - this is not 100% true. Microsoft has implemented a set of eight DHTML properties that can be used to add color to a browser window's scroll bars for MSIE 5.5+ on the Windows platform: scrollbar3dLightColor, scrollbarArrowColor, scrollbarBaseColor, scrollbarDarkShadowColor, scrollbarFaceColor, scrollbarHighlightColor, scrollbarShadowColor, and scrollbarTrackColor. These properties are not 'members' of the window object but are actually CSS extensions whose window-coloring effects are effected when they are applied to the body element. More generally, Microsoft suggests that its scrollbar-color properties can be applied to any element that can give rise to a scrolling mechanism; however, they do not apply to the iframe element.

HTML Goodies' main CSS sector sports a "Scroll Bar Colors" tutorial with a demo page that illustrates all but one of the scrollbar-color properties. (I don't know if any non-MSIE browsers support these properties; I myself don't see any color on Joe's demo page with any of the browsers on my computer. Even as a Mac user, I figured there was a fighting chance that at least Opera would support them: no dice.)

We return now to our discussion of browser window title bars and the visibility thereof. As noted in the last entry, the window object has several Netscape-specific properties corresponding to various window chrome bars; however, it does not have a titlebar property. For secondary windows, JavaScript 1.2 did add a titlebar feature to the window.open( ) method's collection of strWindowFeatures features; the titlebar feature is also supported by MSIE. (Owing to my inability to find specifications for the early versions of JScript, I don't know if Netscape or Microsoft introduced the titlebar feature - it could well have been Microsoft.)

I earlier put Microsoft's titlebar description in front of you; inter alia, it informs us that titlebar is no longer supported by MSIE 5.5+ and is ignored prior to MSIE 5.5. Doesn't sound like such a useful feature, does it? And what does Netscape/Mozilla have to say about titlebar?

In the JavaScript 1.3 Client-Side Reference, the titlebar description reads:

titlebar
(JavaScript 1.2) If yes, creates a window with a title bar. To set the titlebar to no, set this feature in a signed script.

On Mozilla's current window.open( ) page, titlebar is listed in a "Features requiring privileges" subsection, which collects a set of seven features [that] require the UniversalBrowserWrite privilege [to change their default settings], otherwise they will be ignored. Chrome scripts have this privilege automatically, others have to request it from the PrivilegeManager. The titlebar entry therein reads:

titlebar
By default, all new secondary windows have a titlebar. If set to no, this feature removes the titlebar from the new secondary window.
Mozilla and Firefox users can force new windows to always render the titlebar by setting dom.disable_window_open_feature.titlebar to true in about:config or in their user.js file.
Supported in: Netscape 6.x, Netscape 7.x, Mozilla 1.x, Firefox 1.x

Brief commentary on signed scripts, the UniversalBrowserWrite privilege, chrome scripts, and PrivilegeManager

• Signed scripts also date to JavaScript 1.2. Mozilla maintains a "Signed Scripts in Mozilla" document here; several key historical links in this article are dead. "Signing" a script means associating with that script a certificate file that (a) serves as an ID card for the script's author and (b) in effect says, "I wrote this script, which seeks to do something out of the ordinary. Will you kindly grant it permission to do so?" The certificate file itself must be obtained from a certificate authority. Scripts are signed via a command-line program called signtool, which as far as I know is not available for the Macintosh and is thus 'beyond my reach'. The signtool program is documented here; you can download it (more specifically its source code, which you'll have to compile) here if you're using a supported OS and would like to give it a shot.

• The UniversalBrowserWrite privilege is vaguely defined in the "Privileges" subsection of the "Signed Scripts in Mozilla" article; see the subsequent "JavaScript Features Requiring Privileges" subsection for what it will allow you to do.

• Chrome scripts? Mozilla does not explain this term and my attempts to find a meaningful definition therefor elsewhere on the Web have not been successful.

PrivilegeManager is a class belonging to Netscape's custom netscape.security Java package. PrivilegeManager has an enablePrivilege( ) instance method for activating the UniversalBrowserWrite and other privileges via the following syntax:

netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserWrite");

BTW, the above PrivilegeManager command can be used to write the visible property of the chrome bar objects for a primary browser window that we discussed in the previous entry - see here, for example.

(The PrivilegeManager link on Mozilla's window.open( ) page redirects to the Mozilla Development Center's home page. Strangely, you won't find netscape.security's Javadoc documentation at any of Mozilla's Web sites. My PrivilegeManager link above was fished out of the Internet Archive; also, CardContact currently maintains a netscape.security Javadoc here.)

But here's the kicker: even if you were to go get a certificate file and then do the signtool thing, your titlebar=no script will only work with the Mozilla/Netscape family of browsers. And if MSIE/Safari/Opera* users can't run your script, is it really worth going through all of this? To ask the question is to answer it.
(*Actually, Opera will 'run' the script but will not act on the titlebar feature - vide infra.)

Local experimentation

The "Signed Scripts in Mozilla" article concludes with a broken link to Danny Goodman's dated-but-still-useful "Applying Signed Scripts" article, which can be accessed here, again courtesy of the Internet Archive. Interestingly, "Applying Signed Scripts" contains an "Experimenting Locally Without a Certificate" section that discusses a means of testing support for the UniversalBrowserWrite-requiring strWindowFeatures features without obtaining a certificate file or using signtool; here are its instructions as they apply to Firefox:

(1) Launch Firefox.
(2) Open the about:config pane.
(3) Add a new Boolean signed.applets.codebase_principal_support preference to the about:config pane; set its value to true (if it isn't already true).
(See the "Adding, modifying, and resetting preferences" section of Mozilla's about:config page for how to do this.)
(4) Close the about:config pane.

Seems simple enough to try out, eh? I did the above and then ran the script below with Firefox after also setting the dom.disable_window_open_feature.location, dom.disable_window_open_feature.resizable, and dom.disable_window_open_feature.status preferences in the about:config pane to false:

netscape.security.PrivilegeManager.enablePrivilege("UniversalBrowserWrite");
var newWindow = window.open("", "", "height=100,width=100,left=100,top=100,titlebar=no");
netscape.security.PrivilegeManager.disablePrivilege("UniversalBrowserWrite");
var newContent = "<html><body style='background-color:red;color:white;'><h3>Hi</h3>";
newContent += "<form style='text-align:center;'><input type='button' value='Ta-ta!'";
newContent += "onclick='self.close( );'></form></body></html>";
newWindow.document.write(newContent);
/* This code is adapted from Example 2 in the "Applying Signed Scripts" article. */


Firefox first unfurled from the top of the Navigation Toolbar the following dialog box:

Firefox's Internet Security confirm dialog

Clicking the button then popped up the newWindow window - look Ma, no chrome! (OK, it's got borders...)

The newWindow window

N.B. With its title bar gone, the newWindow window could not be dragged on the screen.

The script throws a Can't find variable: netscape error when using Safari. More interesting is what happens with Opera. Opera also popped up the newWindow window, but with a title bar, a domain bar, and a resizing grippy; the Opera Java Console, which is accessed via the Advanced submenu of the Tools menu, had a message waiting for me:
Netscape security model is no longer supported. Please migrate to the Java 2 security model instead.
The "Java 2 security model" is documented here for anyone who wishes to pursue this further.

And that wraps up our tour of HTML Goodies' "Opening New Windows With JavaScript" series of tutorials. In the following entry, we'll address a completely different topic in moving to the next "Beyond HTML : JavaScript" tutorial: "The onerror Event Handler".

reptile7

Saturday, September 19, 2009
 
This Window Has No Title
Blog Entry #157

If you've been following along, you know now that a browser window can be subdivided into
(a) a viewport part holding the document content, and
(b) a chrome part comprising the window's bars and borders.
HTML and CSS allow us fine-grained, down-to-the-pixel control of the document content area. Control over the browser chrome is another story, however, at least at the simple level of coding that I discuss on this blog. If you wanted to, say, resize, reshape, reposition, or add some color to the individual chrome bars, neither HTML, CSS, nor JavaScript provides tools for doing so as of this writing. At best, we are able to show and hide some of the chrome bars via the browser's View menu, and that's about it.

JavaScript 1.2 implemented six chrome bar properties/child objects of the window object: locationbar, menubar, personalbar, scrollbars, statusbar, and toolbar; these properties are 'Netscape-specific', i.e., they were never picked up by Microsoft. As objects, the chrome bars have a single, Boolean property, visible, that in theory can turn the bars on and off when set to true and false, respectively. Of the OS X browsers on my computer, Firefox and Safari support the chrome bar properties/objects (MSIE and Opera return undefined for them), and will read but not write their visible property for both primary and secondary browser windows.
(Firefox will write the visible property with the aid of some Java, but this is a can of worms we're not going to open, at least not right now.)

As we've seen in some of the "Opening New Windows With JavaScript" scripts discussed in recent entries, the strWindowFeatures parameter of the window.open( ) method can in theory equip secondary windows with the aforelisted chrome bars via the following features: location, menubar, directories, scrollbars, status, and toolbar, respectively; however, the actual effects of these features vary somewhat from browser to browser (and at least for menubar, from platform to platform). Moreover, Microsoft and Mozilla, the 'big two' browser vendors, now allow authors less control over secondary window chrome than they used to; for example, we saw in the pop features subsection of Blog Entry #152 that Firefox gives a window.open( )-opened window an address bar and a status bar even if location and status are specifically set to no in the strWindowFeatures string.

A browser window's title bar would also seem to be part of the window chrome even though the title in that bar is a property of the window's document and not of the window itself. Both Microsoft and Mozilla list a strWindowFeatures titlebar feature that in theory can remove a secondary window's title bar when set to no. But in practice, for security reasons, neither Microsoft nor Mozilla wants you to be able to get rid of the title bar or even push it off-screen; in the "Internet Explorer Window Restrictions" section of an "Enhanced Browsing Security" article, Microsoft elaborates:
The visible security features of Internet Explorer windows provide information to the user to help them ascertain the source of the Web page and the security of the communication that uses that page. When these elements are hidden from view, the user might think they are on a more trusted page or interacting with a system process when they are actually interfacing with a malicious host. Malicious use of window relocation can present false information to the user, obscure important information, or otherwise “spoof” important elements of the user interface in an attempt to motivate the user to take unsafe actions or to divulge sensitive information.
In other words - you may have to crank up your imagination a bit, as I had to when I first read this - losing a window's title bar is part of the 'toolbox of deception' that the bad guys use to compromise a user's computing environment. (Hmmm...makes you wonder about some of the people who write in to Joe asking for scripts...)

Furthermore, Microsoft's description of the titlebar feature on its current window.open( ) page is not exactly a ringing endorsement thereof:
titlebar = { yes | no | 1 | 0 }
Specifies whether to display a Title Bar for the window. The default is yes.

Internet Explorer 5.5 and later. This feature is no longer supported. The Title Bar remains visible unless the fullscreen sFeature is active.

This parameter is ignored prior to Internet Explorer 5.5. It applies only if the calling application is an HTML Application or a trusted dialog box.

We'll have more to say about the titlebar feature later, but for now let us note that the MSDN titlebar entry namechecks the window.open( ) fullscreen feature - The Title Bar remains visible unless the fullscreen sFeature is active - which was discussed in the previous entry. Microsoft's description of the fullscreen feature reads:
fullscreen = { yes | no | 1 | 0 }
Specifies whether to display the browser in full-screen mode. The default is no. Use full-screen mode carefully. Because this mode hides the browser's title bar and menus, you should always provide a button or other visual clue to help the user close the window. ALT+F4 closes the new window.

Internet Explorer 7. A window in full-screen mode does not need to be in theatre mode.

Prior to Internet Explorer 7 a window in full-screen mode must also be in theater mode (channelmode).
This brings us to our script du jour, namely, the script offered by HTML Goodies' "New Window: No Title Bar" tutorial, which attempts to use the fullscreen feature to create a new window without a title bar. The "New Window: No Title Bar" script is reproduced below:

<script type="text/javascript">

function goNewWin( ) {



/* The new window's final height and width: */
var NewWinHeight = 200;

var NewWinWidth = 200;



/* Positional offsets for the new window relative to the screen's upper-left-hand corner
: */
var NewWinPutX = 10;
var NewWinPutY = 10;



/* In the following command, the strWindowFeatures string must be all on one line, but a line break can follow either the strUrl or strWindowName parameter. */



TheNewWin = window.open("untitled.html", "TheNewpop",
 "fullscreen=yes,toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=no,resizable=no");

TheNewWin.resizeTo(NewWinHeight, NewWinWidth);

TheNewWin.moveTo(NewWinPutX, NewWinPutY); }


</script>


The "New Window: No Title Bar" script is quite straightforward - in brief, here's what's supposed to happen:

(1) By setting fullscreen to yes and the various chrome bar features to no, the script's window.open( ) command pops up a full-screen and almost completely chromeless window, i.e., the new window will have borders but the rest of the chrome, including the title bar, should be gone.

(2) The script uses the resizeTo( ) method of the window object to shrink the full-screen window to a 200px-by-200px window, which is then slightly offset from (10 pixels to the right, 10 pixels below) the monitor screen's upper-left-hand corner via the moveTo( ) method of the window object - we previously discussed the resizeTo( ) and moveTo( ) methods in Blog Entry #119.

In the previous post, I stated that iCab 3.0.5 is the only browser on my computer that supports the fullscreen feature. More specifically, iCab 3.0.5 supports fullscreen's full-screen effect but not its no-title-bar effect. Running the "New Window: No Title Bar" demo when using iCab 3.0.5 in the SheepShaver environment produces the window below:

The 'New Window: No Title Bar' demo window when using iCab 3.0.5

I didn't expect the demo to give a new window lacking a title bar with the other browsers on my computer, and it doesn't.

I don't know how fullscreen shakes out on the Windows platform. (Loyal Mac user that I am, for a while now I've thought of getting a cheap PC purely for the purpose of testing code - perhaps I should do that one of these days.) At the bottom of the "New Window: No Title Bar" page are four comments by readers, at least three of whom tested the tutorial demo with MSIE 7 and are thus necessarily PC users. One of these commenters, jameex, unpromisingly reports, [Y]eah me too running on ie7 title bar still appears. The other two IE 7 commenters say that they're getting a menu bar but make no mention of the title bar.

Not so surprisingly, Microsoft itself pours cold water on the use of fullscreen to ditch a new window's title bar. As referenced in the Note on fullscreen appearing on Mozilla's window.open( ) page, the "Script sizing of Internet Explorer windows" subsection of the aforelinked "Internet Explorer Window Restrictions" MSDN resource declares:
When creating a window, the definition of the fullscreen=yes specification is changed to mean “show the window as maximized,” which will keep the title bar, address bar, and status bar visible.
So maybe the "New Window: No Title Bar" script did work as advertised once upon a time, but don't get your hopes up if you're using a modern browser.

At this point, I think we've said what we need to say about the fullscreen feature. But let's get back to the titlebar feature. Microsoft's titlebar definition is given above; we'll flesh out Mozilla's take on titlebar in the next post.

reptile7

Tuesday, September 08, 2009
 
Full Screen Ahead
Blog Entry #156

HTML Goodies' "New Window: No Title Bar" tutorial is an outgrowth of an earlier "So, You Want A FullScreen Browser, Huh?" tutorial, which we should briefly discuss before going through "New Window: No Title Bar".

As previously noted in Blog Entry #154, "So, You Want A FullScreen Browser, Huh?" concerns itself with the maximization of window.open( )-opened windows via the strWindowFeatures fullscreen feature:

<script type="text/javascript">
function fullwin( ) {
window.open("/legacy/beyond/dhtml/bigpage.html", "big", "fullscreen,scrollbars"); }
/* The strUrl and strWindowName values are those for the tutorial demo. */
</script>


(Contra the last paragraph in the tutorial's "Open In FullScreen Mode" section, big is not the name of "the page" but of the window holding that page. The document object does not have, nor does it need, a name property.)

Just to be clear before moving forward, "maximization" and "fullscreen" mean occupying all the available displayable surface of a screen.

The fullscreen feature was implemented by Microsoft and remains a 'Microsoft feature', notwithstanding Joe's claim that [i]t is available in both Internet Explorer and Netscape Navigator:

• With respect to 'classic' (pre-DOM) JavaScript, fullscreen is not listed in the "Optional features to specify for a new window" table in the window.open( ) section of the JavaScript 1.3 Client-Side Reference.

• In the "Window functionality features" subsection of Mozilla's current window.open( ) page, there's a fullscreen entry that in part reads:

fullscreen
Do not use. Not implemented in Mozilla. There are no plans to implement this feature in Mozilla.

Joe provides a fullscreen demo in the "Click to Full Screen Mode" section of the tutorial. Clicking the button does open a new window, but generally not a maximized window*, holding a bigpage.html document. However, testing the tutorial demo with various browsers did not sort out to my satisfaction support for the fullscreen feature (or whether it was having any effect at all, for that matter); towards this end, I found it necessary to subtract fullscreen from the strWindowFeatures string and then compare window-rendering results in the presence and absence of fullscreen. Without getting into the details, I can now report that, with the sole exception of iCab 3.0.5, none of the browsers on my computer supports the fullscreen feature.

(*For all browsers, and unrelated to the fullscreen feature, the new window is maximized if the opener window was itself originally rendered as a maximized window - see the "Description" section of Mozilla's window.open( ) page.)

More specifically, the fullscreen feature has no effect with the following browsers:
• In the OS X environment: MSIE 5.2.3, Opera 9.64, Safari 4.0.3, Firefox 3.5.2, and Camino 1.6.9
• In the SheepShaver environment: MSIE 4.5 and Netscape Communicator 4.61

But perhaps fullscreen is best left on the shelf, so to speak; Mozilla's window.open( ) fullscreen entry also states:
fullscreen always upsets users with large monitor screen[s] or with dual monitor screen[s]. Forcing fullscreen onto other users is also extremely unpopular and is considered an outright rude attempt to impose [a] web author's viewing preferences onto users.
Got that, maximizers? On the other hand, I can certainly see how a fullscreen window would be desirable in some situations, e.g., for displaying a really large image or table. Also, the Wiktionary "full screen" page to which I linked at the beginning of the post notes another useful fullscreen application: Most computer games are played in full screen mode.

Closing bigpage.html's window

The bigpage.html document holds a Close window hyperlink for closing the not-so-fullscreen window:

<a href="#" onclick="window.close('big');">Close window</a>

In the tutorial's "Close It Up" section, Joe alleges that the new window name (big, as set by the second window.open( ) parameter) must be fed as a parameter to the window.close( ) command for the command to work. For the record, folks:
(1) The close( ) method of the window object takes no parameters.
(2) The name property of the window object is used to target link and form output to a window/frame, and that's pretty much it.
In the event, however, clicking the Close window link throws no errors and uneventfully closes the new window.

The "Close It Up" section also gives the corresponding code for closing the new window with a push button, which semantically is a better element choice for this type of user interface action.

According to Microsoft, the fullscreen feature hides the [new window's] title bar and menus, ergo its connection to "New Window: No Title Bar", which we'll dissect in the next entry.

reptile7


Powered by Blogger

Actually, reptile7's JavaScript blog is powered by Café La Llave. ;-)