jQuery.fn.parkingslider = function(o) {

    var o = $.extend({
        step: 256,
        min: 256,
        max: 8192,
        cellwidth: 11,
        start: 0,
        disabledMin: 0,
        disabledMax: -1,
        spritefile: "",
        tooltip: false,
        name: "",
        selectionChanged: null
    }, o);


    return this.each(function(i) {
        var element = $(this);

        var uid = $.data(this);
        //total items count
        var itemscount = (o.max - o.min) / o.step + 1;
        //create child elements
        element.append("<select class='trackbar_sel'></select><ul id='bar" + uid + "' class='widget_track'></ul>");


        function GetValueFromIndex(val) {
            return o.min + val * o.step;
        }

        function GetIndexFromValue(val) {
            if (val > o.max)
                val = o.max;
            if (o < o.min)
                val = o.min;

            var res = (val - o.min) / o.step;
            var index = Math.round(res);
            if (index < res) index++; //selection rounded up

            return index;
        }

        function IsIndexDisabled(index) {
            var val = GetValueFromIndex(index);
            if (val <= o.disabledMin)
                return true;
            if (o.disabledMax >= 0 && val >= o.disabledMax)
                return true;
            return false;
        }

        //track width
        var trackwidth = itemscount * (o.cellwidth + 1);
        element.find(".widget_track").css({ 'width': trackwidth + 'px' });

        //create options in select
        for (var i = 0; i < itemscount; i++) {
            element.find("select").append(
                "<option value='" + i + "' rel='" + (i * o.step + o.min) + "' class='" + (IsIndexDisabled(i) ? "disabled" : "active") + "'>" + (i * o.step + o.min) + "</option> ");
        }

        //create cells
        for (var i = 0; i < itemscount; i++) {
            element.find(".widget_track").append("<li class='" + (IsIndexDisabled(i) ? "disabled" : "active") + "'><span class='cell'></span></li>");
        }



        //draw sprites
        /*element.find(".widget_track li.active").css('background-image', 'url(_i/slider/' + o.spritefile + '.png)');*/
        
        
        

        element.find(".widget_track li").each(function(index, el) {
            var idx = ('-' + index * o.cellwidth + 'px');
            $(el).css('background-position', idx + ' 0px');
        });

        var fndsb = 0;
        var lndsb = itemscount;
        for (var i = 0; i < itemscount; i++) {
            if (!IsIndexDisabled(i)) {
                fndsb = i;
                break;
            }
        }
        for (var i = itemscount - 1; i >= 0; i--) {
            if (!IsIndexDisabled(i)) {
                lndsb = i;
                break;
            }
        }
        lndsb += 1;
        
        //draw active sprites
       /* element.find(".cell").css('background-image', 'url(_i/slider/' + o.spritefile + '.png)');

        element.find(".widget_track li").each(function(index, el) {
            var idx = ('-' + index * o.cellwidth + 'px');
            $(el).find('.cell').css('background-position', idx + ' 7px');
        });

        var fndsb = 0;
        var lndsb = itemscount;
        for (var i = 0; i < itemscount; i++) {
            if (!IsIndexDisabled(i)) {
                fndsb = i;
                break;
            }
        }
        for (var i = itemscount - 1; i >= 0; i--) {
            if (!IsIndexDisabled(i)) {
                lndsb = i;
                break;
            }
        }
        lndsb += 1;
        
        */


        //set cells	width
        element.find(".widget_track li,.widget_track li .cell").css({ 'width': o.cellwidth + 'px' });

	if($.browser.msie) 
		{element.find(".widget_track li:last").css({ 'margin-right':'0', 'width': o.cellwidth - 1 + 'px' });}

        //create pointer	
       
        var position = element.find(".widget_track li").position();
        var x = position.left;
        var y = position.top;
        var shift = o.cellwidth / 2;
		
        
        element.append("<div id='pointer" + uid + "' class='handle' style='position: absolute; top: " + y + "px; overflow: hidden;' />");
        

        //calculating start position
        var startIndex = GetIndexFromValue(o.start);
        if (parseInt($(".handle").css('width')) > o.cellwidth)
            shift = o.cellwidth;
        if (startIndex >= fndsb) {
            $("#pointer" + uid).css({ 'left': x + (o.cellwidth + 1) * startIndex + shift + 'px' });
            //var v = Math.floor((o.cellwidth * startIndex + shift) / (o.cellwidth + 1));
            var v = startIndex;
        }
        else {
            $("#pointer" + uid).css({ 'left': x + o.cellwidth * fndsb + shift + 'px' });
            //var v = Math.floor((o.cellwidth * fndsb + shift) / (o.cellwidth + 1));
            var v = fndsb;
        }

        //create tooltip
        if (o.tooltip)
            element.append("<div id='tooltip" + uid + "' class='value' style='left: " + (parseInt($("#pointer" + uid).css('left')) - 31) + "px; top: " + (y - 26) + "px;' ><p></p>");

        //paint on load
        element.change(function() {
            setSelectedIndex(v);
			if (o.tooltip){activecell(v);} else {activeonlycell(v);}
        });

        element.trigger('change');

        //drag function
        function drag(kmouse) {
            if (isMouseDown) {
                var newX = kmouse.pageX;
                if (newX < x)
                    newX = x;
                if (newX > x + (o.cellwidth + 1) * lndsb - o.cellwidth / 2)
                    newX = x + (o.cellwidth + 1) * lndsb - o.cellwidth / 2;
                //fix first
                if (newX < x + o.cellwidth * fndsb + o.cellwidth / 2)
                    newX = x + o.cellwidth * fndsb + o.cellwidth / 2;
                //
                $("#pointer" + uid).css("left", newX + "px");

                $('#tooltip' + uid).css({ "left": (newX - 32) + "px" });
                var v = Math.floor((newX - x) / (o.cellwidth + 1));
                setSelectedIndex(v);
                if (o.tooltip){activecell(v);} else {activeonlycell(v);}
            }
        }

        //drag init
        $("#pointer" + uid).mousedown(function() {
            isMouseDown = true;
            element.mousemove(drag).mouseup(function() {
                isMouseDown = false;
                element.unbind('mousemove', drag)
            });
        });

        //bar click
        $("#bar" + uid).click(function(kmouse) {
            var clickpos = kmouse.pageX;
            if (clickpos > x + o.cellwidth * fndsb && clickpos < x + (o.cellwidth + 1) * lndsb) {
                var v = Math.floor((clickpos - x - 1) / (o.cellwidth + 1)),
                    pos = x + v * (o.cellwidth + 1) + o.cellwidth / 2;
                $('#pointer' + uid).animate({ "left": pos});
                $('#tooltip' + uid).animate({ "left": pos - 31 });

                setSelectedIndex(v);
                if (o.tooltip){activecell(v);} else {activeonlycell(v);}
            }
        })

        //draw active cells
        function activecell(value) {
            for (var y = 0; y <= value; y++)
            { 
                element.find(".widget_track li:eq(" + y + ")").addClass("active");              
            }

            for (var y = value + 1; y <= itemscount; y++)
            {
                element.find(".widget_track li:eq(" + y + ")").removeClass("active");
            }
        }
		
		 function activeonlycell(value) {
            for (var y = 0; y <= itemscount; y++)
            { 
			  if (y != value) {
                element.find(".widget_track li:eq(" + y + ")").removeClass("active");
          		}
			else
				{
				 element.find(".widget_track li:eq(" + value + ")").addClass("active");
				}
			}
        }

        function setSelectedIndex(v) {
            var val = GetValueFromIndex(v);
            $("#result").html(val);
            $("#tooltip" + uid).find("p").html(val);
            if (o.selectionChanged != null)
                o.selectionChanged(val);
        }
    });
	
}