Ohlédnutí za konferencí Svoboda naživo – 10. 11. 2011 Pár mých postřehů, poznámek, úvah atd. z konference. Nečekejte nějaký souvislý text, budou to spíše takové střípky slepené dohromady.
Category Archives: jQuery
Jak lžeme dětem
Jak lžeme dětem Dospělí lžou dětem pořád. Netvrdím, že bychom měli přestat, ale myslím, že bychom se měli alespoň zamyslet, jaké lži jim říkáme a proč. Může nám to přinést užitek. Také nám všem lhali, když jsme byli děti, a některé z těch lží nás dodnes ovlivňují. Zkoumáním toho, jak dospělí lžou dětem, si můžeme …
Fix of jQuery.durationPicker
I have noticed (shamefully late), that the demo for durationPicker is not working in Chrome and IE. It works only in Firefox. I will fix it in 24hrs (it will take longer than that), when I will have time to do it, and investigate what caused it. Link to original article on durationPicker.
Blurry images in html5 canvas
Why <canvas> draws blurry images? Did it happen to you as well? I found fairly simple tutorial, and tried to code according to its advice. The result is shown below. Big blurry cat … Then I tried to copy paste the code, but with almost identical result. Again I got a blurry image. Next day …
Rotate table cell content with jQuery
Rotating text via CSS is now relatively easy. There is a few of good tutorials and demos out there. But they lack one thing – they don’t explain how to rotate text in a table cell. Few days ago during pair programming with Michal Tehnik we run into trouble. We managed to rotate the text, …
Simple inheritance via jQuery.extend
Spoiler warning: This is not true inheritance as we are used have to in static languages. It is not even prototypal inheritance. It is merely an experiment to find out if it is possible to achieve (mock) inheritance using jQuery.extend() method. And yes, it is kind of possible. JQuery.extend basically copies properties from one object onto another. So …
Little jQuery.extend gotcha
jQuery.extend() is a very powerful function for merging two objects or for extending jQuery with custom plugins. There is but one little gotcha to think about: as in most function calls the order of parameters matters 🙂 Following two fragments of code yields different objects var a = { aa : ‘1’ , bb : …
Proposal for WordPress plugin – customScript
<script src=”http://demos.davidjs.com/customScript/raphaeljs.js”></script><script type=”text/javascript”charset=”utf-8″>window.onload=function(){var r=Raphael(“holder”,640,480),p=r.path(“M295.186,122.908c12.434,18.149,32.781,18.149,45.215,0l12.152-17.736c12.434-18.149,22.109-15.005,21.5,6.986l-0.596,21.49c-0.609,21.992,15.852,33.952,36.579,26.578l20.257-7.207c20.728-7.375,26.707,0.856,13.288,18.29l-13.113,17.037c-13.419,17.434-7.132,36.784,13.971,43.001l20.624,6.076c21.103,6.217,21.103,16.391,0,22.608l-20.624,6.076c-21.103,6.217-27.39,25.567-13.971,43.001l13.113,17.037c13.419,17.434,7.439,25.664-13.287,18.289l-20.259-7.207c-20.727-7.375-37.188,4.585-36.578,26.576l0.596,21.492c0.609,21.991-9.066,25.135-21.5,6.986L340.4,374.543c-12.434-18.148-32.781-18.148-45.215,0.001l-12.152,17.736c-12.434,18.149-22.109,15.006-21.5-6.985l0.595-21.492c0.609-21.991-15.851-33.951-36.578-26.576l-20.257,7.207c-20.727,7.375-26.707-0.855-13.288-18.29l13.112-17.035c13.419-17.435,7.132-36.785-13.972-43.002l-20.623-6.076c-21.104-6.217-21.104-16.391,0-22.608l20.623-6.076c21.104-6.217,27.391-25.568,13.972-43.002l-13.112-17.036c-13.419-17.434-7.439-25.664,13.288-18.29l20.256,7.207c20.728,7.374,37.188-4.585,36.579-26.577l-0.595-21.49c-0.609-21.992,9.066-25.136,21.5-6.986L295.186,122.908z”).attr({stroke:”#666″,opacity:.3,”stroke-width”:10}),over=r.path().attr({stroke:”#fff”}),e=r.ellipse(295.186,122.908,5,5).attr({stroke:”none”,fill:”#fff”}).onAnimation(function(){over.attr({path:”M295.186,122.908L”+this.attr(“cx”)+”,”+this.attr(“cy”)+”z”});});e.clone();e.attr({rx:7,ry:3});var rotateAlongThePath=true;function run(){e.animateAlong(p,2e4,rotateAlongThePath,function(){e.attr({cx:295.186,cy:122.908,rotation:0});setTimeout(run);});rotateAlongThePath=!rotateAlongThePath;};run();var logo=r.set(r.rect(13,13,116,116,30).attr({stroke:”none”,fill:”#fff”,rotation:45,opacity:.2}),r.path(“M129.657,71.361c0,3.812-1.105,7.451-3.153,10.563c-1.229,1.677-2.509,3.143-3.829,4.408l-0.095,0.095c-6.217,5.912-13.24,7.588-19.2,7.588c-3.28,0-6.24-0.508-8.566-1.096C81.19,89.48,66.382,77.757,59.604,60.66c3.65,1.543,7.662,2.396,11.869,2.396c15.805,0,28.849-12.04,30.446-27.429l22.073,22.072C127.645,61.351,129.657,66.201,129.657,71.361zM18.953,85.018c-3.653-3.649-5.663-8.5-5.663-13.656c0-5.16,2.01-10.011,5.661-13.656l14.934-14.935c-3.896,13.269-5.569,27.23-4.674,40.614c0.322,4.812,0.987,9.427,1.942,13.831L18.953,85.018zM44.482,46.869c3.279,25.662,23.592,50.991,47.552,57.046c3.903,0.986,7.729,1.472,11.432,1.472c0.055,0,0.107-0.005,0.161-0.005l-18.501,18.503c-3.647,3.646-8.498,5.654-13.652,5.654c-3.591,0-7.021-0.993-10.01-2.815l0.007-0.01c-1.177-0.78-2.298-1.66-3.388-2.593c-0.084-0.082-0.176-0.153-0.26-0.236l-3.738-3.738c-7.688-8.825-12.521-21.957-13.561-37.517C39.736,70.853,41.149,58.578,44.482,46.869″).attr({fill:”#f89938″,stroke:”none”,opacity:.5}),r.circle(71,32,19).attr({stroke:”none”,fill:”#39f”,opacity:.5}));logo.translate(245,177);};</script> You will only see the demo animation if you click link to this post Motivation For this blog I am using WordPress and I am quite happy with it, but I miss one feature – the ability to add custom javascript code to given post. I do not …
Continue reading “Proposal for WordPress plugin – customScript”
Look at the stars … and see code
starryNight plugin API This is an update to my previous post. I wrote nice to look at animation on top of jQuery called starryNight. It takes a <div> element and add moving stars on top of it. Stars are slowly floating across the sky, and when they finally flow out of the sky (or <div> …
Don’t forget to play
Sometimes I need to do something what is not useful at all, just for the fun of it. Someone plays World of Warcraft as a hobby, someone listens to music, drinks, draws.. whatever. I make animations in javascript. It’s half fun and half learning. I can try new things, I can experiment, discover …and what …