Tag Archives: Actionscript

Adobe Flash Platform and I

It appears to me (and perhaps others), I have distanced myself from Adobe Flash Platform during last couple of years. Not because I don’t like it, actually I love it, rather due to some other priorities here at our company, which does lot more (web-standards and design) than flash/flex stuff.

All this time, I have been keeping very low profile in flash-platform community, literally not talking about anything. I feel bad about it, I don’t know ‘why’.

I have done some trivial stuff (video players, flashlite and air apps) but nothing very cool or useful to everyone else.

My to-do list contains a long-list of applications targeted towards Adobe Flash Platform (desktop and other devices), I am supposed to do; Considering, my plate is full with all other responsibilities, I am not spending even 1/4th of the time writing actionscript.

Meanwhile, I have tried to encourage my team to learn actionscript and flex-framework. I even tried to hire some flash (or flex?) developers. I even managed to hire one flex developer last year.

Unfortunately, this person left the company as soon as when it was time to contribute back after 6 months training (no contribution period). That was big set back, a discouragement to me; I stopped looking for Flash/Flex developers.

I keep on promising myself, that I would do these applications; I keep on forgiving myself when I am not getting those done.

Anyway, there is still hope, I would building applications the on language (ActionScript), I am very good at. There is still hope, this blog would have more posts related to Adobe Flash Platform.

Ideas: FlashDevelop on OSX and GNU/Linux

FlashDevelop is an open-source IDE for Flash Platform development (ActionScript, MXML, HAXE, etc.) on Windows platform. I have extensively used it in past, and still, painfully, use it via windows virtual-machine on OSX host.

Couple of years back, I looked at FlashDevelop code to figure out, if we can port it for other operating-systems, such as Mac OSX and GNU/Linux.

I posted on Flash Develop forum about my experiments:

I have been trying to run FlashDevelop under OSX. In last couple of years, whenever I got sometime, I tried these:-

  1. Run FlashDeveloper with DotGNU: FlashDevelop was running but due to a lot of native (Win32) API calls, lots of components were failing (screenshot: http://pic.im/5Xk)
  2. Run Flash Developer with Mono: I tried to compile FlashDevelop using MonoDevelop and run using Mono for OSX. Most of the problems is one component/library i.e. DockPanelSuite (http://sourceforge.net/projects/dockpanelsuite/), an opensource code that uses a lot of PInvoke calls (Win32 API).

I am really excited about the possibilities, if we can port this one library we can get very closer to run FlashDevelop on OSX using Mono.

Note: pics.im seems to be dead, so I have uploaded new screen-shots
Flash Develop on OSX - ScreenshotFlash Develop on OSX

Some Ideas:

MonoDevelop is good enough and works well on OSX, I guess also GNU/Linux. However, I am yet to look at licensing and possibilities of forking the project (MonoDevelop)?

BTW! I have been lazy to write about such experiments on the blog, but while commenting on Jesse Warden’s post, I thought, it makes sense to post it here, so it lives.

Please let me know, if you have any ideas about making this happen? I would be happy to collaborate, contribute and donate in whatever capacity I can.

Happy New Year (2010)

Happy New Year to everyone, hope this year would bring more happiness and success in your personal and professional life. I also hope, a lot of problems in this world would be solved and make everyone (including animals, humans, trees, et al.) life easier and better.

New year (2010) started some ten days back, I am writing this post now? I can say, I have got lazy when it comes to blogging. It’s not that I don’t want to write, perhaps, I think too much before posting anything. There would be at least ten different posts in draft mode, I never posted those because I am not sure, those make any sense.

Anyway, many good things happened last year (2009) including my marriage. I am very hopeful that more good thing would happen in this new year (2010).

Last two years, I have been most inactive in Adobe Flash Platform community and social-media (blogging, etc).  I know, I would bounce back because I love to work on Adobe Flash Platform (specially actionscript), share what I do and help others. We all go through different phases in our life, for me it’s entrepreneurship where I am spending more time on things which would enable us to do great things in future.

Our company is doing very well, we have been focused on many things, specially a different culture, that would enable us to do great things in future, hopefully starting this year. We are happy that we have got very smart and nice individuals in our team, which makes us a great team.

As usual, I am always looking for smart developers (web and flash-platform), who can join us and be part of our journey. We are working on some nice projects and have plans for interesting products, I would surely need more passionate and smart people in my team.

For last many years, I have had new-year resolutions but this year my resolution is to get better at everything I do, that includes my health.

Once again, happy new year to everyone.

Making the case for ActionScript – my take

Peter Elst posted his thoughts about ActionScript and where it’s going. I agree with him and prefer to have simplicity we had once with ActionScript and Flash Platform.

I wrote my two-cents as comment to Peter’s post, that’s how it goes:

Nice post.

We have witnessed how Flash Platform evolved over the years, it has got more attention by people but at the same time, it has lost a lot of attention of those attached initially (as Keith said above).

Jeff Raskin, in Humane Interface, said something like that – complex tasks would require complex user-interactions but that’s no excuse to make simple tasks complex.

I believe, that’s what has happened. It’s not any more simpler to do simple things.

Adobe must think why they are doing it and for whom they are doing. If ActionScript is going to be clone of Java or C#, then why a new language – why not just use one of those?

There must be a philosophy behind a language and platform, what is that behind Flash Platform and ActionScript?

I had more fun in old days than now, just enjoyed the company of everyone (designers, developers, trainers, etc). It was because of simplicity that brought all of us together. I agree a lot of bad implementations were result of ease of doing things in Flash, but hey – there were far more good stuff then than now. A lot of innovation, cool stuff and apps to showcase. How much do we have now?

Job Opening: Flash Platform Developer

We are looking for some smart Flash Platform Developers who can be part of our team in Allies Interactive Services Pvt. Ltd., Kanpur, U.P.

We are a design and development company in Kanpur, though we are small but we are ambitious and have a great vision.

I posted the details on Flex-India sometimes back, pasting the same (edited the typos and formatted) over here:-

I have been meaning to post this for sometime but thought would it be appropriate to do that here?

I am part of a small design and development shop in Kanpur, U.P. Where, we mostly do web development using FOSS, mainly LAMP.

I moved to kanpur around 10 months back with a desire to build a great Flash Platform Team that would work on non-trivial type service projects and some great product ideas.

I could now start doing it, after we have managed to fix a lot of issues mostly a nice office, a good culture and some projects and a product in pipeline.

I need an experienced Flash Platform developer in my team, who can help us to make our vision, desire and dreams a reality.

Since Kanpur is not a metro or fancy place to live, it takes more than just technical aptitude to be here. That is some more strong reason f.ex. A desire to be part of a growing team, desire to be close to family, desire to contribute in the development of IT ecosystem in North and/or a desire to prove, hell yeah we can do great stuff from anywhere, even cities like Kanpur :-)

If you think, you want to help me by being part of my team and understand what I meant above, please don’t hesitate to contact me on [abdul dot qabiz at gmail dot com] off-list i.e. Direct email to me, please don’t reply here on this list.

As far as job description goes, I have already given an idea. However, we are looking for someone who understands web very well that is HTTP and other standards. Fundamentally good at problem solving, the real world ones, ActionScript, Flex Framework, Adobe Flash Player and AIR fundamentals and APIs.

Of course, good experience that says about in your behalf. We would also talk to you so things would get clear, i.e. If we are match for each other.

If you want to know more about company, please check out http://www.alliesinteractive.com

Available for consultancy, training and development

I am available for consultancy, training and development services. Following is the rough list of things, I can provide consultancy, training or development services for:-

  • ActionScript 1.0, 2.0, 3.0
  • Adobe Flash/Flex
  • Adobe Integrated Runtime (AIR)
  • Training on Adobe RIA technologies
  • Architecture for RIA
  • Web Application Development
  • Design and Architecture
  • Development for LAMP
  • Integration Services for Flex/AIR with existing Web Apps
  • Development Setup for small teams
    • Subversion Version Control
    • Bug Tracking System (Trac, Wiki)
    • Training on Development Life Cycle
    • Backup Strategies
    • Development Sandbox Setup for RIA development

    JFYI! You can check out my linkedin profile to know more about me. I am based in India and have around ten (10) years of experience, during this period I have worked for Macromedia/Adobe, Yahoo!, Mixercast and TIS and worked as independent-consultant, freelancer, trainer and co-founder. I have been working on various technologies/platforms (some listed above).

    I am a programmer who enjoys solving users’ problems whatever it takes (technology is no constrain). Having said that, I am passionate about ActionScript/Flash/Flex/AIR and Web (in general) which happen to be my core competencies.

    PS: Do you think, this is a shameless sales pitch :-)

    Technorati tags: , , , , , , , , , ,,

    Adobe Flash Player’s Security-Sandbox is very restrictive

    Adobe Flash Player Security-Sandbox is very good and we have not heard any major security vulnerabilities so far. However, I think, it can be made more intelligent, I have some use-cases where I can’t do anything.

    XMLSocket API is cool, since it’s inception, developers could create cool applications (multi-player games, chat-apps, presence-apps etc). XMLSocket servers (unity, swocket etc) is needed to comply with a specification in order to work with Flash Player (as a client). Since developers are using/creating custom-servers, they could control various things on server-side, f.ex: configuring right security-permissions, serving right policy-file (crossdomain.xml) etc.

    With Binary Socket API, in Adobe Flash runtimes, things have changed a lot. Applications (for Adobe Flash runtimes) can now connect to servers using standard protocols (POP3, SMTP, Databases, HTTP etc). Totally cool feature which allows creation of kick-ass applications (Yahoo! Web Messenger, mySql driver etc). But Adobe Flash Player’s security-sandbox is limiting Binary Socket’s capabilities.

    I have been working on a library (as3httpclient) to do more things (http-status-messages, http-authentication over GET request, support for more http-methods etc) which are not supported by URLLoader API. This library (as3httpclient) doesn’t work in deployed web-application because Adobe Flash Player’s Security-Sandbox restricts it to.

    I have following questions/concerns:-

    • When URLLoader (or other such native APIs) can connect on any port, why can’t custom APIs (as3httpclient and others) connect?
    • Why can’t Flash Player be little more intelligent to check, if connection is made to a HTTP server? Rules could be:- If connection is requested to same domain and destination-port is assigned to HTTP server, let communication happen. If destination server:port is in different domain, check for valid crossdomain.xml and allow the connection?
    • Why doesn’t Flash Player consider to-ports attributes, if policy-file is served over HTTP?

    With standards, we expect flexibility. We can’t expect a HTTP server to push policy-file to Flash clients? That’s not standard.

    Technorati tags: , , , ,

    Loading JavaScript file(s) using HTTPService/URLLoader

    In my last post, I talked about JavaScript Flex 2 component that can inject Javascript code in HTML wrapper’s context. I experimented to see, if we can load Javascript files (.js) using HTTPService (or flash.net.URLLoader) in Flex2/AS3 projects and inject it.

    Example Flex 2.0 code:

    <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
    xmlns="com.abdulqabiz.utils.*"  width="100%" height="100%" creationComplete="onAppInit ()">
    <mx:Script>
    <![CDATA[
    import flash.external.ExternalInterface;
    import mx.events.*;
    import mx.rpc.events.*;
    import mx.rpc.http.HTTPService;
    import com.abdulqabiz.utils.JavaScript;
    private var javascript:JavaScript;
    private var service:HTTPService;
    private function onAppInit ():void
    {
    service = new HTTPService ();
    service.url = "test.js";
    service.useProxy = false;
    service.resultFormat = "text";
    service.addEventListener ("result", injectJavaScript);
    service.send ();
    }
    private function injectJavaScript (event:ResultEvent):void
    {
    javascript = new JavaScript ();
    javascript.source = String(event.result);
    trace ("javascript injected: " + event.result);
    }
    private function invokeSayHelloWorld ():void
    {
    ExternalInterface.call ("sayHelloWorld");
    }
    private function invokeSaySomething (str:String):void
    {
    ExternalInterface.call ("saySomething", str);
    }
    ]]>
    </mx:Script>
    <mx:Button label="invoke javascript saySomething () function" click="invokeSaySomething ('Hey, how are you?')"/>
    <mx:Button label="invoke javascript sayHelloWorld () function" click="invokeSayHelloWorld ()"/>
    </mx:Application>
    

    Test.js used in example:

    //test.js
    var myName = "Abdul Qabiz";
    function saySomething (str)
    {
    alert (str);
    }
    function sayHelloWorld ()
    {
    alert ("Hello World!");
    }
    

    You would need JavaScript.as (with proper package directory structure) and test.js (code posted above) in place to make above example to work.
    I am thinking to load FABridge using this approach. I know, it’s practically of no use except keeping code and logic at one place.

    JavaScript injection through ActionScript

    In last post, I showed, how can we inject JavaScript using ActionScript or MXML into host HTML container/page.

    One more use-cases, I can think of:

    • Request server-side script to send a JavaScript (for specific browser) as string.  Using JavaScript class, I can inject the javascript in HTML

    A MXML component that embeds JavaScript in html

    I know subject line is confusing but I am not able to think a better one. I have written a Adobe Flex 2.0 component(JavaScript.as), which can be used as MXML tag in Flex 2.0 applications. You can write JavaScript code as text of this MXML tag. When your application loads, all that JavaScript code would be exported to HTML container’s context.

    Confused? Let code speak rather than me :)

    Sample MXML application using this component (test.mxml):-

    
    <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" xmlns="com.abdulqabiz.utils.*"  width="100%" height="100%">
    <JavaScript>
    <![CDATA[
    var myName = "Abdul Qabiz";
    function saySomething (str)
    {
    alert (str);
    }
    function sayHelloWorld ()
    {
    alert ("Hello World!");
    }
    ]]>
    </JavaScript>
    <mx:Script>
    <![CDATA[
    import flash.external.ExternalInterface;
    private function invokeSayHelloWorld ()
    {
    ExternalInterface.call ("sayHelloWorld");
    }
    ]]>
    </mx:Script>
    <mx:Button label="invoke javascript sayHelloWorld () function" click="invokeSayHelloWorld ()"/>
    </mx:Application>
    

    HTML code that embeds test.swf(output of above code):-

    
    <html>
    <head>
    <!-- swfobject -->
    <script type="text/javascript" src="http://blog.deconcept.com/swfobject/swfobject_source.js"></script>
    </head>
    <body>
    <div id="flashcontent" class="playerContent" >You don't have Flash Player 9.</div>
    <script type="text/javascript">
    var swfObj = new SWFObject ("JavaScriptComponentTest.swf","JavaScriptComponentTest", "300", "300", "9", "#C0D4DD", true);
    swfObj.write("flashcontent");
    </script>
    <a href="javascript:void(0)" onclick="saySomething ('hey')" >invoke saySomething ()</a><br />
    <a href="javascript:void(0)" onclick="sayHelloWorld ()" >invoke sayHelloWorld ()</a><br />
    <a href="javascript:void(0)" onclick="alert (myName);">show myName </a><br />
    </body>
    </html>
    

    See an example Or Download (zip 133kb includes the SWF).

    The code is available under the MIT license.

    Disclaimer: I have only tested this in FireFox on Windows. So please drop a comment, if doesn’t work in your system.

    Update:
    March 6, 2007 – Fixed a bug, which popped-up after I implemented comment removal feature. Thanks to Joan for point it out.
    March 5, 2007 – Library has been updated, it can now handle comments in JavaScript code. It would basically remove all comments before injecting it in HTML container.

    How to get URL query-string variables within Flex application

    On flexcoders, someone asked, how to get the URL parameters in a Flex 2.0 application? By URL parameter, I mean the query-string variables, as shown below:

    http://yourserver/yourapp.swf?name=Joe&age=22 or http://yourserver/yourapp.mxml?name=Joe&age=22

    Note: To get the variables in flex via mxml file, you need server-side compilation of mxml files.

    You can get the values of the params using from

    mx.core.Application.application.parameters

    object, which contains the name-value pairs (hash-map).

    For example,

    mx.core.Application.application.parameters.name

    would return “Joe”, considering above example URL. You can find more information about this in livedocs: http://livedocs.macromedia.com/flex/20beta1/docs/00001300.html

    Then someone asked, what if your swf is embedded in custom html wrapper, how to get the query-string params inside swf?

    Most of us use ExternalInterface class in Macromedia Flash Player 8(onwards) to invoke some JavaScript functions and extract the value in ActionScript.

    I wrote a quick-and-dirty class in ActionScript 3, which would get the values of params from URL query-string for you. You don’t need any extra JavaScript code in HTML. The same logic can be used for any an ActionScript 2.0 running Macromedia Flash Player 8.
    QueryString class has following properties:-

    • parameters – an Object which contains the name-value pairs from query-string
    • queryString- String, this contains the entire query-string (url-encoded) name-value pairs.
    • url- String, this returns the complete URL of the wrapper page with query-string.

    See demo
    Download source files

    HTTP Authentication for HTTP/GET requests using ActionScript 3

    I am working on ActionScript3 API for Bloglines services, which requires HTTP Authentication for its two of the services. I was not able to set the header of a HTTP/GET request. Macromedia Flash Player allows you set the header only for POST requests. I discussed this issues with Ted Patrick and he told me how I can us Socket to achieve the desired and he was very kind to give a me code-snippet, which got me started. Thanks Ted.

    Finally, I could implement a class(HTTPURLLoader) which allows me to:

    • Add request-headers
    • Do HTTP Authentication for GET URLs
    • Handle HTTP status messages
    • Read the complete response header

    It basically connects to a HTTP server on port 80(hardcoded for now) and sends an HTTP/1.0 request so that server closes the connection immediately after response. I could use HTTP/1.1 to keep connection alive and do things. But then closing connection would require some more logic, either a timeout logic if there is no activity on socket then close the connection, or find the end delimiter of response and then close. So I chose the easiest approach :)

    I am still working on it and there is a lot(bugs-fixing, optimization, code-commenting, removing hardcoded stuff etc) to be done. I just wanted to share whatever I have done so far. I think, idea is more important than the implementation.
    Anyways, I also implemented Base64 in AS3 and also OPML parser for Bloglines. I would soon upload the entire Bloglines AS3 API source.

    Download the code:

    Usage:-

    <mx:Application xmlns:mx="http://www.macromedia.com/2005/mxml" creationComplete="onAppInit()">
    <mx:Script>
    import flash.net.URLRequest;
    import flash.net.URLRequestHeader;
    import com.abdulqabiz.net.HTTPURLLoader;
    import com.abdulqabiz.crypto.Base64;
    private var loader:HTTPURLLoader;
    private var END_POINT:String = "http://rpc.bloglines.com/";
    //you need to set your email/password required for Bloglines access.
    private var email:String = "YOUR_EMAIL_FOR_BLOGLINES";
    private var password:String = "YOUR_BLOGLINES_PASSWORD";
    private function onAppInit()
    {
    loader = new HTTPURLLoader();
    loader.addEventListener("complete", onComplete);
    loader.addEventListener("httpStatus", onHTTPStatus);
    loader.addEventListener("progress", onProgress);
    //for simplicity,not handling following three events.
    //loader.addEventListener("close", onClose);
    //loader.addEventListener("ioError", onIOError);
    //loader.addEventListener("securityError",onSecurityError);
    }
    private function onComplete(event:Event)
    {
    //headers stroed as name-value(hash map)
    var rh:Object = HTTPURLLoader(event.target).responseHeaders;
    var str:String = "";
    for(var p:String in rh)    str+= p + ":" + rh[p] + "\n";
    console.text+="Response Headers: \n" + str + "\n\n";
    //data property holds the content
    console.text+="Body Content:\n" + HTTPURLLoader(event.target).data + "\n\n";
    }
    private function onProgress(event:ProgressEvent)
    {
    //bytesTotal is not accurate, and its 0 if server doesn't send Content-Length header.
    console.text+= "Event: progress:-\n" + "bytesLoaded: " + event.bytesLoaded + "\n\n";
    }
    private function onHTTPStatus(event:HTTPStatusEvent)
    {
    //if httpStatus is 401, 403, 404, 500, 501, socket is closed.
    console.text+= "Event: httpStatus (" + event.status + ")\n\n";
    }
    private function loadURL()
    {
    var request:URLRequest = new URLRequest();
    //call listsubs method of Bloglines
    request.url = END_POINT + "listsubs";
    var credentials:String = Base64.encode(email + ":" + password);
    //create HTTP Auth request header
    var authHeader:URLRequestHeader = new URLRequestHeader("Authorization","Basic " + credentials);
    //add the header to request
    request.requestHeaders.push(authHeader);
    //make the request.
    loader.load(request);
    }
    </mx:Script>
    <mx:Button label="Load URL" click="loadURL()"/>
    <mx:TextArea id="console" width="100%" height="100%"/>
    </mx:Application>

    Extending CSS capablities in Macromedia Flash Player

    I am going to give a simple example using TextField.StyleSheet.transform(..). This is used to extend the CSS parsing capability. For example, “leading” is not parsed by CSS parser in Flash Player. Let’s make an example for the same.

    First we would extend TextField.StyleSheet by creating a subclass(StyleSheetEx) and overriding it’s transform method.

    • StyleSheetEx.as
      import TextField.StyleSheet;
      
      class StyleSheetEx extends TextField.StyleSheet {
        
        // override the transform method
        function transform(style:Object):TextFormat {
      	var _fmt:TextFormat = super.transform(style);
      	for (var z in style) {
            if (z == "leading") {
              _fmt.leading = style[z];
      		delete style[z];
              break;
            }
          }
      	for(var i in _fmt) {
      		trace(i + " : " + _fmt[i]);
      	}
         	return _fmt;
        }
      }
      // end class definition

    • style.css
      p {
      
      	leading:10;
      	font-style:italic;
      	font-family:arial;
      	text-decoration:none;
      }

    • StyleSheetEx.fla
      import StyleSheetEx;
      
      this.createTextField("_txt",this.getNextHighestDepth(), 50,50, 400,200);
      _txt.multiline = true;
      _txt.html = true;
      _txt.wordWrap = true;
      _txt.text = "Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nunc erat est, dapibus id, porttitor a, nonummy nec, augue. Vivamus non felis. Quisque posuere, est et iaculis convallis, felis eros tempor lectus, vel tempor dolor diam quis nisl. Donec tincidunt pellentesque leo. Donec eget nisl. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Morbi sit amet arcu ac magna elementum tristique. Nam fermentum.";
      
      var _css:TextField.StyleSheet = new StyleSheetEx();
      
      _css["owner"] = this;
      _css.onLoad = function(bSuccess) {
      
      this.owner._txt.styleSheet = this;
      
      }
      
      _css.load("style.css");
      

    You can also see demo this example.

    Create above files with code and test it. I hope, “leading” works for you also. I know there could be many better ways, as I can see many enhancements in the above code. Please feel free to suggest.