LinkStack/resources/views/studio/links.blade.php

243 lines
12 KiB
PHP
Executable File

@extends('layouts.sidebar')
@section('content')
<?php use App\Models\Button; ?>
@push('sidebar-stylesheets')
<script src="{{ asset('studio/external-dependencies/fontawesome.js') }}" crossorigin="anonymous"></script>
<link rel="stylesheet" href="{{ asset('studio/external-dependencies/fontawesome.css') }}" />
<style>
@media only screen and (max-width: 1500px) {
.pre-side{display:none!important;}
.pre-left{width:100%!important;}
.pre-bottom{display:block!important;}
}
@media only screen and (min-width: 1501px) {
.pre-left{width:70%!important;}
.pre-right{width:30%!important;}
.pre-bottom{display:none!important;}
}
</style>
<style>.delete{position:relative; color:transparent; background-color:tomato; border-radius:5px; left:5px; padding:5px 12px; cursor: pointer;}.delete:hover{color:transparent;background-color:#f13d1d;}html,body{max-width:100%;overflow-x:hidden;}</style>
@endpush
@include('components.favicon')
@include('components.favicon-extension')
<?php function strp($urlStrp){return str_replace(array('http://', 'https://'), '', $urlStrp);} ?>
<div class="row">
<section class='pre-left shadow text-gray-400'>
<h3 class="card-header"><i class="bi bi-link-45deg">My Links</i>
<a class="btn btn-primary float-right" href="{{ url('/studio/add-link') }}">Add new <span class='d-none d-md-inline'>item</span></a>
</h3>
<div class='card-body p-0 p-md-3'>
{{-- <div style="text-align: right;"><a href="{{ url('/studio/links') }}/10">10</a> | <a href="{{ url('/studio/links') }}/20">20</a> | <a href="{{ url('/studio/links') }}/30">30</a> | <a href="{{ url('/studio/links') }}/all">all</a></div> --}}
<div style="overflow-y: none;" class="col col-md-7 ">
<div id="links-table-body" data-page="{{request('page', 1)}}" data-per-page="{{$pagePage ? $pagePage : 0}}">
@foreach($links as $link)
@php $button = Button::find($link->button_id); if(isset($button->name)){$buttonName = $button->name;}else{$buttonName = 0;} @endphp
@if($button->name !== 'icon')
<div class='row h-100 pb-0 mb-2 border rounded hvr-glow ' data-id="{{$link->id}}">
<div class='col-auto p-2 my-auto mr-2' title="{{ $link->link }}">
<span class=" sortable-handle"></span>
</div>
<div class='col border-left h-100'>
<div class='row h-100'>
<div class='col-12 p-2' style="max-width:300px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;" title="{{ $link->title }}">
<span class='h6'>
@if($button->name == "custom_website")
<span style="border: 1px solid #d0d4d7 !important;border-radius:5px;background-color:#6c757d;width:25px!important;height:25px!important;"><img style="margin-bottom:3px;margin-left:4px;margin-right:4px;max-width:15px;max-height:15px;" alt="button-icon" class="icon hvr-icon" src="@if(file_exists(base_path("studio/favicon/icons/").localIcon($link->id))){{url('studio/favicon/icons/'.localIcon($link->id))}}@else{{getFavIcon($link->id)}}@endif"></span>
@elseif($button->name == "space")
<span style="border: 1px solid #d0d4d7 !important;border-radius:5px;background-color:#6c757d;width:25px!important;height:25px!important;"><i style="margin-left:2.83px;margin-right:-1px;color:#fff;" class='bi bi-distribute-vertical'>&nbsp;</i></span>
@elseif($button->name == "heading")
<span style="border: 1px solid #d0d4d7 !important;border-radius:5px;background-color:#6c757d;width:25px!important;height:25px!important;"><i style="margin-left:2.83px;margin-right:-1px;color:#fff;" class='bi bi-card-heading'>&nbsp;</i></span>
@elseif($button->name == "text")
<span style="border: 1px solid #d0d4d7 !important;border-radius:5px;background-color:#6c757d;width:25px!important;height:25px!important;"><i style="margin-left:2.83px;margin-right:-1px;color:#fff;" class='bi bi-fonts'>&nbsp;</i></span>
@elseif($button->name == "buy me a coffee")
<span style="border: 1px solid #d0d4d7 !important;border-radius:5px;background-color:#6c757d;width:25px!important;height:25px!important;"><img style="margin-left:6px!important;margin-right:6px!important;" alt="button-icon" height="15" class="m-1 " src="{{ asset('\/littlelink/icons\/') . "coffee" }}.svg "></span>
@else
<span style="border: 1px solid #d0d4d7 !important;border-radius:5px;background-color:#6c757d;width:25px!important;height:25px!important;"><img style="max-width:15px !important;" alt="button-icon" height="15" class="m-1 " src="{{ asset('\/littlelink/icons\/') . $buttonName }}.svg "></span>
@endif
{{strip_tags($link->title,'')}}</span>
@if(!empty($link->link))
<br /><a title='{{$link->link}}' href="{{ $link->link}}" target="_blank" class="ml-4 text-muted small">{{Str::limit($link->link, 75 )}}</a>
@endif
</div>
<div class='col' class="text-right">
{{Str::limit($link->params['text'] ?? null, 150) }}
@if($link->typename == 'video')
@php
$embed = OEmbed::get($link->link);
if ($embed && $embed->hasThumbnail()) {
echo "<img style='max-height: 150px;' src='".$embed->thumbnailUrl()."' />";
}
@endphp
@endif
</div>
<div class='col-12 py-1 px-3 m-0 bg-blend-darken card-footer mt-2'>
<a href="{{ route('editLink', $link->id ) }}" class="hvr-grow mr-2"><i class='bi bi-pencil'></i> Edit</a>
@if(env('ENABLE_BUTTON_EDITOR') === true)
@if($link->button_id == '1' or $link->button_id == '2')
<a href="{{ route('editCSS', $link->id ) }}" class="mr-2 hvr-grow text-success">Customize</a>
@endif
@endif
@if(!empty($link->link))
<span class='hvr-grow'><i class="bi bi-bar-chart-line"></i> {{ $link->click_number }} Clicks</span>
@endif
<a href="{{ route('deleteLink', $link->id ) }}" title="Delete" onclick="return confirm('Are you sure you want to delete `{{$link->title}}` ?')" class="float-right hvr-grow p-1 text-danger"><i class='bi bi-trash'></i></a>
@if(file_exists(base_path("studio/favicon/icons/").localIcon($link->id)))<a href="{{ route('clearIcon', $link->id ) }}" title="Clear icon cache" class="float-right hvr-grow p-1 text-primary"><i style="-webkit-text-stroke:1px;padding-right:5px;" class="bi bi-arrow-repeat"></i></a>@endif
</div>
</div>
</div>
</div>
@endif
@endforeach
</div>
<script type="text/javascript">
const linksTableOrders = "{{ implode(' | ', $links->pluck('id')->toArray()) }}"
</script>
</div>
<ul class="pagination justify-content-center">
{!! $links ?? ''->links() !!}
</ul>
<a class="btn btn-primary" href="{{ url('/studio/add-link') }}">Add new item</a>
</div>
</section>
<section class='pre-right shadow text-gray-400 pre-side'>
<h3 class="card-header"><i class="bi bi-window-fullscreen" style="font-style:normal!important;"> Preview:</i></h3>
<div class='card-body p-0 p-md-3'>
<center><iframe allowtransparency="true" id="frPreview1" style=" border-radius:0.25rem !important; background: #FFFFFF; min-height:600px; height:100%; max-width:500px !important;" class='w-100' src="{{ url('') }}/@<?= Auth::user()->littlelink_name ?>">Your browser isn't compatible</iframe></center>
</div>
</section>
</div>
<br>
<section style="margin-left:-15px;margin-right:-15px;" style="width:100%!important;" class='pre-bottom shadow text-gray-400 pre-side'>
<h3 class="card-header"><i class="bi bi-window-fullscreen" style="font-style:normal!important;"> Preview:</i></h3>
<div class='card-body p-0 p-md-3'>
<center><iframe allowtransparency="true" id="frPreview2" style=" border-radius:0.25rem !important; background: #FFFFFF; min-height:600px; height:100%; width:100% !important;" class='w-100' src="{{ url('') }}/@<?= Auth::user()->littlelink_name ?>">Your browser isn't compatible</iframe></center>
</div>
</section><br>
<section style="margin-left:-15px;margin-right:-15px;" class='shadow text-gray-400'>
<a name="icons"></a>
<h3 class="mb-4 card-header"><i class="fa-solid fa-icons"></i> Page Icons</i></h3>
<div class="card-body p-0 p-md-3">
<form action="{{ route('editIcons') }}" enctype="multipart/form-data" method="post">
@csrf
<div class="form-group col-lg-8">
@php
function iconLink($icon){
$iconLink = DB::table('links')
->where('user_id', Auth::id())
->where('title', $icon)
->where('button_id', 94)
->value('link');
if (is_null($iconLink)){
return false;
} else {
return $iconLink;}}
function searchIcon($icon)
{$iconId = DB::table('links')
->where('user_id', Auth::id())
->where('title', $icon)
->where('button_id', 94)
->value('id');
if(is_null($iconId)){return false;}else{return $iconId;}}
function icon($name, $label){ echo '
<label>'.$label.'</label>
<div class="input-group">
<div class="input-group-prepend">
<div class="input-group-text"><i class="fa-brands fa-'.$name.'"></i></div>
</div>
<input type="url" class="form-control" name="'.$name.'" value="'.iconLink($name).'" >';
if(searchIcon($name) != NULL){echo '<a href="'. route("deleteLink", searchIcon($name) ) .'" class="delete"><i style="color:#fff" class="bi bi-trash-fill"></i></a>';}
echo '</div><br>';}
@endphp
<style>input{border-top-right-radius: 0.25rem!important; border-bottom-right-radius: 0.25rem!important;}</style>
{!!icon('mastodon', 'Mastodon')!!}
{!!icon('instagram', 'Instagram')!!}
{!!icon('twitter', 'Twitter')!!}
{!!icon('github', 'GitHub')!!}
{!!icon('linkedin', 'LinkedIn')!!}
{!!icon('tiktok', 'TikTok')!!}
{!!icon('discord', 'Discord')!!}
{!!icon('youtube', 'YouTube')!!}
{!!icon('snapchat', 'Snapchat')!!}
{!!icon('reddit', 'reddit')!!}
{!!icon('pinterest', 'Pinterest')!!}
{!!icon('telegram', 'Telegram')!!}
{!!icon('whatsapp', 'WhatsApp')!!}
<button type="submit" class="mt-3 ml-3 btn btn-info">Save links</button>
</form>
</div>
</section>
<script src="{{ asset('studio/external-dependencies/jquery-1.12.4.min.js') }}"></script>
<script type="text/javascript">$("iframe").load(function() { $("iframe").contents().find("a").each(function(index) { $(this).on("click", function(event) { event.preventDefault(); event.stopPropagation(); }); }); });</script>
@endsection