public function addTypeField()
{
$this->addField('type', LinkType::class, __('Type de lien'));
+ $this->addUIDField();
}
public function addDestinationField()
if ($this->_integration) {
$this->addField('inline', MultimediaIntegration::class, __('Intégration'));
}
- $this->addUIDField();
+
if ($this->_addedContents) {
$this->addField('header_contents', FormSection::class, __('Contenus superposés'));
$this->addField('image', FilesOrURL::class, __('Image'), $this->getFilesOrURLEntry() + ['accept' => self::$_acceptImage]);
$this->addField('header_tooltip', FormSection::class, __('Paramètres'));
$this->addField('tooltip', Textarea::class, __('Texte de l\'infobulle'));
$this->addField('display_area', Checkbox::class, __('Afficher la zone de couleur au survol'), ['default' => true]);
- $this->addUIDField();
}
}
this.initEvents();
this.initIcons();
this.panels.init();
+ this.zoom.reset();
},
initIcons: function () {
// Disable scroll by spacebar
$(window).on('keydown', function (e) {
if (e.keyCode == 32) {
- if ($this.zoom.zoom !== 1) {
- $("#linkeditor-main").addClass('grab');
- return false;
- }
+ $("#linkeditor-main").addClass('grab');
+ return false;
} else if (e.keyCode == 18) {
$("#linkeditor-main").addClass('duplicate');
return false;
if ($(this).hasClass('duplicate')) {
$this.links.duplicateLinkClick();
return;
- } else if ($(this).hasClass('grab') && $this.zoom.zoom > 1) {
+ } else if ($(this).hasClass('grab')) {
$this.zoom.zoomdragging = {
x: $this.mx,
y: $this.my,
};
$(this).addClass('grabbing');
} else {
- $this.zoom.resetZoomDrag();
- $this.links.createLinkDrag();
- deselectAll = false;
+ // Check if the user is not clicking the scrollbar
+ if ($this.mx < $this.canvasRect.right - 20 && $this.my < $this.canvasRect.bottom - 20) {
+ $this.zoom.resetZoomDrag();
+ $this.links.createLinkDrag();
+ deselectAll = false;
+ }
}
if (deselectAll) {
$this.form.saveFormDataInLink();
this.links.moveDragLink();
this.links.moveResizeLink();
this.zoom.updateMousePosition();
-
},
setMouseCoordinates: function (e) {
var aw = this.linkeditor.canvasRect.width - 30;
var ah = this.linkeditor.canvasRect.height - 30;
this.linkeditor.fs = Math.min(aw / this.linkeditor.fw, ah / this.linkeditor.fh);
- var left = (this.linkeditor.canvasRect.width - this.linkeditor.fw * this.linkeditor.fs) / 2;
- var top = (this.linkeditor.canvasRect.height - this.linkeditor.fh * this.linkeditor.fs) / 2;
+ var left = ((this.linkeditor.canvasRect.width * 2) - this.linkeditor.fw * this.linkeditor.fs) / 2;
+ var top = ((this.linkeditor.canvasRect.height * 2) - this.linkeditor.fh * this.linkeditor.fs) / 2;
$("#linkeditor-fluidbook").css({left: left, top: top, transform: 'scale(' + this.linkeditor.fs + ')'});
},
};
this.zoomdragging = false;
$("#linkeditor-main").on('wheel', function (e) {
+ var step = $this.zoom >= 1 ? 0.25 : 0.1;
$this.linkeditor.setMouseCoordinates(e);
let delta = e.originalEvent.deltaY;
if (delta === 0) {
e.stopImmediatePropagation();
e.preventDefault();
if (delta < 0) {
- if ($this.setZoom($this.zoom + 0.25)) {
+ if ($this.setZoom($this.zoom + step)) {
$this.moveZoom(e);
}
} else {
- $this.setZoom($this.zoom - 0.25);
+ $this.setZoom($this.zoom - step);
}
return false;
});
},
updateMousePosition: function () {
- if (!$("#linkeditor-main").hasClass('grab') || this.zoom === 1) {
+ if (!$("#linkeditor-main").hasClass('grab')) {
this.resetZoomDrag();
}
if (this.zoomdragging !== false) {
resetZoomDrag: function () {
$("#linkeditor-main").removeClass('grab').removeClass('grabbing');
- if (this.zoom === 1) {
- $("#linkeditor-canvas").scrollTo({left: 0, top: 0});
- }
this.zoomdragging = false;
},
this.linkeditor.rulers.updateRulers();
},
- setZoom: function (z) {
+
+ normalizeZoom: function (z) {
+ return Math.max(0.5, Math.min(8, z));
+ },
+
+ setZoom: function (z, force) {
let $this = this;
- z = Math.max(1, Math.min(6, z));
- if (z === this.zoom) {
+ z = this.normalizeZoom(z);
+ if (force !== true && z === this.zoom) {
return false;
}
this.zoom = z;
+ let cw2 = this.linkeditor.canvasRect.width * 2;
+ let ch2 = this.linkeditor.canvasRect.height * 2;
+ let zh = ch2;
+ if (this.zoom < 1) {
+ zh *= this.zoom;
+ }
$("#linkeditor-canvas").attr('data-z', this.zoom);
- $("#linkeditor-zoom").css({transform: 'scale(' + this.zoom + ')', overflow: 'visible'});
+ $("#linkeditor-zoom").css({
+ transform: 'scale(' + this.zoom + ')', overflow: 'visible',
+ width: cw2,
+ maxWidth: cw2,
+ minWidth: cw2,
+ height: zh,
+ minHeight: zh,
+ maxHeight: zh
+ });
+
setTimeout(function () {
- $("#linkeditor-zoom").css({overflow: 'hidden'});
+ //$("#linkeditor-zoom").css({overflow: 'hidden'});
if (this.zoom === 1) {
$this.resetZoomDrag();
}
reset: function () {
this.setZoom(1);
+ $("#linkeditor-canvas").scrollTo({top: '50%', left: '50%'});
this.resetZoomDrag();
},
};
#linkeditor-links
.link
+ #linkeditor-main.grab &
+ pointer-events: none
box-sizing: border-box
position: absolute
border: currentColor solid 1px
overflow: hidden
#linkeditor-zoom
- width: 100%
- height: 100%
- max-width: 100%
- max-height: 100%
- min-height: 100%
- min-width: 100%
+ width: 200%
+ height: 200%
+ max-width: 200%
+ max-height: 200%
+ min-height: 200%
+ min-width: 200%
transform-origin: 0 0
- overflow: hidden
#linkeditor-canvas
background-color: #505050