update view

rdme

cleanup view names, add modal partial

v2.0.1

Author: ctf0

README.md

@@ -183,14 +183,14 @@ npm install vue dropzone keycode vue-tippy vue2-filters vuemit vue-notif --save
 
 > ***Or Use another Framework***
 >
-> - duplicate `views/vendor/MediaManager/media-bulma` and rename it to the framework you want ex.`media-bootstrap`
+> - edit `views/vendor/MediaManager` files.
 > - duplicate `assets/vendor/MediaManager/js/components/media-bulma.vue` and rename it to the framework you want ex.`media-bootstrap.vue`
 > - duplicate `assets/vendor/MediaManager/sass/media-bulma.scss` and rename it to the framework you want ex.`media-bootstrap.scss`
 > - set `MIX_MM_FRAMEWORK` to the framework name ex.`MIX_MM_FRAMEWORK=bootstrap`
 > - start editing the new files.
 
 - add this one liner to your main js file and run `npm run watch` to compile your `js/css` files.
-    + if you are having issues with `npm run production`, [Check](https://ctf0.wordpress.com/2017/09/12/laravel-mix-es6/)
+    + if you are having issues [Check](https://ctf0.wordpress.com/2017/09/12/laravel-mix-es6/)
 
 ```js
 // ex. "resources/assets/js/app.js"

logs/v2.0.0.txt

@@ -0,0 +1,7 @@
+- add `_modal` partial
+- renamed `_partial` to `_manager`
+- renamed `media-bulma` to `media`
+- updated `media` view with the correct html headers
+- renamed `animated` to `mm-animated` to avoid conflict with container page `animated`
+- update wiki
+- update readme

logs/v2.0.1.txt

@@ -30,7 +30,6 @@ public function __construct()
         $this->sanitizedText   = config('mediaManager.sanitized_text');
         $this->unallowed_mimes = config('mediaManager.unallowed_mimes');
         $this->LMF             = config('mediaManager.last_modified_format');
-        $this->fw              = config('mediaManager.framework');
     }
 
     /**
@@ -40,7 +39,7 @@ public function __construct()
      */
     public function index()
     {
-        return view("MediaManager::media-{$this->fw}");
+        return view('MediaManager::media');
     }
 
     /**

src/Controllers/MediaController.php

@@ -1,4 +1,4 @@
-.animated {
+.mm-animated {
     animation-duration: 600ms;
     animation-timing-function: cubic-bezier(1, 0, 0, 1);
     animation-fill-mode: both;

src/resources/assets/sass/shared/animate.scss

@@ -329,9 +329,9 @@ class="button"
                         <template v-if="selectedFile">
                             <div class="detail_img">
                                 <template v-if="selectedFileIs('image')">
-                                    <div class="modal animated fadeIn mm-modal" id="img_modal">
+                                    <div class="modal mm-animated fadeIn mm-modal" id="img_modal">
                                         <div class="modal-background pointer" @click="toggleModal()"></div>
-                                        <div class="modal-content animated fadeInDown">
+                                        <div class="modal-content mm-animated fadeInDown">
                                             <p class="image">
                                                 <img :src="selectedFile.path">
                                             </p>
@@ -406,10 +406,10 @@ class="button"
         {{-- ====================================================================== --}}
 
         {{-- modals --}}
-        <div class="modal animated fadeIn mm-modal" id="new_folder_modal">
+        <div class="modal mm-animated fadeIn mm-modal" id="new_folder_modal">
             {{ Form::open(['route' => 'media.new_folder', '@submit.prevent'=>'NewFolderForm($event)']) }}
                 <div class="modal-background pointer" @click="toggleModal()"></div>
-                <div class="modal-card animated fadeInDown">
+                <div class="modal-card mm-animated fadeInDown">
                     <header class="modal-card-head is-link">
                         <p class="modal-card-title">
                             <span class="icon"><i class="fa fa-folder"></i></span>
@@ -434,10 +434,10 @@ class="button"
             {{ Form::close() }}
         </div>
 
-        <div class="modal animated fadeIn mm-modal" id="rename_file_modal">
+        <div class="modal mm-animated fadeIn mm-modal" id="rename_file_modal">
             {{ Form::open(['route' => 'media.rename_file', '@submit.prevent'=>'RenameFileForm($event)']) }}
                 <div class="modal-background pointer" @click="toggleModal()"></div>
-                <div class="modal-card animated fadeInDown">
+                <div class="modal-card mm-animated fadeInDown">
                     <header class="modal-card-head is-warning">
                         <p class="modal-card-title">
                             <span class="icon"><i class="fa fa-i-cursor"></i></span>
@@ -464,10 +464,10 @@ class="button"
             {{ Form::close() }}
         </div>
 
-        <div class="modal animated fadeIn mm-modal" id="move_file_modal">
+        <div class="modal mm-animated fadeIn mm-modal" id="move_file_modal">
             {{ Form::open(['route' => 'media.move_file', '@submit.prevent'=>'MoveFileForm($event)']) }}
                 <div class="modal-background pointer" @click="toggleModal()"></div>
-                <div class="modal-card animated fadeInDown">
+                <div class="modal-card mm-animated fadeInDown">
                     <header class="modal-card-head is-warning">
                         <p class="modal-card-title">
                             <span class="icon"><i class="fa fa-share"></i></span>
@@ -505,10 +505,10 @@ class="button"
             {{ Form::close() }}
         </div>
 
-        <div class="modal animated fadeIn mm-modal" id="confirm_delete_modal">
+        <div class="modal mm-animated fadeIn mm-modal" id="confirm_delete_modal">
             {{ Form::open(['route' => 'media.delete_file', '@submit.prevent'=>'DeleteFileForm($event)']) }}
                 <div class="modal-background pointer" @click="toggleModal()"></div>
-                <div class="modal-card animated fadeInDown">
+                <div class="modal-card mm-animated fadeInDown">
                     <header class="modal-card-head is-danger">
                         <p class="modal-card-title">
                             <span class="icon"><i class="fa fa-warning"></i></span>

src/resources/views/_partial.blade.php renamed to src/resources/views/_manager.blade.php

@@ -0,0 +1,10 @@
+{{-- manager --}}
+<div class="modal mm-animated fadeIn is-active" v-if="showModal">
+    <div class="modal-background" @click="toggleModal()"></div>
+    <div class="modal-content mm-animated fadeInDown" style="width: 70%;">
+        <div class="box">
+            @include('MediaManager::_manager')
+        </div>
+    </div>
+    <button class="modal-close is-large" @click="toggleModal()"></button>
+</div>

src/resources/views/_modal.blade.php

@@ -1,8 +1,13 @@
 <!DOCTYPE html>
 <html>
 <head>
+    <meta charset="utf-8">
+    <meta http-equiv="x-ua-compatible" content="ie=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="csrf-token" content="{{ csrf_token() }}">
     <title>Media Manager</title>
-    {{-- bulma --}}
+
+    {{-- Styles --}}
     <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/bulma/0.6.0/css/bulma.min.css">
 </head>
 <body>
@@ -17,7 +22,7 @@
             <div class="columns">
                 {{-- media manager --}}
                 <div class="column">
-                    @include('MediaManager::_partial')
+                    @include('MediaManager::_manager')
                 </div>
             </div>
         </div>