From aa703c63d8ec28dcb48e63ae2940a3cb632a402c Mon Sep 17 00:00:00 2001
From: Vincent Vanwaelscappel <vincent@cubedesigners.com>
Date: Thu, 23 Jan 2025 12:54:08 +0100
Subject: [PATCH] wait #7273 @0.5

---
 .../FluidbookPublication/LinksOperation.php   |   2 +-
 package.json                                  |   9 +-
 .../link_editor.blade.php                     |   9 +-
 .../link_editor_beta.blade.php                | 437 ++++++++++++++++++
 4 files changed, 446 insertions(+), 11 deletions(-)
 create mode 100644 resources/views/fluidbook_publication/link_editor_beta.blade.php

diff --git a/app/Http/Controllers/Admin/Operations/FluidbookPublication/LinksOperation.php b/app/Http/Controllers/Admin/Operations/FluidbookPublication/LinksOperation.php
index fa114b283..1125fe98b 100644
--- a/app/Http/Controllers/Admin/Operations/FluidbookPublication/LinksOperation.php
+++ b/app/Http/Controllers/Admin/Operations/FluidbookPublication/LinksOperation.php
@@ -337,7 +337,7 @@ trait LinksOperation
 
         $token = Str::random(10);
 
-        return view('fluidbook_publication.link_editor', ['version' => 'beta', 'id' => $id, 'fluidbook' => FluidbookPublication::find($id), 'access' => "", 'token' => $token]);
+        return view('fluidbook_publication.link_editor_beta', ['version' => 'beta', 'id' => $id, 'fluidbook' => FluidbookPublication::find($id), 'access' => "", 'token' => $token]);
     }
 
     public function broadcast(Request $request)
diff --git a/package.json b/package.json
index 09bedf15f..aa8d46a23 100644
--- a/package.json
+++ b/package.json
@@ -8,9 +8,12 @@
         "elearningpackage-dev": "cross-env process.env.section=elearningpackage mix",
         "elearningpackage-watch": "cross-env process.env.section=elearningpackage mix watch",
         "elearningpackage": "cross-env process.env.section=elearningpackage mix --production",
-        "linkeditor-dev": "cross-env process.env.section=linkeditor mix",
-        "linkeditor-watch": "cross-env process.env.section=linkeditor mix watch",
-        "linkeditor": "cross-env process.env.section=linkeditor mix --production"
+        "linkeditor-dev": "cross-env process.env.section=linkeditor-stable mix",
+        "linkeditor-watch": "cross-env process.env.section=linkeditor-stable mix watch",
+        "linkeditor": "cross-env process.env.section=linkeditor-stable mix --production",
+        "linkeditor-beta-dev": "cross-env process.env.section=linkeditor mix",
+        "linkeditor-beta-watch": "cross-env process.env.section=linkeditor mix watch",
+        "linkeditor-beta": "cross-env process.env.section=linkeditor mix --production"
     },
     "devDependencies": {
         "axios": "^1.3.5",
diff --git a/resources/views/fluidbook_publication/link_editor.blade.php b/resources/views/fluidbook_publication/link_editor.blade.php
index acfef9db2..0a22be904 100644
--- a/resources/views/fluidbook_publication/link_editor.blade.php
+++ b/resources/views/fluidbook_publication/link_editor.blade.php
@@ -308,12 +308,9 @@
                     @endif
                     <a href="#" data-action="toggleWhiteOverlay" data-icon="white-overlay"
                        data-tooltip="{{__('Afficher un overlay blanc semi-opaque au dessus des pages')}}"></a>
-                    <a href="#" id="preview-links" class="disabled" data-action="links.preview" data-icon="preview-links"
-                       data-tooltip="{{__('Voir un aperçu des liens (Ctrl+Y)')}}" data-key="ctrl+y"></a>
-                    <a href="#" id="start-animations" class="" data-action="links.animation" data-icon="start-animation"
-                       data-tooltip="{{__('Lancer les animations')}}"></a>
                     <a href="#" data-action="openFluidbook" data-icon="open-fluidbook"
                        data-tooltip="{{__('Ouvrir le fluidbook à la page courante')}}"></a>
+
                 </nav>
                 <nav id="linkeditor-toolbar-right">
                     <div class="when-selection-3">
@@ -404,11 +401,9 @@
         var ASSETS = @json($assets);
         var CAN_CONTAIN_LINKS = @json($canContainLinks);
         var DEPTH = @json($depths);
-        var FONT_SIZE = @json([]);
-        var ZOOM = null;
     </script>
     <script
-            src="/packages/linkeditor/js/linkeditor.js?v={{filemtime(public_path('packages/linkeditor/js/linkeditor.js'))}}"></script>
+        src="/packages/linkeditor/js/linkeditor.js?v={{filemtime(public_path('packages/linkeditor/js/linkeditor.js'))}}"></script>
 @endpush
 @push('linkeditor_styles')
     <script>window._skipAutoTriggers = true;</script>
diff --git a/resources/views/fluidbook_publication/link_editor_beta.blade.php b/resources/views/fluidbook_publication/link_editor_beta.blade.php
new file mode 100644
index 000000000..c929bf689
--- /dev/null
+++ b/resources/views/fluidbook_publication/link_editor_beta.blade.php
@@ -0,0 +1,437 @@
+{{-- __('!! Editeur de liens') --}}
+@php
+    if($version==='stable'){
+        $scriptVersion='-stable';
+    }else{
+        $scriptVersion='';
+    }
+    $title='#'.$id.' - '.__('Editeur de liens');
+    /** @var $fluidbook \App\Models\FluidbookPublication */
+    $depths=\App\SubForms\Link\Base::getDepths(\App\Models\FluidbookPublication::find($fluidbook->id));
+    $canContainLinks=\App\SubForms\Link\Base::typesCanContainLinks();
+    $fluidbook->getLinksAndRulers($links,$rulers);
+    $fbdata=$fluidbook->getPageData()->getRawData();
+    $fbdata['settings']['width']=$fbdata['width']=$fluidbook->getPageWidth();
+    $fbdata['settings']['height']=$fbdata['height']=$fluidbook->getPageHeight();
+    $fbdata['settings']['pages']=$fbdata['pages']=$fluidbook->getPagesNumber();
+    $fbdata['page_dimensions']=[];
+    $mh = 0;
+    for($i=1;$i<=$fbdata['pages'];$i++){
+        $fbdata['page_dimensions'][$i]=[$fluidbook->getPageWidth($i),$fluidbook->getPageHeight($i)];
+        $mh = max($mh,$fbdata['page_dimensions'][$i][1]);
+    }
+    $fbdata['pages_max_height']=$mh;
+    $theme=\App\Models\FluidbookTheme::withoutGlobalScopes()->find($fluidbook->theme);
+    /** @var \Cubist\Backpack\Magic\PageData $themeData */
+    $themeData=$theme->getPageData();
+    $themeRawData=$themeData->getRawData();
+
+    $extraThemeFiles=['background'=>'backgroundImage','aftersearch'=>'afterSearch'];
+    $extraFluidbookFiles=['tabs'=>'tabsHTML5'];
+    $hasExtra=false;
+    $t=[];
+    foreach ($extraThemeFiles as $name=>$field) {
+        $file=$themeData->getImageFile($field);
+        if(null===$file){
+            $t[$name]=null;
+            continue;
+        }
+        if(stristr($file,'.svg')){
+            $opt=\Fluidbook\Tools\SVG\SVGTools::optimizeSVG($file);
+        }
+        $t[$name]=[
+            'path'=>$file,
+            'url'=>str_replace('.svg','.o.svg',$themeData->getImageURL($field)),
+            'dim'=> \Cubist\Util\Graphics\Image::getimagesize($file)
+            ];
+        $hasExtra=true;
+    }
+    foreach ($extraFluidbookFiles  as $name=>$field) {
+        $fname=$fluidbook->$field;
+        if(!$fname){
+            continue;
+        }
+        $file=$fluidbook->getAssetDir().'/'.$fname;
+        if(null===$file || !file_exists($file)){
+            $t[$name]=null;
+            continue;
+        }
+
+        if(stristr($file,'.svg')){
+            $opt=\Fluidbook\Tools\SVG\SVGTools::optimizeSVG($file);
+        }
+
+        $t[$name]=[
+            'path'=>$file,
+            'url'=>route('fluidbookpublication-link-asset',['id'=>$fluidbook->id,'file'=>str_replace('.svg','.o.svg',$fname)]),
+            'dim'=> \Cubist\Util\Graphics\Image::getimagesize($file)
+            ];
+        $hasExtra=true;
+    }
+    $translations=[
+        'success_save'=>__('Liens sauvegardés'),
+        'error_save'=>__('Une erreur s\'est produite lors de la sauvegarde des liens'),
+        'error'=>__('Une erreur s\'est produite'),
+        'manual_save_message'=>__('Sauvegarde manuelle'),
+        'automatic_save_message'=>__('Sauvegarde automatique'),
+        'warning_unsaved_changes'=>__('Des données n\'ont pas été sauvegardées'),
+        'before_export_save_message'=>__("Sauvegarde avant export"),
+        'before_restore_message'=>__("Sauvegarde avant la restauration des liens"),
+        'upload_save_message'=>__("Après l'upload d'un fichier"),
+        'restore_version_tooltip'=>__('Restaurer cette version'),
+        'export_version_tooltip'=>__('Exporter les liens au format xlsx'),
+        'delete_link'=>__('Supprimer le lien'),
+        'edit_image_link'=>__('Editer les liens de l\'image'),
+        'delete_selection'=>__('Supprimer la sélection'),
+        'select_all'=>__('Tout sélectionner'),
+        'error_open_image_link'=>__('Impossible d\'ajouter des liens au contenu de ce lien'),
+        'empty'=>__('Vide'),
+        'copy_link_id'=>__('Copier l\'identifiant unique'),
+        'level'=>__('Niveau'),
+        'before_fix_drifted'=>__('Sauvegarde avant la correction de la dérive des liens'),
+        'before_import_links_from_pdf'=>__('Sauvegarde avant de restaurer les liens du PDF'),
+        'copy'=>__('Copier'),
+        'cut'=>__('Couper'),
+        'paste_here'=>__('Coller ici'),
+        'paste_in_place'=>__('Coller en place'),
+        'paste_on_left'=>__('Coller en décalant  vers la gauche'),
+        'paste_on_right'=>__('Coller en décalant vers la droite'),
+        'cover_page_0'=>__('Recouvrir la page sans marge'),
+        'cover_doublepage_0'=>__('Recouvrir la double-page sans marge'),
+        'cover_page_1'=>__('Recouvrir la page avec une marge de :margin',['margin'=>'1px']),
+        'cover_doublepage_1'=>__('Recouvrir la double-page avec une marge de :margin',['margin'=>'1px']),
+        'n_links_copied'=>__('%nb% liens copiés'),
+        'n_links_cut'=>__('%nb% liens coupés'),
+        'click_to_copy_id'=>__('Cliquer pour copier l\'identifiant du lien'),
+        'id_copied'=>__('Identifiant copié !'),
+        'lock'=>__('Vérouiller'),
+        'fix_offset'=>__('Corriger décalage de page'),
+    ];
+
+    $rulers=!count($rulers)?'{}':json_encode($rulers);
+    $links=!count($links)?'{}':json_encode($links);
+    /** @var \App\Models\User $user */
+    $user=backpack_user();
+    $settings=[
+        'left_open'=>false, 'left_width'=>20,'left_tool'=>'layers',
+        'right_open'=>true,'right_width'=>20,'right_tool'=>'form',
+        'panels_layout'=>['left'=>['layers','versions'],'right'=>['form']]
+        ];
+    foreach ($settings as $k=>$v) {
+        $settings[$k]=$user->getToolboxSetting('linkeditor_'.$k,$v);
+    }
+    $assets=$fluidbook->getLinksAssetsDimensions();
+
+    $alignments=[
+        'left'=>__('Aligner la sélection à gauche'),
+        'center'=>__('Centrer horizontalement la sélection'),
+        'right'=>__('Aligner la sélection à droite'),
+        'top'=>__('Aligner la sélection en haut'),
+        'middle'=>__('Centrer verticalement la sélection'),
+        'bottom'=>__('Aligner la sélection en bas')
+    ];
+    $dimensions=[
+      'width'=>__('Appliquer la même largeur à la sélection'),
+      'height'=>__('Appliquer la même hauteur à la sélection'),
+      'both'=>__('Appliquer les mêmes dimensions à la sélection'),
+    ];
+
+    if(cache()->has('connexion'.$id)) {
+        $connexionInfo = cache()->get('connexion'.$id);
+    }
+
+    $u = backpack_user();
+@endphp
+@extends('layouts.linkeditor')
+
+@section('content')
+    @include('fluidbook_publication.link_editor_icons')
+    <div id="token" data-token="{{$token}}"></div>
+    @isset($connexionInfo)
+        <div id="token-cache" data-token="{{$connexionInfo['token']}}"></div>
+    @endisset
+    <div id="userID" data-id="{{backpack_user()->id}}"></div>
+    <div id="popup-overlay">
+        <div id="popup-holder">
+        </div>
+    </div>
+    <div id="loader"></div>
+    <div id="popup-templates">
+        <div class="popup" data-popup="moveLinks" style="max-width: 300px">
+            <h2>{{__('Déplacer les liens')}}</h2>
+            <a nohref="" class="close" data-icon="close"></a>
+            <form action="/fluidbook-publication/{{$fbdata['id']}}/edit/links/move"
+                  data-save-before-submit="{{__("Sauvegarde avant le déplacement de liens")}}"
+                  class="reloadAfterSuccess" method="post">
+                @csrf
+                <p>{!! __('Déplacer les liens de :nb pages :br à partir de la page :page',
+                    ['br'=>'</p><p>','nb'=>'<input type="number" name="number">','page'=>'<input type="text" name="start">'])!!}</p>
+                <p><label>
+                        <input type="checkbox" checked
+                               name="offset_internal_links"
+                               value="1"> {{__('Appliquer le décalage aux numéros de pages des liens internes')}}
+                    </label></p>
+                <p class="button">
+                    <button type="submit">{{__('Déplacer les liens')}}</button>
+                </p>
+            </form>
+        </div>
+
+        <div class="popup" data-popup="unavailable" style="max-width: 300px">
+            <h2>{{__('Fluidbook en cours d\'édition')}}</h2>
+            <p>{{__('Utilisateur : ')}} <span id="username"></span></p>
+            <p>Identifiant: <span id="id"></span></p>
+            @if($u->hasPermissionTo('fluidbook-publication:admin'))
+                <p class="button">
+                    <button id="connectTo" type="submit">{{__('Déconnecter l\'utilisateur')}}</button>
+                </p>
+            @endif
+        </div>
+
+        <div class="popup" data-popup="unavailable-twin-connection" style="max-width: 300px">
+            <h2>{{__('Vous êtes déjà connecté sur ce fluidbook')}}</h2>
+            <p class="button">
+                <button id="connectTo" type="submit">{{__('Vous déconnecter des autres onglets')}}</button>
+            </p>
+        </div>
+    </div>
+
+    <div draggable="false" id="linkeditor">
+        <div style="display: none" id="panels-setups">
+            <a href="#" id="linkeditor-icon-layers" data-panel="layers" data-icon="layers"
+               data-action="panels.toggleLayers"
+               data-tooltip="{{__('Liste des liens')}} (F7)"
+               data-key="f7"></a>
+            <a href="#" id="linkeditor-icon-versions" data-panel="versions" data-action="panels.toggleVersions"
+               data-icon="wayback-machine"
+               data-tooltip="{{__('Restaurer une version précédente')}} (F6)" data-key="f6"></a>
+            <a href="#" id="linkeditor-icon-form" data-panel="form" data-icon="settings"
+               data-action="panels.toggleForm"
+               data-tooltip="{{__('Paramètres du lien')}} (F8)" data-key="f8"></a>
+            <div id="linkeditor-panel-versions">
+                <div id="linkeditor-panel-versions-list">
+
+                </div>
+            </div>
+        </div>
+        <aside id="linkeditor-left" class="linkeditor-sidebar" data-side="left">
+            <nav id="linkeditor-left-icons">
+
+            </nav>
+            <div id="linkeditor-left-panel" class="linkeditor-panel-side">
+
+            </div>
+            <div class="handle"></div>
+        </aside>
+        <div id="linkeditor-main">
+            <div draggable="false" id="linkeditor-toolbar">
+                <nav id="linkeditor-toolbar-left">
+                    <a href="#" data-icon="save" data-action="save.save" data-tooltip="{{__('Sauvegarder')}} (Ctrl+S)"
+                       data-key="ctrl+s"></a>
+                    <a href="#" data-icon="undo" data-action="undo.undo"
+                       data-tooltip="{{__('Annuler la dernière modification')}} (Ctrl+Z)"
+                       data-key="ctrl+z" data-key-skipintextfields></a>
+                    <a href="#" data-icon="redo" data-action="undo.redo"
+                       data-tooltip="{{__('Rétablir la derière modification')}} (Ctrl+Maj+Z)"
+                       data-key="ctrl+shift+z" data-key-skipintextfields></a>
+                    <div class="separator"></div>
+                    <a href="#" data-action="zoom.reset" data-icon="zoom-reset"
+                       data-tooltip="{{__('Réinitialiser le zoom')}} (Esc)" data-key="esc, ctrl+0, ctrl+numpad0"></a>
+                    <div class="separator"></div>
+                    <div data-icon="import-links"
+                         data-tooltip="{{__('Importer les liens (Remplacer)')}}">
+                        <form class="importExcel"
+                              data-save-before-submit="{{__("Sauvegarde avant l'import d'un fichier excel")}}"
+                              action="/fluidbook-publication/{{$fbdata['id']}}/edit/links/import/replace" method="post"
+                              enctype="multipart/form-data">
+                            <input type="file"
+                                   accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
+                                   name="file"/>
+                        </form>
+                    </div>
+                    <div data-icon="merge-links"
+                         data-tooltip="{{__('Importer les liens (Ajouter)')}}">
+                        <form class="importExcel"
+                              data-save-before-submit="{{__("Sauvegarde avant l'import d'un fichier excel")}}"
+                              action="/fluidbook-publication/{{$fbdata['id']}}/edit/links/import/merge" method="post"
+                              enctype="multipart/form-data">
+                            <input type="file"
+                                   accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"
+                                   name="file"/>
+                        </form>
+                    </div>
+                    <a href="#" data-icon="import-links-pdf" data-action="links.importFromPDF"
+                       data-tooltip="{{__('Importer les liens du PDF')}}"></a>
+                    <a id="linkeditor-export-latest" download="links_{{$fbdata['id']}}.xlsx"
+                       href="/fluidbook-publication/{{$fbdata['id']}}/edit/links/versions/export/latest"
+                       data-icon="export-links" data-tooltip="Exporter les liens"></a>
+                    <a href="#" data-action="popup.openLinksMove" data-icon="move-links"
+                       data-tooltip="{{__('Déplacer les liens')}}"></a>
+
+                </nav>
+                <nav id="linkeditor-toolbar-center">
+                    <a href="#" data-action="firstPage" data-icon="first-page"
+                       data-tooltip="{{__('Aller à la couverture')}}"></a>
+                    <a href="#" data-action="previousPage" data-icon="previous-page"
+                       data-tooltip="{{__('Aller à la page précédente')}}"></a>
+                    <div data-tooltip="{{__('Aller à une page')}} (Ctrl+G)" data-key="ctrl+g"
+                         data-action="focusPageField" id="linkeditor-page-field">
+                        <input type="number" pattern="[0-9]+" step="0" min="0" max="{{$fbdata['settings']['pages']}}">
+                        / {{$fbdata['settings']['pages']}}</div>
+                    <a href="#" data-action="nextPage" data-icon="next-page"
+                       data-tooltip="{{__('Aller à la page suivante')}}"></a>
+                    <a href="#" data-action="lastPage" data-icon="last-page"
+                       data-tooltip="{{__('Aller à la dernière page')}}"></a>
+                    @if($hasExtra)
+                        <div class="separator"></div>
+                        @if(null!==$t['background'])
+                            <a href="#background" data-action="changePage"
+                               data-action-args="{{json_encode(['background'])}}"
+                               data-icon="landscape"
+                               data-special="background"
+                               data-tooltip="{{__('Editer les liens du fond')}}"></a>
+                        @endif
+                        @if(null!==$t['aftersearch'])
+                            <a href="#aftersearch" data-action="changePage"
+                               data-action-args="{{json_encode(['aftersearch'])}}"
+                               data-icon="search"
+                               data-special="aftersearch"
+                               data-tooltip="{{__('Editer les liens de l\'image supplémentaire du menu')}}"></a>
+                        @endif
+                        @if($fluidbook->tabsHTML5 && stristr($fluidbook->tabsHTML5,'.svg'))
+                            <a href="#tabs" data-action="changePage"
+                               data-action-args="{{json_encode(['tabs'])}}"
+                               data-icon="tabs"
+                               data-special="tabs"
+                               data-tooltip="{{__('Editer les liens des onglets')}}"></a>
+                        @endif
+                    @endif
+                    <div class="separator"></div>
+                    @if($fluidbook->pdfThumbnails)
+                        <a href="#" data-action="togglePDFThumbnails" data-icon="pdf-thumbnails"
+                           data-tooltip="{{__('Afficher les pages du PDF des miniatures')}}"></a>
+                    @endif
+                    <a href="#" data-action="toggleWhiteOverlay" data-icon="white-overlay"
+                       data-tooltip="{{__('Afficher un overlay blanc semi-opaque au dessus des pages')}}"></a>
+                    <a href="#" id="preview-links" class="disabled" data-action="links.preview"
+                       data-icon="preview-links"
+                       data-tooltip="{{__('Voir un aperçu des liens (Ctrl+Y)')}}" data-key="ctrl+y"></a>
+                    <a href="#" id="start-animations" class="" data-action="links.animation" data-icon="start-animation"
+                       data-tooltip="{{__('Lancer les animations')}}"></a>
+                    <a href="#" data-action="openFluidbook" data-icon="open-fluidbook"
+                       data-tooltip="{{__('Ouvrir le fluidbook à la page courante')}}"></a>
+                </nav>
+                <nav id="linkeditor-toolbar-right">
+                    <div class="when-selection-3">
+                        <a href="#" data-action="links.distributeSelection" data-action-args="x"
+                           data-tooltip="{{__('Distribuer la sélection horizontalement')}}"
+                           data-icon="distribute-horizontally"></a>
+                        <a href="#" data-action="links.distributeSelection" data-action-args="y"
+                           data-tooltip="{{__('Distribuer la sélection verticalement')}}"
+                           data-icon="distribute-vertically"></a>
+                        <div class="separator"></div>
+                    </div>
+                    <div class="when-selection-2">
+                        @foreach($alignments as $a=>$label)
+                            <a href="#" data-action="links.alignSelection" data-action-args="{{$a}}"
+                               data-tooltip="{{$label}}"
+                               data-icon="align-{{$a}}"></a>
+                        @endforeach
+                        <div class="separator"></div>
+                        @foreach($dimensions as $d=>$label)
+                            <a href="#" data-action="links.dimensionSelection" data-action-args="{{$d}}"
+                               data-tooltip="{{$label}}"
+                               data-icon="dimensions-{{$d}}"></a>
+                        @endforeach
+                    </div>
+                </nav>
+            </div>
+            <div id="linkeditor-editor">
+                <div draggable="false" id="linkeditor-links"></div>
+                <div draggable="false" id="linkeditor-rulers">
+                    <div id="linkeditor-ruler-corner"></div>
+                    <div class="ruler-bar" id="linkeditor-ruler-x"></div>
+                    <div class="ruler-bar" id="linkeditor-ruler-y"></div>
+                </div>
+                <div draggable="false" id="linkeditor-duplicatelink-overlay"></div>
+                <div draggable="false" id="linkeditor-selectlink-overlay">
+                    <div id="linkeditor-selectlink-rect"></div>
+                </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" class="linkeditor-sidebar" data-side="right">
+            <nav id="linkeditor-right-icons">
+            </nav>
+            <div id="linkeditor-right-panel" class="linkeditor-panel-side"></div>
+            <div class="handle"></div>
+        </aside>
+    </div>
+    <div id="linkeditor-clipboard"></div>
+    <div id="linkeditor-preload"></div>
+    <div id="linkeditor-form-templates">
+        @foreach(\App\SubForms\Link\Base::types() as $f)
+            @if(!isset($f['class']) || (isset($f['disabled']) && $f['disabled']))
+                @continue;
+            @endif
+            @php
+                /** @var \App\SubForms\Link\Base $instance */
+                $instance=new $f['class']();
+                $instance->setFluidbookId($id);
+                $instance->initForm();
+                $instance->setValue('type',$f['type']);
+                echo $instance->render();
+            @endphp
+        @endforeach
+    </div>
+    <form id="linkupload" class="filesorurlupload" action="{{backpack_url('filesorurlupload')}}" method="post"
+          enctype="multipart/form-data">
+        <input type="hidden" name="entity" value="{{ \App\Models\FluidbookPublication::class}}">
+        <input type="hidden" name="entry_id" value="{{ $id }}">
+        <input type="hidden" name="attribute" value="linksAssets">
+    </form>
+@endsection
+
+@push('linkeditor_scripts')
+    <script>
+        var TRANSLATIONS = @json($translations);
+        var FLUIDBOOK_DATA = @json($fbdata);
+        var LINKS = {!! $links !!};
+        var RULERS = {!! $rulers !!};
+        var SETTINGS = @json($settings);
+        var THEME = @json($t);
+        var ASSETS = @json($assets);
+        var CAN_CONTAIN_LINKS = @json($canContainLinks);
+        var DEPTH = @json($depths);
+        var FONT_SIZE = @json([]);
+        var ZOOM = null;
+    </script>
+    <script
+        src="/packages/linkeditor{{$scriptVersion}}/js/linkeditor.js?v={{filemtime(public_path('packages/linkeditor'.$scriptVersion.'/js/linkeditor.js'))}}"></script>
+@endpush
+@push('linkeditor_styles')
+    <script>window._skipAutoTriggers = true;</script>
+    <style>
+        @foreach(\App\SubForms\Link\Base::types() as $type)
+            @if(isset($type['color']))
+            .link[fb-type="{{$type['type']}}"] {
+            color: {{$type['color']}};
+            background-color: {{\Cubist\Util\Graphics\Color::colorToCSS($type['color'],0.25)}};
+        }
+
+        .linkeditor-linktype[data-type="{{$type['type']}}"]::before, label[fb-type="{{$type['type']}}"] input[type="checkbox"]::before {
+            background-color: {{$type['color']}};
+        }
+        @endif
+        @endforeach
+    </style>
+    <link rel="stylesheet"
+          href="/packages/linkeditor{{$scriptVersion}}/css/style.css?v={{filemtime(public_path('packages/linkeditor'.$scriptVersion.'/css/style.css'))}}"/>
+@endpush
-- 
2.39.5