﻿(function($) {
    $.fn.showhide = function(options) {
        //Thay doi gia tri truyen vao va default
        var opts = $.extend($.fn.showhide.defaults, options);

        opts.objId = $(this).attr("id");
        $(this).css({ width: opts.width, height: opts.height });
        $(this).find("img").css({ width: opts.width, height: opts.height });

        //Thuc hien chinh do sang cua cac div image xuong 0 va hien image dau tien 1
        $($(this).children("." + opts.ClassDivImage)).css({ opacity: 0, left: -(opts.width * 2) }).show();
        $($(this).children("." + opts.ClassDivImage)[opts.index]).css({ opacity: 1, left: 0 });

        //Luu tru cac gia tri data
        $(this).data("running", false);
        $(this).data("index", opts.index);
        $(this).data("length", ($(this).children("." + opts.ClassDivImage)).length);
        $(this).data("divimage", "." + opts.ClassDivImage);
        $(this).data("TimeEffectImage", opts.TimeEffectImage);

        //Phuong thuc thuc hien chuyen anh
        function ShowHide_ChangeImage(objId) {
            if (!$("#" + objId).data("running")) {
                $("#" + objId).data("running", true);
                //Lay gia tri tong so anh
                var max = $("#" + objId).data("length");
                //Lay doi tuong anh tiep theo
                var next = $("#" + objId).data("index") + 1;
                if (next >= max) next = 0;

                //Thuc hien an doi tuong hien hanh
                $($("#" + objId).children($("#" + objId).data("divimage"))[$("#" + objId).data("index")]).animate({ opacity: 0 }, $("#" + objId).data("TimeEffectImage"), function() {
                    $(this).css({ left: -($(this).width()*2) });
                });
                $($("#" + objId).children($("#" + objId).data("divimage"))[next]).css({ left: 0 });
                //Thuc hien hien thi doi tuong tiep theo
                $($("#" + objId).children($("#" + objId).data("divimage"))[next]).animate({ opacity: 1 }, $("#" + objId).data("TimeEffectImage"));
                //Thay doi gia tri index
                $("#" + objId).data("index", next);
                $("#" + objId).data("running", false);
            }
        }

        //Khoi tao timer thay doi hinh anh
        $(this).everyTime(opts.TimeChangeImage, opts.objId, function() {
            var id = false;
            if ($(this).children("div").length > 0) {
                id = $($($(this).children("div")[0]).parent()).attr("id");
            }
            if (id) {
                ShowHide_ChangeImage(id);
            }
        });
    };

    $.fn.showhide.defaults = {

        TimeChangeImage: 5000, //Thoi gian chuyen anh
        TimeEffectImage: 2000,  //Thoi gian hieu ung chuyen anh
        ClassDivImage: "divImage",  //Div cua image

        objId: "slideShow",  //Id cua doi tuong truyen vao
        index: 0,  //Gia tri index cua image
        width: 0,
        heigth: 0
    };
})(jQuery);
