All posts by guya

Cool feature of HTML5

Not dealing much with HTML lately, I’ve only noticed this new feature now. The thing is that HTML5 let you change the page’s URL path without refreshing the page content. Like in this example from google 20thingsilearned.com – when you flip the book’s pages the url changes for easy bookmarking and SEO, but the content doesn’t flicker. If that not seems like much to you, than you don’t know what you’re talking about.

All that is needed to achieve the magic is this line of code:

window.history.pushState("", "title", "somePath/");

Try it:

    Click to change the page url

Amazing! There is no need for the ugly hash (#) anymore in order to achieve AJAX/Flash deep linking… oh wait… it doesn’t work in IE9 and FireFox 3.x :( (yet)

Thinking “I know all that browsers can do” this one got me wondering. I’m coming to realize that even though I still believe I generally know most of its capabilities, with HTML 5 there probably lots of things that browsers can do which I’m not yet familiar with. I swear I will skim through the spec when I’ll have the time, there must be many interesting security flaws in there… or is it?!.

More info here & here

New Away3D Flash Molehill Video

This is a never seen before example of the upcoming version of Away3D engine taking advantage of the new 3D API of the upcoming Flash Player – code named Molehill.

This example and more, were presented by Lee Brimelow today in the FlashIsrael event and he said he just got these a few hours ago from Away3D devs, so chances are you never seen it before.

There were other impressive examples with even much more polygons and such. I’m sure we’ll get to play with all of it in a few weeks when the labs version of Molehill will be available along with the new Away3D engine – - Great!

It was great to finally be able to meet Lee and all the others. After years of reading Lee’s blogs and seeing him in videos, he seems like a truly funny, smart and nice dude… ah yeah… and tolerant for annoying people with cameras Winking smile — Thanx

Putting Data Into Context

The challenges of presenting large amount of data visually in a way that one will be able to easily digest and understand it are becoming more viable daily. The democratization of data, challenge authors to think about new ways to visualize it.

The above text, is pretty much the summery of this highly inspiring video called Journalism in the Age of Data. As the name suggest this video is mainly about journalism data viz, but, it is also highly inspiring for anyone dealing with data of any kind.

Many RIA applications today struggle with the ability to present large data sets to the user in away which he can digest and understand.
I would say that many of these new apps, especially in the enterprise space and from the last few years, are built upon the Flex framework.

As RIA developers many of us face these challenges in the day to day work. Obviously, the charts that comes bundled with the Flex framework won’t suffice most of the time, and one would need to relay on third party components or role her own. Not so long ago, its seemed that this area is blooming. The amazing open source projects like Flare and BirdEye. The slick commercial components, IBM ILOG Elixir and KapLab – ridiculously priced and has draconian licensing, respectively.

Today, these open source projects seems to be abandoned and the commercial tools prices seem to increase. The field of online data visualization is exploding and yet the Flex tools seems a bit halted.

The somewhat halted SilverLight with its basic charts and decent third party components. And the HTML5 alternatives, like Protovis, which still needs some maturity – doesn’t seem to provide the alternative.

Anyhow, if one wants to create something “out of the box”, than she needs to use something like Flare as the base and invent her own data viz, other than use some slick, out of the box, components.

InsideRIA has an immense list of with most data visualization frameworks and resources


The Video

I’ve extracted some selected examples, for your convenience:

Many Eyes (Java)
Budget Forecasts, Compared With Reality (Flash)
The Jobless Rate for People Like You (Flash)
In graphics: Eurozone in crisis (HTML)
The Stimulus Tracker (Flash)
Crash: Death on Britain’s roads (Flash, HTML)
How Different Groups Spend Their Day
The Crises of Credit
Last.fm Listening History – What have I been listening to? 
Eurovision Song Contest 2008 (Flash)
Google public data explorer (Flash, HTML)
Oakland Crimespotting (Flash)
Tracking Taxi Flow Across the City

Blogs:
http://infosthetics.com/
http://www.visualcomplexity.com/vc/
http://flowingdata.com/
http://blog.blprnt.com/
http://www.good.is/infographics
http://eagereyes.org/
http://www.guardian.co.uk/news/datablog
http://well-formed-data.net (not from the video)

Debugging Flash Player on Google Chrome

Just a quick tip in case you missed it. I’ve written previously on how to better develop Flash and Flex on Google Chrome. But, since Chrome is now auto updating the Flash Player with the latest release version, it ignores other players, debug player included.

In order to be able to run the Flash Player Debugger with Chrome:

  1. Go to about:plugins (past it in the address bar)
  2. Click on “Details” to see the full view (top-right)
  3. Search for this gcswf32.dll and click the “Disable” link just below it (be sure to click the first “Disable”)
  4. Install the Netscape-compatible plug-in from here.

Next time you will start Chrome it will use this debug player.

Exotic Flash Builder 4 Tips and Tricks

The Flash Builder is built on Eclipse, you know, hence many of Eclipse stuff will naturally comply, also, these tips will mostly work the same in Flex Builder 3 and Eclipse.

-> Browse to any file or directory

It’s essential to be able to easily browse to the resource you’re currently looking at. There should have been a built in way to do this.

1. Click on, Run –> External Tools -> External Tools Configuration (Alternatively, click on the Favorites icon and select "External Tools Configuration")

image

2. Inside the "External Tools Dialog" -> Select "Program" -> click on the "New Launch Configuration" icon.

image

3. Inside the "Main" tab (Default) set:

  • Name: Explorer
  • Location: c:windowsexplorer.exe
  • Working Directory: c:windows
  • Arguments: /select,"${resource_loc}"

image

4. Go to the "Build" tab and uncheck "Build before launch"

image

5. Go to the "Common" tab, look for "Display in favorites menu" and check "External Tools"

image

You can now select any file or directory from the “Package Explorer” and browse straight to it’s location in windows explorer.

image

-> Extending with batch files – kill all IE processes

Flash Builder 4 can be extended using batch files (Shell Scripts on the Mac). This example uses a batch file to kill all opened IE processes before launching a new debug session.

There are a few reasons to debug a Flex app in IE. Firstly, some users still use it, and secondly I don’t want the precious tabs that are opened on my other useful browsers to be bothered. Occasionally, IE processes are left running in the background even though debug session was ended. Sometimes I simply didn’t closed the browser before running a new session. Both of these cases lead to the consuming of needed memory and slows down the system.

A batch file is merely a text file with a .bat extension.

  1. Create a new text file.
  2. Edit this file with any text editor –> Copy paste this line into it: taskkill /F /IM "iexplore.exe"  -> Save this file as kill_iexplore.bat (Double clicking on this file will kill all IE processes)
  3. Click on, Run –> External Tools -> External Tools Configuration
  4. Inside the "External Tools Dialog" -> Select "Program" -> click on the "New Launch Configuration" icon.
  5. Inside the "Main" tab (Default) set:
    Name: Kill Internet Explorer
    Location: c:kill_iexplore.bat
    (depending on were the file is saved)
    • Go to the "Build" tab and uncheck "Build before launch"
    • Go to the "Common" tab, look for "Display in favorites menu" and check "External Tools"

    – In Order to kill all IE processes before launching a new debug session

    1. Right-Click on the flex project –> Select “Properties
    2. In the properties dialog select “Builders” –> Click on “Import” and select “Kill Internet Explorer” from the list.

    image

    -> Link with Editor

    This one is very helpful but easily overlooked, it’ll make the Package Explorer and the editor view synchronized.

    Click on this icon to make your life better.

    image

    -> Some Important shortcuts (For Mac CTRL == CMD, ALT == Option)

    Ctrl+Shift+T Find any class SDK included
    Ctrl+Shift+R Find any resource/file (wont find SDK classes)
    Ctrl+3 Finds everything, literally everything – files, commands, views (Amazing, try it, use it)
    Ctrl+Alt+Up/Down Duplicate a line or a block of code
    Alt+Up/Down Reorder a line or a block of code
    Ctrl+D Delete a line or a block of code
    Ctrl+Shift+L+L Open Configuration
    Ctrl+K Find next (like F3)

    Less important shortcuts

    Ctrl+O Current class outline
    Ctrl+Shift+G Finds all references in the workspace
    Ctrl+Shift+L Shows all shortcuts (key binding)
    Ctrl+M Maximize the selected view
    Ctrl+J Quick Search without the search dialog (click ESC when done)
    Ctrl+Shift+X To upper case
    Ctrl+Shift+Y To lower case
    Ctrl+I Auto indent selected code

     

    P.S. Why exotic?! It made you look didn’t it. And beside, it is somewhat exotic.

    P.S.S. At first I thought about writing a short post with only the first tip, but, thinking about it, I think I’ll make this an ever updating page. So if you have any other tip you like to share please write about it in the comments.

    Flash Player 10.1 Global Error Handling Examples and the Flex 3.x Issue

    We all welcomed this addition to the Flash Player 10.1. The ability to catch all exceptions inside the player has lots of benefits, from proper logging on to not annoying users that has the debug player.

    There are some code examples of how to implement this feature, and indeed it was a breeze adding it for pure Flash and to Flex 4.x projects. But, somehow I had trouble making it work for Flex 3.x project. I know it’s a player dependent but still something in the Flex 3.x framework killed this functionality.

    Anyhow, eventually it did worked for me on the Flex 3.x, but I couldn’t make it to work when even 1 of the libraries, except playerglobal.swc, is external or RSL. I guess there is no escape from monkeying with the RSL loader to see if I can find a solution there.

    I’ve mad these examples available, in case you need a complete example and/or also struggling with this feature on Flex 3.x. Also, in these examples I didn’t force the user to update the Flash Player and used a compiler argument -target-player=10.1.0 instead of modifying the html wrapper.

    All examples are viewable here, you can right-click on “View Source” or download the complete Flash Builder 4 projects (for Flex Builder 3 project, look at the comments).

    GEH Pure Flash

    GEH Flex 4.1

    GEH Flex 3.5

    Note: No need for the FP 10.1 playerglobal.swc to be inside C:Program FilesAdobeAdobe Flash Builder 4sdks4.1.0frameworkslibsplayer10.1 I’ve put it inside the libs folder.

    John Smith’s younger brother, Adam

    Update: Youtube has revived my video. you can now watch Webcam Clickjacking as much as you like. —

    Remember ClickJacking? The generic flaw in web browsers and HTML. Remember Webcam Clickjacking? My PoC showing how this flaw can be used to take control over a victim webcam and mic.

    Well, my PoC, to my surprise, created a lot of buzz when I published it and the related youtube video got 1,220,966 views – most of it from its first day.

    view_count

    Yesterday I got an email from youtube titled “Video removed – Copyright Infringement”. At first I thought it’s just another spam mail, but looking inside it and than trying to watch my video gave me an alarming red webpage, with the bold text “This video is no longer available due to a copyright claim by Adam Smith.

    WTF, what copyright shmopiright, my video has no sound and barley a screen capture of my mouse. In-fact I sometime claim it to be the most dull video with the most views.

    My immediate suspect was Adobe, but it made no sense, if they wanted to, they should have done it when it was hot. Than again sense and Adobe legal dept’ doesn’t always go together. flashObject anyone?

    Googleing for such a generic name as “Adam Smith” gives about 3,570,000 results, apparently it’s more generic than “John Doe”. Googleing for “Professor Adam Smith” from adobe gives some possible options but it’s still not informative enough and too vague.

    So who is this MR. Generic claiming I’ve stole his precious copyrights. Maybe he’s just a fake dude trying to annoy. Even if he’s real, I guess when you have such a generic name you don’t care to be hated, nobody is gonna correlate your face with your name anyway.

    Anyhow, I’ve filed a counter-notification and hopefully the video will be up again soon. Even if it won’t, I’m sure it’ll appear in some other places.

    There is a lot of info regarding “my video was removed from youtube” just google it, if you need to.

    There is a lesson to be learned here, one should never trust google, and alike with their important assets. It can get shut-down in an instance. Personally I don’t care much about this video, I didn’t get a dime out of it and its heydays are long gone. But, there are cases where people lost all of their income one day since google removed their blogspot hosted blog, for example.

    If you want full control over your videos and such, you should be hosting it yourself, and on some remote island. Than again, they still be able to cut your cable.

    I just wonder where the hell is the decentralized web?! Too few people are controlling too much stuff.

    Encode and Decode URLs in Python for Google Appengine

    While developing in Python for Google Appengine you’ll might want to encode or decode URLs. Sounds like a simple task, as it is in many other languages. Somehow in Python 2.5.x which is the version supported by appengine, it’s not as straight forward, at least it wasn’t for me. There are tones solutions, suggestions and examples out there, not all work as expected.

    After some trial and error it finally worked:

    import urllib
    
    text = 'some text'
    
    #decodeURI
    text = urllib.unquote(text.encode('ascii')).decode('utf-8')
    
    #encodeURI
    text = urllib.quote(text.encode('utf-8'))

    Might spare you some time.

    If your gonna work with unicode on your appengine app than your in for some other troubles. This presentation, and this article (and its comments) might help a bit.

    Flash Private Browsing Fixed – Not Good Enough

    I was going to congrat Adobe for their fix to the private browsing in Flash, this was my original text:

    I’m glad to say that Adobe has fixed the minor issue they had with the new Flash Player 10.1 private browsing. I’ve written before on how a developer can tell the user’s browsing mode.

    The Flash Player that is installed with CS5 is 10.1.52.14 which still suffer from this bug. If you surf the web using private browsing mode you should update the Flash Player to the latest, currently, 10.1.53.38 (RC4). Actually you should update it anyway.

    But, when I went to see what have they changed in order to fix it. I saw that both modes, now, have the same limit of 100KB, but it’s still differ. While trying to save more than 100KB in normal browsing mode the status is “pending” while in private browsing mode it immediately fails.

    Making this demo functional again required changing 1 line of code. Using any Flash Player, from 10.1_beta2 till latest 10.1.53.38(RC4) should show you if you’re in private mode or not.

    So, please, again, normal and private browsing modes should behave exactly the same from a developer standpoint. Making local storage limit the same 100KB was a step in the right direction, but, it’s not enough. Let any Flash content ask for more storage even if it’s in private mode and allow the user to accept it, just remember to delete the user’s choice along with the local storage.

    BTW, it might be possible to trick the browsers to tell you the user’s browsing mode, using HTML5 localStorage for example, and without using Flash.

    The updated source code is below:

    package {
    	import flash.display.Sprite;
    	import flash.display.StageAlign;
    	import flash.display.StageScaleMode;
    	import flash.events.NetStatusEvent;
    	import flash.net.SharedObject;
    	import flash.net.SharedObjectFlushStatus;
    	import flash.text.TextField;
    	import flash.text.TextFieldAutoSize;
    	import flash.text.TextFormat;
    	import flash.utils.getTimer;
    	import flash.utils.setTimeout;
    
    	/**
    	 * This class will tell the current browsing mode of the user
    	 * Tested with Flash Player 10.1 beta 2 - 10.1.53.38 (RC4)
    	 * for more info go to:
    	 * http://blog.guya.net
    	 */
    
    	[SWF(backgroundColor="#FFFFFF", width="400", height="35")]
    	public class KissAndTell extends Sprite
    	{
    		private var _tf:TextField;
    
    		public function KissAndTell()
    		{
    			initStage();
    			createTF();
    			setTimeout(saveData, 300);
    		}
    
    		private function initStage():void
    		{
    			stage.scaleMode = StageScaleMode.NO_SCALE;
    			stage.align = StageAlign.TOP_LEFT;
    		}
    
    		//try to save 140kb into the local storage
    		private function saveData():void
    		{
    			var kissSO:SharedObject = SharedObject.getLocal("kissAndTell");
    			kissSO.data.value = getDataString(140);
    
    			var status:String;
    
    			try
    			{
    				status = kissSO.flush();
    				kissSO.addEventListener(NetStatusEvent.NET_STATUS, netStatusHandler);
    			}
    			catch(ex:Error)
    			{
    				trace("Save failed - private browsing mode");
    				setPrivateText();
    			}
    
    			if(status && status == SharedObjectFlushStatus.PENDING)
    			{
    				trace("Pending status - normal browsing mode");
    			}
    
    			/***  Changed in the newer versions of the Flash Player 10.1 beta ***/
    			//If we can save more than 100kb then we're in Private Mode
    			else if(status && status == SharedObjectFlushStatus.FLUSHED)
    			{
    				setPrivateText();
                }
    		}
    
    		//Listening to this event just to prevent exception on debug players
    		private function netStatusHandler(event:NetStatusEvent):void
    		{
    			trace("event.info.code: " + event.info.code);
    		}
    
    		private function setPrivateText():void
    		{
    			_tf.text = "Private Browsing Mode";
    			_tf.backgroundColor = 0xAA2222;
    		}
    
    		private function createTF():void
    		{
    			_tf = new TextField();
    			_tf.autoSize = TextFieldAutoSize.LEFT;
    			_tf.defaultTextFormat = new TextFormat("Arial, Verdana", 20, 0xFFFFFF, true, null, null, null, null, null, 10, 10);
    			_tf.text = "Normal Browsing Mode"
    			_tf.backgroundColor = 0x22AA22;
    			_tf.background = true;
    			addChild(_tf);
    		}
    
    		private function getDataString(kb:int):String
    		{
    			var t:int = getTimer();
    			var word:String = "GUYA.NET_GUYA.NET_GUYA.NET_GUYA.NET_GUYA.NET_GUYA.NET_GUYA.NET_GUYA.NET_GUYA.NET_GUYA.NET_GUYA.NET_";
    			var count:int;
    			var a:Array = new Array();
    			var lenNeeded:int = kb * 1024;
    			while(count * word.length < lenNeeded)
    			{
    				a.push(word);
    				count++;
    			}
    
    			var ret:String = a.join("");
    			trace("time for generating " + kb + "kb: " + String(getTimer() - t) + " ml");
    			return ret;
    		}
    
    	}
    }

    Now the world is gone, Nexus one

    My Nexus has finally reached it’s final destination. It travel all over the US and some other countries switched 5 hands, before ending at it’s new home, and into my arms :)

    It was a lengthy and cumbersome process for one to order a Nexus one. I wouldn’t have imagined it will take so much. Special thanx goes to the special girl that coordinated the delivery.

    In order to order the Nexus I had to use a proxy, as described in here. proxz.com seemed good enough. On my machine I had an issue with an anti-virus blocking proxies. Shutting down or uninstalling the AV required a password, so I had to tweak the registry in order to remove it.

    I’ve paid for a 1 month US proxy from proxz, to go on the safe side. I didn’t care so much for my credit card to be stolen, anyway it’s insured. But for my google account I’ve changed the password, just in case. Loosing my gmail seems much more dangerous than loosing my CC.

    I’ve pimped my Nexus with some ASCII art:

    my_nexus_ascii

    Beside a few tiny glitches it seems great so far. The new software update is immediately installed so I don’t have to suffer from a missing multitouch.

    Many things to do now, need to play with openplug, though their best sample TweetMWC looks only OK. And where is that Flash 10.1 I was promised?