background preloader

Flex to HTML5 Considerations

Flex to HTML5 Considerations
The web application landscape has shifted rapidly in the past six months. Due to Adobe’s changing view of the Flash Platform, many companies who have relied on technologies like Flex are looking to migrate to HTML5. This transition can be tricky both for an organization as well as its developers. 1. Many developers will quickly become overwhelmed when examining the options for HTML5 web application frameworks. Within JavaScript you will find frameworks that differ greatly on each of these points. There are several key points to consider when making this decision for your organization: How documented is the framework? If your company is attempting to decide on an MVC architecture, I would recommend examining Backbone JS, Ember JS, Angular JS, and ExtJS / Sencha Touch. In addition, your team can augment the framework that you have chosen over time. 2. A DOM (Document Object Model) manipulation and AJAX library is an essential tool in JavaScript development. 3. 4. 5. Conclusion

What is the current state of the art in HTML canvas JavaScript libraries and frameworks Test plan Five Tools for Managing Complexity in Large-Scale JavaScript Projects - Signals Blog JavaScript lacks many of the tools and culture that define a clear 'right way' to approach large-scale projects. Yet it's still possible to build and maintain complex software with JavaScript. But how? For the last year, I've been involved in the development of a chemical structure editor written in JavaScript. ChemWriter is an interactive, graphically-oriented component that combines many characteristics of a drawing program with chemistry domain knowledge. In the course of developing ChemWriter, we've experimented with many tools and approaches for managing complexity as the capabilities of the software increased. Google Closure. ChemWriter is a component consisting of over 14,000 lines of JavaScript code spread over 112 source files and 14 packages, and is backed by over 1,600 automated tests.

Code Conventions This is a set of coding conventions and rules for use in JavaScript programming. The long-term value of software to an organization is in direct proportion to the quality of the codebase. Over its lifetime, a program will be handled by many pairs of hands and eyes. If a program is able to clearly communicate its structure and characteristics, it is less likely that it will break when modified in the never-too-distant future. All of our JavaScript code is sent directly to the public. JavaScript Files JavaScript programs should be stored in and delivered as .js files. JavaScript code should not be embedded in HTML files unless the code is specific to a single session. Whitespace Where possible, these rules are consistent with centuries of good practice with literary style. Blank lines improve readability by setting off sections of code that are logically related. Blank spaces should always be used in the following circumstances: while (true) { Avoid excessively long lines. Use line comments. Is

Patterns For Large-Scale JavaScript Application Architecture Today we're going to discuss an effective set of patterns for large-scale JavaScript application architecture. The material is based on my talk of the same name, last presented at LondonJS and inspired by previous work by Nicholas Zakas. Who am I and why am I writing about this topic? I'm currently a JavaScript and UI developer at AOL helping to plan and write the front-end architecture to our next generation of client-facing applications. I also consider myself something of a design pattern enthusiast (although there are far more knowledgeable experts on this topic than I). Can you summarize this article in 140 characters? In the event of you being short for time, here's the tweet-sized summary of this article: Decouple app. architecture w/module,facade & mediator patterns. What exactly is a 'large' JavaScript application? Before we begin, let us attempt to define what we mean when we refer to a JavaScript application as being significantly 'large'. Let's review your current architecture.

Flash Pro & CreateJS Following that is the handleComplete method. This remains almost identical to what was published, except that now it removes the Platypus instance that was on stage. We’ve also enabled touch interactions on our stage, so this game can be played on an iOS device. Quick Tip: In a more complex project, you’d likely get rid of the exportRoot , and add elements to the stage directly. Another important change we’ve made is to change the Ticker listener from stage to our tick function. Quick Tip: I’m keeping things simple here, but generally you should create a class that encapsulates your logic and register a method on it with Ticker, instead of polluting the global (window) scope. Adding game logic The tick function is called 20 times per second, and is the heartbeat of the game. First, if a random value is less than 0.01 (1% chance) then we create a new platypus, push it into our platypii array, set its display properties, give it a velocity, and add it as a child of the stage.

webgl Canvas + - iPhone Style Tab Control with HTML, CSS and JavaScript « CSS3 Wizardry Works with Desktop Safari, Desktop Google Chrome, Desktop Firefox 4, Android, iPhone, iPod Touch and iPad.Please not that this was originally designed for Android/iPhone/iPad use. It can be used on modern desktop browsers. Just note that the attached example will only work with Firefox 4 or later because it uses CSS3 transitions for navigation. If you’ve used an iPhone or iPad, you’ve seen them. Actually, Apple uses them on the operating system. The interaction is simple and immediate. Let’s go over the markup for the tab control. As you can see, the markup is very straightforward and we can easily reuse the pattern through an application as necessary. Here’s the markup. This will give us a tab control that looks like this: Now we’re going to create the JavaScript to make the tabs function. Anyway, here’s the code that creates the tab: If you look at the argument passed in, setupTabs expects a selector indicating the parent element that the tab control abides in. should be: and the line:

Centiped testé sur. How to enable locale switching in a XULRunner application This article is for developers who have localised their XUL application using DTD entity files and want to provide their users with a mechanism to switch the locale in the application itself. Normally the application locale is inherited from the OS environment of the host system, however there are situations when you might want to give users the option to override the default setting and choose a different locale. Here is an outline of the solution: 1. First, you need to tell XULRunner that your application wishes to ignore the default OS locale and that it will do its own choosing instead. defaults/preferences/prefs.js /* Don't inherit OS locale */pref("intl.locale.matchOS", "false");/* Choose own fallback locale; later it can be overridden by the user */pref("general.useragent.locale", "en-GB"); Note that some distributions of XULRunner or Firefox don't honour the "intl.locale.matchOS" setting, so in those cases you won't be able to override the OS locale [Debian Iceweasel bug #417961].

Environement de dev. Turning arguments into an array | In JavaScript, when you're dealing with functions that don't have a fixed number of arguments, there's a neat, built-in, local variable called arguments which almost is an array of all the arguments that have been passed to that function. Almost, but not quite. Luckily there's a simple way to close the gap and turn the arguments variable into something more manageable. Here's a quick example of how arguments can be used: function add() { for(var i = 0, total = 0; i < arguments.length; i++) { total += arguments[i]; } alert(total); } add(1, 2, 3); // alerts 6 add(1, 2, 3, 4); // alerts 10 This function can deal with any number of arguments and alerts the sum of them. Instead of adding numbers, let's see if we can concatenate strings: function concat() { alert(arguments.join(' ')); } // error: arguments.join is not a function concat('This', 'does', 'not', 'work'); The error appears because the arguments variable is not actually an array and doesn't have any built-in methods.