Add FileStore User Manual page

app/Providers/ViewServiceProvider.php

@@ -161,5 +161,17 @@ public function boot()
         \Blade::component('manual.components.note', 'note');
         \Blade::component('manual.components.technote', 'technote');
         \Blade::component('manual.components.warning', 'warning');
+
+        \Blade::directive('manualImage', function($expression) {
+            return <<<EOT
+<?php
+    list(\$image, \$alt) = [$expression];
+    echo "<div class='manual-image-container'>";
+    echo "<img src='" . asset('images/manual/' . \$image) . "' alt='" . e(\$alt) . "'>";
+    echo "</div>";
+?>
+EOT;
+
+        });
     }
 }

public/css/manual.css

@@ -11649,6 +11649,24 @@ h1 {
   margin-bottom: 15px;
 }
 
+p {
+  margin-bottom: 12px;
+}
+
+.btn {
+  border-radius: 0;
+}
+
+.btn-warning {
+  background-color: #f6993f;
+  border-color: #f6993f;
+  color: #fff;
+}
+
+.btn-warning:hover {
+  background-color: #f47f0e;
+}
+
 @media (min-width: 768px) {
   .nav-sidebar {
     position: -webkit-sticky;
@@ -11741,3 +11759,13 @@ h1 {
   color: #666;
 }
 
+.manual-image-container {
+  text-align: center;
+  margin-top: 20px;
+  margin-bottom: 20px;
+}
+
+.manual-image-container img {
+  max-width: 100%;
+}
+

public/mix-manifest.json

@@ -1,6 +1,6 @@
 {
     "/js/app.js": "/js/app.js?id=50b8a39f140134f9b4f0",
-    "/css/manual.css": "/css/manual.css?id=8a71c3d80cf386eb6c58",
+    "/css/manual.css": "/css/manual.css?id=d45e06c8ff193bb40e0d",
     "/css/auth.css": "/css/auth.css?id=995d1eaf14a305d0950b",
     "/css/app.css": "/css/app.css?id=c9baf31c864bf0722572",
     "/css/document.css": "/css/document.css?id=91b4c54bab2003f7216c",

resources/sass/manual.scss

@@ -29,10 +29,24 @@ h1 {
 
 }
 
+p {
+    margin-bottom: 12px;
+}
 
 
+.btn {
+    @include border-radius(0);
+}
 
+.btn-warning {
+    background-color: #f6993f;
+    border-color: #f6993f;
+    color: #fff;
 
+    &:hover {
+        background-color: #f47f0e;
+    }
+}
 
 
 
@@ -133,3 +147,17 @@ h1 {
     text-align: right;
     color: $dark-gray;
 }
+
+
+.manual-image-container {
+
+    text-align: center;
+
+    margin-top: 20px;
+    margin-bottom: 20px;
+
+    img {
+        max-width: 100%;
+    }
+
+}

resources/views/manual/en/filestore.md.blade.php

@@ -0,0 +1,68 @@
+# FileStore
+
+FileStore is Office Forge's document and media file hosting and sharing service. This system allows organizations to upload, manage access to, and share files among their staff members. These files are securely stored on your Office Forge server and accessible from any web browser so you'll always have access to your most important information.
+
+### Drives
+
+The FileStore service is organized into Drives. Drives are created and configured by an organization Administrator from the Administrative settings area.
+
+#### Access Controls
+
+When configuring a Drive, Administrators can choose to restrict access to a Drive based on a Staff Member's Team membership. If a Drive has been restricted, a Staff Member must be a member of at least one of the Teams that has been granted access to the Drive or they will have no access to it or the documents and files within that Drive.
+
+See more information about [Access Controls]({{ route('manual', ['access-controls']) }}).
+
+@note
+Administrators are able to access all Drives regardless of their Team memberships.
+@endnote
+
+Access the FileStore option from the main Office Forge navigation menu and you'll be presented with a list of all the Drives you have access to:
+
+@manualImage('fileStore_drives.png', 'List of FileStore Drives within Office Forge')
+
+
+### Documents and Files
+
+Within a Drive, you'll see a listing of all the documents and files that have been stored there.
+
+@manualImage('fileStore_hoverOptions.png', 'Listing of files and folders within a Drive. The cursor is hovering over an entry which shows additional options to preview the file in the browser or download the file to the user\'s device.')
+
+Select a file to view and edit details about the file.
+
+Hovering the mouse cursor over an entry in the listing reveals one or more quick options for each file. Click the <button class="btn btn-primary btn-sm">{!! \App\icon\mediaFileDownload([]) !!}</button> button to download the file directly to your device.
+
+
+For supported files (images, pdfs, etc), you can click the <button class="btn btn-primary btn-sm">{!! \App\icon\mediaFilePreview([]) !!}</button> button to preview the file in your browser.
+
+
+### Uploading Files
+
+Click the <button class="btn btn-primary btn-sm">{!! \App\icon\mediaFileUpload(['mr-2']) !!}Upload File</button> button and you'll be presented with a form to upload new files to FileStore.
+
+@manualImage('fileStore_uploadImage.png', 'Form showing input fields for a file to upload, a name to give to the file, and a description field to gather additional details about the file.')
+
+Select a file to upload (supported files will display a preview of the selected file), change the filename if desired, and optionally provide some additional information about the file. Click the <button class="btn btn-primary btn-sm">Save</button> button to upload the file to FileStore.
+
+@tip
+Most modern browsers allow drag-and-drop of files onto the File form, which can save considerable time compared to navigating through the File selection dialog window.
+@endtip
+
+Once a file has been uploaded, it can immediately be viewed and downloaded by any Staff Member who has access to the Drive.
+
+### Deleting Files
+
+Uploaded files can be deleted from the Edit File screen. You'll be prompted to confirm that you want the file to be deleted. Click <button class="btn btn-warning btn-sm">Confirm</button> to continue with deleting the file, or <button class="btn btn-secondary btn-sm">Cancel</button> to stop the operation.
+
+@manualImage('fileStore_confirmDelete.png', 'A dialog box confirming the Staff member wants to proceed with deleting an uploaded file.')
+
+@warning
+Once a file has been deleted, it's gone for good.
+@endwarning
+
+### Organizing Files with Folders
+
+Within a Drive, uploaded files can be further organized through the use of Folders. Click the <button class="btn btn-primary btn-sm">{!! \App\icon\folderPlus(['mr-2']) !!}Add Folder</button> button to create a new Folder in the current view. Once created, files can then be uploaded into a Folder to help keep your FileStore organized. You can also create any number of child folders within a Drive.
+
+@tip
+A thoughtful FileStore organization scheme can really help your Staff Members, ensuring they can access and use their tools and resources efficiently.
+@endtip

resources/views/manual/manual.blade.php

@@ -117,6 +117,9 @@
                                 <a class="list-group-item list-group-item-action{{ $key == 'access-controls' ? ' active' : '' }}" href="{{ route('manual', ['access-controls']) }}">
                                     Access Controls
                                 </a>
+                                <a class="list-group-item list-group-item-action{{ $key == 'filestore' ? ' active' : '' }}" href="{{ route('manual', ['filestore']) }}">
+                                    FileStore
+                                </a>
                                 {{--<a class="list-group-item list-group-item-action{{ $key == 'dashboard' ? ' active' : '' }}" href="{{ route('manual', ['dashboard']) }}">
                                     Dashboard
                                 </a>