fipamo/resources/views/back/page.blade.php
ro a53723f7c8
changed role attritubet to class in page editor ui
the role attribute is being used incorrectly through out the site, which
is bad for screen reader, so they need to be removed and replaced with
the class attribute

the page editor was the biggest culprit, so that one has been converted
first
2024-03-25 12:53:31 -06:00

196 lines
8.3 KiB
PHP

@extends('frame')
@section('title', 'The Dash | Editing '. $title)
@php
if($mode == 'edit')
{
$id = $page['id'];
$uuid = $page['uuid'];
$slug = $page['slug'];
$feature = $page['feature'];
$layout = $page['layout'];
$tags = $page['tags'];
$content = $page['content'];
$date = $page['created'];
$updated = $page['updated'];
$media = $page['media'];
$files = $page['docs'];
}else{
$id = "";
$uuid = "";
$slug = "";
$feature = "";
$layout = "";
$tags = "";
$content = "";
$date = "";
$updated = "";
$media = "";
$files = "";
}
@endphp
@section('main-content')
<section data-index="{{ $id }}" data-uuid="{{ $uuid }}" data-slug="{{ $slug }}" data-layout="{{ $layout }}" class="file-manager">
@if($feature == '')
<div class="file-drop">
<label for="page-files-upload">DRAG AND DROP FILES OR CLICK TO SELECT</label>
</div>
<label class="list-title">IMAGES AND VIDEO</label>
<div id="page-images-list" class="page-images-list"></div>
<label class="list-title">FILES</label>
<div class="page-files-list"></div>
@else
<div class="file-drop">
<label for="page-files-upload">DRAG AND DROP FILES OR CLICK TO SELECT</label>
</div>
<label class="list-title">IMAGES AND VIDEO</label>
<div id="page-images-list" class="page-images-list">
@if(count($media)>1)
@foreach($media as $item)
@if($item['type'] == "mp4")
<div id="{{ $loop->index }}" class="video-item" data-id="{{ $item['file'] }}">
<video>
<source src="{{ $item['file'] }}"/>
</video>
<button id="{{ $loop->index }}" class="media-remove">
X
</button>
</div>
@else
<div id="{{ $loop->index }}" class="img-item" data-id="{{ $item['file'] }}" style="background: url({{ $item['file'] }}) no-repeat center center / cover">
<button id="{{ $loop->index }}" class="media-remove">
X
</button>
</div>
@endif
@endforeach
@else
@if($media[0] != '')
@if($media[0]['type'] == "mp4")
<div id="0" class="video-item" data-id="{{ $media[0]['file'] }}">
<button id="0" class="media-remove">X</button>
</div>
@else
<div id="0" class="img-item" data-id="{{ $media[0]['file'] }}" style="background: url({{ $media[0]['file'] }}) no-repeat center center / cover">
<button id="0" class="media-remove">X</button>
</div>
@endif
@endif
@endif
</div>
<label class="list-title">FILES</label>
<div class="page-files-list">
@if(count($files) > 1)
@foreach($files as $item)
@php
$fileName = explode("/", $item['file']);
@endphp
@if($item['type'] == "mp3")
<div id="{{ $loop->index }}" class="audio-item" data-id="{{ $item['file'] }}">
<audio controls>
<source src="{{ $item['file'] }}"/>
</audio>
<button id="{{ $loop->index }}" class="media-remove">
X
</button>
</div>
@else
<div id="{{ $loop->index }}" class="file-item" data-id="{{ $item['file'] }}">
<a href="{{ $item['file'] }}" target="_blank">{{ $fileName[6] }}"</a>
<button id="{{ $loop->index }}" class="media-remove">
X
</button>
</div>
@endif
@endforeach
@else
@if(isset($files[0]) && $files[0] != '')
@php
$fileName = explode("/", $item['file']);
@endphp
@if($files[0]['type'] == "mp3")
<div id="0" class="audio-item" data-id="{{ $files[0]['file'] }}">
<audio controls>
<source src="{{ $files[0]['file'] }}"/>
</audio>
<button id="{{ $loop->index }}" class="media-remove">
X
</button>
</div>
@else
<div id="0" class="file-item" data-id="{{ $files[0]['file'] }}">
<a href="{{ $item['file'] }}" target="_blank">{{ $fileName[6] }}"</a>
<button id="{{ $loop->index }}" class="media-remove">
X
</button>
</div>
@endif
@else
@endif
@endif
</div>
@endif
</section><section class="page-meta">
<div class="page-meta-wrapper">
<div class="page-title">
<strong>TITLE</strong>
<textarea id="post-title-text" type="text" name="post-title-text" class="post-edit" placeholder="TITLE">{{ $title }}</textarea>
</div>
<div class="page-tags">
<strong>TAGS</strong>
<textarea id="post-tags" type="text" name="post-tags" class="form-control" placeholder="tags [comma seperated]">{{ $tags }}</textarea>
</div>
<div class="page-layouts">
<strong>LAYOUTS</strong>
<select id="page-templates">
@foreach($views as $view)
@if($view == $layout)
<option value={{ $view }} selected>{{ $view }}</option>
@else
<option value={{ $view }}>{{ $view }}</option>
@endif
@endforeach
</select>
</div>
<div class="page-options">
<strong>OPTIONS</strong>
@spaceless
@include('includes.options')
@endspaceless
</div>
<div class="page-updated">
<strong>UPDATED</strong>
<span id="post-date" type="text">
{{ $updated }}
</span>
</div>
<div class="page-created">
<strong>CREATED</strong>
<span id="post-date" type="text">
{{ $date }}
</span>
<input id="page-files-upload" type="file" name="page-files-upload" multiple/>
<input id="post-image-upload" type="file" name="post-image-upload"/>
<input id="form_token" name="token" type="hidden" value="needtoaddtoken"></div>
</div>
</div>
</section>
<section class="text-editor">
@spaceless
@include('includes.editor')
@endspaceless
<div class="edit-post-wrapper">
<textarea id="edit" spellcheck="false" class="language-md">{{ $content }}</textarea>
<pre id="highlight"><code id="highlight-content" class="language-md"></code></pre>
</div>
</section>
@endsection
@section('scripting')
<script type="module" src="/assets/scripts/dash/app/EditPage.js"></script>
@endsection