namespace App\Http\Controllers\Admin\Operations\FluidbookPublication;
+use App\Models\FluidbookDocument;
use App\Models\FluidbookPublication;
+use Cubist\Backpack\Http\Controllers\Base\XSendFileController;
use Illuminate\Support\Facades\Route;
trait EditOperation
protected function setupEditRoutes($segment, $routeName, $controller)
{
Route::match(['get'], $segment . '/{id}/edit/links', $controller . '@links');
+ Route::match(['get'], $segment . '/{id}/edit/link_{page}.jpg', $controller . '@getLinkPage');
}
+
+ protected function getLinkPage($fluidbook_id, $page)
+ {
+ /** @var FluidbookPublication $fluibdook */
+ $fluibdook = FluidbookPublication::find($fluidbook_id);
+ $path = $fluibdook->getFile($page);
+ return XSendFileController::sendfile($path);
+ }
+
+// protected function getThumb($doc_id, $doc_page)
+// {
+//
+// /** @var FluidbookDocument $doc */
+// $doc = FluidbookDocument::find($doc_id);
+// $path = $doc->getFile($doc_page, 'jpg', 'thumb', true, true, '');
+// if (filesize($path) === 0) {
+// for ($i = 1; $i <= 8; $i++) {
+// clearstatcache();
+// if (filesize($path) > 0) {
+// break;
+// }
+// sleep($i);
+// }
+// }
+// return XSendFileController::sendfile($path);
+// }
+
protected function setupEditDefaults()
{
$this->crud->addButton('line', 'edit', 'view', 'crud::buttons.fluidbook_publication.edit', 'end');
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+}
+img {
+ -webkit-user-select: none;
+ -khtml-user-select: none;
+ -moz-user-select: none;
+ -o-user-select: none;
+ user-select: none;
+ user-drag: none;
+}
body,
#linkeditor,
html {
height: calc( 100% - 51px);
width: 100%;
}
-#linkeditor #linkeditor-main #linkeditor-editor #linkeditor-fluidbook {
+#linkeditor #linkeditor-main #linkeditor-editor #linkeditor-zoom {
+ width: 100%;
+ height: 100%;
+ transform-origin: 0 0;
+}
+#linkeditor #linkeditor-main #linkeditor-editor #linkeditor-canvas {
background-color: #505050;
position: relative;
top: 16px;
left: 16px;
height: calc( 100% - 16px);
+ max-height: calc( 100% - 16px);
width: calc( 100% - 16px);
+ max-width: calc( 100% - 16px);
+ overflow: auto;
+}
+#linkeditor #linkeditor-main #linkeditor-editor #linkeditor-canvas::-webkit-scrollbar {
+ width: 6px;
+ height: 6px;
+}
+#linkeditor #linkeditor-main #linkeditor-editor #linkeditor-canvas::-webkit-scrollbar-track {
+ background: transparent;
+}
+#linkeditor #linkeditor-main #linkeditor-editor #linkeditor-canvas::-webkit-scrollbar-track:hover {
+ background-color: #000;
+}
+#linkeditor #linkeditor-main #linkeditor-editor #linkeditor-canvas::-webkit-scrollbar-thumb {
+ background-color: #aaa;
+ border: 1px solid #333;
+ border-radius: 20px;
+}
+#linkeditor #linkeditor-main #linkeditor-editor #linkeditor-canvas.grab {
+ cursor: grab;
+}
+#linkeditor #linkeditor-main #linkeditor-editor #linkeditor-canvas.grabbing {
+ cursor: grabbing;
+}
+#linkeditor #linkeditor-main #linkeditor-editor #linkeditor-canvas #linkeditor-fluidbook {
+ transform-origin: 0 0;
+ position: absolute;
+ top: 0;
+ left: 0;
+}
+#linkeditor #linkeditor-main #linkeditor-editor #linkeditor-canvas #linkeditor-fluidbook .linkeditor-page {
+ position: absolute;
+ top: 0px;
+ left: 0px;
+ background-color: rgba(255, 255, 255, 0.2);
+ outline: 1px solid rgba(255, 255, 255, 0.5);
+}
+#linkeditor #linkeditor-main #linkeditor-editor #linkeditor-canvas #linkeditor-fluidbook .linkeditor-page img {
+ display: block;
+ width: 100%;
+ height: 100%;
+}
+.simple #linkeditor #linkeditor-main #linkeditor-editor #linkeditor-canvas #linkeditor-fluidbook .linkeditor-page#linkeditor-page-right {
+ display: none;
}
/*# sourceMappingURL=linkeditor.css.map */
\ No newline at end of file
-{"version":3,"sources":["linkeditor.less"],"names":[],"mappings":"AAAA;AAAM;AAAa;EACf,YAAA;EACA,WAAA;EACA,gBAAA;;AAGJ;EACI,mBAAA;EACA,YAAA;;AAFJ,WAII;AAJJ,WAIW;EACH,qBAAA;EACA,YAAA;EACA,mBAAA;EACA,gBAAA;;AARR,WAWI;EACI,WAAA;EACA,yBAAA;;AAbR,WAgBI;EACI,yBAAA;;AAjBR,WAgBI,iBAGI;EACI,yBAAA;EACA,cAAA;EACA,YAAA;;AAtBZ,WAgBI,iBASI;EACI,0BAAA;EACA,WAAA;;AA3BZ,WAgBI,iBASI,mBAII;EACI,yBAAA;EACA,kBAAA;EACA,SAAA;EACA,UAAA;EACA,0BAAA;EACA,yBAAA","file":"linkeditor.css"}
\ No newline at end of file
+{"version":3,"sources":["linkeditor.less"],"names":[],"mappings":"AAAA;EACI,SAAA;EACA,UAAA;EACA,sBAAA;;AAIJ;EACI,yBAAA;EACA,wBAAA;EACA,sBAAA;EACA,oBAAA;EACA,iBAAA;EACA,eAAA;;AAGJ;AAAM;AAAa;EACf,YAAA;EACA,WAAA;EACA,gBAAA;;AAGJ;EACI,mBAAA;EACA,YAAA;;AAFJ,WAII;AAJJ,WAIW;EACH,qBAAA;EACA,YAAA;EACA,mBAAA;EACA,gBAAA;;AARR,WAWI;EACI,WAAA;EACA,yBAAA;;AAbR,WAgBI;EACI,yBAAA;;AAjBR,WAgBI,iBAGI;EACI,yBAAA;EACA,cAAA;EACA,YAAA;;AAtBZ,WAgBI,iBASI;EACI,0BAAA;EACA,WAAA;;AA3BZ,WAgBI,iBASI,mBAII;EACI,WAAA;EACA,YAAA;EACA,qBAAA;;AAhChB,WAgBI,iBASI,mBAUI;EACI,yBAAA;EACA,kBAAA;EACA,SAAA;EACA,UAAA;EACA,0BAAA;EACA,8BAAA;EACA,yBAAA;EACA,6BAAA;EACA,cAAA;;AAEA,WA9BZ,iBASI,mBAUI,mBAWK;EACG,UAAA;EACA,WAAA;;AAIJ,WApCZ,iBASI,mBAUI,mBAiBK;EACG,uBAAA;;AAEA,WAvChB,iBASI,mBAUI,mBAiBK,yBAGI;EACG,sBAAA;;AAIR,WA5CZ,iBASI,mBAUI,mBAyBK;EACG,sBAAA;EACA,sBAAA;EACA,mBAAA;;AAGJ,WAlDZ,iBASI,mBAUI,mBA+BK;EACG,YAAA;;AAGJ,WAtDZ,iBASI,mBAUI,mBAmCK;EACG,gBAAA;;AAvEpB,WAgBI,iBASI,mBAUI,mBAwCI;EACI,qBAAA;EACA,kBAAA;EACA,MAAA;EACA,OAAA;;AA/EpB,WAgBI,iBASI,mBAUI,mBAwCI,sBAMI;EACI,kBAAA;EACA,QAAA;EACA,SAAA;EACA,0CAAA;EACA,2CAAA;;AAtFxB,WAgBI,iBASI,mBAUI,mBAwCI,sBAMI,iBAOI;EACI,cAAA;EACA,WAAA;EACA,YAAA;;AAIA,OAAQ,YA/EhC,iBASI,mBAUI,mBAwCI,sBAMI,iBAaK;EAEO,aAAA","file":"linkeditor.css"}
\ No newline at end of file
+* {
+ margin: 0;
+ padding: 0;
+ box-sizing: border-box;
+}
+
+
+img {
+ -webkit-user-select: none;
+ -khtml-user-select: none;
+ -moz-user-select: none;
+ -o-user-select: none;
+ user-select: none;
+ user-drag: none;
+}
+
body, #linkeditor, html {
height: 100%;
width: 100%;
height: ~"calc( 100% - 51px)";
width: 100%;
- #linkeditor-fluidbook {
+ #linkeditor-zoom {
+ width: 100%;
+ height: 100%;
+ transform-origin: 0 0;
+ }
+
+ #linkeditor-canvas {
background-color: #505050;
position: relative;
top: 16px;
left: 16px;
height: ~"calc( 100% - 16px)";
+ max-height: ~"calc( 100% - 16px)";
width: ~"calc( 100% - 16px)";
+ max-width: ~"calc( 100% - 16px)";
+ overflow: auto;
+
+ &::-webkit-scrollbar {
+ width: 6px;
+ height: 6px;
+
+ }
+
+ &::-webkit-scrollbar-track {
+ background: transparent;
+
+ &:hover {
+ background-color: #000;
+ }
+ }
+
+ &::-webkit-scrollbar-thumb {
+ background-color: #aaa;
+ border: 1px solid #333;
+ border-radius: 20px;
+ }
+
+ &.grab {
+ cursor: grab;
+ }
+
+ &.grabbing {
+ cursor: grabbing;
+ }
+
+
+ #linkeditor-fluidbook {
+ transform-origin: 0 0;
+ position: absolute;
+ top: 0;
+ left: 0;
+
+ .linkeditor-page {
+ position: absolute;
+ top: 0px;
+ left: 0px;
+ background-color: rgba(255, 255, 255, 0.2);
+ outline: 1px solid rgba(255, 255, 255, 0.5);
+
+ img {
+ display: block;
+ width: 100%;
+ height: 100%;
+ }
+
+ &#linkeditor-page-right {
+ .simple & {
+ display: none;
+ }
+ }
+ }
+ }
}
}
}
+$(function () {
+ var single = ['mobilefirst', 'portrait'].indexOf(FLUIDBOOK_DATA.settings.mobileNavigationType) >= 0;
+ var pw = FLUIDBOOK_DATA.settings.width;
+ var ph = FLUIDBOOK_DATA.settings.height;
+ var fw = pw * (single ? 1 : 2);
+ var fh = ph;
+ var zoom = 1;
+ var zoomdragging = false;
+
+ function init() {
+ $(window).on('hashchange', function () {
+ changePage();
+ });
+ $(window).on('resize', function () {
+ resize();
+ });
+ key('escape', function () {
+ setZoom(1);
+ resetZoomDrag();
+ });
+ // Disable scroll by spacebar
+ $(window).on('keydown', function (e) {
+ if (e.keyCode == 32) {
+ $("#linkeditor-canvas").addClass('grab');
+ return false;
+ }
+ });
+ $(window).on('keyup', function (e) {
+ if (e.keyCode == 32) {
+ resetZoomDrag();
+ }
+ });
+ $("#linkeditor-canvas").on('mousedown', function (e) {
+ if ($(this).hasClass('grab') && zoom > 1) {
+ zoomdragging = {
+ x: e.pageX,
+ y: e.pageY,
+ scrollX: $("#linkeditor-canvas").scrollLeft(),
+ scrollY: $("#linkeditor-canvas").scrollTop()
+ };
+ $(this).addClass('grabbing');
+ } else {
+ resetZoomDrag();
+ }
+ });
+ $(window).on('mousemove', function (e) {
+ if (!$("#linkeditor-canvas").hasClass('grab') || zoom === 1) {
+ resetZoomDrag();
+ }
+ if (zoomdragging !== false) {
+ moveZoomDrag(e);
+ }
+ });
+ $(window).on('mouseup', function (e) {
+ if (zoomdragging !== false) {
+ moveZoomDrag(e);
+ }
+ resetZoomDrag();
+ });
+ $("#linkeditor-canvas").on('wheel', function (e) {
+ var delta = e.originalEvent.deltaY;
+ if (delta == 0) {
+ return true;
+ }
+
+ if (delta < 0) {
+ if (setZoom(zoom + 0.25)) {
+ moveZoom(e);
+ }
+ } else {
+ setZoom(zoom - 0.25);
+ }
+ return false;
+ });
+
+ if (single) {
+ $("#linkeditor").addClass('single');
+ } else {
+ $("#linkeditor").addClass('double');
+ }
+ $('.linkeditor-page').css({
+ width: pw, height: ph
+ });
+ $("#linkeditor-page-right").css({left: pw + 1})
+ $('#linkeditor-fluidbook').css({
+ width: fw, height: ph
+ });
+ resize();
+ changePage();
+ }
+
+ function resetZoomDrag() {
+ $("#linkeditor-canvas").removeClass('grab').removeClass('grabbing');
+ zoomdragging = false;
+ }
+
+ function moveZoomDrag(e) {
+ var deltaX = e.pageX - zoomdragging.x;
+ var deltaY = e.pageY - zoomdragging.y;
+ $("#linkeditor-canvas").scrollTo({
+ top: zoomdragging.scrollY - deltaY, left: zoomdragging.scrollX - deltaX
+ });
+ }
+
+ function moveZoom(e) {
+ var rect = $("#linkeditor-zoom").get(0).getBoundingClientRect();
+ var lx = (e.originalEvent.pageX - rect.x) / rect.width;
+ var ly = (e.originalEvent.pageY - rect.y) / rect.height;
+ $("#linkeditor-canvas").scrollTo({left: pct(lx), top: pct(ly)});
+ }
+
+ function pct(v) {
+ return (v * 100) + '%';
+ }
+
+ function setZoom(z) {
+ z = Math.max(1, Math.min(6, z));
+ if (z === zoom) {
+ return false;
+ }
+ zoom = z;
+ $("#linkeditor-canvas").attr('data-z', zoom);
+ $("#linkeditor-zoom").css({transform: 'scale(' + zoom + ')'});
+ return true;
+ }
+
+ function changePage(page) {
+ if (page === undefined) {
+ var h = window.location.hash;
+ if (h.length === 0) {
+ page = 0;
+ } else {
+ page = window.location.hash.substring(1);
+ }
+ }
+ if (page % 2 === 1 && !single) {
+ page--;
+ }
+ loadPage(page, 'left');
+ if (!single) {
+ loadPage(page + 1, 'right');
+ }
+ resize();
+ }
+
+ function loadPage(p, side) {
+ var container = $("#linkeditor-page-" + side);
+ if (p === 0 || p > FLUIDBOOK_DATA.settings.pages) {
+ $(container).html('');
+ } else {
+ $(container).html('<img draggable="false" src="link_' + p + '.jpg" />')
+ }
+ }
+
+ function resize() {
+ resizeCanvas();
+ }
+
+ function resizeCanvas() {
+ var cw = $('#linkeditor-canvas').outerWidth();
+ var ch = $('#linkeditor-canvas').outerHeight();
+ var aw = cw - 20;
+ var ah = ch - 20;
+ var s = Math.min(aw / fw, ah / fh);
+ var left = (cw - fw * s) / 2;
+ var top = (ch - fh * s) / 2;
+ $("#linkeditor-fluidbook").css({left: left, top: top, transform: 'scale(' + s + ')'});
+ }
+
+ init();
+});
links: {
name: "{{__('Editer les liens')}}",
callback: function (key, opt) {
-
+ window.open('/fluidbook-publication/' + {{$entry->id}} + '/edit/links#' + ($(opt.$trigger[0]).index() + 1))
},
},
}, compositionContextConversionSettings());
@extends('layouts.empty')
@section('content')
- <div id="linkeditor">
+ <div draggable="false" id="linkeditor">
<aside id="linkeditor-left"></aside>
<div id="linkeditor-main">
- <div id="linkeditor-toolbar"></div>
+ <div draggable="false" id="linkeditor-toolbar"></div>
<div id="linkeditor-editor">
- <div id="linkeditor-rulers"></div>
- <div id="linkeditor-fluidbook"></div>
+ <div draggable="false" id="linkeditor-rulers"></div>
+ <div draggable="false" id="linkeditor-canvas">
+ <div draggable="false" id="linkeditor-zoom">
+ <div draggable="false" id="linkeditor-fluidbook">
+ <div draggable="false" class="linkeditor-page" id="linkeditor-page-left"></div>
+ <div draggable="false" class="linkeditor-page" id="linkeditor-page-right"></div>
+ </div>
+ </div>
+ </div>
</div>
</div>
<aside id="linkeditor-right"></aside>
</div>
@endsection
@push('after_scripts')
+ <script>
+ var FLUIDBOOK_DATA = @json($fluidbook->getPageData()->getRawData());
+ </script>
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-scrollTo/2.1.3/jquery.scrollTo.min.js"
+ integrity="sha512-PsJ1f4lw0Jrga4wbDOvdWs9DFl88C1vlcH2VQYqgljHBmzmqtGivUkzRHWx2ZxFlnysKUcROqLeuOpYh9q4YNg=="
+ crossorigin="anonymous" referrerpolicy="no-referrer"></script>
+ <script src="https://cdnjs.cloudflare.com/ajax/libs/keymaster/1.6.1/keymaster.min.js"
+ integrity="sha512-BCAhaaB0/bmrMBa8RVw/Cgqg5OOuQ+kZPWfRL7RlRb/LLfQMSuxDZ48TNxmwk3dFs+R4diG6yVsXKFNELe6trw=="
+ crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/fabric.js/5.2.4/fabric.min.js"
integrity="sha512-HkRNCiaZYxQAkHpLFYI90ObSzL0vaIXL8Xe3bM51vhdYI79RDFMLTAsmVH1xVPREmTlUWexgrQMk+c3RBTsLGw=="
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
projects / fluidbook-toolbox.git / commitdiff