wip file field

2024-09-28 18:36:18 +03:00
parent 5ed57838fc
commit 39e7a3aed4
25 changed files with 674 additions and 44 deletions
@@ -0,0 +1,25 @@
+<div>
+    <div style="display: flex; align-items: center;gap: 10px" class="color-picker">
+        <input
+                type="color"
+                id="{{$id}}-picker"
+                style="border: none;background: transparent;padding: 0;width:64px;"
+                {{$field->readonly && !$createMode ? "disabled" : ""}}
+                value="{{$value}}"
+        />
+        <input
+                type="text"
+                id="{{$id}}"
+                value="{{$value}}"
+                class="form-control {{!empty($errorMessage) ? "is-invalid" : "" }}"
+                autocomplete="off"
+                {{$field->readonly && !$createMode ? "readonly" : ""}}
+        />
+    </div>
+
+    @if($errorMessage)
+        <div class="invalid-feedback d-block">
+            {{$errorMessage}}
+        </div>
+    @endif
+</div>
@@ -0,0 +1,16 @@
+@php
+$references = $graph->edges
+->filter(fn($edge) =>  $edge->field === $field->name && $edge->source === $record->id)
+->map(fn($edge) =>  $graph->records->firstWhere("id", $edge->target));
+@endphp
+
+@if ($references->isNotEmpty())
+{{--<Sortable sortableClass="mt-3" on:update={reorder}>--}}
+        @foreach($references as $reference)
+        <!--This div helps the sorting thing-->
+        <div>
+                @include("lucent::records-editor.fields.file.preview")
+        </div>
+        @endforeach
+<!--</Sortable>-->
+@endif
@@ -0,0 +1,50 @@
+@php
+    $schema = $channel->schemas->firstWhere("name",$reference->schema);
+@endphp
+
+<div class="preview-file">
+    <div style="display: flex;align-items: center;gap: 10px;">
+        <div class="image">
+            @include("lucent::records-editor.fields.file.thumb", ["size" => "small", "record" => $reference])
+        </div>
+        <div class="title">
+            <div>
+                <a class="record-title" href="{{lucent_url("records")}}/{{$record->id}}">
+                    {{$viewModel->getRecordName($reference)}}
+                </a>
+                <small class="d-block">
+                    from {{$schema->label}}
+                    @if ($record->status === "draft")
+                        @include("lucent::records-editor.status", ["status" => $record->status])
+                    @endif
+                </small>
+            </div>
+        </div>
+    </div>
+{{--    <div style="display: flex;gap:4px; align-items: center;  margin-right: 10px;">--}}
+{{--        {#if hasInsert}--}}
+{{--        <div class="reference-action">--}}
+{{--            <Dropdown>--}}
+{{--                <div slot="button">--}}
+{{--                    <Icon icon="photo-film"/>--}}
+{{--                </div>--}}
+{{--                <button class="dropdown-item button" on:click={e => insert(e,null)}>original</button>--}}
+{{--                {#each imagePresets as preset}--}}
+{{--                <button class="dropdown-item button" on:click={e => insert(e,preset)}>{preset}</button>--}}
+{{--                {/each}--}}
+{{--            </Dropdown>--}}
+
+{{--        </div>--}}
+{{--        {/if}--}}
+{{--        {#if hasDelete}--}}
+{{--        <div class="reference-action">--}}
+{{--            <button--}}
+{{--                    class="button"--}}
+{{--                    on:click={remove}--}}
+{{--            >--}}
+{{--                <Icon icon="trash-can"/>--}}
+{{--            </button>--}}
+{{--        </div>--}}
+{{--        {/if}--}}
+{{--    </div>--}}
+</div>
@@ -0,0 +1,59 @@
+@php
+    $imageSide = 256;
+    $fileSide = 32;
+    $fontSize = "20";
+    $showFilename = $showFilename ?? false;
+
+
+     if ($size === "medium") {
+        $imageSide = 128;
+        $fileSide = 12;
+        $fontSize = "17";
+    } else if ($size === "small") {
+        $imageSide = 64;
+        $fileSide = 12;
+        $fontSize = "15";
+    } else if ($size === "tiny") {
+        $imageSide = 42;
+        $fileSide = 12;
+        $fontSize = "13";
+    }
+@endphp
+
+<div style="display: flex;align-items: center;gap: 5px;">
+
+    @if(str_starts_with($record->_file->mime, "image"))
+        <a
+                href="{{lucent_url("records")}}/{{$record->id}}"
+                title="{{$record->_file->originalName}}"
+                style="width:{{$imageSide}}px;height:{{$imageSide}}px"
+        >
+            <img
+                    class="rounded w-100"
+                    style="border-radius: 12px;padding: 4px;"
+                    src={{lucent_thumbnail($record)}}
+                    alt="{{$record->_file->path}}"
+            />
+        </a>
+    @else
+        <a
+                href="{{lucent_url("records")}}/{{$record->id}}"
+                title="{{$record->_file->path}}"
+                class="file-preview-small"
+                style="width:{{$imageSide}}px;height:{{$imageSide}}px"
+        >
+            <x-lucent::icon icon="file" :width="$fileSide" :height="$fileSide"></x-lucent::icon>
+            <span class="ms-2"
+            >.{{pathinfo($record->_file->path, PATHINFO_EXTENSION)}}</span
+            >
+        </a>
+    @endif
+
+    @if ($showFilename)
+        <a
+                href="{{lucent_url("records")}}/{{$record->id}}"
+                title="{{$record->_file->path}}"
+                class="preview-file-filename lx-small-text text-decoration-none"
+        >{{$record->_file->path}}  </a>
+    @endif
+</div>
@@ -0,0 +1,18 @@
+<div>
+    <input
+            type="text"
+            id="{{$id}}"
+            value="{{$value}}"
+            class="form-control {{!empty($errorMessage) ? "is-invalid" : "" }}"
+            autocomplete="off"
+            {{$field->readonly && !$createMode ? "readonly" : ""}}
+    />
+    <div class="system-help-text light-text">
+        Leave this empty to autogenerate from <i>{{$field->source}}</i>
+    </div>
+    @if($errorMessage)
+        <div class="invalid-feedback d-block">
+            {{$errorMessage}}
+        </div>
+    @endif
+</div>
@@ -0,0 +1,20 @@
+<div style="position: relative;">
+    @if($field->selectOptions)
+        <Autocomplete {field} bind:value={value}></Autocomplete>
+       @else
+        <input
+                type="text"
+                id="{{$id}}"
+                value="{{$value}}"
+                class="form-control {{!empty($errorMessage) ? "is-invalid" : "" }}"
+                autocomplete="off"
+                {{$field->readonly && !$createMode ? "readonly" : ""}}
+        />
+    @endif
+
+    @if($errorMessage)
+        <div class="invalid-feedback d-block">
+            {{$errorMessage}}
+        </div>
+    @endif
+</div>