AMT Blog

Brunch is a handy MIT Licensed, assembler for building your HTML5 applications. It is agnostic to frameworks, libraries, programming, stylesheet & templating languages and backend technology.

To simplify app development, brunch watches your files for changes and automatically wraps your scripts and templates in require.js modules. All build errors are printed to console. If you have growl / libnotify, brunch will use them too.

Brunch uses node.js plugins to speak with compilers. There are a bunch of plugins already:

• Programming languages: JavaScript, CoffeeScript, IcedCoffeeScript, Roy
• Pre-compiled templates: Handlebars.js, Jade, Mustache, Eco
• Styles: CSS, Stylus, LESS, Sass
• Minifiers: uglify.js, clean-css

There are some people who are using brunch already. Ranging from internal tooling to high traffic facebook apps. Do check out the other examples given on the website.

Read more…

Like what we post? Share your thoughts on the comments below. If you wish to get regular updates on what we post, do subscribe to our RSS Feed

Filtrify is a handy open source plugin for advanced tag filtering, inspired by Chosen multiple select feature and Orman Clark’s Vertical Navigation Menu. This free plugin developed by Luís Almeida, lets you search tags within the tags, filter items by multiple tags from different categories, and get a live feedback on the number of items containing related tags.

How Filtrify Works

Filtrify makes use of the new HTML5 "data" attribute to store the metadata. All you have to do is include a "data" attribute for each item in your list with the respective tags (metadata). If you have more than one category of tags, include them in another "data" attribute. You can add as much categories of tags as you need.

Filtrify will then go through all the data attributes you included in your items and it will create a search menu with as many fields as the different number of categories (data-attributes) you provided. Each field label in the menu fires a "popup" filtering panel and there's where all the magic happens.
The plugin instanciation is very simple, you just have to pass a "containerID" and a "placeHolderID" which is the ID of the element where you want to place the menu.

Read more…

Like what we post? Share your thoughts on the comments below. If you wish to get regular updates on what we post, do subscribe to our RSS Feed

HTML5 is revolutionizing the Web, and now it is coming to your ebook reader! In this presentation, Sanders Kleinfeld of O'Reilly Media, Inc. gives us an overview of three areas of HTML5 that offer great promise to ebook publishers looking to expand beyond traditional text-and-graphic narratives: HTML5 Canvas, Geolocation, and Audio/Video. After a brief tutorial of the HTML markup and JavaScript code used to implement these features, she takes us into some exercises that put HTML5 in action.

For each topic area, she also discusses the current status of HTML5 compatibility with major EPUB reader platforms (for example, iBooks, Nook Color, Adobe Digital Editions).

Click here to download:

HTML5_for_Publishers_Presentation.ppt (12.02 MB)

(download)

Click here to download:

HTML5_for_Publishers_Presentation.ppt (12.02 MB)

Read more…

Like what we post? Share your thoughts on the comments below. If you wish to get regular updates on what we post, do subscribe to our RSS Feed

FlashJS is an open source JavaScript graphics and game development engine with API resembling Flash. It`s HTML5 game development tool, created by studying the Flash methodology for years. Just write ActionScript 3 code inside of <actionscript> tag.

FlashJS comes complete with example games code and syntax sugar for game developers. The new features of FlashJS 0.4 are:

• scaleX, scaleY properties
• DisplayObject with alpha, rotation, x, y
• addChild, removeChild, removeChildAt, getChild, getChildByName, numChildren
• Keyboard and mouse events
• Loader
• Stage and it`s onEnterFrame event
• Tweens
• Tested and Supported in Firefox 4+, Internet Explorer 9+, Opera 11, and latest versions of Chrome & Safari

Read more…

Like what we post? Share your thoughts on the comments below. If you wish to get regular updates on what we post, do subscribe to our RSS Feed

Flotr2 is an open source library for drawing HTML5 graphs and charts. It is a branch of flotr which removes the Prototype dependency and includes many improvements.

Features:

• mobile support
• framework independent
• extensible plugin framework
• custom chart types
• FF, Chrome, IE6+, Android, iOS
• lines
• bars
• candles
• pies
• bubbles

How Flotr2 is used:

In order to use Flotr2, include the flotr2.min.js script in your page and create a visible <div> with positive width and height. A graph is drawn with the Flotr.draw(container, data, options) method.

Read more…

Don't like to miss out any of our posts? Do Subscribe to our Feed

Zoey is an HTML5 – CSS3 powered framework for developing simple & standard mobile apps. It is small, customisable and features a range of UI components like navigation, lists, buttons, control groups, forms and grids.

It is built on top of zepto.js and weights at only 21.6KB (combined JavaScript and CSS) and GZipp'ed at around 6KB.

Zoey supports all modern browsers (iOS 4.2 & Android 2.2 tested).

Read more…

foneFrame is a mobile framework that creates web pages for smartphones like Android & iPhone. foneFrame displays HTML5, XML, RSS, & SSI files as mobile web pages.

Use foneFrame to quickly wireframe a new mobile site. Edit the underlying CSS style sheet, incorporate other tools like jQuery, Sencha, or Phonegap.

Using foneFrame jumpstarts your mobile development effort by providing a robust framework. Using this as a starting point, other tools like jQuery and Phonegap can be used along with foneFrame, decreasing development time and insuring standards-compliant results.

The free version of foneFrame is released under the Creative Commons Attribution 3.0 Unported License (CC BY 3.0).

Read more…

Don't like to miss out any of our posts? Do Subscribe to our Feed

Reverie is a versatile HTML5 theme framework for WordPress from theme developers from ThemeFortress that is based on the ZURB Foundation.

Reverie is not like some other frameworks that are packed full of user friendly features. That is to say, there is no options page for non-technical WordPress users to change things around easily. Consider Reverie as a blank canvas for creating your own unique theme. It’s very well coded and is optimised for search engines too.

The default design is minimal yet has everything you need with a menu area at the top and bottom of the page and widget areas in the sidebar and footer. It includes an archives template, full width template and a custom page template that you can use as a base for creating your own page templates.

The framework was designed to work with the new bbPress 2.0 WordPress plugin. bbPress integration is still actually pretty rare. I had predicted months ago that most designers would be making their themes bbPress friendly but it doesn’t seemed to have happened yet; therefore I’m sure this framework will prove popular with those who are looking for a good theme that works with bbPress out of the box.

Reverie is a good framework for those who are looking for a blank canvas to create a unique design for their website. Even beginners should be able to change colours, fonts and layouts as the code is well documented. Those of you who are looking for a user friendly drag and drop framework though should look elsewhere.

Read more…

DHTMLX recently announced the final release of DHTMLX Touch 1.0, a free JavaScript framework for building HTML5 mobile web apps. Version 1.0 offers more stable performance, better cross-platform compatibility, and extended customization options.

In addition to these improvements, DHTMLX Touch introduces some new features, such as HTML5 offline mode, IDE integration, back button support, and online skin builder tool. The detailed documentation, multiple demos, and code samples shorten the learning curve and allow developers to quickly create great looking web apps for mobile and touch devices.

This update extends the list of supported desktop browsers (Chrome, Safari, FF, Opera, IE8+) and adds BlackBerry support. The visual designer tool for DHTMLX Touch, which allows creating mobile web interfaces without coding, has been updated to support the latest release.

Read the complete story…

Looking for a trusted development partner to build your custom Mobile applications using HTML5? Visit us at: www.amt.in

After the Abode’s recent announcement of dropping all development plans on mobile flash, HTML5 has obviously become the no. 1 choice for mobile web developers. 

In Adobe’s official announcement, Danny Winokur, Adobe’s VP and general manager of interactive development, wrote, “HTML5 is now universally supported on major mobile devices, in some cases exclusively. This makes HTML5 the best solution for creating and deploying content in the browser across mobile platforms. We are excited about this, and will continue our work with key players in the HTML community, including Google, Apple, Microsoft and RIM, to drive HTML5 innovation they can use to advance their mobile browsers.

According to Eric Meyers, an author and HTML/CSS expert, A rational comparison between HTML5 & Flash goes like this: “It's really the HTML we're all used to plus more elements. But that's the 80/20 answer. HTML5 adds new elements for things like sections of a document and articles, and figures and captions for figures. So it covers things that a lot of us do all the time, like create <div> and then <p> inside of that to go along with an image. Now there's just an element called "figure" and you insert an image and you have an element after that called "caption."

There's been an attempt to look at what people are doing. What class names are people using over and over again? What structures are they setting up over and over again? Because HTML doesn't have elements that directly address those.

The HTML5 spec also attempts to very precisely and exhaustively describe what browsers should do in pretty much any given circumstance. Older HTML specifications would simply say: "These are the elements. These are the attributes. Here are some basic parsing rules. Here is what you're supposed to do if you encounter an error." HTML5 has these really long algorithms that say: "Do this, then this, then this, then this. And if you hit a problem, here, do this other thing." There's a lot of debate as to whether that's even a good idea. But if the vision that's encoded in those algorithms is brought out -- I'm not saying it will be, but if it is, then browsers will be a lot more interoperable. But that's the base level answer. As you push further into the more obscure corners, then the answer to "how is HTML5 different?" becomes much more complicated.

Read more…

AMT has developed an indigenous framework which converts Flash to HTML5. Are you looking to convert your mobile flash web apps to HTML5. Contact us for more information.