Exciting exploration with MooTools

Since last night the issue of how to go about opening a new mochaui window from within an iFrame caused me less sleep. But thanks to the posts I read that lead me to a solution, (one of which is http://forum.mootools.net/topic.php?id=3768) ... that I should supply the local relative path to the intended page, rather than make mochaui think it's coming from another domain. See snippet below:

    MochaUI.mainWindow = function(){

        new MochaUI.Window({

            id: 'mainWindow',

            title: 'ePinoy Business Directory',

            closable: false,

            resizable: true,

            maximizable: true,

            y: 85,

            x: 20,

            loadMethod: 'iframe',

            contentURL: '../../../directory/index.php',

            /*contentURL: 'http://directory.epinoybiz.com/',*/

            scrollbars: true,

            padding: { top: 10, right: 10, bottom: 10, left: 10 },

            width: 700,

            height: 390

        });

    };

The commented part is my original code, that caused me to mull over the codes I wrote since late that afternoon.

By the way, since the app I modified is intentionally loaded in a mochaui window, and this app has links to initiate calls to another mochaui windows in its parent, so, simply need to include the mootools.js and construct your event binding codes.

I hope this will save a bit of time for those who'll wonder why their codes don't work ;)

Wow ... New Domain ... Willowdan as the new Pinoy online entrepreneur?

First time for me ... not the several attempts I had, but first time to embark this much, and this means I'm now serious. Ready to jump into online entrepreneurship? Let's see what challenges are coming up .... 

This blog will have to serve as temporary repositories for comments and suggestions for each and every web app I am to come up with. So, guys, I'll be opening up one for a start, and I hope you will all be participating in its improvements.

See you ... 

Custom file uploader buttons

About a year ago in my work project,  one requirement that arised was to make custom file upload buttons. Of course our friendly neighborhood Google made it easier these days to research on how to go about it. Then came a page where I was taught of hidding the browse button idea. I termed it "the magic" as I introduced it to my colleagues. 

The technique was to hide the two browse buttons atop the fileupload button image via CSS. Though I used YUI for simplicity on fileupload mechanism, the complexity started to loom when I had to hide the whole uploading process, and that was through iframe. If without iframe, the uploading will need to refresh the AJAX page, which will logout the user from the server session. One option was to open a new child window, but was readily rejected by the product team.

So, for a few months, the iframe-hidden-fileupload or "the magic" worked for the requirement, until we discovered that in IE one of the two browse buttons when used to upload any file, tends to transport the same file repetitively. Actually the one placed higher in terms of screen location, was the one having this issue, inspite of a JS code written to supposedly erase any previous path in the file input field.

As a solution, I recently made the iframe refresh after every fileupload process, to repaint again the fileupload form as a whole.

Mushups?

Ok, before peeping into wikipedia, how do I define mushups. Can you imagine the Yahoo! site, exactly, www.yahoo.com ... It's called a portal, right? Composed of portalets, one managing the advertisements, another managing users different accounts(mail, yahoo biz subscriptions, etc.). Currently a lot of sites are emerging as mushups, specially that the term "webservices " is at the top of the list of tech terms now-a-days. Simple example, I can create a cool mushup, an AJAX application that can send SMS to my contacts currently located in Marikina, and next to send IM to those located in California, utilizing Googlemap API and a local service provider's(sample PLDT's webservice) API for sending SMS. Cool, right? Yes, it's a mushup of different data coming from different sources. The cartographic data from Google, and contacts data from my PLDT subscription, as an example. ;)

tinyMCE 3.2

From my tests last Thursday, apparently all possible known issues in the AJAX app I'm working on are to be resolved by this new version. Now I'm into integrating it ... And hopefully it will fit well .. 

If you ever need it just visit http://tinymce.moxiecode.com/download.php it will surely make your blogging/editing web app experience a facinating one ;)

COO

Why not, if that will be a blessing, a manifestation, a beginning of a fullfilment of my innermost longing for more wealth ... Welcoming even the mere thought (where all things begin) is quite exciting, thrilling, even as the details continuosly flow and somewhat worrisome ... but as the Audio BOOKS say, "... don't bother about the details, what your responsibility is to ask what you want, leave the details to the Universe ...". So I'll just do that, ... 

Then next maybe owning one big global enterprise supplying the world with alternative algae fuel, why not? What does having a scientist Uncle for, time to cultivate the enterprising Pinoy within. 

JQuery?

I'm now intrigued by JQuery's popularity and power in comparison to PrototypeJs. I came across a stat that says JQuery is second among tech surveys, and so it is becoming highly appreaicted as compared to about a year ago. Hmmm .... will look definitely into it's features and capabilities this coming days.

Making Google Chrome fast

First of, make sure to download Google Chrome, my favorite browser!

I came across Shafqat Ahmed's site yesterday about Google Chrome, and I believe it make sense choosing the option how you like Chrome consume your computer's memory.

The three options are as follows:

1. --process-per-site 
   
2. --process-per-tab 
   
3. --single-process
   

You may opt to have three different shortcuts for each of the options like:

"C:\Documents and Settings\Papa\Local Settings\Application Data\Google\Chrome\Application\chrome.exe" --single-process

... as how I set it up for one of my shortcut to Chrome. 

As explained in Marc Chung's page as to why process model is important,

"The short answer is robustness.  A web application running in your browser, is a lot like an application running on your operating system, with one important distinction:  Modern operating systems[1] run applications in their own separate process space, while modern browsers[2] run web applications in the same process space. By running applications in separate processes, the OS can terminate a malicious (or poorly written) application without affecting the rest of the OS.  The browser, on the other hand, can't do this.  Consequently a single rogue application can suck up mountains of memory and eventually crash your entire browser session, along with every other web application you were using at the time."

JavaScriptMVC, Singleton Pattern ....

It has been a while since I last posted, and now I'm yet to be a Java certified guy :) 

AJAX has and still is occupying more than 60% of my life. I recently touchbased again with JavaScriptMVC honcho, and he seem to be one of the very qualified person to talk to regarding JS. Inspired as you may put it, I'll try my best to put this blog into use as a media for my recently learned techniques, work-arounds, etc. for the purpose of giving back to the tech gurus who made my days every-now-and-then, and paying forward as well.

Starting of with JavaScriptMVC coupled with Singleton pattern. Make sure those of you guys who are into AJAX applications, starting or already doing production level should look into JavaScriptMVC and tandem it with singleton pattern. Honestly, I owe this two best-practice principle when it comes to the organized AJAX application we currently have. We were able to separate the three parts, model, view, and controllers, though with a little bit of tweeks to fit our requirements. I hope to give some details later for more clarified discussion.

Regarding singleton as described by Pro JavaScript Design Pattern 2008: "The singleton is one of the most basic, but useful, patterns in JavaScript, and one that you will probably use more than any other. It provides a way to group code into a logical unit that can be accessed through a single variable. By ensuring that there is only one copy of a singleton object, you know that all of your code makes use of the same global resource. Singleton classes have many uses in JavaScript. They can be used for namespacing, which reduces the number of global variables in your pages. They can be used to encapsulate browser differences through a technique known as branching, which allows you to use common utility functions without worrying about browser sniffing. Most importantly, they can be used to organize your code in a consistent manner, which increases the readability and maintainabil- ity of your pages. This pattern is extremely important in JavaScript, maybe more so than in any other lan- guage. Using global variables in your pages presents a huge risk, and a namespace created with a singleton is one of the best ways to remove those global variables. This alone would make the singleton worth knowing, but this pattern can be used for many different purposes. We cover the most useful ones in this chapter."

In our apps, we made use of three major namespaces, $m, $v, and $c and branching them according to the needed subfunctions. Examples, 

$v.setElementAttribute(elementObj, attribute, newValue);

$m.im.sendMessage();

With this, codes are organized also based on functionality.

Benefits of Sun Java certifications

• Sun Java certification prove that you have the exact skills and knowledge to develop business applications on the java technology.
• Becoming certified in Sun Java technology improves marketability of a professional and helps increase opportunities for professional advancement, in areas like salary increase and job role enhancements.
• Sun Java certified professionals provide a more stable work environment in the business enterprises.
• Sun Java certification help experienced Java programmers to validate their knowledge and get industry recognition.
• Sun Java certified professionals are more productive and efficient in the workplace .

IE8

Hhhhhhmmmm .. running in Linux? Hehehehe, a lot doubt it, including myself. It's official, its beta version is out, I'm sure a lot wants to try it out.

But for me, given the power and flexibility of FireFox, I'll stick with it, FIreBug is my newest best friend.

Java?

Again I'm having this urge with passion to learn Java more, after I set aside it for a while for my passion for AJAX. Currently I'm reading and has just registered for the online course of Mr. Sang Shin, and I believe I need this to boost my career. DotNet, C#? Nah, Java is the one for me, "Write once, run anywhere."

AJAX?

I just realized I'm into AJAX for a while now, and I have not shared anything about it, or have helped anyone on how to go about it, bad for a person who supports the opensource movement :(

Anyways, I hope through this blog I'll be able to set a mood of returning back the favor to the community which helped me learn AJAX.

To start off, I am fond of using prototype.js in tandem with scriptaculous.js. With my current work as a developer, we're using prototype windows, sure thing it's the best ever DHTML windows available for our IM purposes :)

Later within the week I will share snippets that may be helpful for the starters in AJAX. Another exciting web application I'm tinkering is an online dream board, that has yet to be publicly hosted :)

Oh, and a very good help balloons is one thing I have to apply in my web apps soon, so stay tuned.

So, that's it for now ;)