small.extendMethods({
    topsale: function(url){
        var container = small(this).first();
        var step = -1;
        var data = [];
        var timer = null;
        small.json({
            "url": url,
            "callback": function(response){
                data = response;
                small.each(response, function(key, value){
                    var current = new Image();
                    current.src = value;
                });
                show();
            }
        });
        function show(){
            if(++step > 2) step = 0;
            var id = 1;
            var index = step;
            container.stop().start({
                "time": 180,
                "callback": function(){
                    var thumb = container.append("div").opacity(0).setId("thumb-" + id++);
                    var link = thumb.append("a").setAttr({
                        "href": "item/" + data[index].id,
                        "title": data[index].title
                    });
                    var text = data[index].title.substring(0, id < 4 ? 14 : (id < 6 ? 10 : 8)) + "...";
                    link.append("div").setClass("text").text(text);
                    link.append("img").setAttr({
                        "src": data[index].image,
                        "alt": data[index].title
                    });
                    link.append("div").setClass("text").text("ЦЕНА: " + data[index].price);

                    var visibility = 0;
                    thumb.stop().start({
                        "time": 30,
                        "callback": function(){
                            thumb.opacity(++visibility * 10);
                        },
                        "repeat": 10
                    });
                    if(id == 8){
                        timer = small.start({
                            "time": 2000,
                            "callback": function(){
                                hide();
                            }
                        });
                    }

                    index += 3;
                },
                "repeat": 7
            });
        }
        function hide(){
            var id = 1;
            container.stop().start({
                "time": 180,
                "callback": function(){
                    var thumb = container.find("div#thumb-" + id++);

                    var visibility = 10;
                    thumb.stop().start({
                        "time": 30,
                        "callback": function(){
                            thumb.opacity(--visibility * 10);
                            if(visibility == 0){
                                thumb.remove();
                            }
                        },
                        "repeat": 10
                    });
                    if(id == 8){
                        show();
                    }
                },
                "repeat": 7
            });
        }
    }
});