Laravel Media Library Full (ok)

277KB

laravel-medialibrary.rar

C:\xampp82\htdocs\testcom\database\migrations\2022_04_16_074443_create_media_table.php

<?php
use Illuminate\Support\Facades\Schema;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Database\Migrations\Migration;
class CreateMediaTable extends Migration
{
  public function up()
  {
    Schema::create('media', function (Blueprint $table) {
      $table->bigIncrements('id');
      $table->morphs('model');
      $table->uuid('uuid')->nullable()->unique();
      $table->string('collection_name');
      $table->string('name');
      $table->string('file_name');
      $table->string('mime_type')->nullable();
      $table->string('disk');
      $table->string('conversions_disk')->nullable();
      $table->unsignedBigInteger('size');
      $table->json('manipulations');
      $table->json('custom_properties');
      $table->json('generated_conversions');
      $table->json('responsive_images');
      $table->unsignedInteger('order_column')->nullable()->index();
      $table->nullableTimestamps();
    });
  }
  public function down()
  {
    Schema::dropIfExists('media');
  }
}

C:\xampp82\htdocs\testcom\database\migrations\2022_04_16_074828_create_posts_table.php

<?php
use Illuminate\Database\Migrations\Migration;
use Illuminate\Database\Schema\Blueprint;
use Illuminate\Support\Facades\Schema;
return new class extends Migration
{
  /**
   * Run the migrations.
   *
   * @return void
   */
  public function up()
  {
    Schema::create('posts', function (Blueprint $table) {
      $table->id();
      $table->string('title');
      $table->text('body');
      $table->timestamps();
    });
  }
  /**
   * Reverse the migrations.
   *
   * @return void
   */
  public function down()
  {
    Schema::dropIfExists('posts');
  }
};

C:\xampp82\htdocs\testcom\app\Models\Post.php

<?php
namespace App\Models;
use Illuminate\Database\Eloquent\Factories\HasFactory;
use Illuminate\Database\Eloquent\Model;
use Spatie\MediaLibrary\HasMedia;
use Spatie\MediaLibrary\InteractsWithMedia;
use Spatie\MediaLibrary\MediaCollections\Models\Media;
class Post extends Model implements HasMedia
{
  use HasFactory, InteractsWithMedia;
  protected $guarded = [];
  public function registerMediaColections()
  {
    $this->addMediaCollection('images')
      ->singleFile();
    $this->addMediaCollection('downloads')
      ->singleFile();
  }
  public function registerMediaConversions(Media $media = null): void
  {
    $this->addMediaConversion('thumb')
      ->width(368)
      ->height(232)
      ->sharpen(10);
  }
}

C:\xampp82\htdocs\testcom\app\Http\Controllers\PostController.php

<?php
namespace App\Http\Controllers;
use App\Http\Requests\PostCreateRequest;
use App\Models\Post;
use Illuminate\Http\Request;
use Spatie\MediaLibrary\MediaCollections\Models\Media;
use Spatie\MediaLibrary\Support\MediaStream;
class PostController extends Controller
{
  public function index()
  {
    $posts = Post::all();
    return view('posts.index', compact('posts'));
  }
  public function create()
  {
    return view('posts.create');
  }
  public function store(PostCreateRequest $request)
  {
    $post = Post::create($request->validated());
    if ($request->hasFile('image')) {
      $post->addMediaFromRequest('image')->withResponsiveImages()->toMediaCollection('images');
    }
    if ($request->hasFile('download')) {
      $post->addMediaFromRequest('download')->withResponsiveImages()->toMediaCollection('downloads');
    }
    return to_route('posts.index');
  }
  public function edit(Post $post)
  {
    return view('posts.edit', compact('post'));
  }
  public function show(Post $post) {
    return view('posts.show', compact('post'));
  }
  public function update(PostCreateRequest $request, Post $post)
  {
    $post->update($request->validated());
    if ($request->hasFile('image')) {
      $post->addMediaFromRequest('image')->withResponsiveImages()->toMediaCollection('images');
    }
    if ($request->hasFile('download')) {
      $post->addMediaFromRequest('download')->withResponsiveImages()->toMediaCollection('downloads');
    }
    return to_route('posts.index');
  }
  public function destroy($id)
  {
    $post = Post::findOrFail($id);
    $post->delete();
    return to_route('posts.index');
  }
  public function download($id)
  {
    $post = Post::findOrFail($id);
    $media = $post->getFirstMedia('downloads');
    return $media;
  }
  public function downloads()
  {
    // $media = Media::where('collection_name', 'downloads')->get();
    return MediaStream::create('downloads.zip')->addMedia(Media::all());
  }
  public function resImage($id)
  {
    $post = Post::findOrFail($id);
    return view('posts.show', compact('post'));
  }
}

C:\xampp82\htdocs\testcom\resources\views\components\main.blade.php

<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Laravel</title>
  <!-- Fonts -->
  <link href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap" rel="stylesheet">
  <script src="https://cdn.tailwindcss.com"></script>
</head>
<body class="antialiased">
  {{ $slot }}
</body>
</html>

C:\xampp82\htdocs\testcom\resources\views\posts\create.blade.php

<x-main>
  <div class="max-w-6xl mx-auto mt-12">
    <div class="space-y-8 divide-y divide-gray-200 w-1/2 mt-10">
      <form method="POST" action="{{ route('posts.store') }}" enctype="multipart/form-data">
        @csrf
        <div class="sm:col-span-6">
          <label for="title" class="block text-sm font-medium text-gray-700"> Post Title </label>
          <div class="mt-1">
            <input type="text" id="title" name="title"
              class="block w-full transition duration-150 ease-in-out appearance-none bg-white border border-gray-400 rounded-md py-2 px-3 text-base leading-normal transition duration-150 ease-in-out sm:text-sm sm:leading-5" />
          </div>
        </div>
        <div class="sm:col-span-6">
          <label for="title" class="block text-sm font-medium text-gray-700"> Post Image </label>
          <div class="mt-1">
            <input type="file" id="image" name="image"
              class="block w-full transition duration-150 ease-in-out appearance-none bg-white border border-gray-400 rounded-md py-2 px-3 text-base leading-normal transition duration-150 ease-in-out sm:text-sm sm:leading-5" />
          </div>
        </div>
        <div class="sm:col-span-6">
          <label for="title" class="block text-sm font-medium text-gray-700"> Post Image Download </label>
          <div class="mt-1">
            <input type="file" id="image" name="download"
              class="block w-full transition duration-150 ease-in-out appearance-none bg-white border border-gray-400 rounded-md py-2 px-3 text-base leading-normal transition duration-150 ease-in-out sm:text-sm sm:leading-5" />
          </div>
        </div>
        <div class="sm:col-span-6 pt-5">
          <label for="body" class="block text-sm font-medium text-gray-700">Body</label>
          <div class="mt-1">
            <textarea id="body" rows="3" name="body"
              class="shadow-sm focus:ring-indigo-500 appearance-none bg-white border border-gray-400 rounded-md py-2 px-3 text-base leading-normal transition duration-150 ease-in-out focus:border-indigo-500 block w-full sm:text-sm border-gray-300 rounded-md"></textarea>
          </div>
        </div>
        <div class="sm:col-span-6 pt-5">
          <button type="submit" class="px-4 py-2 rounded bg-indigo-500 hover:bg-indigo-700">Create</button>
        </div>
      </form>
    </div>
  </div>
</x-main>

C:\xampp82\htdocs\testcom\resources\views\posts\edit.blade.php

<x-main>
  <div class="max-w-6xl mx-auto mt-12">
    <div class="space-y-8 divide-y divide-gray-200 w-1/2 mt-10">
      <form method="POST" action="{{ route('posts.update', $post->id) }}" enctype="multipart/form-data">
        @csrf
        @method('PUT')
        <div class="sm:col-span-6">
          <label for="title" class="block text-sm font-medium text-gray-700"> Post Title </label>
          <div class="mt-1">
            <input type="text" id="title" name="title" value="{{ $post->title }}" class="block w-full transition duration-150 ease-in-out appearance-none bg-white border border-gray-400 rounded-md py-2 px-3 text-base leading-normal transition duration-150 ease-in-out sm:text-sm sm:leading-5" />
          </div>
        </div>
        <div class="sm:col-span-6">
          <label for="title" class="block text-sm font-medium text-gray-700"> Post Image </label>
          <div class="mt-1">
            <input type="file" id="image" name="image" class="block w-full transition duration-150 ease-in-out appearance-none bg-white border border-gray-400 rounded-md py-2 px-3 text-base leading-normal transition duration-150 ease-in-out sm:text-sm sm:leading-5" />
          </div>
        </div>
        <div class="sm:col-span-6">
          <label for="title" class="block text-sm font-medium text-gray-700"> Post Image Download </label>
          <div class="mt-1">
            <input type="file" id="image" name="download" class="block w-full transition duration-150 ease-in-out appearance-none bg-white border border-gray-400 rounded-md py-2 px-3 text-base leading-normal transition duration-150 ease-in-out sm:text-sm sm:leading-5" />
          </div>
        </div>
        <div class="sm:col-span-6 pt-5">
          <label for="body" class="block text-sm font-medium text-gray-700">Body</label>
          <div class="mt-1">
            <textarea id="body" rows="3" name="body" class="shadow-sm focus:ring-indigo-500 appearance-none bg-white border border-gray-400 rounded-md py-2 px-3 text-base leading-normal transition duration-150 ease-in-out focus:border-indigo-500 block w-full sm:text-sm border-gray-300 rounded-md">
              {{ $post->body }}
            </textarea>
          </div>
        </div>
        <div class="sm:col-span-6 pt-5">
          <button type="submit" class="px-4 py-2 rounded bg-indigo-500 hover:bg-indigo-700">Create</button>
        </div>
      </form>
    </div>
  </div>
</x-main>

C:\xampp82\htdocs\testcom\resources\views\posts\index.blade.php

<x-main>
  <div class="max-w-6xl mx-auto mt-8">
    <a href="{{ route('posts.create') }}" class="px-4 py-2 text-white bg-indigo-500 rounded">Create</a>
    <div class="-my-2 overflow-x-auto sm:-mx-6 lg:-mx-8">
      <div class="py-2 align-middle inline-block min-w-full sm:px-6 lg:px-8">
        <div class="shadow overflow-hidden border-b border-gray-200 sm:rounded-lg">
          <table class="min-w-full divide-y divide-gray-200">
            <thead class="bg-gray-50 dark:bg-gray-600 dark:text-gray-200">
              <tr>
                <th scope="col"class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-200 uppercase tracking-wider">Id</th>
                <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-200 uppercase tracking-wider">Title</th>
                <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-200 uppercase tracking-wider">Image</th>
                <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-200 uppercase tracking-wider">Download</th>
                <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-200 uppercase tracking-wider">Actions</th>
              </tr>
            </thead>
            <tbody class="bg-white divide-y divide-gray-200">
              @foreach ($posts as $post)
              <tr>
                <td class="px-6 py-4 whitespace-nowrap">{{ $post->id }}</td>
                <td class="px-6 py-4 whitespace-nowrap">{{ $post->title }}</td>
                <td class="px-6 py-4 whitespace-nowrap">
                  <img class="w-8 h-8 rounded-full" src="{{ $post->getFirstMedia('images')->getUrl('thumb') }}" />
                </td>
                <td class="px-6 py-4 whitespace-nowrap">
                  <img class="w-8 h-8 rounded-full" src="{{ $post->getFirstMedia('downloads')->getUrl('thumb') }}" />
                </td>
                <td class="px-6 py-4 text-right text-sm">
                  <div class="flex space-x-2">
                    <a href="{{ route('posts.edit', $post->id) }}" class="px-4 py-2 bg-indigo-500 hover:bg-indigo-700 rounded-lg text-white">Edit</a>
                    <a href="{{ route('posts.show', $post->id) }}" class="px-4 py-2 bg-indigo-500 hover:bg-indigo-700 rounded-lg text-white">Show</a>
                    <form class="px-4 py-2 bg-red-500 hover:bg-red-700 rounded-lg text-white" method="POST" action="{{ route('posts.destroy', $post->id) }}" onsubmit="return confirm('Are you sure?');">
                      @csrf
                      @method('DELETE')
                      <button type="submit">Delete</button>
                    </form>
                  </div>
                </td>
              </tr>
              @endforeach-
              <!-- More items... -->
            </tbody>
          </table>
        </div>
      </div>
    </div>
  </div>
</x-main>

C:\xampp82\htdocs\testcom\resources\views\posts\show.blade.php

<x-main>
  <div class="max-w-6xl mx-auto mt-12">
    <h1>{{ $post->title }}</h1>
    {{ $post->getFirstMedia('downloads') }}
  </div>
</x-main>