«
»

jQuery Scheduling Plugin

February 15th, 2007 by Ralf S. Engelschall

During my recent evaluation of JavaScript toolkits I came across jQuery. As mentioned in this other posting, I was really pleased by jQuery. Hence I’ve investigated further and immediately used jQuery to solve a few tasks. One of the results which came out of this jQuery hacking was a reusable scheduling plugin.

Features

This plugin provides the following three main features:

  1. Global Scheduler Class
    There is a global jQuery.scheduler class object which can be instanciated to get a (actually jQuery unrelated) scheduler object. This object provides a thin convenience wrapper around JavaScript’s standard setTimeout() and clearTimeout() functions. The wrapper provides optionally abbreviated time specification, optional task repeating (like setInterval()), optional protected against double-scheduling, support for both stand-alone function and object method calls, optional passing of arbitrary arguments, and support for both a flexible key-value and a convenient positional-argument calling convention on the schedule method.
  2. jQuery Global Scheduler Object
    There is a global scheduler object instanciated for the jQuery object which can be used with the global
    jQuery.schedule(), jQuery.reschedule() and jQuery.cancel() functions.
  3. jQuery Object Scheduling Method
    All jQuery objects are extended with a schedule() method which is a convinience wrapper allowing one to use the “jQuery Global Scheduler Object” to schedule a task for the current jQuery object.

Trivial Example

The following is a trivial example use of the schedule() method on jQuery objects. On click on the text “TEST BUTTON”, it changes its color to blue and after 2 seconds it changes it to red. Additionally, a value 42 is passed through to the scheduled task which “prints” it into a another element for demonstration purposes.

<did="button">TEST BUTTON</div>
<div id="test"></div>

<script type="text/javascript">
    $(document).ready(
    function(){
        $('#button').click(function () {
            $(this).css("color", "blue").schedule("2s", function (x) {
                $(this).css("color", "red");
                $("#test").html("test: x = " + x);
         }, 42);
       });
    });
</script>

Download

The jQuery plugin can be downloaded from the File Repository area.

Category: Hacking, JavaScript | Tags: , | Comments: 5
Print | Syndicate | Trackback | Respond

5 Responses to “jQuery Scheduling Plugin”

  1. Ralf S. Engelschall says:
    March 13th, 2007 at 21:08 |

    I’ve today overhauled the scheduling plugin to correctly support both the simple and flexible calling convention also in the jQuery object method. Also a few bugfixes were made, too.

  2. Miguel says:
    May 31st, 2007 at 15:43 |

    Can you provide an example of how to use all of the methods in your plugin? I can only get the schedule() function to work.

  3. Ralf S. Engelschall says:
    June 2nd, 2007 at 14:32 |

    Miguel: beside schedule() there is just reschedule() and cancel() and both simply take as an argument the return value of schedule(). That’s all. See also the scheduler.html example document in the File Repository.

  4. Sonera says:
    June 11th, 2008 at 10:07 |

    I want to schedule events like broadcating a video at a given time in my application. I was suggested to use jquery. Can you help me ?

  5. Ralf S. Engelschall says:
    June 23rd, 2008 at 13:38 |

    Sonera: no, the jQuery Scheduling plugin is intended to be used with jQuery on a client-side (browser) and there for scheduling tasks in the range of just a few seconds(!). If you need to schedule the broadcasting of a video at a given time, that’s a task for a cron(8) job at the server-side.

Leave a Reply