JSFiddle

Dimitar's public fiddles

  • loops and console.log

    do/while prints exit condition as extra

  • Confirm Form Edit Before Leave

    Mootools 1.4.5, HTML, CSS, JavaScript

  • Sortable Table

    MooTools Sortables

  • HTML5 datalist - Country

    No-Library (pure JS), HTML, CSS, JavaScript

  • Full Screen

    Native Full Screen test

  • css labels

    No-Library (pure JS), HTML, CSS, JavaScript

  • CSS Table with textarea full height

    No-Library (pure JS), HTML, CSS, JavaScript

  • MT Table Sortable

    Simple MooTools Sortables for table rows

  • Clock with JavaScript and Canvas

    https://developer.mozilla.org/en-US/docs/Canvas_tutorial/Basic_animations

  • JavaScript Challenge #3 (Turtle Drawing)

    http://mootools.net/blog/2012/08/08/javascript-challenge-3/ The challenge for this week is to design a turtle drawing program that accepts any form of user input in order to move, rotate and style a “pen” across a canvas. It should resemble the functionality demonstrated in the following diagram… The important things we are looking for are the ability to change direction and then to move forward in a straight line. You can do this with HTML elements (and some interesting CSS) but we encourage the use of SVG or canvas in your solutions as they are more suited to the task. Hint: you don’t have to have the labels on the left and you can use text fields (or even keyboard navigation) instead of links. What is important is how you maintain and modify direction and position of the “pen” (the point at the “front” of the line).

  • JavaScript Challenge #2 (Whac-A-Moo)

    http://mootools.net/blog/2012/08/01/javascript-challenge-2/ One of the most common requirements of web applications is to be able to respond to user input, and in particular clicks (or touches). Continuing with our theme of element generation (and in some cases animation); this week’s challenge will be to create a basic whac-a-mole game. The point of the game will be to click on highlighted elements to increase score. This can be as basic or as intricate as you wish it to be, but it should resemble the following diagram… The green block represents the block a player must click in order to gain points. This means you will need logic to randomly select one of the possible blocks and highlight it. You also need to register user clicks and update the score “label”. Hint: at times when you need to add many of the same kind of event to a variable amount of elements (in this case blocks); it is helpful and even efficient to use event delegation. You will need to use the setInterval() function or the setTimeout() function to create a predictable amount of time between each click or highlight.

  • MT Forge - NestedSortables

    http://mootools.net/forge/p/nestedsortables

  • MT DnD + Sortables - multilevel

    Mootools 1.4.5, HTML, CSS, JavaScript

  • MT DnD + Sortables

    Mootools 1.4.5, HTML, CSS, JavaScript

  • MT Sortables - DnD between lists

    Mootools 1.4.5, HTML, CSS, JavaScript

  • WoW Beez Theme

    the new theme from wowbeez.com

  • JavaScript Challenge #1 (Spiral)

    http://mootools.net/blog/2012/07/25/javascript-challenge-1/ This week’s challenge is to find an elegant solution to generating elements in a spiral pattern. Consider the following diagram… Your solution can be procedural or recursive, but in either case you will be dealing with a shrinking grid of possible locations for elements. The colours do not have to be in the result - they are only used to indicate the pattern. Hint: Try defining variables for columns and rows so that the shape can change but the positioning and order remain the same.