no-agenda-producers/podcastartgenerator
no-agenda-producers/podcastartgenerator
Template
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 3 Wiki Activity

fix: adding ability to update artist bg

Browse Source
This commit is contained in:
Paul Couture 2023-12-20 19:45:19 +00:00
parent 87198b46a5
commit a156a44130
13 changed files with 147 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
site/app/Livewire/Artist/Avatar.php
View File

@ -36,6 +36,10 @@ public function save()
Image::load($disk->path($avatar))
->manualCrop($this->width, $this->height, $this->x, $this->y)
->save();
Image::load($disk->path($avatar))
->width(350)
->height(350)
->save();
ImageOptimizer::optimize($disk->path($avatar));
auth()->user()->artists()->first()->update(compact('avatar'));
$this->avatar = null;

48
site/app/Livewire/Artist/Header.php Normal file
View File

@ -0,0 +1,48 @@
<?php
namespace App\Livewire\Artist;
use Livewire\Component;
use Livewire\WithFileUploads;
use Spatie\Image\Image;
use Intervention\Image\Facades\Image as InterventionImage;
use ImageOptimizer;
use Illuminate\Support\Facades\Storage;
use Illuminate\Validation\Rules\File;
use Illuminate\Http\RedirectResponse;
use Livewire\Attributes\Validate;
class Header extends Component
{
use WithFileUploads;
public $header;
public $x;
public $y;
public $width;
public $height;
public function render()
{
return view('livewire.artist.header');
}
public function save()
{
$disk = Storage::disk('static');
$header = $this->header->store('artist_headers', 'static');
Image::load($disk->path($header))
->manualCrop($this->width, $this->height, $this->x, $this->y)
->save();
Image::load($disk->path($header))
->width(270)
->height(185)
->save();
ImageOptimizer::optimize($disk->path($header));
auth()->user()->artists()->first()->update(compact('header'));
$this->header = null;
return redirect(request()->header('Referer'));
}
}

10
site/app/Models/Artist.php
View File

@ -64,9 +64,17 @@ public function wallets()
public function avatar()
{
if (!$this->avatar) {
return config('app.static_asset_url') . '/' . ('avatars/default_avatar_male.svg');
return config('app.static_asset_url') . '/avatars/default_avatar_male.svg';
}
return config('app.static_asset_url') . '/' . $this->avatar;
}
public function header()
{
if (!$this->header) {
return config('app.static_asset_url') . '/artist_headers/default_artist_banner.png';
}
return config('app.static_asset_url') . '/' . $this->header;
}
}

4
site/resources/views/livewire/artist/avatar.blade.php
View File

@ -21,7 +21,7 @@ class="d-flex flex-column justify-content-center"
x-init="setUp"
>
<div class="d-flex justify-content-center text-center mt-4 mb-4">
<img id="avatar" src="{{ $avatar->temporaryUrl() }}" style="width: 100%; max-width: 100%;">
<img id="avatar" src="{{ $avatar->temporaryUrl() }}" style="width: 100%; max-width: 350px; margin:5px auto;">
</div>
<div class="d-flex justify-content-end text-end mt-4 mb-4">
<button type="submit" class="btn btn-gradient btn-small">
@ -32,7 +32,7 @@ class="d-flex flex-column justify-content-center"
@else
<div class="mb-2 mx-2">
<label for="avatar" style="width: 100%;">
<img src="{{ auth()->user()->artists()->first()->avatar() }}" style="width: 100%; max-width: 100%;">
<img src="{{ auth()->user()->artists()->first()->avatar() }}" style="width: 100%; max-width: 350px;">
</label>
</div>
<div class="mb-2 mx-2">

42
site/resources/views/livewire/artist/header.blade.php Normal file
View File

@ -0,0 +1,42 @@
<form wire:submit.prevent="save">
@if($header)
<div
class="d-flex flex-column justify-content-center"
wire:ignore
x-data="{
setUp() {
const cropper = new Cropper(document.getElementById('header'), {
aspectRatio: 1.46,
autoCropArea: 1,
viewMode: 1,
crop (event) {
@this.set('x', event.detail.x)
@this.set('y', event.detail.y)
@this.set('width', event.detail.width)
@this.set('height', event.detail.height)
}
})
}
}"
x-init="setUp"
>
<div class="d-flex justify-content-center text-center mt-4 mb-4">
<img id="header" src="{{ $header->temporaryUrl() }}" style="width: 100%; max-width: 270px; margin:5px auto;">
</div>
<div class="d-flex justify-content-end text-end mt-4 mb-4">
<button type="submit" class="btn btn-gradient btn-small">
<span>Save Profile Header</span>
</button>
</div>
</div>
@else
<div class="mb-2 mx-2">
<label for="header" style="width: 100%;">
<img src="{{ auth()->user()->artists()->first()->header() }}" style="width: 100%; max-width: 270px; margin:5px auto;">
</label>
</div>
<div class="mb-2 mx-2">
<input type="file" name="header" id="header" class="sr-only" wire:model="header">
</div>
@endif
</form>

16
site/resources/views/partials/nav/head.blade.php
View File

@ -77,9 +77,6 @@
</ul>
</li>
@endif
@if (auth()->user())
<livewire:themeswitch />
@else
<li>
<label class="theme-switcher-label d-flex" for="theme-switcher">
<input type="checkbox" class="theme-switcher" id="theme-switcher">
@ -89,7 +86,6 @@
</div>
</label>
</li>
@endif
<li class="setting-option mobile-menu-bar d-block d-xl-none">
<button class="hamburger-button">
<i class="ri-menu-2-fill"></i>
@ -121,7 +117,19 @@
</div>
</div>
<nav>
<ul class="mainmenu">
@include('partials/nav/main')
<li class="has-dropdown has-menu-child-item">
<a {!! request()->is(['podcasts', 'podcasts/*']) ? 'class="active"' : '' !!}>Podcasts</a>
<ul class="submenu">
@foreach ($navPodcasts as $cast)
<li>
<a href="/podcasts/{{ $cast->slug }}">{{ $cast->name }}</a>
</li>
@endforeach
</ul>
</li>
</ul>
</nav>
</div>
</div>

2
site/resources/views/partials/nav/main.blade.php
View File

@ -5,7 +5,7 @@
<a {!! request()->is(['artworks', 'artworks/*']) ? 'class="active"' : '' !!} href="/artworks">Submitted</a>
</li>
<li>
<a {!! request()->is(['artists', 'artists/*']) ? 'class="active"' : '' !!} href="/artists">Artists</a>
<a {!! request()->is(['artists', 'artists/*', 'artist', 'artist/*', 'profile']) ? 'class="active"' : '' !!} href="/artists">Artists</a>
</li>
@if (auth()->user())
<li>

3
site/resources/views/profile/edit.blade.php
View File

@ -27,6 +27,9 @@
<div class="col-xl-4 col-lg-12 mb-4">
@include('profile.partials.update-avatar-form')
</div>
<div class="col-xl-4 col-lg-12 mb-4">
@include('profile.partials.update-header-form')
</div>
</div>
</div>
</section>

2
site/resources/views/profile/partials/single-artist-card.blade.php
View File

@ -1,6 +1,6 @@
<div class="single-author profile flex-stretch">
<div class="thumb">
<img src="{{ Vite::asset($artist->header ?? 'resources/img/artist-dark-banner-default.png') }}" alt="{{ $artist->name }}'s Cover Photo" />
<img src="{{ $artist->header() }}" alt="{{ $artist->name }}'s Cover Photo" />
</div>
<div class="content">
<a href="/artist/{{ $artist->slug }}"><img class="author-thumb avatar_img" src="{{ $artist->avatar() }}"

5
site/resources/views/profile/partials/update-avatar-form.blade.php
View File

@ -1,10 +1,11 @@
<div class="authbox">
<div class="authbox" style="min-height: 100%;">
<div class="row mt-4 gutter-2">
<div class="col">
<div class="signin-content">
<div class="mb-6">
<h2 class="mb-2">{{ __('Update Artist Avatar') }}</h2>
<h3 class="mb-2">{{ __('Update Artist Avatar') }}</h3>
<p class="normal">{{ __('This avatar will be used on the artist gallery and artist profile page.') }}</p>
<p class="small">Be patient, it takes a moment to process.</p>
</div>
</div>
</div>

18
site/resources/views/profile/partials/update-header-form.blade.php Normal file
View File

@ -0,0 +1,18 @@
<div class="authbox" style="min-height: 100%;">
<div class="row mt-4 gutter-2">
<div class="col">
<div class="signin-content">
<div class="mb-6">
<h3 class="mb-2">{{ __('Update Profile Header') }}</h3>
<p class="normal">{{ __('This header is used in the artist listing and artist profile page.') }}</p>
<p class="small">Be patient, it takes a moment to process.</p>
</div>
</div>
</div>
</div>
<div class="row mt-0 gutter-2">
<div class="col">
<livewire:artist.header />
</div>
</div>
</div>

4
site/resources/views/profile/partials/update-password-form.blade.php
View File

@ -1,9 +1,9 @@
<div class="authbox">
<div class="authbox" style="min-height: 100%;">
<div class="row mt-4 gutter-2">
<div class="col">
<div class="signin-content">
<div class="mb-6">
<h2 class="mb-2">{{ __('Update Password') }}</h2>
<h3 class="mb-2">{{ __('Update Password') }}</h3>
<p class="normal">{{ __('Ensure your account is using a long, random password to stay secure.') }}</p>
</div>
</div>

4
site/resources/views/profile/partials/update-profile-information-form.blade.php
View File

@ -1,9 +1,9 @@
<div class="authbox">
<div class="authbox" style="min-height: 100%;">
<div class="row mt-4 gutter-2">
<div class="col">
<div class="signin-content">
<div class="mb-6">
<h2 class="mb-2">{{ __('Update Login') }}</h2>
<h3 class="mb-2">{{ __('Update Login') }}</h3>
<p class="normal">{{ __("Update your account's username and email address. Note, your username may not be the same as your public artist profile.") }}</p>
</div>
</div>