First, code for increasing day. If we have date in string, then code would look something like this:

strYear = strDate.substring(0,4);
strMonth = strDate.substring(5,7);
strDay = strDate.substring(8,10);
d = new Date(strYear, strMonth - 1, strDay);
d.setDate(d.getDate() + 1);

Then, to format date time, to something like yyyy-mm-dd, I was using this code:

strYear = d.getFullYear();
if (d.getMonth() < 10)  {  
	intMonth = d.getMonth() + 1;
	strMonth = '0' + intMonth;
} else  {
  strMonth = d.getMonth() + 1;
}
if (d.getDate() < 10)  {
  strDay = '0' + d.getDate();
} else {  
	strDay = d.getDate();   
}

Finnaly, date would be created something like:

strDate = strYear + '-' + strMonth + '-' + strDay;

getMonth - with this function we are geting number of a month, but from 0, 0 - this is January?
getDate - with this function we are geting number of a day in a month.

    var tree = Ext.create('Ext.tree.Panel', {
        store: store,
        hideHeaders: true,
        rootVisible: false,
        viewConfig: {
            plugins: [{
                ptype: 'treeviewdragdrop'
            }]
        },
        height: 450,
        width: 400,
        title: 'InLabel server and databases',
        renderTo: 'tree-example',
        collapsible: true,
	listeners:{
		itemclick: function(view, record, item, index, event) {
			if (record.isLeaf()) {
				Ext.fly("yourdivid").update(record.data.text);
			} else {
				Ext.Ajax.request({
				    url: 'components/com_dcstree/detailed_info.php',
					method: 'GET',
				    params: {
					id: record.data.id
				    },
				    success: function(response){
					var text = response.responseText;
					Ext.fly("yourdivid").update(text);
					// process server response here
				    }
				});
			}
			//Ext.get("yourdivid").originalDisplay = "aaa";
			//dumpProps(view);
		}
	}
    });

So, most important thing is "listeners", and with record.isLeaf() I am checking if user clicked on node, or on leaf. Second part, Ext.Ajax.request,... is example of ExtJS Ajax, in this case I am loading detailed_info.php.

Another example of slider. Here I gave one example of the slider, but I didn't like that example since I am deleting and adding IMG tag, which can costs performance. I decided to write another example where I will just move pictures. Problem with which I was facing was how to make infinite? That problem I solved by splitting images in two part, then one part I will move on the end of another, and this is how I will have infinity effect.

HTML is simple:

    <div id="container">
    </div>

CSS:

#container {
    width: 17%;
    overflow: hidden;
}

.imagesTrack {
    white-space: nowrap;
    position: relative;
}

JS:

/*global jQuery, document, setInterval*/
(function () {
    "use strict";
    jQuery.getJSON("files.json", function (data) {
        var myQ = jQuery,
            firstHalfRightPosition = 0,
            secondHalfRightPosition = 0,
            px,
            firstHalf = "first-half",
            secondHalf = "second-half",
            firstHalfId = "#" + firstHalf,
            secondHalfId = "#" + secondHalf,
            widthOfFirstHalf = 0,
            widthOfSecondHalf = 0,
            spaceBetweenTwoHalfs = 10,
            loadedImgIndex = 0,
            numberOfImages = 0;

        myQ("<span class='imagesTrack' id='" + firstHalf + "'/>").appendTo("#container");
        myQ("<span class='imagesTrack' id='" + secondHalf + "'/>").appendTo("#container");

        data.forEach(function (file, index, array) {
            var imgSrc = '<img src="' + file + '" id="' + index + '">';
            numberOfImages = numberOfImages + 1;

            if (index < array.length / 2) {
                myQ(imgSrc).appendTo(firstHalfId);
            } else {
                myQ(imgSrc).appendTo(secondHalfId);
            }

            myQ('#' + index).on("load", function () {
                loadedImgIndex = loadedImgIndex + 1;
            });
        });

        secondHalfRightPosition = -spaceBetweenTwoHalfs;

        setInterval(function () {
            if (loadedImgIndex === numberOfImages) {
                widthOfFirstHalf = myQ("#first-half").width();
                widthOfSecondHalf = myQ("#second-half").width();

                px = firstHalfRightPosition + "px";
                myQ(firstHalfId).css("right", px);
                firstHalfRightPosition = firstHalfRightPosition + 1;

                px = secondHalfRightPosition + "px";
                myQ(secondHalfId).css("right", px);
                secondHalfRightPosition = secondHalfRightPosition + 1;

                if (firstHalfRightPosition === widthOfFirstHalf + spaceBetweenTwoHalfs) {
                    firstHalfRightPosition = -1 * secondHalfRightPosition - spaceBetweenTwoHalfs;
                }

                if (secondHalfRightPosition === widthOfFirstHalf + widthOfSecondHalf + spaceBetweenTwoHalfs) {
                    secondHalfRightPosition = -1 * firstHalfRightPosition - spaceBetweenTwoHalfs;
                }
            }
        }, 1);

    });
}());

Live example:

One small example of list of images in one line, with endless animating, where middle image will be shown as "selected".

Html part is simple we need only one line of code:

<div id="imagesTrack"></div>

CSS:

#imagesTrack {
    width: 100%;
    overflow: hidden;
    white-space: nowrap;
}

Javascript:

/*global jQuery, document, setInterval*/
(function () {
    "use strict";
    jQuery.getJSON("files.json", function (data) {
        data.forEach(function (file) {
            jQuery("#imagesTrack").append('<img src="' + file + '">');
        });
        setInterval(function () {
            jQuery("#imagesTrack").append('<img src="' + jQuery("img")[0].src + '">');
            jQuery("img").eq(0).remove();
            jQuery("img").eq(2).css("border", "14px solid #333");
            jQuery("img").eq(1).css("border", "");
        }, 500);
    });
}());

Interesting thing to notice here is eq, which will give us jQuery object of one item in the array (or list, whatever) of images.

Live example: