Where Delphi has always excelled, even to this day, is where its IDE and it’s VCL meet – you design the look of the application first, and then slap code in behind it second.   Not the other way around.   Users are given a “form” on which they can drag components from the visual component library.   The VCL is a vast palette of components and elements really allowing you to make your program look however you want..   Afterward positioning everything and making the program look “correct” you go into each component and add the various bits needed to make them do what you want.  

When it comes to rapid application development, Delphi is king.   It beats VB, VC and Java hands down for easy of program design.  This is my opinion of course and largely an opinion based on my experiences with it years ago.   I don’t use it any more but I know a lot of folks still do and it’s doing fairly well..  I also see a lot of elements of Delphi’s innovated IDE in other IDE’s out there.. (*cough*Eclipse*cough*)

So my thought is.. How useful would that be for javascript?  This fits in nicely with a project I’m doing at work in that some of the same concepts are there..    You have a framework in the background that all this rests on (lets call it a desktop), then on top of that you have delphi like “forms” (lets call them viewlets) which are nothing more than a window framework container.  Each viewlet would have components that would be pulled from a common component library that you have positioned how you see fit and now have working how you want.

With jQuery it would be fairly simple to allow for any kind of function definitions; from onclicks to mouseovers.. Custom code would be simple and all of that could easily be serialized into a simple object definition that would be easy to store remotely..

You would need a “component inspector” like object that allowed you to edit and change things within a viewlet but once that’s done you simply disable the component inspector and you’re off to the races..

There are a lot of good javascript frameworks but they all come at this problem from the other direction.. More over there aren’t any drag and drop Delphi like application creation tools out there for javascript and certainly not any written entirely in javascript..

For work I am creating a whole new system and I was thinking of how I could keep it easy enough that third party developers could design and create their own viewlets for our system.. That’s when this whole thing plonked itself into my head..   If you designed it from the onset to be a system that could be entirely dynamically done then it would take very little programming on the part of the third party creator to get something new.. They don’t even need to know the framework because they could simply drag and drop the components they want onto a form (I have a hard time calling it a viewlet) then you’d have drop down boxes in the component inspector to attach information to that component..

At that point its just a matter of making your components sophisticated enough to provide the functionality you want..  The other nice thing is your shop goes from being application developers to simply being component developers..  If the framework works, you simply need to continue to develop better and better components..  You aren’t rewriting the wheel each time you want to make a change..

There would need to be some back end code in place to handle the storage of user generated forms, but all HTML, CSS, JPGS, and Components as well as the window framework and desktop are already written.  They don’t change. 

From a support standpoint it would be nice to give your support folks a way to pop-up some kind of component inspector widget that would allow you to browse components and forms on the fly.. etc.. 

I dunno.. its one of those things I was pondering.. I know I wont be allowed to do this for work but it amuses me..

WPOS7 Screenshot

So I have been plugging away at creating my OS7 theme.. I previously stated that IE8 sucked completely and I have to take that back.   It doesn’t suck completely.. infact, it sucks a lot less than I realized..

I found that I was using IE8 in “quirks mode” and of course it behaved quirky.  My main question is;  What the hell is the point of quirks mode?!  “Here have our browser in a mode that is completely broken.” I just don’t get it.. I guess quirks mode is basically IE6 as they seem to render similarly.. (I have IE6 on my laptop still for testing purposes..) If that’s the case it couldn’t be better named..

Apparently since I had a misspelling (or something) in my doctype it defaulted to quirksmode.. Once I found that I was in the wrong mode, found out why and fixed it, I started to test my new UI in IE7 and IE8.. It actually works!!  Ever so minor bug in IE7, but its hardly worth mentioning..   IE8 works fine, but a little slow. er.. in fact, a lot slow.. IE8 ain’t zippy at all..

I think that if Microsoft would focus on speeding up IE8 A LOT and quash the remaining bugs, they’d have a viable browser. I fear they have been slack in development because they knew they had the majority of the market share. Since supposedly soon they will be uncoupling the OS and the browser that market share will wax..

With some of the advances that other browsers are pulling, IE is gonna hurt bad!

As to my theme.. It’s still not technically a theme.. At this point I am creating the basic window manager windows object and making all the standard stuff work..  So far so good..

What REALLY amuses me is if you use my theme, with F11 poked (fullscreen).. it looks like you’re in windows 7.  heh At a glance you can’t tell the difference.. *glee*  I want to further that illusion if at all possible..

On the back end, I need to make WordPress ajaxable in order to pull information.. Supposedly there are already some pretty good wordpress plugins for doing this, but I don’t know that I want to rely on others work..   I’ll likely test a few before making a decision but more than likely I’ll write my own ajax solution which means poking around in the guts of WordPress.. Fun!

Wordpress OS7 Theme

So I have been using Windows 7 for a while now and I really do like it.  It’s no Snow Lepoard but it’s what I have.. heh  Honestly, its not bad at all..  I also have been using wordpress for a goodly while with the same theme “Microblue” a theme I created a year ago.

I’m getting bored with Microblue so its time for a change and I thought it would be fun to combine Windows 7′s look and feel into a wordpress theme.    This lead me down the road that I had started with my jQuery Windows post and posed an important question;

Do I implement a windows manager within a webpage?    God what a pain in the ass..

I could easily just create a static theme that looks sorta like windows 7..  Or.. I could create a much bigger and deeper product which would in essence be an entire windows manager..  In a  web browser..  I’m still pondering the route I want to go..

I’m not sure wordpress can handle some of the stuff I have in mind.. It would require some back end ajax work in order to take advantage of everything I want to do and I’m not sure I want to write that part of this..

The other issue here is that I’m going to be using a LOT of PNG files in order to take advantage of the alpha channel.  So older browsers will have to be waved off..  No matter which way I go this will be true..

I would like to try some effects that I don’t think you can do yet with PNG’s.. I want a PNG to be able to blur the image below it.. but I don’t think you can do that yet..  That will require some research..

I’m going to be working on this project for a bit outside of wordpress to get the basic look working then work on adding it to wordpress.

—

Saturday, Jun 20th 2009 – So I have been working on my initial run at the WPOS7 theme.   I find it painfully ironic that IE8 can’t display it.  It works perfectly in Firefox and Safari but epic fail in IE.

—

Sunday, Jun 21st 2009 — Well I spent the majority of the weekend working on my OS7 theme.  I have gone the windows manager route and am using this experience to learn more about jQuery.. What’s interesting is since I’m going this route, I’ll be able to apply my knowledge to Build Forge and the new UI that we are going to be creating..

It’s coming along nicely and works perfectly in Safari and Firefox… And to be honest, its working better than I would have thought..  IE8 is still an epic fail.. I mean dear god.. what a piece of crap..   I’m going to have to write some special jQuery stuff just to get IE8 working..  Assuming that doesn’t fail completely too..

I’m also going the route of writing it such that it will activate those windows that are created by the HTML as well as instancing new ones..   My reasoning behind this is for my work.. I am considering the creation of a new UI that would sit on the existing code base..

We’ll see.. I want to make this sucker as functional as possible..

Surfs Up!

I have been playing with the jQuery animate functionality a bit today and it occurred to me that jQuery would likely be the perfect library to build a browser based game on top of..

I did a little browsing about the web, and sure enough.. someone thought of it before me.

The games I would want to create would be less animated than this one.. but I could totally see a Masters of Orion remake as a browser based game using the jQuery library..   Or any number of other turn based games..  You could even make them multiplayer fairly easily..

As computers get faster, and as browser trend towards threaded javascript engines.. Why the hell not?! At this point I think it would be just as easy/difficult to create a game via a webbrowser as it would via any other medium..

More over you wouldn’t have to sell any kind of client.. everyone with a modern computer has a web browser.. You trade having to create a game that works with hundreds of different graphics drivers and computer configurations for having to deal with 5 major browsers that all do things slightly differently, but big deal.. jQuery does most of that nicely, so really you’re only stuck fixing CSS issues..

As always the trick is in coming up with a game that is compelling enough that others want to play it. I mentioned Masters of Orion above because I think that’s likely one of the best games of all time and as such a perfect candidate for remake in this format.

Granted you’re not going to make the next 3D masterpiece as a browser based game.. but I say good.. Games these days are moving towards looking good with zero game play.. Give me a game that is fun to play any day over the latest wiz-bang graphics.. I think the browser game market is a good place to try this..

Example Windows

So as part of my on-going exploring and learning of jQuery I want to create a window system.  This will let me explore the wonderful world of jQuery as well as create something functional and useful for my work project.

This window system will need to be dragable, droppable, completely resizable via all standard and expected methods.  It will need to be able to have x number of configurable buttons within the border both left and right, have other customizable data within the top header..

I want to make it so that each window is basically a container, and thus can contain anything.. including other windows.

Most of these windows will need to be created dynamically completely at run time.  That means no static HTML at all.  But the windows will need to know where to live I suppose.. Users will need to be able to drag the window and the “desktop” will either allow free dragging or snapping to place holders..  Not sure the best way to go about this just yet..

Above you should see a window. It doesn’t know how to pull information from the page yet, but soon it will be able to replace an element within the page with a window of the same information.

The window is a container that already comes with 2 tabs per the window definition (which is defined in json)..

Next is just a plain window with a plain block of text.

This still doesn’t work. It will.. bear with me.

I plan to add the various icons and twisties support soon.

Lightbox Test Image

I have been playing with the javascript library jQuery for a couple days now.. My intent is to learn the ins and out’s of it for a project at work.  So far I like what I am seeing.

I need to learn a “best practices” as there are many ways to do things in jQuery and I am very likely going about some of it incorrectly..  But, there is only one way to try things and that’s to jump off the deep end!  So far it’s cake.. Something I have wanted for my site for a while now was a lightbox implementation.  And while WordPress has quite a few lightbox like plugins, I thought it would be interesting to create my own using jQuery such that ANY link (on any website) with an attribute of rel=”lightbox” would be opened as a lightbox. This is the file I’m actively developing on;

http://rsow.com/files/jquery.lightbox.js

And the image above will be my lightbox test image for the time being.  Clicking the image will close the lightbox.

So far so good!  The lightbox appears to be working nicely.  Clicking the image correctly pulls the “shade” (the darker background) and opens a white background over the shade with a “loading” gif.  It then loads the image into memory.   Once the image is loaded, it then resizes the white background to the size of the image, and displays the image in the place of the loading image.

Large Wide Image

You most likely wont ever see the loading GIF unless you’re loading a very large image like the one to the left.  But that brought up a different problem.  What if the image is larger than the screen?

The lightbox will now automatically size the image to fit your screen upon load. If you resize your desktop while the lightbox is displaying it wont adjust itself yet.

At this point the only real pain is remembering to add rel=”lightbox” to your anchors.  I’m sure there is a way to get WordPress to play nice with that regard.. not sure yet.  Also my goal was to make it so that the only thing you would need would be to add jQuery and my jQuery.lightbox files to your site and you’re good to go. Unfortunately I forgot about the loading graphic.. so you’ll want that gif too..  And it will need to live at /images/loading.gif   You can use any you like, so long as it’s there and it isn’t too large.

Loading GIF

Feel free to use mine..

I want to add some more features to this thing.. I dunno how crazy I’ll get though.  Comments would be nice on an image by image basis, but not sure how to go about that.  Either I can try to embed the comments in the page in some hidden way and then have jQuery pull them or I could try loading them from a similarily named file that resides next to the image?  I dunno.

I also like the idea of creating other forms of pop-ups / lightbox styles through the use of the rel attribute.  If you use “lightbox” it does what it does now, but if you use “lightbox_zoom” (or something) it does something else..   I already have other ideas but I dunno how crazy I want to get.

Right now this system has no way to do groups either.. this is purely a singleton solution right now.  I’d like to add more features but for now it’s where its at.  I’m a little stunned at how easy it was to create to be honest.  This bodes very well for jQuery.