December 2009
1 post
#jsquizz
Recently I started to ask twitterverse JavaScript related questions, just for fun. I called it “jsquizz”, but twitter is very fast media, so I decided to copy some of this questions here, so I could easily find them later.
var date = +new Date;
// much shorter than new Date().getTime()
var a = "</script>"; // wouldn’t work
var a = "</s" + "cript>";...
October 2009
1 post
Raphaël 1.2.1
In Raphaël 1.2 release I did two major changes that I want to explain: IE optimisation and animation revamp.
For drawing in IE Raphaël uses VML. VML syntax for path is different to SVG: it uses different letters for commands and it doesn’t support floating point numbers. So to insure correct work I have to replace commands and round the numbers. But this not the end, IE doesn’t support quadratic...
September 2009
2 posts
2 tags
The Emperor’s New Clothes
It was an argument in web standards talks for a while. Tables for layout, style attributes, JavaScript event attributes, inline script tags and even font tags are ok. Take a look at google.com. Right. Google.com is probably most visited page in the web, so if <font size=-1>blah</font> is smaller than correct semantic HTML and CSS, even by one byte, then it worth it. Because every byte...
Raphaël 1.0 RC1
Recently I released Raphaël 1.0 RC1. The most noticeable change for users of the library is differences in the API: removing moveTo, lineTo and friends from the path object. Why did I decide to do this? The biggest drawback of these methods is that they apply immediately. That means that if you draw path consisting of three segments, path element is updated three times – each time with increased...
August 2009
1 post
Mermaids & Fishermen
Imagine the ocean. The ocean where live mermaids and lots of fisherman are chasing their luck. If you ask mermaids and fisherman about ocean they will tell you the same story: “I love ocean. Ocean is my home. I live in breath of the ocean only…” etc. But in fact their approach to ocean is very different. Fisherman care only about money they will get for fish. Ocean is just a big reservoir for...
July 2009
1 post
We need to talk
I am very lucky person. I met personally so many great people, like Cameron Adams, John Allsopp, Lachlan Hardy, Russ Weakley, Tim Lucas and many more others who, I hope, will forgive my laziness. The problem is, I don’t remember when last time I was talking to any of them (except Lachlan who is my colleague at Atlassian). We proud of our community, we see each other on conferences and other...
April 2009
2 posts
1 tag
Objects in JavaScript (part II)
I will not write about prototypical inheritance in JavaScript today. Instead lets take a look at one misunderstanding:
“Changing prototype on the constructor will magically update not only new objects, but also all existing ones…”
This is totally wrong. Do not trust an author who uses word “magic” while explaining JavaScript (or anything).
function C() {} //constructor
var x = new...
1 tag
Objects in JavaScript (part I)
Recently I was talking to friend of mine about objects in JavaScript. He is writing JavaScript for living and very good at it, however I found that he doesn’t understand some core features of the language. So, in case you have this gap in understanding JavaScript, I’ll try to explain.
Friend of mine give cite me one book:
“The interesting thing about ECMAScript primitive values for Booleans,...
March 2009
2 posts
1 tag
So, you think you know JavaScript?
Quick test for real understanding of JavaScript core beyond closures and scopes. Here five small scripts. Try to answer what will be alerted in each case without running them in the console. Then you could create a test file and easily check your answers. Ready?
if (!("a" in window)) {
var a = 1;
}
alert(a);
var a = 1,
b = function a(x) {
x && a(--x);
...
Raphaël 0.7
New Raphaël release:
Plugins functionality (Raphael.fn.myshape = function () {};)
New method “set” as a replacement for depricated “group”
getBBox for text is fixed in IE
Added point of origin in rotation
Added support for “src” attribute in attr method
Added setWindow method for iframes support
Added setSize method, so you can resize canvas
Provide alternate...
February 2009
2 posts
Washington Post Using Raphaël
As stated on Ajaxian Washington Post start using Raphaël. Frankly, this is company named Evri, who is working for Washington Post and creates fancy widgets for them, uses Raphaël for drawing purposes. Anyway, Raphaël is on washingtonpost.com and it is time to celebrate. To see it by yourself you can visit this page.
WSG Talk
On 11 March 2009 I will be presenting Raphaël at Web Standards Group meeting. Come and join me.
January 2009
1 post
2 tags
Raphaël 0.6—Animation and More
Now, when I finally updated the documentation page, I feel ok to introduce you to Raphaël 0.6. So, what is new in this version?
Ability to set rotation, translation and scale via attr method
Ability to set path via attr method. That means now you can change path without redrawing it. The only thing you have to learn how to write path string in SVG documentation for path data syntax
...
December 2008
1 post
Mac Shortcuts Converter
When switched to Mac it was a real disaster to understand all these special symbol OS uses for control keys (⌘, ⌥, etc). After a while I used to them and now I feel sorry for people who have to write “Command + Option + P” instead of “⌘⌥P”. To solve this little aesthetic issue I wrote a little application. Use it for good and let force be with you.
November 2008
3 posts
5 tags
iPhone Clock Web Application
Since last year WebJam™ I am proud owner of shiny iPod Touch. Yes, still shiny. What I found recently that while I am in the office my iPod just wasting space at my desk. Just for fun I decide to create simple web application that will turn my iPod to digital clock while I am in the office.
Just for fun I decide to emulate old LC clock without any images or vector graphics. To make it...
4 tags
Raphaël Feed
I’ve created twitter account for Raphaël. All upcoming news and releases will be announced there. Feel free to follow @RaphaelJS or subscribe to RSS feed.
Web Directions South ’08 Wrap Up 2
Just want to point out that Web Directions crew finalised work on podcasts and podcast of my talk is available along with my slides at Web Directions web site, so look and listen if you feel like this.
October 2008
4 posts
3 tags
Pie Chart Madness
With release of Raphaël 0.5.6b building pie charts become very easy task. Before I need to draw path with a hole inside, but now I can really draw every sector of the pie, because Raphaël finally has arcTo method. It was a bit of challenge to create it because VML has absolutely different interface from SVG. Fortunately Erik Dahlström from Opera point me to right direction. After that it was...
7 tags
San Francisco
This Saturday (11 of October) I am travelling to San Francisco, California for two weeks. If anyone want to catch up for a coffee or something, feel free to drop me a line, because I probably will be bored after hours. Hope to see you there.
3 tags
My First Interview Ever
Interview I gave to Andrew Tetlaw from SitePoint at Web Directions South this year. Check it out: Dmitry Baranovskiy Talks about Raphaël.
September 2008
9 posts
Web Directions South ’08 Wrap Up
The amazing week of Web Directions is over. This year was significant for me, because I did a smooth move from listeners to speakers. My session was pretty good, without “Oh, shit!” moments and tricky questions. In fact questions were very different, yet very simple to answer. I’ve put together slides from the presentation on slideshare. All the demos are on Vimeo.
I should also...
3 tags
WatchWeb Jam 8 presentation
4 tags
Yet another demo
The one chart left for GitHub project and it has been done: languages chart. This one takes all the data from HTML table, so updating the table will change the chart and without JavaScript you still can see the table.
4 tags
Raphaël Now Supports iPhone & iPod Touch
Well, to be honest, I haven’t done a thing. New 2.1 Software Update add SVG support for iPhone & iPod Touch, so apparently all the demos for Raphaël now work on “iTouch” products. That is what happens when instead of supporting products you support technology. Go Web Standards!
3 tags
Another Play with Charting
This time I decide to go with punch chart from GitHub. This gives me good opportunity to find some bugs in my library and just have fun. Take a peek: Default look, vampire look and bright look.
5 tags
GitHub Impact Chart
Recently I was amazed by idea of GitHub impact chart. It is so visually powerful. There are two problems: you have to click on rectangular areas instead of the shape and it doesn’t work in IE. I decided to rebuild this chart using Raphaël. Here the result: Raphaël driven GitHub Impact Chart. I don’t know what sort of scaling guys use, so I went with logarithmic scale. Play around and send me...
2 tags
Raphaël 0.5.3
New version of Raphaël has been released yesterday. Among other improvements there is ability to get attributes of objects by writing object.attr("fill"). Also there are many fixes for IE.
Another thing: I moved project to GitHub to socialise it better. Hope it will help you in your daily coding job.
WebJam Ⅷ
I am pleased to announce that WebJam is live again. And pretty soon (25 September) it will rock again. I will definitely present my latest cool thing—Raphaël, so come along, have fun and vote for me.
WatchDemo of the TextMate™ modified HTML bundle
August 2008
4 posts
SVG Tests
I found recently that W3C published very good written tests for SVG. Today I spent my lunch time to run across these tests in different browsers. Here results:
Browser
Passed
Total number of tests
276
Opera 9.51
246
Safari 4
218
Firefox 3.0.1
160
Internet Explorer
0
...
Announcing RaphaelJS.com
I am pleased to announce that because of my bandwidth limitation I have to drop down Raphaël hosting.
But! There are always friends who can help in hard moment, so I am happy to introduce http://raphaeljs.com
Special thanks goes to:
Lachlan Hardy: for the whole idea, amazing support and awesome spirit. He organised whole move.
Andrew Krespanis: for...
S×SW
I have a dream. A crystal dream of attending South by South-West Interactive Conference. Today I become one step closer to my dream: my panel was accepted and took it place in voting system.
Go and check my panel description. It is called “JavaScript Ninja Secrets” and going to be awesome if it make it to the final. So please, vote for me and/or wish me a luck.
3 tags
Raphaël—JavaScript library
Today I am pleased to release my JavaScript library to work with vector graphics. From now you can create different shapes, rotate text or images by 30° (or more) with easy API of Raphaël. And, yes, it works in IE6 and 7 too. So, please welcome Raphaël and be kind with him. Today is his first day out. Check out the demos: rotation, reflection and another rotation. Write me any feedback.
July 2008
5 posts
Programming Brain Teaser
Dustin Diaz put an interesting task on his blog. In short, you have an array:
var arr = ["a", "b", "c", "c", "d", "e", "e", "e", "e", "e",
"f", "e", "f", "e", "f", "a", "a", "a", "f", "f", "f"];
and it should be turned into string like this:
"a b c c d e e <span>e e e</span> f e f e f a a <span>a</span> f f
<span>f</span>"
First solution in my mind is...
One Amazing Business Card
Want to share my little excitement: my business card made it in “70 Amazing Business Cards”. That was a bit of surprise, because I am not a designer, and my cards are very cheap indeed.
3 tags
My WebDU 2008 Presentation
I uploaded slides from my WebDU presentation on “Advanced JavaScript™ Techniques” to SlideShare. Not really as valuable without verbal part, but still could be useful.
2 tags
Simple Cycle
In continuation of my previous post here is my implementation of times method of then Number object.
Number.prototype.times = function (f) {
(function (i) {
i && arguments.callee(--i) && f(i);
return true;
})(this);
};
The idea is that you should be able to write code like this one:
var a = [4, 2, 6, 1, 8, 0];
a.length.times(function (i) {
...
June 2008
3 posts
JavaScript Without “if”
For some reason I have a question in my head: “Could I write code in JavaScript without ‘if’ statements at all?” Inspired by Chris Owen’s presentation on SmallTalk I created this implementation of SmallTalk-like pattern for working with boolean objects:
Boolean.prototype.ifTrue = function (f) {
this && f();
return this;
};
Boolean.prototype.ifFalse = function (f) {
this...
“Yet more stupid shit for people who refuse to learn Javascript. These type of...”
– youarelosttothesea
“So Safari, Opera and now Firefox all pass the test; of the major browsers, that...”
– CSS3.info
May 2008
8 posts
Web Directions South ’08
I am pleased to announce that I am going to speak at Web Directions South this year. I am very excited because it is first time I will share stage with such a web stars as Jeffrey Veen and Douglas Crockford. Not mention other 18 speakers.
I am happy to give you a promo code that takes $50 off the ticket price. “WDS08-DBA”. See you at Web Directions!
2 tags
JavaScript Nuance
I would like to describe yet another JavaScript weirdness. Fortunately I didn’t face it before and was absolutely sure that function a(){} is equal to var a = function (){}.
I was wrong. There is a huge difference. Lets see the example:
var a = 5;
if (a == 5) {
var b = function () {
return "obvious";
};
} else {
var b = function () {
return "never";
};
}
if...
“Legant prius et postea despiciant.”
Firefox Table Bug Workaround
Reminder to myself. Workaround for the bug: Bug 155955.
table {
border-collapse: collapse;
border-spacing: 0;
}
:root table {
border-collapse: separate;
}
One Pixel Rounded Corners
After reading blog post of CSS Guy about one pixel rounded corners at Google Analytics web site which is done by using some additional <b> tags I realize that I was using this technique long time ago, but without additional elements. Here is the HTML code:
<ul>
<li>
<a href="#">One</a>
</li>
<li>
<a href="#">Two</a>
...
1 tag
AJA* (AJAX, AJAH, AJAJ, etc)
I am sick of all this AJA* things (AJAX, AJAH, AJAJ, etc). If I can dictate the fashion I say “Call it AJEX—Asynchronous JavaScript-based EXchange” or something as generic. AJAJ just sound stupid.
John Resig—Pure JavaScript HTML Parser →
Australian English in Mac OS
Just to remember this next time I will set up new environment: terminal command to force spell checker to respect australian English.
defaults write -g NSPreferredSpellServerLanguage "en_AU"