Javascript
Bespin in Titanium: From The Jaws Of Victory…
bespin is really an intriguing project. Since I’ve grown frustrated with the inconsistencies between the various code editors that I have been using — I work on Leopard at home and Ubuntu at work — I thought that creating my own editor would be the answer to that. Nothing fancy, mind you. Just something consistent.
My first impulse was to use Flex. And it almost worked! Using mx:html I was able to wrap a nice web page in an otherwise very ActionScript-y application.
And then, catastrophe! Flex Webkit’s canvas implementation is subpar and I could only get a very mamed version of bespin. Nothing usable, anyway.
Thus, I turned to Titanium.
After some light trial and error, I got it to work!
Unfortunately, the result is less than awesome: Titanium’s Webkit gets easily overwhelmed and, worse, crashes reliably ( :g: ) as soon as I ask it to do some medium lifting.
This video shows the original victory followed by the vexing defeat:
Note that, to get it to work, I replaced embed.js with my own version that works around any dojo.request()/eval issue:
(function() { // -- Load Script var loadme = new Array(); var loadScript = function(src, onload) { var embedscript = document.createElement("script"); embedscript.type = "text/javascript"; embedscript.src = src; embedscript.onload = onload; document.getElementsByTagName("head")[0].appendChild(embedscript); } var onScriptLoaded = function() { var src = loadme.shift(); if(src) loadScript(src, onScriptLoaded); } var componentRequires = function() { dojo.require("bespin.bespin"); dojo.require("bespin.util.canvas"); dojo.require("bespin.util.keys"); dojo.require("bespin.util.navigate"); dojo.require("bespin.util.path"); dojo.require("bespin.util.tokenobject"); dojo.require("bespin.util.util"); dojo.require("bespin.util.mousewheelevent"); dojo.require("bespin.util.urlbar"); dojo.require("bespin.client.filesystem"); dojo.require("bespin.client.settings"); dojo.require("bespin.client.status"); dojo.require("bespin.client.server"); dojo.require("bespin.client.session"); dojo.require("bespin.editor.actions"); dojo.require("bespin.editor.clipboard"); dojo.require("bespin.editor.cursor"); dojo.require("bespin.editor.editor"); dojo.require("bespin.editor.events"); dojo.require("bespin.editor.model"); dojo.require("bespin.editor.toolbar"); dojo.require("bespin.editor.themes"); dojo.require("bespin.editor.undo"); dojo.require("bespin.syntax.base"); dojo.require("bespin.syntax.simple._base"); dojo.require("bespin.cmd.commandline"); dojo.require("bespin.cmd.commands"); dojo.require("bespin.cmd.editorcommands"); dojo.require("th.helpers"); // -- Thunderhead... hooooo dojo.require("th.css"); dojo.require("th.th"); dojo.require("th.models"); dojo.require("th.borders"); dojo.require("th.components"); } loadScript("js/dojo/dojo.js.uncompressed.js", function() { dojo.require = function(src) { loadme.push('js/' + src.replace(/\./g, '/') + '.js'); } componentRequires(); dojo.require("bespin.editor.component"); loadScript(loadme.shift(), onScriptLoaded); }); })(); |
As you can see, I override dojo.request() with my own, stack up all the component names, then load them one by one, waiting for each to be fully loaded before moving on.
If you enjoyed this post, make sure you subscribe to my RSS feed!
PHP classes and Javascript: S2ajax says “hi()”
Sajax is a ‘managed’ AJAX framework that was created by the fine folks at Modern Method a few years ago.
What’s so great about it is the seamless communication between your back-end and the web page itself: you write your PHP code, tell Sajax which functions to export and they are now accessible from Javascript.
For instance — from the ‘example_types.php’ file:
function return_string() { return "Name: Tom / Age: 26"; } |
The corresponding Javascript call would be:
<button onclick="x_return_string(display_result);">Return as string</button> |
OK so this is a pretty great package, no doubt.
Unfortunately there are exactly three things that bother me here:
- The choice to prefix all remote calls with ‘x_’ which feels less natural, even though it is a convenient way to avoid namespace collisions.
- More importantly, Sajax does not support PHP classes and I am not comfortable working with strictly procedural code. After all, object-oriented PHP has been around for quite some time now.
- Of course, it would seem that the last Sajax release happened sometime in 2006, which would explain #2
Thus, S2ajax was born.
If supports classes and methods, does not require prefixing and the export() calls are now more powerful.
The syntax is still very straightforward and relies on clean Javascript code.
And the license, obviously, is still the very open BSD.
Additionally, this S2ajax can be easily integrated with PHP 5’s magic class and methods loading. For instance, it works with my own PHP framework.
As usual, all this goodness is available at github.com!
If you enjoyed this post, make sure you subscribe to my RSS feed!
ExtPHP now on Github
About 10 months ago, I released this tool, allowing developers to handle ExtJS like “managed” code in PHP: ExtPHP.
Shortly thereafter, Jack Slocum changed ExtJS’ licensing model and it all became very muddy but my main question was: “As a commercial user, what would the status of the extensions be?”
It seems that it’s OK to create an extension and not GPL it as long as it doesn’t contain any ExtJS original code. The claim is that most extensions now fall under that category. Of course, there is still the risk of an extension still containing ExtJS code — hint: that’s very likely — and the company who paid for ExtJS commercial licensing is now burdened with…what? De-facto GPL code? Or does the code that was reused considered “commercially licensed” as well? Even though it is part of an open-source extension?
Ten months later, I am not getting a sense that things were clarified well enough. Look at this topic on ExtJS’ forums. It looks like, after September, everybody gave up.
So, what now?
Well, if anyone could point me to a comprehensive answer regarding this issue, that will sure help me decide whether to revisit my decision to give up on ExtJS from a commercial standpoint.
In the meantime, ExtPHP is now available at Github.
If you enjoyed this post, make sure you subscribe to my RSS feed!
typeface.js is promising
I read today about typeface.js and it’s exactly the lightweight replacement that sifr could use. If you are not familiar with sifr, in a nutshell: use whatever font you want, regardless of whether it is installed on your visitors’ computers or not.
Of course, these days, Flash is more popular than ever but if you are a purist, typeface allows you to do without Flash, using the Canvas element. And, even better, since it’s not Flash, it works on iPhone.
If you are looking for a pixel-perfect solution, however, it is not quite ready yet. Not far, but not quite:
- Text replacement does not allow the user to select text in either FireFox or Safari
- font-stretch support is not rendered correctly in Opera
Now, these weaknesses are, I am sure, only temporary and they are the price to pay for being able to specify your text’s rendering using pure CSS (font-stretch: normal)
If you enjoyed this post, make sure you subscribe to my RSS feed!
ExtPHP: An ExtJS Converter/Wrapper for PHP Developers
It is something that I had to think about in my day job, because my team is migrating to PHP for web development and I believe that we simply do not have enough time for them to learn JavaScript’s intricacies, I needed to be the one person who would have to wrestle JavaScript when problems happened. I therefore needed a way to insulate them from the gory details, which is why I created ExtPHP.
As you may have guessed from subtle hints, such as this entry’s 12-feet tall header, ExtPHP creates a PHP wrapper for ExtJS.
I noticed, at dzone.com, that the last time someone created a wrapper for JavaScript, many readers complained about how intrusive his approach was. Well, be assured that ExtPHP does not foil ExtJS’ non-intrusive take. Of course, with ExtJS itself, it’s up to the developer to decide what kind of style they wish to adopt, and ExtPHP follows suit.
I guess the introduction I wrote in ExtPHP’s documentation explains fairly clearly what the idea is: “ExtPHP is a wrapper for ExtJS. This is version 0.1, so I expect that a lot of things can be improved upon and your feedback is greatly appreciated. ExtPHP can be used to write both intrusive and non-intrusive Javascript, just like ExtJS itself. Use it responsibly. One of the many advantages of this design is that unknown/misspelled/misused methods are detected in your PHP editor rather than forcing you to debug your JavaScript code in your web browser. ”
Documentation? Indeed, I took some time to write a much-needed PDF document. Let me know how I can improve it, I am sure that you will find it lacking - because it is.
Anyway, I am releasing this as a “Technology Preview” and I will greatly appreciate your help beta-testing it.
Cheers.
If you enjoyed this post, make sure you subscribe to my RSS feed!
jQuery UI now professionally maintained!
Well, this is exciting:
Paul Bakaus, lead jQuery UI developer, announced today that he was hired by Liferay, Inc., of L.A., to work full time on his baby.
As an early adopter, I am very happy to see the project evolve this way. In case you are not familiar with Liferay, they develop open-source products, so all is well 
If you enjoyed this post, make sure you subscribe to my RSS feed!
About Events Capturing
Dusting Diaz blogs about consuming events in Mozilla.
I’ve always enjoyed his postings but I have to disagree about having to wait for a ‘better’ IE: the same tricks can already be performed in current version of IE.
Simply react to a click event with this code (pasted from nextBBS’ common.php):
// A very experimental private function: consume the original event, if possiblefunction _killEvent(e) { if(e.preventDefault) { e.preventDefault() e.stopPropagation(); } else { e.cancelBubble = true; e.returnValue = false; } } |
If you enjoyed this post, make sure you subscribe to my RSS feed!
Where is getElementsByClassName()?
Since one of the goals of this blog is to show you how we resolved some of the issues we encounter when writing modern Web applications, allow me to repost this short article that I originall posted at goodjavascript.com
It’s an extremely common problem: you want to retrieve all the “special” links embedded in your web page. Or all the text areas with a certain style.
You looked at someone else’s code and found that they use the method getElementsByClassName() profusely.
However, when you tried, there was no such method.
(more…)
If you enjoyed this post, make sure you subscribe to my RSS feed!
Create your own WebTop in php/js in no time
They are everywhere: protopage, pageflakes, netvibes et al are free, easy to use -as long as you have a powerful browser- and moderatly eye-pleasing.
SO?
A couple months ago, I wondered how long it would take me to build my own ‘WebTop’ (You can play with it here). The challenge would be to get it to a satisfactory state over a week-end.
Of course, I decided to use existing open-source code for the applications’ primary needs.
(more…)
If you enjoyed this post, make sure you subscribe to my RSS feed!
