$token = Str::random(10);
$contents = $this->getLatestMarkdown($id);
+
$fluidbook=FluidbookPublication::find($id);
return view('fluidbook_publication.markdown_editor', ['contents' => $contents, 'version' => 'stable', 'id' => $id, 'fluidbook' => $fluidbook, 'access' => "", 'token' => $token]);
}
}
- return $fluidbook->getAccessibleContents()['pages'];
+ return $fluidbook->getAccessibleContents();
}
protected function saveMarkdown($fluidbook_id, $message = '', $md = '[]')
}
}
+
$region = $forceRegion ?? $this->getRegion();
$base = 'fluidbookpublication/docs/' . $this->id . '/' . $path;
$res = Files::mkdir($region == Region::EUROPE ? protected_path($base) : us_protected_path($base));
+
if ($fname) {
$res .= $fname;
}
+
return $res;
}
if (!file_exists($file)) {
if ($revision === 'latest') {
$json = ['pages' => []];
+
foreach ($this->getComposition() as $page => $d) {
- $json['pages'][$page] = file_get_contents($this->getAccessibleFile($page));
+ try {
+ $json['pages'][$page] = file_get_contents($this->getAccessibleFile($page));
+ }catch (\Exception $e) {
+ dump($page, $e->getMessage());
+ }
}
file_put_contents($file, gzencode(json_encode($json)));
this.linkeditor.rulers.updateRulers();
const $this = this
$this.linkeditor.previewLinks.setPreview(true)
-
},
normalizeZoom: function (z) {
import MarkdowneditorUndo from "./markdowneditor.undo";
import MarkdowneditorSave from "./markdowneditor.save";
import MarkdowneditorVersions from "./markdowneditor.versions";
+import MarkdowneditorZoom from "./markdowneditor.zoom";
import tippy from "tippy.js";
import 'tippy.js/dist/tippy.css';
return keyfilter(event);
};
+require('jquery.scrollto');
+
function keyfilter(event, disable = false) {
if (disable) {
return false
this.undo = new MarkdowneditorUndo(this);
this.save = new MarkdowneditorSave(this);
this.versions = new MarkdowneditorVersions(this);
+ this.zoom = new MarkdowneditorZoom(this);
+
this.open = false
this.savedScroll = null;
const container = document.querySelector("#markdown-preview .markdown-wrapper")
var imageFormat = FLUIDBOOK_DATA.settings.imageFormat ?? 'jpg';
- var c = '<div class="contents">';
- //if (this.linkeditor.utils.isSpecialPage(p)) {
- //let data = this.linkeditor.utils.getSpecialPageAssetData(p);
- //c += '<img draggable="false" width="' + data.dim[0] + '" height="' + data.dim[1] + '" class="images" src="' + data.url + '" />';
- //} else {
- if (this.pagesSource === 'pages') {
- if (this.rasterizePages.indexOf(p) >= 0) {
- c += '<img draggable="false" src="raster_' + p + '.' + imageFormat + this.noCache + '" />';
- } else if (this.vectorPages.indexOf(p) >= 0) {
- c += '<img draggable="false" src="vector_' + p + '.svg' + this.noCache + '" />';
- } else {
- c += '<img draggable="false" class="images" src="images_' + p + '.' + imageFormat + this.noCache + '" />';
- c += '<img draggable="false" class="texts" src="texts_' + p + '.svg' + this.noCache + '" />';
- }
- } else if (this.pagesSource === 'thumbnails') {
- c += '<img draggable="false" src="thumbspdf_' + p + '.' + imageFormat + this.noCache + '" />';
+ var c = '<div id="markdowneditor-zoom" class="contents">';
+ if (this.pagesSource === 'pages') {
+ if (this.rasterizePages.indexOf(p) >= 0) {
+ c += '<img draggable="false" src="raster_' + p + '.' + imageFormat + this.noCache + '" />';
+ } else if (this.vectorPages.indexOf(p) >= 0) {
+ c += '<img draggable="false" src="vector_' + p + '.svg' + this.noCache + '" />';
+ } else {
+ c += '<img draggable="false" class="images" src="images_' + p + '.' + imageFormat + this.noCache + '" />';
+ c += '<img draggable="false" class="texts" src="texts_' + p + '.svg' + this.noCache + '" />';
}
- //}
+ } else if (this.pagesSource === 'thumbnails') {
+ c += '<img draggable="false" src="thumbspdf_' + p + '.' + imageFormat + this.noCache + '" />';
+ }
c += '</div>';
if (p > 0 || p <= FLUIDBOOK_DATA.settings.pages) {
container.innerHTML = c;
timeout: timeout,
}).show();
},
+
+ setMouseCoordinates: function (e) {
+ this.mx = e.pageX;
+ this.my = e.pageY;
+ },
}
--- /dev/null
+function MarkdowneditorZoom(markdowneditor) {
+ this.markdowneditor = markdowneditor;
+ this.init();
+}
+
+MarkdowneditorZoom.prototype = {
+ init: function () {
+ var $this = this;
+
+ this.zoom = 1;
+ this.zoomdragging = false;
+ this.mx = 0;
+ this.my = 0;
+ this.canvasRect = $("#markdown-preview").get(0).getBoundingClientRect()
+ this.initialWidth = $("#markdown-wrapper")[0].getBoundingClientRect().width
+ this.initialHeight = $("#markdown-wrapper")[0].getBoundingClientRect().height
+ this.container = $("#markdown-wrapper")
+ this.content = $('#markdown-zoom');
+ this.ctrl = false
+
+ $(window).on('mousemove mousedown mouseup', function (e) {
+ $this.setMouseCoordinates(e);
+ })
+
+ $(document).on('keydown', function(e){
+ $this.ctrl = e.ctrlKey
+ })
+
+ $(document).on('keyup', function(e){
+ $this.ctrl = false
+ })
+
+ $("#markdown-preview").on('mousewheel', function (e) {
+ e.stopPropagation();
+ if($this.ctrl) {
+
+ var step = $this.zoom >= 1 ? 0.25 : 0.1;
+ $this.setMouseCoordinates(e);
+ let cursorPositionOnFluidbookBeforeZoom = $this.getFluidbookPositionOfCursor();
+
+ const centerX = ($this.container.scrollLeft() + $this.container.width() / 2) / $this.zoom;
+ const centerY = ($this.container.scrollTop() + $this.container.height() / 2) / $this.zoom;
+
+ let delta = e.originalEvent.deltaY;
+ if (delta === 0) {
+ return true;
+ }
+
+ e.stopPropagation();
+ e.stopImmediatePropagation();
+ e.preventDefault();
+
+ if ($this.setZoom($this.zoom + step * (delta > 0 ? -1 : 1), e)) {
+ $this.moveZoomAfterWheelZoom(centerX, centerY);
+ }
+
+ return false;
+ }
+ });
+
+ $(document).on("click", "#markdown-preview", function(e) {
+ const centerX = ($this.container.scrollLeft() + $this.container.width() / 2) / $this.zoom;
+ const centerY = ($this.container.scrollTop() + $this.container.height() / 2) / $this.zoom;
+ e.stopPropagation();
+ e.stopImmediatePropagation();
+ e.preventDefault();
+ if($this.zoomdragging) {
+ $this.zoomdragging = false
+ $this.setZoom(1)
+ console.log()
+ $("#markdowneditor-zoom").css("cursor","zoom-in")
+ return false;
+ }
+ $this.zoomdragging = true
+ $this.setZoom(3)
+ $("#markdowneditor-zoom").css("cursor","zoom-out")
+ console.log(centerY,centerX)
+ $this.moveZoomAfterWheelZoom(centerX,centerY);
+ })
+ },
+
+ setZoom: function(z) {
+ const $this = this
+ z = this.normalizeZoom(z);
+ this.zoom = z;
+
+ $("#markdowneditor-zoom").css({
+ //transform: 'scale(' + $this.zoom + ')',
+ width: $this.initialWidth * $this.zoom,
+ height: $this.initialHeight * $this.zoom,
+ margin: "0 auto"
+ })
+
+ return true;
+ },
+
+ moveZoomAfterWheelZoom: function (centerX,centerY) {
+ this.container.scrollLeft(centerX * this.zoom - this.container.width() / 2);
+ this.container.scrollTop(centerY * this.zoom - this.container.height() / 2);
+ },
+
+ getFluidbookPositionOfCursor: function () {
+ let rect = $("#markdowneditor-zoom").get(0).getBoundingClientRect();
+ let lx = (this.mx - rect.x) / rect.width;
+ let ly = (this.my - rect.y) / rect.height;
+
+ return {x: rect.x, y: rect.y, width: rect.width, height: rect.height};
+ },
+
+ setMouseCoordinates: function (e) {
+ this.mx = e.pageX;
+ this.my = e.pageY;
+ },
+
+ normalizeZoom: function (z) {
+ if (this.markdowneditor.mobileFirst) {
+ return 1;
+ }
+ return Math.max(1, Math.min(8, z));
+ }
+};
+export default MarkdowneditorZoom;
transform: translate(-50%,-50%)
&-wrapper
- display: flex
+ //display: flex
align-items: center
user-select: none
position: relative
height: 100%
overflow: auto
margin-right: 7px
+ justify-content: center
+ #markdowneditor-zoom
+ width: 100%
+ height: 100%
+ will-change: transform
+ cursor: zoom-in
+ //transition: all .3s
+ //position: absolute
&-page
width: 100%
</nav>
</div>
<div id="markdown-preview" class="markdown-container">
- <div class="markdown-wrapper">
+ <div id="markdown-wrapper" class="markdown-wrapper">
</div>
<div class="handle preview-handle"></div>
</div>
projects / fluidbook-toolbox.git / commitdiff