someone (@bigel) has sent me a link to a great post about 5 missing javascript numbers functions.

In there I found a real jem!

function round(number, decimals){
return parseFloat(number.toFixed(decimals));
}

some experiments work out, and I put them online.

Previously though, I was just dumping them in a git repository I call playground, and I was hard linking to them in posts and what not.

Now however i’ve added an awesome feature, which is called html5 apache index by the mega talented Lars Jung

my new playground, all sorted out

You can check out some of my projects like  the ipad simulator , html5 canvas video puzzle and more

I then read that Paul Irish had described it as “think Dabblet.com for canvas” and I had a lightbulb moment!

why not in dabblet? 

I then quickly rushed to Dabblet to see if I can fork it ( github ) and play.

One saturday later, I present you scrubbing values in dabblet.com ( DEMO )

Features : cmd/ctrl + click and drag to resize absolute lengnth values (px,em,etc)

Iphone style scrubbing, the higher you raise the cursor above the element, the higher the increment value per drag is (it’s also indicated by the lovely cursors )

Next on queue : colorpickers on color values and duration support for animations and transitions

Feel free to check the code

Bret Victor – Inventing on Principle from CUSEC on Vimeo.

Bio: Bret Victor invents tools that enable people to understand and create. He has designed experimental UI concepts at Apple, interactive data graphics for Al Gore, and musical instruments at Alesis.

For more Bret, see http://worrydream.com

This talk was given at CUSEC 2012 http://2012.cusec.net

Many people have felt that apple intentionally bringing the web apps down, to make native apps the ones a user chooses.

When 4.3 was released I have also noticed then a lot of webapps I have had ‘installed’ on my homescreen seem to have become plain shortcuts.

They would open up in safari instead of on their own like before, they weren’t full screened and they would refresh on beginning.

Basically this mean  that saving a page to the homescreen just became a bookmark on the homescreen rather then a full “webapp” like before.

Many great  webapps I used on daily basis like thomas fuch’s everytimezone.com

Even in his screen shot fo the app you can see it’s fullscreened.

BUT THEN…

I read about a gamesforcats.com site and went there to install an app for my cat. Turns out  that it’s a web app. And it’s fullscreened. WTF right?

I went on to investigate.

Turns out apple added a new meta tag that specifies whether this app is webapp capable or not!

<meta name="apple-mobile-web-app-capable" content="yes" />

This was new and before adding a meta of

<meta names="apple-mobile-web-app-status-bar-style" content="black-translucent" />

did the trick of making a website to a web app.

Sad that this was quetly done and broke all other webapps out there , apps that didn’t update or didn’t know about the new method.

But I’m glad my ability to make “webapps” is back!!

UPDATE :

Turns out this “webapp” mode is also discoverable by JS

window.navigator.standalone

So you can actually know if a user runs your app in fullscreen and if not bug him to do so by all sorts of pointy arrows and notifications

If you have, then you might have noticed the awesome effect from the main menu, the rotating cubes.

I was so impressed by it that I had to try and replicate it. (click on image to see the demo)

Couple of things I learned :

• You can bind a handler to “webkitTransitionEnd” and execute code when the transition on that element finishes.
• It’s very hard to “reset” transitioned elements  back to their original state, if you don’t want that reset to be animated. You have to manually override -webkit-transition-porperty , reset the stage (for example rotate(0) ) and then set the transition property back to what it was.
• Facebook caches the shared pages, so if you put a facebook “like” button, and then change the page’s title, of meta, you have to  ”reset” the link. the best/only way to do that without changing the url is facebook url lint.
• Css3 3d is fun! go experiment with it, it’s gpu accelerated where ever it’s avaliable be it mobile or ipad or mac, and it’s looking super smooth! go crazy

Turns out, that you can style almost any element.

Be it <head>, <style> , <title> , whatever.

DEMO

You then can add the html5 “contenteditable” attribute, to make these blocks editable.

And what you get is a live updating <style> and <title> blocks.

I’m starting of thinking about creative uses for this, there have got to be some!!

If you have an creative Idea on how to use this, feel free to share in comments.

Microsoft PR dpt. has done it again. They’ve released a comparison chart, between their brand new IE9, and other browsers such as firefox and chrome.

And for one think it has to stop. Their comparison is full will half-truths and whole lies, and coming from a company that made web-developers suffer and scream in rage, it’s absurd.

IE9 is a better browser then all other IEs. It’s faster, more standard driven and all in all a decent browser. BUT (and it’s a big but) it’s not a modern browser and it’s not by far, better then Firefox or Chrome.

This recent post made me create this :

The truth behind IE9 comparison chart

Yes it may sound whiny to some, but there’s no denial that somebody at Microsoft has failed to check all the fact before posting this.

A little background

I’ve thought about creating the iPad simulator shortly after I bought my iPad. I was fascinated by the UI and wanted to see if I can recreate it.

This isn’t the first online simulator I’ve built, before this, was a Nokia n97 simulator, also built with JS + CSS  (http://nokian97.co.il)

I’ve uploaded the iPad simulator a while ago, started playing with it, adding apps  (google maps, safari, photos etc’) , and I was getting 5 hits daily (most of them me from work)

Forrst

I joined Forrst and decided to share it with the forrsters , and I got amazing feedback. And people there told me they want to hack on it, so I’ve released the code on github.

W3c Israel

Some weeks after, I went to a W3C Israel meeting on web app development and after a short hackaton (results of which you can see  here and fork on github ) I’ve showed the guys there the iPad simulator among other things. They told me I have to publish it somewhere. I’ve sent an email to ajaxians@ajaxian.com and went to sleep.

Morning After

I wake up, and I see that someone mentioned me on twitter (I’m @altryne) and he talked about my iPad simulator. I went and checked google analytics and I was amazed to see that while I was sleeping more then 2000 unique hits arrived at my site.

Twitter

Turns out my site was a hit on twitter, with guys like Dylan Schiemann (@dylans), Jesse Newhart (@JesseNewhart),Dion Almaer (@dalmaer),Cameron Moll (@cameronmoll) and a lot more – thanx a lot guys I’m glad you like it.

Websites and blogs

Like I said, I never expected this kind of embrace by the community, and I certainly was surprised to see my link in the guardian tech blog and on Developer.Yahoo.com tech blog and I was proud.

Also I was featured on habrahabr.ru , techweb.com.cn, Ycombinator, macmagazine.com.br and event 1 youtube video!

What’s next?

Well I read all the comments I could find, including the trolling and I have a ton of stuff to do.

One thing I was thinking about, is showing a web demo of some iPad applications, and ask developers to provides those demo’s, because screenshots are too static

If your’e an iPad app developer and want to see your app in the simulator, contact me : alex [at]  alexw.me

I’m also gonna finish my photos app and it’s gonna be awesome! Stay tuned.

This snipplet by @doublerebel on github, extends the .is() function in jQuery, so that if it’s used without parameters inside, will return if the DOM has been found on page

Consider the following

if($('#somediv').is()) {
$('#somediv').ajax....
} else{
console.log('no ajax placeholder')
}

The script itself is pretty straightforward, so straightforward in fact, that one want’s this implemented in jQuery core

(function($) { $.fn.extend({ _is: $.fn.is, is: function(s) { return s ? this._is(s) : !!this.length; } }); })(jQuery);

You can fork this on github