+++ /dev/null
-
-(function($) {
- $.widget('wl.pictureviewer', {
-
- options: {
- steps: 6, // steps of zoom
- max: 300, // max zoom in percent
- plus_button: undefined,
- minus_button: undefined
- },
-
- _create: function() {
- var self = this;
- self._zoom = 0;
- self.initial_size = [
- self.element.width(),
- self.element.height()
- ];
- self.initial_position = self.element.offset();
-
- self.element.css({
- 'margin': 0,
- 'position': 'absolute',
- });
- self.element.offset(self.initial_position);
-
- if (self.options.plus_button)
- self.options.plus_button.click(
- function(ev) { self.zoom(1); });
- if (self.options.minus_button)
- self.options.minus_button.click(
- function(ev) { self.zoom(-1); });
-
- function contain(event, ui) {
- var fix = self.allowedPosition(ui.position);
- console.log("fix: ", fix);
- if (fix !== undefined) {
- return false;
- };
- };
- self.element.draggable({drag: contain});
-
- return self;
- },
-
- zoom: function(steps) {
- var t = this._zoom + steps;
- return this.zoomTo(t);
- },
-
- zoomForStep: function(step) {
- // 0 => initial
- // max_step-1 => max %
- return 100 + (this.options.max - 100) / this.options.steps * step
- },
-
- zoomTo: function(level) {
- if (level < 0 || level > this.options.steps)
- return;
- var ratio = this.zoomForStep(level) / 100;
- var new_width = ratio * this.initial_size[0];
- var new_height = ratio * this.initial_size[1];
- var target = {
- 'width': new_width,
- 'left': this.initial_position.left - (new_width - this.initial_size[0])/2,
- 'top': this.initial_position.top - (new_height - this.initial_size[1])/2,
- };
- this._zoom = level;
- this.element.animate(target, 200); // default duration=400
- },
-
- allowedPosition: function(off) {
- var x = undefined, fix_x = undefined;
- var y = undefined, fix_y = undefined;
- var w = this.element.width();
- var h = this.element.height();
- var cw = $(window).width();
- var ch = $(window).height();
- var off = off || this.element.offset();
-
- if (w <= cw) {
- var x = off.left;
- if (x < 0)
- fix_x = 0;
- if (x + w > cw)
- fix_x = cw - w;
- } else {
- if (x > 0)
- fix_x = 0;
- if (x + w < cw)
- fix_x = cw - w;
- }
-
- if (h <= ch) {
- var y = off.top;
- if (y < 0)
- fix_y = 0;
- if (y + h > ch)
- fix_y = ch - h;
- } else {
- if (y > 0)
- fix_y = 0;
- if (y + h < ch)
- fix_y = ch - h;
- }
- if (fix_x !== undefined || fix_y !== undefined)
- return { top: fix_y, left: fix_x };
- return undefined;
-
- },
- });
-}(jQuery));
-
-
-$(document).ready(function(){
- $("img.canvas").pictureviewer({
- plus_button: $(".toolbar .button.plus"),
- minus_button: $(".toolbar .button.minus")
- });
-});
-