/* ==========================================================
 * MobilyMap
 * date: 29.11.2010
 * author: Marcin Dziewulski
 * last update: 20.1.2011
 * web: http://www.mobily.pl or http://playground.mobily.pl
 * email: hello@mobily.pl
 * Free to use under the MIT license.
 * ========================================================== */
(function ($) {
    $.fn.mobilymap = function (options) {
        var defaults = {
            position: "center",
            popupClass: "bubble",
            markerClass: "point",
            popup: true,
            cookies: true,
            caption: true,
            setCenter: true,
            navigation: true,
            navSpeed: 1000,
            navBtnClass: "navBtn",
            outsideButtons: false,
            onMarkerClick: function () {},
            onPopupClose: function () {},
            onMapLoad: function () {}
        };
        var sets = $.extend({}, defaults, options);
        return this.each(function () {
            var $this = $(this);
            $this.css({
                position: "relative",
                overflow: "hidden",
                cursor: "move"
            });
            $this.wrapInner($("<div />").addClass("imgContent").css({
                zIndex: "1",
                position: "absolute"
            }));
            var content = $this.find(".imgContent"),
                image = $this.find("img"),
                title = image.attr("alt"),
                point = $this.find("." + sets.markerClass),
                mouseDown = false,
                mx, my, ex, ey, imgw = image.width(),
                imgh = image.height(),
                divw = $this.width(),
                divh = $this.height();
            var cookies = {
                create: function (name, value, days) {
                    if (days) {
                        var date = new Date();
                        date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
                        var expires = "; expires=" + date.toGMTString()
                    } else {
                        var expires = ""
                    }
                    document.cookie = name + "=" + value + expires + "; path=/"
                },
                erase: function (name) {
                    cookies.create(name, "", -1)
                },
                read: function (name) {
                    var nameEQ = name + "=";
                    var ca = document.cookie.split(";");
                    for (var i = 0; i < ca.length; i++) {
                        var c = ca[i];
                        while (c.charAt(0) == " ") {
                            c = c.substring(1, c.length)
                        }
                        if (c.indexOf(nameEQ) == 0) {
                            return c.substring(nameEQ.length, c.length)
                        }
                    }
                    return null
                }
            };
            var map = {
                check: function (x, y) {
                    if (y < (divh - imgh)) {
                        y = divh - imgh
                    } else {
                        if (y > 0) {
                            y = 0
                        }
                    }
                    if (x < (divw - imgw)) {
                        x = divw - imgw
                    } else {
                        if (x > 0) {
                            x = 0
                        }
                    }
                    return {
                        x: x,
                        y: y
                    }
                },
                init: function (position) {
                    map.preloader();
                    switch (position) {
                    case "center":
                        var x = (divw - imgw) / 2,
                            y = (divh - imgh) / 2;
                        break;
                    case "top left":
                        var x = 0,
                            y = 0;
                        break;
                    case "top right":
                        var x = divw - imgw,
                            y = 0;
                        break;
                    case "bottom left":
                        var x = 0,
                            y = divh - imgh;
                        break;
                    case "bottom right":
                        var x = divw - imgw,
                            y = divh - imgh;
                        break;
                    default:
                        var new_position = position.split(" "),
                            x = -(new_position[0]),
                            y = -(new_position[1]);
                        if (y < (divh - imgh)) {
                            y = divh - imgh
                        } else {
                            if (y > 0) {
                                y = 0
                            }
                        }
                        if (x < (divw - imgw)) {
                            x = divw - imgw
                        } else {
                            if (x > 0) {
                                x = 0
                            }
                        }
                    }
                    if (sets.cookies) {
                        if (cookies.read("position") != null) {
                            var pos = cookies.read("position").split(","),
                                x = pos[0],
                                y = pos[1]
                        } else {
                            var x = (divw - imgw) / 2,
                                y = (divh - imgh) / 2
                        }
                    }
                    content.css({
                        top: y + "px",
                        left: x + "px"
                    })
                },
                preloader: function () {
                    var loadimg = new Image(),
                        src = image.attr("src");
                    image.css({
                        visibility: "hidden"
                    });
                    $this.append($("<div />").addClass("loader").css({
                        position: "absolute",
                        zIndex: "10",
                        top: "0",
                        left: "0",
                        width: "100%",
                        height: "100%"
                    }));
                    $(loadimg).load(function () {
                        image.css({
                            visibility: "visible"
                        });
                        $this.find(".loader").fadeOut(1000, function () {
                            $(this).remove();
                            if (sets.caption) {
                                $this.append($("<div />").addClass("imgCaption").html(title).hide());
                                captiond = $this.find(".imgCaption");
                                captionh = captiond.innerHeight();
                                captiond.css({
                                    bottom: -captionh + "px",
                                    position: "absolute",
                                    zIndex: "7"
                                }).show().animate({
                                    bottom: 0
                                })
                            }
                            sets.onMapLoad.call(this)
                        })
                    }).attr("src", src);
                    image.removeAttr("alt")
                },
                mouse: function (e) {
                    var x = e.pageX,
                        y = e.pageY;
                    return {
                        x: x,
                        y: y
                    }
                },
                update: function (e) {
                    var mouse = map.mouse(e),
                        x = mouse.x,
                        y = mouse.y,
                        movex = x - mx,
                        movey = y - my,
                        top = ey + movey,
                        left = ex + movex,
                        check = map.check(left, top);
                    content.css({
                        top: check.y + "px",
                        left: check.x + "px"
                    });
                    if (sets.cookies) {
                        cookies.create("position", check.x + "," + check.y, 7)
                    }
                },
                navigation: {
                    buttons: function () {
                        $this.prepend($("<div />").addClass("mapNav").css({
                            position: "absolute",
                            zIndex: "7",
                            right: "5px",
                            top: "5px"
                        }));
                        nav1 = $this.find(".mapNav");
                        for (i = 0; i < 4; i++) {
                            nav1.append('<a href="#" class="' + sets.navBtnClass + " " + sets.navBtnClass + i + '" rel="' + i + '">btn' + i + "</a>")
                        }
                        nav1.bind({
                            mouseenter: function () {
                                if (sets.caption) {
                                    captiond.stop()
                                }
                            }
                        })
                    },
                    move: function () {
                        $("." + sets.navBtnClass).bind({
                            mousedown: function () {
                                var navbtn = $(this).attr("rel");
                                if (navbtn == 0) {
                                    content.animate({
                                        top: 0
                                    }, sets.navSpeed)
                                }
                                if (navbtn == 1) {
                                    content.animate({
                                        left: divw - imgw + "px"
                                    }, sets.navSpeed)
                                }
                                if (navbtn == 2) {
                                    content.animate({
                                        top: divh - imgh + "px"
                                    }, sets.navSpeed)
                                }
                                if (navbtn == 3) {
                                    content.animate({
                                        left: 0
                                    }, sets.navSpeed)
                                }
                            },
                            mouseup: function () {
                                content.stop();
                                var pos = content.position(),
                                    x = pos.left,
                                    y = pos.top;
                                if (sets.cookies) {
                                    cookies.create("position", x + "," + y, 7)
                                }
                            },
                            mouseout: function () {
                                content.stop()
                            },
                            click: function () {
                                return false
                            }
                        })
                    }
                }
            };
            if (sets.navigation) {
                map.navigation.buttons();
                map.navigation.move()
            }
            content.bind({
                mousedown: function (e) {
                    e.preventDefault();
                    mouseDown = true;
                    var mouse = map.mouse(e);
                    mx = mouse.x, my = mouse.y;
                    var element = content.position();
                    ex = element.left, ey = element.top;
                    map.update(e)
                },
                mousemove: function (e) {
                    if (mouseDown) {
                        map.update(e)
                    }
                    return false
                },
                mouseup: function () {
                    if (mouseDown) {
                        mouseDown = false
                    }
                    return false
                },
                mouseout: function () {
                    if (mouseDown) {
                        mouseDown = false
                    }
                    return false
                },
                mouseenter: function () {
                    if (sets.caption) {
                        captiond.animate({
                            bottom: -captionh + "px"
                        })
                    }
                    return false
                },
                mouseleave: function () {
                    if (sets.caption) {
                        captiond.animate({
                            bottom: 0
                        })
                    }
                    return false
                }
            });
            map.init(sets.position);
            point.each(function () {
                var $this = $(this),
                    pos = $this.attr("id").split("-");
                x = pos[1], y = pos[2];
                $this.css({
                    position: "absolute",
                    zIndex: "2",
                    top: y + "px",
                    left: x + "px"
                })
            }).wrapInner($("<div />").addClass("markerContent").css({
                display: "none"
            }));
            point.click(function () {
                var $this = $(this),
                    pointw = $this.width(),
                    pointh = $this.height(),
                    pos = $this.position(),
                    py = pos.top,
                    px = pos.left,
                    wrap = $this.find(".markerContent").html();
                if (sets.setCenter) {
                    var center_y = -py + divh / 2 - pointh / 2 - 40,
                        center_x = -px + divw / 2 - pointw / 2,
                        center = map.check(center_x, center_y);
                    content.animate({
                        top: center.y + "px",
                        left: center.x + "px"
                    })
                }
                if (sets.popup) {
                    $("." + sets.popupClass).remove();
                    $this.after($("<div />").addClass(sets.popupClass).css({
                        position: "absolute",
                        zIndex: "100"
                    }).html(wrap).append($("<a />").addClass("close")));
                    var popup = $this.next("." + sets.popupClass),
                        popupw = popup.innerWidth(),
                        popuph = popup.innerHeight(),
                        y = py,
                        x = px;
                    popup.css({
                        top: y + pointh + "px",
                        left: x + "px",
                        marginLeft: -(popupw / 2 - pointw / 2) + "px"
                    })
                } else {
                    sets.onMarkerClick.call(this)
                }
                return false
            });
            $this.find(".close").live("click", function () {
                var $this = $(this);
                $this.parents("." + sets.popupClass).remove();
                setTimeout(function () {
                    sets.onPopupClose.call(this)
                }, 100);
                return false
            });
            if (sets.outsideButtons) {
                $(sets.outsideButtons).click(function () {
                    var $this = $(this),
                        rel = $this.attr("rel");
                    div = content.find("." + sets.markerClass).filter(function () {
                        return $(this).attr("id") == rel
                    });
                    div.click();
                    return false
                })
            }
        })
    }
}(jQuery));