/*
* Perspective
*/
- function ScanGalleryPerspective(options){
- var old_callback = options.callback || function() { };
-
- this.vsplitbar = 'GALERIA';
-
- options.callback = function(){
+ class ScanGalleryPerspective extends $.wiki.SidebarPerspective {
+ vsplitbar = 'GALERIA';
+ dimensions = {};
+ zoomFactor = 1;
+ origin = {};
+ imageOrigin = {};
+
+ constructor(options) {
+ super(options);
var self = this;
-
- this.dimensions = {};
- this.zoomFactor = 1;
- if (this.config().page == undefined)
- this.config().page = CurrentDocument.galleryStart;
+ if (this.config().page == undefined)
+ this.config().page = CurrentDocument.galleryStart;
this.$element = $("#side-gallery");
this.$numberInput = $('.page-number', this.$element);
- // ...
- var origin = {};
- var imageOrigin = {};
-
this.$image = $('.gallery-image img', this.$element).attr('unselectable', 'on');
// button handlers
event.preventDefault();
self.setPage($(this).val());
});
-
- $('.start-page', this.$element).click(function(){
- self.setPage(CurrentDocument.galleryStart);
- });
+
+ $('.start-page', this.$element).click(function(){
+ self.setPage(CurrentDocument.galleryStart);
+ });
$('.previous-page', this.$element).click(function(){
self.setPage(parseInt(self.$numberInput.val(),10) - 1);
var datalist = modal.find('.modal-body');
datalist.html('');
self.doc.withGalleryList(function(galleries) {
- console.log(galleries);
+ let item;
$.each(galleries, (i, gallery) => {
item = $('<div class="form-check"><label class="form-check-label"><input class="form-check-input" type="radio" name="gallery"></label></div>');
$('input', item).val(gallery);
item = $('<div class="form-check"><label class="form-check-label"><input class="ctrl-new form-check-input" type="radio" name="gallery"><input class="ctrl-name form-control" placeholder="nowa"></label></div>');
item.appendTo(datalist);
});
- })
+ });
$('#gallery-chooser .ctrl-ok').on('click', function (event) {
let item = $('#gallery-chooser :checked');
let name;
} else {
name = item.val();
}
-
+
self.doc.setGallery(name);
$('#gallery-chooser').modal('hide');
self.refreshGallery(function() {
});
this.$image.load(function(){
- console.log("Image loaded.")
self._resizeImage();
}).bind('mousedown', function() {
- self.imageMoveStart.apply(self, arguments);
- });
-
-
-
- old_callback.call(this);
- };
-
- $.wiki.SidebarPerspective.call(this, options);
- };
+ self.imageMoveStart.apply(self, arguments);
+ });
+ }
- ScanGalleryPerspective.prototype = new $.wiki.SidebarPerspective();
+ _resizeImage() {
+ var $img = this.$image;
- ScanGalleryPerspective.prototype._resizeImage = function(){
- var $img = this.$image;
+ $img.css({
+ width: '',
+ height: ''
+ });
- $img.css({
- width: '',
- height: ''
- });
+ this.dimensions = {
+ width: $img.width() * this.zoomFactor,
+ height: $img.height() * this.zoomFactor,
+ originWidth: $img.width(),
+ originHeight: $img.height(),
+ galleryWidth: $img.parent().width(),
+ galleryHeight: $img.parent().height()
+ };
+
+ if (!(this.dimensions.width && this.dimensions.height)) {
+ setTimeout(function(){
+ $img.load();
+ }, 100);
+ }
- this.dimensions = {
- width: $img.width() * this.zoomFactor,
- height: $img.height() * this.zoomFactor,
- originWidth: $img.width(),
- originHeight: $img.height(),
- galleryWidth: $img.parent().width(),
- galleryHeight: $img.parent().height()
- };
+ var position = normalizePosition($img.position().left, $img.position().top, this.dimensions.galleryWidth, this.dimensions.galleryHeight, this.dimensions.width, this.dimensions.height);
- if (!(this.dimensions.width && this.dimensions.height)) {
- setTimeout(function(){
- $img.load();
- }, 100);
+ $img.css({
+ left: position.x,
+ top: position.y,
+ width: $img.width() * this.zoomFactor,
+ height: $img.height() * this.zoomFactor
+ });
}
- var position = normalizePosition($img.position().left, $img.position().top, this.dimensions.galleryWidth, this.dimensions.galleryHeight, this.dimensions.width, this.dimensions.height);
-
- $img.css({
- left: position.x,
- top: position.y,
- width: $img.width() * this.zoomFactor,
- height: $img.height() * this.zoomFactor
- });
- };
+ setPage(newPage) {
+ newPage = normalizeNumber(newPage, this.galleryImages.length);
+ this.$numberInput.val(newPage);
+ this.config().page = newPage;
+ $('.gallery-image img', this.$element).attr('src', this.galleryImages[newPage - 1].url);
+ }
- ScanGalleryPerspective.prototype.setPage = function(newPage){
- newPage = normalizeNumber(newPage, this.doc.galleryImages.length);
- this.$numberInput.val(newPage);
- this.config().page = newPage;
- $('.gallery-image img', this.$element).attr('src', this.doc.galleryImages[newPage - 1].url);
- };
+ alterZoom(delta) {
+ var zoomFactor = this.zoomFactor + delta;
+ if (zoomFactor < 0.2)
+ zoomFactor = 0.2;
+ if (zoomFactor > 2)
+ zoomFactor = 2;
+ this.setZoom(zoomFactor);
+ }
- ScanGalleryPerspective.prototype.alterZoom = function(delta){
- var zoomFactor = this.zoomFactor + delta;
- if (zoomFactor < 0.2)
- zoomFactor = 0.2;
- if (zoomFactor > 2)
- zoomFactor = 2;
- this.setZoom(zoomFactor);
- };
+ setZoom(factor) {
+ this.zoomFactor = factor;
+ this.dimensions.width = this.dimensions.originWidth * this.zoomFactor;
+ this.dimensions.height = this.dimensions.originHeight * this.zoomFactor;
- ScanGalleryPerspective.prototype.setZoom = function(factor){
- this.zoomFactor = factor;
+ // var position = normalizePosition(this.$image.position().left, this.$image.position().top, this.dimensions.galleryWidth, this.dimensions.galleryHeight, this.dimensions.width, this.dimensions.height);
- this.dimensions.width = this.dimensions.originWidth * this.zoomFactor;
- this.dimensions.height = this.dimensions.originHeight * this.zoomFactor;
+ this._resizeImage();
+ }
- // var position = normalizePosition(this.$image.position().left, this.$image.position().top, this.dimensions.galleryWidth, this.dimensions.galleryHeight, this.dimensions.width, this.dimensions.height);
+ /*
+ * Movement
+ */
+ imageMoved(event) {
+ event.preventDefault();
- this._resizeImage();
- };
+ // origin is where the drag started
+ // imageOrigin is where the drag started on the image
- /*
- * Movement
- */
- ScanGalleryPerspective.prototype.imageMoved = function(event){
- event.preventDefault();
+ var newX = event.clientX - this.origin.x + this.imageOrigin.left;
+ var newY = event.clientY - this.origin.y + this.imageOrigin.top;
- // origin is where the drag started
- // imageOrigin is where the drag started on the image
+ var position = normalizePosition(newX, newY, this.dimensions.galleryWidth, this.dimensions.galleryHeight, this.dimensions.width, this.dimensions.height);
- var newX = event.clientX - this.origin.x + this.imageOrigin.left;
- var newY = event.clientY - this.origin.y + this.imageOrigin.top;
+ this.$image.css({
+ left: position.x,
+ top: position.y,
+ });
- var position = normalizePosition(newX, newY, this.dimensions.galleryWidth, this.dimensions.galleryHeight, this.dimensions.width, this.dimensions.height);
+ return false;
+ }
- this.$image.css({
- left: position.x,
- top: position.y,
- });
+ imageMoveStart(event) {
+ event.preventDefault();
- return false;
- };
+ var self = this;
- ScanGalleryPerspective.prototype.imageMoveStart = function(event){
- event.preventDefault();
+ this.origin = {
+ x: event.clientX,
+ y: event.clientY
+ };
- var self = this;
+ this.imageOrigin = self.$image.position();
+ $(document).bind('mousemove.gallery', function(){
+ self.imageMoved.apply(self, arguments);
+ }).bind('mouseup.gallery', function() {
+ self.imageMoveStop.apply(self, arguments);
+ });
- this.origin = {
- x: event.clientX,
- y: event.clientY
- };
+ return false;
+ }
- this.imageOrigin = self.$image.position();
- $(document).bind('mousemove.gallery', function(){
- self.imageMoved.apply(self, arguments);
- }).bind('mouseup.gallery', function() {
- self.imageMoveStop.apply(self, arguments);
- });
+ imageMoveStop(event) {
+ $(document).unbind('mousemove.gallery').unbind('mouseup.gallery');
+ }
- return false;
- };
+ /*
+ * Loading gallery
+ */
+ refreshGallery(success, failure) {
+ var self = this;
+ this.doc.refreshScansGallery({
+
+ success: function(galleryImages) {
+ self.galleryImages = galleryImages;
+ self.$image.show();
+ console.log("gconfig:", self.config().page );
+ self.setPage( self.config().page );
+ $('#imagesCount').html("/" + galleryImages.length);
+
+ $('.error_message', self.$element).hide();
+ if(success) success();
+ },
+ failure: function(message) {
+ self.$image.hide();
+ $('.error_message', self.$element).show().html(message);
+ if(failure) failure();
+ }
+ });
+ }
- ScanGalleryPerspective.prototype.imageMoveStop = function(event){
- $(document).unbind('mousemove.gallery').unbind('mouseup.gallery');
- };
+ onEnter(success, failure) {
+ super.onEnter()
+ this.refreshGallery(success, failure);
+ }
- /*
- * Loading gallery
- */
- ScanGalleryPerspective.prototype.refreshGallery = function(success, failure) {
- var self = this;
- this.doc.refreshGallery({
- success: function(doc, data){
- self.$image.show();
- console.log("gconfig:", self.config().page );
- self.setPage( self.config().page );
- $('#imagesCount').html("/" + doc.galleryImages.length);
-
- $('.error_message', self.$element).hide();
- if(success) success();
- },
- failure: function(doc, message){
- self.$image.hide();
- $('.error_message', self.$element).show().html(message);
- if(failure) failure();
- }
- });
+ onExit(success, failure) {
+ };
}
-
- ScanGalleryPerspective.prototype.onEnter = function(success, failure){
- $.wiki.SidebarPerspective.prototype.onEnter.call(this);
- this.refreshGallery(success, failure);
- };
-
- ScanGalleryPerspective.prototype.onExit = function(success, failure) {
-
- };
-
$.wiki.ScanGalleryPerspective = ScanGalleryPerspective;
})(jQuery);
fnp / redakcja.git / blobdiff