digitarald.de Combined

MooTools 1.3.1 is out

Mon, 28 Feb 2011 12:42:01 +0000

MooTools Core and More 1.3.1 just got released yesterday. My personal highlights include:

Documentation and demos improved, thanks to the developers and hundreds of contributors. Still something missing? Fork the demos. Cool facts: The new demos run directly from github through jsfiddle!
Snappier experience with updated Slick selector engine, better supported Event delegation with submit, focus, blur, reset, change and select and native JSON support in JSON.decode and JSON.encode.

I am working on updating all my open sourced libraries to 1.3, adding them to github and submitting them to the forge. Yes, a long list, but bare with me … it happens step by step and even faster with the help of contributors. Kudos to everybody that forked the code and posted back their fixes and enhancements!

Stable FancyUpload 3.0

Mon, 25 May 2009 08:44:13 +0000

After a lot of feedback from the community and testing in the wild, the stable 3.0 release got tagged on github. The latest commits contain several bugfixes and new options: timeLimit prevents Flash timeouts from the server response and policyFile allows you to select your own policy file location. The changelog provides more details.

Get the up-to-date download packages. If you did not yet update your old FancyUpload 2, now is definitely the time! If you run into problems or want to share your experiences, join the support forum. Needless to say, this latest 3.0 version can be copied over the previous release candidates straightforward.

FancyUpload - Swiff meets Ajax 3-0

Sun, 24 May 2009 22:00:00 +0000

Added: Option timeLimit (default 30s, 0 for linux). Prevents frozen upload when server fails, after timeout the upload is cancelled and the complete event fired (with “timeout” error).
Added: Option policyFile, custom location for the cross-domain policy.
Added: Events beforeStart/Stop/Remove for more control over the upload process (e.g. setting data from inputs).
Changed: 1s delay for onFail, prevents failing on slow connections.
Fixed: data is not correctly merged between uploader options and file-specific options.
Fixed: Removed debugging behaviour on progress bars.

FancyUpload - Swiff meets Ajax 3-0-rc1

Mon, 04 May 2009 22:00:00 +0000

Added: New showcase attach-a-file including first iteration of the class Attach.
Added: New event reposition, fired when the box is moved.
Changed: More converted placeholder-units for validation errors.
Fixed: remove event did not fire correctly, broke option fileListMax
Fixed: Example script.php did not clear log file correctly.
Fixed: I really missed a console.log in FancyUpload2.js, sorry!

Fresh FancyUpload 3 Showcase: Attach-a-File

Mon, 04 May 2009 21:21:55 +0000

A short update with less words but a link to a the new showcase: “Attach a file”.

I promised regular showcase releases in the FancyUpload 3.0 announcement, this is the first one in the row and only the tip of the iceberg. The new showcase is a copy of a real-world example (most web developers will recognize the original) implemented as a reusable class that will be released later. The final class will also include a graceful fallback to an iframe-based uploader with nearly the same functionality.

Enjoy the fresh interface from the “Attach a file” showcase and discuss it in the forums. Your feedback and ideas are always welcome!

FancyUpload 3.0 Unleashed

Thu, 30 Apr 2009 10:12:00 +0000

Despite the delay, the completely rewritten version of FancyUpload, version 3.0, got pushed to github today. This new version is more stable, has better documentation and more showcases than ever. I even added two download packages with runnable installations, like many developers requested. This article introduces the new features and showcases, impatient readers can jump directly to the comprehensive project page or fork on github.

Update (5th May ‘09): 3.0 rc1 got released to fix smaller bugs and I added new showcase “Attach A File”.

FancyUpload - Swiff meets Ajax 3-0-rc0

Wed, 29 Apr 2009 22:00:00 +0000

Added: Total rewrite of Swiff.Uploader JavaScript and Actionscript
Added: Event based interactions from Flash to JS
Added: File-based list handling for easy implementation
Added: IFrame fallback class Uploader.js, mirroring the Swiff.Uploader API
Added: Several new options like appendCookieData, buttonImage and various validations
Fixed: All known bugs (case-sensitive typeFilter, sending data, Mac problems, load events, …)

MooTools 1.2.2 Core and More

Fri, 24 Apr 2009 09:04:00 +0000

The new MooTools Core 1.2.2 was announced today. It contains several important bug fixes, especially class support for Safari 4 and position calculation.

The new MooTools More 1.2.2.1 is the initial full release, updates will now come more frequently. Thanks to the developers and the community who helped a lot with feedback and contributions. Grab your own copy of MooTools Core and More and check out the new awesomeness.

SqueezeBox - Expandable Lightbox 1-1-rc4

Wed, 22 Apr 2009 22:00:00 +0000

Added: SqueezeBox.open(subject, options), where subject can be an element or an URL.
Added: Support for evalScripts in ajax handler.
Changed: Added more widgets to the showcases reflecting the new features.

Let Me Introduce Your Forum

Wed, 22 Apr 2009 17:58:12 +0000

Dear Reader,

I beg your pardon if my comment system failed you in the past. From today, this problem is solved!

To provide a proper support platform for my steadily growing and gorgeous community, I hereby introduce the official support forums. With your help it will be a vivid place to post and discuss questions, answers, bugs, fixes, ideas and the latest web craftsman gossip.

I hope you enjoy the forums, new project releases will be published next week (only because end of the week is a bad time to release awesomeness).

LuxuriousUploader - Sneak Preview

Wed, 01 Apr 2009 07:27:00 +0000

Update (1st May ‘09): FancyUpload 3.0 was released, completely rewritten and fully compatible with Flash 9 and 10. The project site provides more showcases, extensive documentation and runnable download packages.

Update: Oops, the release will be next week. An April Fool so close before the real release, very cruel, I know!

Finally, I can start the public beta for the upcoming FancyUpload 3.0. Enjoy the sneak preview showcase, it is kept very simple, providing the basic feature set. The process indicator is provided directly in the browser window. The new control is even more cross-browser, a lot of tests on different platforms ensure that!

If people like what they see, I’ll release it officially (and documented) this week! Now go and check out the preview!

Rolling out Sly - The JavaScript Selector Engine

Wed, 25 Mar 2009 17:11:00 +0000

Finally, a new selector engine!

Sly is a turbocharged, cross-browser, library-agnostic JavaScript class for querying DOM documents using CSS3 selectors.

If you’re a code geek like me, you might want skip the details and go directly to the source, the speed tests or the specs.

Sly awesomeness:

Pure and powerful JavaScript matching algorithm for fast and accurate queries
Extra optimizations for frequently used selectors and latest browser features
Works uniformly in DOM documents, fragments or XML documents
Utility methods for matching and filtering of elements
Standalone selector parser to produce JavaScript Object representations
Customizable pseudo-classes, attribute operators and combinators
Just 3 kB! (minified and gzipped, 8 kB without gzip)
No dependencies on third-party JS libraries, but developers can override internal methods (like getAttribute) for seamless integration.
Code follows the MooTools philosophy, respecting strict standards, throwing no warnings and using meaningful variable names

Querying the DOM with Sly:

// Finds all odd rows in all tables
var rows = Sly.search('table td:odd');

// Finds all links with class "internal" and an attribute "href" starting with "#".
var links = Sly.search('a.internal[href^="#"]');

// Another notation is also possible, since Sly acts as a constructor
var snippets = Sly('pre.highlight.javascript > code').search();

// features is just one element, lists has all list items are siblings of features
var features = Sly.find('#features');
var lists = Sly.search('~ ul', body);

… more examples and documentation.

Friday: Chess Playtime

Fri, 13 Mar 2009 15:01:00 +0000

I always tell people that there are many hidden gems on my playground. In the upcoming weeks, I will start to release some of those secrets to the public. You can peek at the snippets and perhaps put them to some good use.

It is Friday, so we start with some playtime: Blue Chess is a pretty old class which I wrote a year ago as proof of concept. It allows you to play a round of chess with 10kb elegant JavaScript. That is, if you find an opponent in real life, since it has no AI opponent. My favourite features are the animated dragging and interactive preview of possible moves. You can also pick up pieces and undo moves, but the implemented rules for “check-mate” are not yet complete.

Enjoy!

p.s. I fixed the SqueezeBox.css which was released yesterday. I forgot to update some lines. If any problems occurred on your site using it, try downloading it again.

SqueezeBox Patch Day

Thu, 12 Mar 2009 16:40:00 +0000

I found some time to give SqueezeBox some love. The new version was ready for some time, only needing some testing and a little fine tuning.

The functionality is still the same, but there are a lot of nifty things in this new release. Like a new look–with smooth shadows! And by hiding the browser scrollbars, it now prevents jumping pages and provides a better modal user experience. Images load fine now, so no more Endless-Spinner-of-Death™. Iframes are now also pre-loadable and are shown when the page loads completely.

The next iteration will feature an awesome caption bar and series navigation. The current API already supports them, so I just need to create elegant and usable interface for those.

I hope that everything works fine for you all and any feedback is appreciated. And please, do send me your sites that use SqueezeBox.

Enjoy!

Spring Cleaning & Consulting

Thu, 12 Mar 2009 13:58:53 +0000

I just returned from my 4 weeks honeymoon trip through Chile, where we travelled from Santiago to Tierra del Fuego and enjoyed the nature and very friendly and open-hearted people. I will visit it again someday but for now I do admit that “there is no place like home”.

With plenty of availability, fresh energy and full of ideas, I would love to take new challenges, now as part of your projects. There were many contracting and consulting requests; therefore I decided to freelance from now on “more officially”. If you merely need an adapted version of my open source projects, a full-blown user interface design or any other consulting (MooTools, plain JavaScript, XHTML/CSS, whatsoever), give me a call to get a quote.

SqueezeBox - Expandable Lightbox 1-1-rc3

Wed, 11 Mar 2009 23:00:00 +0000

Added: Subtle shadow, via CSS or PNG.
Added: Option iframePreload (defaults to false): Preload iframe before showing, similar to images.
Changed: SqueezeBox hides scrollbars now, to prevent flickering/jumping pages.
Fixed: Fixed endless loading loop for fast loading uncached images.
Fixed: Empty content after closing to stop playing Swiff movies.

FancyUpload - Swiff meets Ajax 2-0

Thu, 04 Dec 2008 23:00:00 +0000

Added: Flash 10 support
Added: removeFile now returns the new global progress status, to refresh numbers
Fixed: Clickable overlay for Flash 10, define your target element with option “target”
Fixed: Encoding problems fixed, JS calls failed due to ExternalInterface bugs (Kudos to SwfUpload for their short and efficient fix)
Fixed: Cancelling a running file starts the next file
Fixed: Enabled cross domain upload

MooTools 1.2.1 Released

Fri, 17 Oct 2008 06:24:00 +0000

Release early. Release often. And listen to your customers. (Linus Torvald)

This is one of the new objectives of MooTools, and the developers, co-developers and beta-testers work hard and (and perfectionistic) on creating, discussing and fixing tickets. Yesterdays 1.2.1 release is a drop-in replacement (no breaking changes) with:

Less bugs
Less memory leaks
More browser compatibility
… details in the changelog
… download or custom builder

Proceed as normal, get the complete release on the download page or customize your download. The upcoming milestone 1.2.2 is already geared with exciting new features and improvements. If you work with 1.2, updating is simple and highly recommended (if you still work with 1.11, it is not that easy but strongly recommended).

FancyUpload for Flash 10

Wed, 15 Oct 2008 17:16:00 +0000

This morning Adobe Flash 10 Player was released. Already during the beta releases people realised that it breaks all Flash-based upload solutions (there are several) that control a hidden flash-object with JavaScript.

I developed and tested all day to release a FancyUpload version that works in Flash 9 and 10 (Kodus to Anders Rasmussen and his conversion to AS3). The code is now commited to github, so people can review and submit patches in a blink:

http://github.com/digitarald/digitarald-fancyupload

It includes the updated source, assets and showcases. As a fix for Flash 10, the invisible Flash object has been moved over the browse button (referred by the option target). A solution with less than 10 lines, thanks to MooTools. A showcase with the fixed source is also available, waiting for tests in your favourite browsers.

The project site and showcases are not updated for this release, this one is a preview for developers, to get some feedback. I’d appreciate any feedback, test results and patches developers using the new version can provide.

30 Days of MooTools Tutorials

Wed, 01 Oct 2008 08:46:51 +0000

I like to feature people who have more time than me to write about MooTools and all its features and best practices. Sam and Troy from consider: open started to post 30 tutorials about their MooTools 1.2 experience, targeting also developers without MooTools/JavaScript experience. So far they finished 21 days full of good explanations and examples:

Kodus to the Troy and Sam, it is a great overview and a lot of detailed information.

AutoCompleter 1-1-2

Mon, 18 Aug 2008 22:00:00 +0000

Added: Option indicator for Autocompleter.Ajax, element is shown during request.
Added: Option indicatorClass, class-name is added during request to input.
Added: Option visibleChoices (default true), to scroll hidden choices into view
Added: Option emptyChoices, called instead of hideChoices when tokens are empty.
Fixed: Fixed filter loops on RegExp::test for Opera.
Fixed: Element::getSelectedRange returns correct positions for textareas in IE .
Fixed: Selected item resets correctly.
Fixed: Update can now also handle tokens as Hash, length check fixed.
Changed: BREAKING CHANGE (incl. Compatibility)! Naming conventions following MooTools 1.2
- Autocompleter.Base to Autocompleter
- Autocompleter.Ajax to Autocompleter.Request
- Autocompleter.Ajax.Json/Xhtml to Autocompleter.Request. JSON /HTML
Changed: BREAKING CHANGE (incl. Compatibility)! Extracted Local and Request from Autocompleter.js
Changed: Removed Element::getOffsetParent, included in MooTools 1.2
Changed: Element::getCaretPosition renamed to Element::getSelectedRange
Changed: Added JSON and HTML Request showcases.

How Jan explains the MooTools World

Thu, 10 Jul 2008 05:45:00 +0000

Jan Kassens, a MooTools core developer, finally got his blog on-line and did not stop writing till then. Readers can find some really useful code snippets and tutorials, revealing amazing MooTools “secrets” in detail:

Custom Pseudo Selectors - Adding the :random() selector
Exposes Class Mutator - Adding getters and setters to classes for modern browsers
toElement Method - Using element methods on your classes
Binds Class Mutator - The Bind helper to make coder shorter and simpler
outerClick Event - Adding the custom events for outer clicks

Kodus to Jan! I hope that he’ll find the time to continue this series. You can even write him, when you have an idea for an article. He even infected me again with this virus and I want to write more tutorials …

10 Resources For Learning MooTools 1.2

Fri, 20 Jun 2008 08:08:00 +0000

This article is a comprehensive list of 10 resources for developing or expanding crazy MooTools 1.2 ninja skills!

The first links are beginner guides for starting your successful career and understanding the basic concepts. After a few minutes, you’ll eventually see the light and realize how easy your daily life with MooTools can be. Then follow the next links.

If you already know JavaScript, MooTools makes it very easy for you, because it builds its API on JavaScript. Writing MooTools still feels like JavaScript because it follows the same principles. It just results in less headaches and a lot more fun!

If you are stuck, feel free to drop into our IRC-channel or post to the google group. Our ever helpful community is ready to answer your questions.

Mootools Essentials: The Official Mootools Cookbook for JavaScript/Ajax Development

The MooTools 1.2 reference for your bookshelf. Mootools Essentials aims to help you accomplish that task with the following:

Illustrations of nearly every class and function in the library
Real–world examples of how to use them
Written by Mootools user/contributor and Mootorial author, Aaron Newton.

I was one of the lucky guys who received a copy to review it, so I’ll post a detailed review about the first MooTools book later. Release is very close, but you can pre-order your personal copy.

The mooWalkthrough

The mooWalkthrough is a step by step, page by page, walk through of the JavaScript Framework.

Take your time and click through the pages. This guide makes it really easy for beginners, because it covers all the basic patterns consicely. Every page shows a problem and its solution and references further resources.

MooTools 1.2 for The Non Programmer (Part 2, 3, 4)

Using JavaScript can be a bit daunting for the non-programmer types out there. So, I’m going to display a few examples of just how easy MooTools can be. Hopefully, this will get you motivated to do a bit of learning and see how powerful and usable MooTools can be.

A guide with “everyday” examples and non-technical descriptions. If you want a quick overview and skip the basic patterns, this one is for you.

MooTools Classes: How to use them

Object oriented Classes in JavaScript keep your project structure clean and result in readable and reusable code. This article explain the Class pattern for beginners.

Chaining with MooTools 1.2

Describes the Chain Class in a documented example. Extending and implementing Classes are the basics for reusable code.

**Using MooTools Hash.Cookie API **

Shows and explains how to use the Hash.Cookie Class for saving persistent data the simple way.

What’s New in 1.2: Swiff

Today we’re going to talk about Swiff, which lets you combine Flash and JavaScript to do things MooTools can’t do on its own.

What’s New in 1.2: Element Storage

Another new feature that’s been built into the latest version of MooTools is the Element Storage. This article describes the usage of this great new feature, as well as why it was developed, and how it can be used to keep your applications organized and efficient.

Day to Day Mootooling

When using Mootools from day to day, these links will light your path.

MooTools Documentation

Always the best place for some research. If you spot an error or want to add a better example or text file a ticket with a patch.

MooTools Source Code

The authoritative source of information on Mootools, the source is considered one of the cleanest and easiest to understand in the JavaScript world. The source itself demonstrates some of the best practices that you should follow in your own code, including how to extend the MooTools classes for your own features.

MooTools 1.1 To 1.2 - Compatibility Layer

Thu, 12 Jun 2008 16:51:00 +0000

The MooTools-Team keeps working hard on the page and the requested missing features. The compatibility-layer for the 1.11 version is one of the frequent requests in the group, so I’ll provide them here for now:

Core Compat-Script for 1.2 Core Download
More Compat-Script for 1.2 More Download (contains only Fx.Scroll)

Browse them on github (or should we call it moohub?).

The compat scripts add the class and methodnames that have changed from 1.11 to 1.2. They also reflect several changed function arguments. MooTools 1.2 provides a powerful and consistent API, so I’ll continue my series on the changes that everybody can make the switch soon! I suggest to start reading them, to get an idea of the renamed classes and methods. Don’t trust these compat files implicitly, better convert your 1.11 scripts to 1.2 soon. We may update the compats for a more comprehensive 1.11 support, but 1.2 is the future-proof version!

Fuel Your Anticipation - Firefox 3 On June 17th

Thu, 12 Jun 2008 09:19:36 +0000

While the Firefox Release Candidate 3 just came out today with minor updates, Mozilla announced the final release for June 17th. A world record for the most software downloads in 24 hours is also arranged.

Some of my favourite new features:

Full page zoom. From the View menu and using keyboard shortcuts, you can now zoom in and out on the content of entire pages – this scales not just the text but the layout and images as well.
Tags. You can now associate keywords with your bookmarks to easily sort them by topic.
Offline support. Web applications can take advantage of new features to support being used even when you don’t have an Internet connection.
Reliability. Firefox 3 now stores bookmarks, history, cookies, and preferences in a transactionally secure database format. This means your data is protected against loss even if your system crashes.
Speed. Firefox 3 has gotten a performance boost by completely replacing the part of the software that handles drawing to your screen, as well as to how page layout work is handled.
Memory use reduced. Firefox 3 is more memory efficient than ever, with over 300 memory “leak” bugs fixed and new features to help automatically locate and dispose of leaked memory blocks.
more …

First tech-reviews about Firefox 3 are full of praise but also mention the memory-eating performance.

What are your experiences, did you expect more? Are you still scared to download?

API Cheat Sheet for MooTools 1.2

Thu, 12 Jun 2008 06:39:00 +0000

API Cheat Sheet for MooTools 1.2

MooTools 1.1 To 1.2 - Classes

Wed, 11 Jun 2008 09:48:00 +0000

My favourite JavaScript framework MooTools just got released as version 1.2, with tons of new features, performance boosts and bugfixes. To make the API consistent and bullet-proof for the future, the new release introduces several changed methodnames and arguments that break 1.11 and 1.2 beta code.

So I start a series about understanding the changes and converting to MooTools 1.2, starting with the powerful OOP helper Class.

FancyUpload - Swiff meets Ajax 2-0-beta-4

Thu, 08 May 2008 22:00:00 +0000

Fixed: Fixed fileUpload to return changed options, fixes overriding options.

SimpleTabs - Unobtrusive Tabs + Ajax 1-1

Tue, 06 May 2008 22:00:00 +0000

Public release for MooTools 1.2 - Support for static content and Ajax requests - Simplified CSS and span’s to allow styling with sliding doors technique - Reads tab content from existing XHTML markup

FancyUpload - Swiff meets Ajax 2-0-beta-3

Mon, 05 May 2008 22:00:00 +0000

Added: Optional events for every callback (e.g. onSelect, onComplete, etc.) are added automatically for more control
Added: Option limitSize (default false) to limit file size (in bytes) of a single selected file
Added: Option limitFiles (default true) to limit queue length, ignores finished files
Added: Option allowDuplicates (default false) to disable duplicate files in queue (checking name and size)
Added: Option validateFile as custom callback validator (default returns always true). Should return true or false.
Added: Optional callbacks for handling the file updates, allowing to control the behaviour and layout of the file elements:
- fileInvalid: called for invalid files with error stack as 2nd argument
- fileCreate: creates file element after select (see FancyUpload2::fileCreate for default method)
- fileUpload: called when file is opened for upload, allows to modify the upload options (data, url, method, fieldName) for every upload.
- fileComplete: updates the file element to completed state and gets the response (2nd argument) (see FancyUpload2::fileComplete for default method)
- fileRemove: removes the element (see FancyUpload2::fileRemove for default method)
Fixed: callback options are added as events , so they don’t break FancyUpload callbacks