As I said before, last few months I’ve been working for Falanxia.com, where I help to develop social games in Flash (and more platforms coming). I was not very happy with the way how to periodically call a method:

var timer:Timer = new Timer(10, 100); // call a method 100 times with 10 ms delay)
timer.addEventListener(TimerEvent.TIMER, method);
timer.start();

Is there a shorter approach to do the same thing? While we already use TweenLite/TweenMax a lot, I thought there has to be a plugin which should handle this task (no, I don’t need TweenLite.delayedCall(). Well, nope, there’s not. But sure it can be handled this way:

var tweenObj:Object = {pass:0};
TweenLite.to(tweenObj, 1, {ease:Liner.easeNone, onUpdate:method}); // 100 * 10 ms = 1 second

IMHO this way is a bit cumbersome and you need to create an Object to be tweened. I came up with a simple TweenLite plugin to do the job:

/*
 * Falanxia Utilitaris.
 *
 * Copyright (c) 2010 Falanxia (http://falanxia.com)
 *
 * Permission is hereby granted, free of charge, to any person obtaining a copy
 * of this software and associated documentation files (the "Software"), to deal
 * in the Software without restriction, including without limitation the rights
 * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 * copies of the Software, and to permit persons to whom the Software is
 * furnished to do so, subject to the following conditions:
 *
 * The above copyright notice and this permission notice shall be included in
 * all copies or substantial portions of the Software.
 *
 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
 * THE SOFTWARE.
 */

package com.falanxia.utilitaris.plugins {
    import com.greensock.*;
    import com.greensock.plugins.*;



    /**
     * Dummy tween plugin.
     *
     * @author Vaclav Vancura @ Falanxia a.s. vaclav@falanxia.com
     * @author Falanxia (falanxia.com, @falanxia)
     * @since 1.0
     */
    public class DummyTweenPlugin extends TweenPlugin {


        public static const API:Number = 1.0;

        protected var _target:Object;



        /**
         * Constructor.
         */
        public function DummyTweenPlugin() {
            super();
            this.propName = "dummy";
            this.overwriteProps = ["dummy"];
        }



        /**
         * Tween initialization.
         * Gets called when any tween of the special property begins. Store any initial values
         * and/or variables that will be used in the "changeFactor" setter when this method runs.
         * @param target Target object of the TweenLite instance using this plugin
         * @param value The value that is passed in through the special property in the tween.
         * @param tween The TweenLite or TweenMax instance using this plugin.
         * @return If the initialization failed, it returns false. Otherwise true. It may fail if, for example, the plugin requires that the target be a DisplayObject or has some other unmet criteria in which case the plugin is skipped and a normal property tween is used inside TweenLite
         */
        override public function onInitTween(target:Object, value:*, tween:TweenLite):Boolean {
            return true;
        }
    }
}

How to use it?

TweenPlugin.activate([DummyTweenPlugin]); // first you need to activate the plugin, but only once in the whole app
TweenLite.to(this, 1.0, {dummy:{}, onUpdate:method});

This way there’s no need to create an Object variable. I think it’s a bit simpler. Actually this article took much more time to write than to code the DummyTweenPlugin.

The Involver Media Player is coded in pure ActionScript 3 (to save space and hence bandwidth), with a help by PureMVC, BulkLoader, TweenMax libraries and a lot of my own open source classes.

Today you can meet this player on Facebook and other social networks. I worked on this player for several months and I think the request was successfully fulfilled. As you can see below, the feature set is pretty comprehensive.

Features:

• Skinning with custom loaded skins saved as SWFs, easily compiled in Adobe Flash (no Flex and AS3 coding needed, so it’s very easy to prepare new skins),
• Color theming of all skin elements (via config XML),
• Configuration from config XML, overriding any settings via FlashVars and remoting,
• Plugins (external in remote SWFs, internal bundled with player),
• Advanced system and network error recovery,
• Logging locally via LocalConnection, trace() and remotely to logging remoting endpoint,
• JavaScript events to invoke on a certain event (play, pause, stop, checkpoint spotted, plugin widget clicked, etc.),
• Player can be fully controlled from JavaScript,
• Full playback support (play, pause, skip, seek, load progress, playback progress, volume, mute),
• Full playlist support (sequential playback, random playback, intro playback),
• Fullscreen support,
• Titles, logos and other graphics on screen while playing, with animation and precise positioning,
• Mouse wheel support to control volume and/or seeking,
• Set checkpoints in video and playlist to call a function or plugin,
• Plugins can add custom buttons to the toolbar, footer and “More” screen,
• Advanced animation when resizing player window,
• Plugin tickers during video playback,
• Preroll / postroll plugins and actions,
• Popup blocker handler and ticker,
• Galleries of images and videos,
• Carousel to navigate images and videos,
• Facebook application plugin,
• Discussion plugin (with a playback ticker),
• Link plugin (with a list of links and playback ticker),
• Playlist navigator plugin,
• Image viewer plugin,
• Slideshow plugin,
• RSS reader plugin,
• Share this video plugin,
• Signup plugin,
• Stream listing plugin.

Examples:

• Basic player with two plugins
• Larger player with two plugins
• Scaling full window player (opens a new window)
• Player with mouse click handler to show a page
• More plugins
• Notification bar handled by the Link plugin
• Notification bar handled by the Quiz plugin
• Notification bar handled by the RSS plugin
• A lot of plugins, try resizing browser window after clicking “More” button (opens a new window)
• Color theming from configuration XML
• Muppets skin by Alex Schleifer
• Theming Muppets skin by Alex Schleifer
• Sunkist skin by Sunkist Soda

We thought isometric view would be awesome for a game of this type. My part of this job was to bring to life the whole client side, except drawings (done by Vladimír ‘Frognfly’ Chalupa) – that means all user interface graphics, icons, animations, Flash, Papervision3D and interactivity is my work.

I really enjoyed this job as I was able to do what I love, from scratch to finish. While designing skinning core, I developed a new skinning library I will open for public use soon. Watch my space on GitHub.

Click the images below to view
full resolution screenshots.

Initial game screen. Click the image to see the full resolution screenshot.

Basic screen elements. Click the image to see the full resolution screenshot.

First game mockups. Click the image to see the full resolution screenshot.

Overall map with an already bought house and current avatar position. Click the image to see the full resolution screenshot.

Original overall map. Click the image to see the full resolution screenshot.

Original character designer screen, page 1. Click the image to see the full resolution screenshot.

Original character designer screen, page 2. Click the image to see the full resolution screenshot.

Defect window. Click the image to see the full resolution screenshot.

Jackpot window. Click the image to see the full resolution screenshot.

Casino window. Click the image to see the full resolution screenshot.

Help a Friend window. Click the image to see the full resolution screenshot.

Job window. Click the image to see the full resolution screenshot.

New Message window. Click the image to see the full resolution screenshot.

Taxi window. Click the image to see the full resolution screenshot.

Jail window. Click the image to see the full resolution screenshot.

Webcafe window. Click the image to see the full resolution screenshot.

Animated preloader preview

Click to see the preloader preview.

Unfortunately the project is not alive anymore. However all these subprojects were pretty complex and made me much better programmer.

Click the images below to view
full resolution screenshots.

Click the image to see the full resolution.

Prosím čtěte před spuštěním kostky: Právě jsme s Kaplickem zjistili, že vám kostka pravděpodobně shodí browser, pokud nemáte nejnovější Flash Player. Aktuální build je 9.0.98.0, verzi vašeho pluginu zjistíte zde a aktuální betu Flash Playeru stáhnete zde.

Click the image to launch Flash.

Nemůžu se nepodělit o své nadšení, popravdě nečekal jsem, že to s ní půjde tak hladce. Již minule jsem dal k dispozici zdroják na animující se koberec, ale vzhledem k tomu, že jsem nepřibalil samotný Papervision, tak to asi nikdo z vás nezkompiloval (pokud si nestáhnul PV3D z SVN nebo jiného zdroje).

V dnešním balíčku naleznete i kompletní aktuální knihovnu a okomentovaný zdroják. Jediné co potřebujete, je Adobe Flash CS3 (a unzip).

Pokud máte nějaké dotazy, formulář níže je vám k dispozici.

Včera jsem se pustil do 3D ve Flashi a dost mne to vzalo. Klikejte, zdroják je zde.

Click the image to launch Flash.

The visual quality and animation experience scales nicely with hardware being used. So when your computer is not powerful enough, you won’t see so many animations. But well, the site is rather old now, so I suppose you got it with all bells and whistles.

Site is bilingual, so choose your language in the footer.

Click the images below to view
full resolution screenshots.

Initial screen. Click the image to see the full resolution.

Menu overlay. Click the image to see the full resolution.

About Us section. Click the image to see the full resolution.

Video player. Click the image to see the full resolution.

Audio player. Click the image to see the full resolution.

Image viewer. Click the image to see the full resolution.

Click the image to see the full resolution.

Click the image to see the full resolution.

Click the image to see the full resolution.

Click the image to see the full resolution.

Click the image to see the full resolution.

Click the image to see the full resolution.

Click the image to see the full resolution.

Click the image to see the full resolution.

A short animation done in one night for the Jsem.cz project.

Click the image to see the full resolution.

A short “animation” done in one night for the Jsem.cz project.