Monday, June 5th, 2006
Prototype Window Class
The Prototype Window Class allows you to add in-browser windows with the flick of a few lines of code (and CSS to tweak).
The window features:
- Resizable windows
- Minimize/Maximize
- Modal Dialogs
- Visual Effects
- Skinnable
Usage
JAVASCRIPT:
-
-
win = new Window('window_id', {title: "Sample", top:100, left:350})
-
win.getContent().innerHTML = "<h1>Hello world !!</h1>";
-
win.setDestroyOnClose();
-
win.showCenter();
-
Surprisingly there is even good documentation, Samples, and more.
3.8 rating from 93 votes
And finally, after moving past the fundamentals of xmlHttpRequest, we come back to good ol DHTML – js/html, UI widgets, databinding. And this is where the likes of dojo and prototype fall far behind the established players. Eg, domapi, bindows (and others) go way beyond the basics of a window widget. Give me a listgrid with sortable, moveable columns, full keystroke and tab support and I’ll give you a keystroke optimised, data entry Business Application. Otherwise, we are stuck with moribund mouse bound Web Apps that any data entry operator will have a pink fit if you suggest they move from their old but extremely fast CHUI terminals.
So where is such a widget based on dojo? Prototype? Last I looked there isn’t.
http://www.cnn.com/2006/TECH/06/02/data-entry-operators-across-america-have-pink-fits-over-latest-ajax-craze.html
128 kb of JavaScript for that is kind of heavy huh?
However, I am glad to give $10.00 to an open source developer (as I just did for this project) and let someone else pay $495.00 for a library (domapi) that will ultimately become obsolete. Much functionality, found in many libraries, tools and products, has already been overrun by open source projects that are more stable (e.g. the domapi listgrid component continues to break while moving columns) and powerful (many open source success stories have truly broken the mold in their niche or area) that it is unwise too complain of a “lack of steak” when the for-profit outfits will always be stuck “selling the sizzle.”
there’s another one: http://www.net4visions.com/dev/dialog/dialog.htm
[...] Prototype Window Class. Nifty. (via) [...]
The code is rather messy and not particularly extensible beyond skinning the buttons etc. You can create your own using prototype, using the handle attribute of draggable window, then use this patch (http://dev.rubyonrails.org/ticket/3727) and extend it a bit to make it work correctly (patch assumes window is fixed, easy fix tho). Also it’s better (or tho not as portable) to clone your window from a page (eg var winItem = $(’_win’).cloneNode(true);) rather than create the layout inside the javascript.
Enjoy
ps someone needs to run with this (http://knutties.livejournal.com/24270.html), it’s absolutely brilliant, you can pull the code out and effectively create fragments of content, effectively giving you transclusion capability. Combine that with the windows as mentioned above and you have a really nice little platform for knowledge management, now thats web2.0 baby!
The code is rather messy and not particularly extensible beyond skinning the buttons etc. You can create your own using prototype, using the handle attribute of draggable window, then use this patch (http://dev.rubyonrails.org/ticket/3727) and extend it a bit to make it work correctly (patch assumes window is fixed, easy fix tho). Also it’s better (or tho not as portable) to clone your window from a page (eg var winItem = $(’_win’).cloneNode(true);) rather than create the layout inside the javascript.
Enjoy
ps someone needs to run with this (http://knutties.livejournal.com/24270.html), it’s absolutely brilliant, you can pull the code out and with minor mods can effectively capture fragments of content, giving you transclusion capability! Combine that with the windows as mentioned above and you have a really nice little platform for knowledge management, now thats web2.0 baby!
“However, I am glad to give $10.00 to an open source developer (as I just did for this project) and let someone else pay $495.00 for a library (domapi) that will ultimately become obsolete.”
Hey – can’t argue against the $ proposition of a free library. However that does diminish when developing commercial apps and the domapi does have a free/non commercial licence. But whether they ultimately will become obsolete – who knows? Its the here, the now, and the sort of widget support that domapi and bindows provide is just waaay ahead of anything built on prototype/dojo/mochikit.
Maybe the widgets will come with the others? Time will tell.
Looks familiar ;)
http://ajaxian.com/archives/javascript-windows-enhanced
And the lord said unto them,
Thou shalt not overwrite the native Window object.
[...] While reading AJAXIAN today there was an article on creating in-browser windows. The window features: * Resizable windows * Minimize/Maximize * Modal Dialogs * Visual Effects * Skinnable Not only can you load a full webpage inside one of the windows but you can close out just like you can with browsers. Many of the features that this class allows you to do will hopefully be implemented in Call Log Version 3. [...]
I spent a few hours integrating this into my app a few weeks ago (previous version, admittedly) only to discover there were serious issues with IE6. Couldn’t find any statement from the author as to what browsers it’s known to work with.
The net4visions alternative is proving painful too. It’s a shame Scriptaculous doesn’t have this covered yet.
I tried to integrate the dialog confirm box with ASP.NET, its weird that the “Confirm” takes a life of its own. I can’t seems to call it like a regular javascript “confirm” with a return code value.
PPL gotta stop calling Ajax this and that. It’s still the plain old dhtml, What I’m looking for are javascrpt UI Widegts that supports different types of datasource like collections, array, objects, whatever. Otherwise, they are no more useful to me than 5 years ago.
looks cool but may be not very useful to my daily work
[...] Prototype Window Class: “The Prototype Window Class allows you to add in-browser windows with the flick of a few lines of code (and CSS to tweak). [...]
I tried it out in Opera 8.5 – I think a modern browser that understands DOM and CSS and all the W3C things. It doesn’t work, an error occurs. I think the developers should not only think of ff and ie6/7. web developers should not use such framworks if they are not compatible. Its the same with dojo and co.
[...] However, there does seem to be some debate over at the Ajaxian.com comments as to its implementation and true nature. [...]
The tool is great no doubt. I appreciate the standards also. I need to know how can I trap Close Button click or my custom callback function from within the window!!! Please let me know if any luck.
Pls check out this site where I have implemented prototype windows.