(function () { var ns = $.namespace('pskl.controller'); ns.MinimapController = function (piskelController, animationController, drawingController, container) { this.piskelController = piskelController; this.animationController = animationController; this.drawingController = drawingController; this.container = container; this.isClicked = false; }; ns.MinimapController.prototype.init = function () { this.cropFrame = document.createElement('DIV'); this.cropFrame.className = 'minimap-crop-frame'; this.cropFrame.style.display = 'none'; $(this.container).mousedown(this.onMinimapMousedown_.bind(this)); $(this.container).mousemove(this.onMinimapMousemove_.bind(this)); $(this.container).mouseup(this.onMinimapMouseup_.bind(this)); $(this.container).append(this.cropFrame); }; ns.MinimapController.prototype.onDrawingControllerMove_ = function () { var zoomRatio = this.getDrawingAreaZoomRatio_(); if (zoomRatio > 1) { this.displayCropFrame_(zoomRatio, this.drawingController.getRenderer().getOffset()); } else { this.hideCropFrame_(); } }; ns.MinimapController.prototype.displayCropFrame_ = function (ratio, offset) { this.cropFrame.style.display = 'block'; this.cropFrame.style.top = (offset.y * this.animationController.renderer.getZoom()) + 'px'; this.cropFrame.style.left = (offset.x * this.animationController.renderer.getZoom()) + 'px'; var zoomRatio = this.getDrawingAreaZoomRatio_(); this.cropFrame.style.width = (this.container.width() / zoomRatio) + 'px'; this.cropFrame.style.height = (this.container.height() / zoomRatio) + 'px'; }; ns.MinimapController.prototype.hideCropFrame_ = function () { this.cropFrame.style.display = 'none'; }; ns.MinimapController.prototype.onMinimapMousemove_ = function (evt) { if (this.isClicked) { if (this.getDrawingAreaZoomRatio_() > 1) { var coords = this.getCoordinatesCenteredAround_(evt.clientX, evt.clientY); this.drawingController.setOffset(coords.x, coords.y); } } }; ns.MinimapController.prototype.onMinimapMousedown_ = function (evt) { this.isClicked = true; }; ns.MinimapController.prototype.onMinimapMouseup_ = function (evt) { this.isClicked = false; }; ns.MinimapController.prototype.getCoordinatesCenteredAround_ = function (x, y) { var frameCoords = this.animationController.renderer.getCoordinates(x, y); var zoomRatio = this.getDrawingAreaZoomRatio_(); var frameWidth = this.piskelController.getCurrentFrame().getWidth(); var frameHeight = this.piskelController.getCurrentFrame().getHeight(); var width = frameWidth / zoomRatio; var height = frameHeight / zoomRatio; return { x : frameCoords.x - (width/2), y : frameCoords.y - (height/2) }; }; ns.MinimapController.prototype.getDrawingAreaZoomRatio_ = function () { var drawingAreaZoom = this.drawingController.getRenderer().getZoom(); var drawingAreaFullHeight = this.piskelController.getCurrentFrame().getHeight() * drawingAreaZoom; var zoomRatio = drawingAreaFullHeight / this.drawingController.getRenderer().getDisplaySize().height; return zoomRatio; }; })();