# Laravel Media Library Full (ok)

{% file src="https://1957079826-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MCBeDUD-PK_RF-YgJRe%2Fuploads%2FJk35rZFuTD61EmxUbL2w%2Flaravel-medialibrary.rar?alt=media&token=f637aa0b-1a7f-40f4-aa8c-1b06604de7e9" %}

C:\xampp82\htdocs\testcom\database\migrations\2022\_04\_16\_074443\_create\_media\_table.php

```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
<?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
<?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
<?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

```blade
<!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

```blade
<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

```blade
<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

```blade
<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

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

```

<figure><img src="https://1957079826-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MCBeDUD-PK_RF-YgJRe%2Fuploads%2Fo6kvLKqvcCarxRtIGqvw%2FScreenshot_1.png?alt=media&#x26;token=58b21db3-7d2e-45c2-a53e-27344319a700" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1957079826-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MCBeDUD-PK_RF-YgJRe%2Fuploads%2FZO2uG3aNKqBjbIHT9dYZ%2FScreenshot_3.png?alt=media&#x26;token=210fc290-c0f4-4a96-9b58-927e88be8072" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1957079826-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MCBeDUD-PK_RF-YgJRe%2Fuploads%2FZO2uG3aNKqBjbIHT9dYZ%2FScreenshot_3.png?alt=media&#x26;token=210fc290-c0f4-4a96-9b58-927e88be8072" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1957079826-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MCBeDUD-PK_RF-YgJRe%2Fuploads%2FjnFwtc363EoPY8RfyqDm%2FScreenshot_4.png?alt=media&#x26;token=d58900fc-4071-4b33-8bdc-9ec79060cced" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1957079826-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MCBeDUD-PK_RF-YgJRe%2Fuploads%2FssFHXNSxzOPqRG8bjsI5%2FScreenshot_5.png?alt=media&#x26;token=1281b8da-18e4-4278-aff0-a387e758ccfa" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1957079826-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MCBeDUD-PK_RF-YgJRe%2Fuploads%2FWMmMIeZnKyXLEUeOYb9l%2FScreenshot_6.png?alt=media&#x26;token=57e0bfab-da5f-44f9-90fb-5cd978ed5e98" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1957079826-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MCBeDUD-PK_RF-YgJRe%2Fuploads%2FidLwgmW7MB5MP32gpPNU%2FScreenshot_7.png?alt=media&#x26;token=0676811f-8dba-4c73-8ada-611725d0b416" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1957079826-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MCBeDUD-PK_RF-YgJRe%2Fuploads%2FdNIMFUihg6JlEyKstffe%2FScreenshot_8.png?alt=media&#x26;token=c5db3f85-4890-4523-b4d8-4fe65b7f3989" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1957079826-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MCBeDUD-PK_RF-YgJRe%2Fuploads%2FXRmowYLu0MHWSZUE50NS%2FScreenshot_9.png?alt=media&#x26;token=4dbd1bc0-9411-4b3e-9c10-305d89d1bc2b" alt=""><figcaption></figcaption></figure>

<figure><img src="https://1957079826-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MCBeDUD-PK_RF-YgJRe%2Fuploads%2F76KAZ2acRdbxLdUDuK2n%2FScreenshot_10.png?alt=media&#x26;token=08ca3b0d-621a-4918-981b-c5f98cdad9f6" alt=""><figcaption></figcaption></figure>
