Hi,

after few hours of investigating this bug …
if you are trying to put a jquery ui slider on a page with mootools it won’t work as you would excpect because mootools slide event fires before jquery does.

the fix for this problem is easy, just do .prop(‘slide’,null) before initializing the jquery slider. this will remove Mootools’s Fx.Slide from the element.

scroller.prop('slide',null).slider({...});

Hope i helped someone with this ... 

G'day
Ady

Hi all,
recently i finished working on a great tool to help editors add videos to their blog.
this tool grabs data from AOL Video library which is the largest curated library in the web.

the plugin wrap it self in it’s own namespace so it won’t conflict with other components on the page,
it features semantic matching for content, which is a great thing. you can write your post , hit the suggest videos button and in a second you get planty of semantically related videos that can match your content.

Download link: Video Suggestion for wordpress

We bloggers know that adding a video to your post reduces the bounce rate and helps improving your search engine score!
That plugin has some other versions that works with Movable Type CMS & Blogsmith. if you fency another version feel free to contact me , and i’ll try to help out with it.

Fetching suggest data was a nice challenge. i needed to post data to a remote server and grab the returned data in a JSON format , cross domain json is an easy task, you can use jsonp which works great, but it lacks one small thing..
you can’t post data. bummer ! if you want to grab a lot of text / data and push it to a remote server for analysis , it gets harder.
luckily we now have a new HTML5 method to do such things, “postmessage”. post message is a way to communicate between the opener page and an iframe who sits on another domain.
i’ll write a post regarding that way soon, with some examples.

* will be glad to have comments from you readers about that tool & generally about the blog.

Ady

if you wan’t to prevent a user from leaving your page,
something you might wanna do if you build a cms , or some admin page with user changing fields.

create a javascript variable named isDirty and make sure that field will be set to true on all input changes on the page (and some non trivial changes you might have in your ui)
than bind an event to the window.onbeforeunload (works on all browsers without the use of an extrenal js lib such as jQuery, dojo, mootools)

 window.onbeforeunload = function (ev) {
            var leavePageMsg = 'Your changes haven\'t been saved.\nAre you sure you want to leave this page?';
            ev = ev || window.event;
            if (isDirty) {
                if (ev) {
                    ev.returnValue = leavePageMsg;
                }
                return leavePageMsg;
            }
            // no return value - meaning it's ok to leave the page.
        };

Thats it, it will do the magic :)
Have a good one.

i got a bit of messing around lately with html and found this great new features to XMLHttpRequest object.
now you can use it to send files and get their progress using javascript ! for all of us this is a great improvment , cause we don’t to use flash / silverlight / java anymore to get a neat progress bar for file upload.
of course there are great solutions (swfupload / uploadify etc) that hides the flash and mimics the whole process , but it not native to the browser …

so the uploader is wrapped as a class named .. you can guess Html5Uploader,
for ease of writing i used jquery – mainly for the selectors and event handling , but it can easily removed by anyone with a bit of javascript knowledge.

so in order to get it up & running create a new html5uploader object using such line :

var uploader = new Html5Uploader({ mimeTypes: “image/jpeg,image/gif,image/png,image/x-png,image/bmp”, queueSizeLimit: 10, fileInputId: ‘filesToUpload’ });
events thrown from the class :

onErrorAddingFile with an error object
onCancel – once a file is removed from queue
onAddedToQueue – once a file being added to queue (here you can write your own html)
onUploadStarted – for each file
onAllComplete – self explained i guess
onProgress – for file upload
onComplete – for each file
onError – on error while uploading.

you can download the demo from this link : html5 multiple file upload source

in the zip file you will find a .net solution with all the files (css/js/ashx) – the upload handler is a .net handler, you can modify one of my previous php upload handlers for this cause if you want to use php as your backend

and view an online demo @ html5 multiple file upload demo

right now chrome and firefox >4 supports html5 uploading, ie – not yet.

if you find this usefull , have any comments – please share with me, it’s nice to listen to my audience :)

Have a good one,

Ady