page api rewire, pt 1

start building out the new version of the page editing api while making
some changes to the original scripts for added flexibility and using the
full range of HTTP methods that weren't being used before.

currenlty, it's just an end to end test to make sure the plumbing works
as it should data is being passed and can be processed.

now that it all works, the guts of page editing can be completed

update sortablejs to the latest since it's been awhile and got rid of
the old version

app/Http/Controllers/API/PageAPIController.php

@@ -0,0 +1,30 @@
+<?php
+
+namespace App\Http\Controllers\API;
+
+use App\Http\Controllers\Controller;
+use App\Services\AuthService;
+use Illuminate\Http\Request;
+
+class PageAPIController extends Controller
+{
+    public function __construct(
+        AuthService $authService
+    ) {
+        $this->auth = $authService;
+    }
+
+    public function write(Request $request)
+    {
+        $body = json_decode($request->getContent());
+        //var_dump($body);
+
+        $result = [
+            'message' => 'API IS CONNECTED',
+            'type'    => 'apiTesting',
+            'uuid'    => $body->uuid,
+        ];
+
+        return response()->json($result)->header('Content-Type', 'application/json');
+    }
+}

public/assets/scripts/dash/app/controllers/PageEditor.js

@@ -94,7 +94,7 @@ export default class PostEditor {
 			this.fm = new FileManager(
 				document.querySelector('[role="file-drop"]'),
 				document.getElementById('page-files-upload'),
-				document.querySelector('[role="page-images-list"]'),
+				document.getElementById('page-images-list'),
 				document.querySelector('[role="page-files-list"]')
 			);
 			var optionButtons = document.querySelectorAll('.post-option-btn');
@@ -156,7 +156,10 @@ export default class PostEditor {
 							) {
 								notify.alert(r.message, false);
 							} else {
-								if (r.type === DataEvent.PAGE_UPDATED) {
+								if (
+									r.type === DataEvent.PAGE_UPDATED ||
+									r.type === DataEvent.API_TESTING
+								) {
 									notify.alert(r.message, true);
 								} else {
 									notify.alert(r.message, true);

public/assets/scripts/dash/app/events/DataEvent.js

@@ -1,45 +1,46 @@
-export const AUTH_STATUS = "getAuthStatus";
+export const AUTH_STATUS = 'getAuthStatus';
-export const REQUEST_GOOD = "requestGood";
+export const REQUEST_GOOD = 'requestGood';
-export const REQUEST_LAME = "requestLame";
+export const REQUEST_LAME = 'requestLame';
-export const API_REQUEST_GOOD = "apiUseAuthorized";
+export const API_REQUEST_GOOD = 'apiUseAuthorized';
-export const API_REQUEST_LAME = "apiUseNotAuthorized";
+export const API_REQUEST_LAME = 'apiUseNotAuthorized';
-export const IMG_REQUEST_GOOD = "imgRequestGood";
+export const IMG_REQUEST_GOOD = 'imgRequestGood';
-export const IMG_REQUEST_LAME = "imgRequestLame";
+export const IMG_REQUEST_LAME = 'imgRequestLame';
-export const SETTINGS_LOADED = "settingsLoaded";
+export const SETTINGS_LOADED = 'settingsLoaded';
-export const POST_IMAGE_ADDED = "postImageAdded";
+export const POST_IMAGE_ADDED = 'postImageAdded';
-export const FEATURE_IMAGE_ADDED = "featureImageAdded";
+export const FEATURE_IMAGE_ADDED = 'featureImageAdded';
-export const PAGE_ERROR = "postError";
+export const PAGE_ERROR = 'postError';
-export const PAGE_ADDED = "postAdded";
+export const PAGE_ADDED = 'postAdded';
-export const PAGE_UPDATED = "postUpdated";
+export const PAGE_UPDATED = 'postUpdated';
-export const PAGE_DELETED = "postImageAdded";
+export const PAGE_DELETED = 'postImageAdded';
-export const PAGES_RENDERED = "pagesRendered";
+export const PAGES_RENDERED = 'pagesRendered';
-export const PAGES_NOT_RENDERED = "pagesNotRendered";
+export const PAGES_NOT_RENDERED = 'pagesNotRendered';
-export const TAG_PAGES_RENDERED = "tagPagesRendered";
+export const TAG_PAGES_RENDERED = 'tagPagesRendered';
-export const TAG_PAGES_NOT_RENDERED = "tagPagesNotRendered";
+export const TAG_PAGES_NOT_RENDERED = 'tagPagesNotRendered';
-export const SETTINGS_UPDATED = "settingsUpdated";
+export const SETTINGS_UPDATED = 'settingsUpdated';
-export const SETTINGS_NOT_UPDATED = "settingsNotUpdated";
+export const SETTINGS_NOT_UPDATED = 'settingsNotUpdated';
-export const MENU_ADD_ITEM = "menuAddItem";
+export const MENU_ADD_ITEM = 'menuAddItem';
-export const MENU_DELETE_ITEM = "menuDeleteItem";
+export const MENU_DELETE_ITEM = 'menuDeleteItem';
-export const MENU_UPDATED = "menuUpdated";
+export const MENU_UPDATED = 'menuUpdated';
-export const AVATAR_UPLOADED = "avatarUploaded";
+export const AVATAR_UPLOADED = 'avatarUploaded';
-export const SITE_BACKGROUND_UPLOADED = "siteBackgroundUploaded";
+export const SITE_BACKGROUND_UPLOADED = 'siteBackgroundUploaded';
-export const UPLOAD_PROGRESS = "uploadProgress";
+export const UPLOAD_PROGRESS = 'uploadProgress';
-export const API_PAGE_WRITE = "writingItDown";
+export const API_PAGE_WRITE = 'writingItDown';
-export const API_PAGE_CREATE = "writingNewEntry";
+export const API_PAGE_CREATE = 'writingNewEntry';
-export const API_PAGE_DELETE = "erasingPage";
+export const API_PAGE_DELETE = 'erasingPage';
-export const API_SETTINGS_WRITE = "savingSettings";
+export const API_SETTINGS_WRITE = 'savingSettings';
-export const API_BACKUP_CREATE = "createBackup";
+export const API_BACKUP_CREATE = 'createBackup';
-export const API_BACKUP_DOWNLOAD = "downloadBackup";
+export const API_BACKUP_DOWNLOAD = 'downloadBackup';
-export const API_BACKUP_RESTORE = "downloadBackup";
+export const API_BACKUP_RESTORE = 'downloadBackup';
-export const API_IMAGES_UPLOAD = "uploadProfileImages";
+export const API_IMAGES_UPLOAD = 'uploadProfileImages';
-export const API_RENDER_PAGES = "renderPages";
+export const API_RENDER_PAGES = 'renderPages';
-export const API_REINDEX_PAGES = "reindexPages";
+export const API_REINDEX_PAGES = 'reindexPages';
-export const API_INIT = "blogInit";
+export const API_INIT = 'blogInit';
-export const API_INIT_GOOD = "blogInitGood";
+export const API_INIT_GOOD = 'blogInitGood';
-export const API_INIT_LAME = "blogInitLame";
+export const API_INIT_LAME = 'blogInitLame';
-export const API_GET_SECRET = "retrieveSecret";
+export const API_GET_SECRET = 'retrieveSecret';
-export const API_RESET_PASS = "resetPassword";
+export const API_RESET_PASS = 'resetPassword';
-export const SEND_MAIL = "sendMail";
+export const API_TESTING = 'apiTesting';
+export const SEND_MAIL = 'sendMail';
 class DataEvent {
 	//--------------------------
 	// methods

public/assets/scripts/dash/app/ui/FileManager.js

@@ -1,4 +1,4 @@
-import Sortable from '../vendor/sortable.js';
+import Sortable from '../vendor/sortable.core.esm.js';
 import anime from '../vendor/anime.es.js';
 import DataUtils from '../utils/DataUtils.js';
 import Notfications from './Notifications.js';
@@ -64,13 +64,23 @@ export default class FileManager {
 	getFileOrder() {
 		let imgList = '';
 		let fileList = '';
+		//change file order this and chance data-source to data-id
+		//console.log('ORDER', this.mediaSort.toArray());
 		for (var i = 0, length = this.imageList.childNodes.length; i < length; i++) {
+			try {
 				let div = this.imageList.childNodes[i];
 				imgList = imgList + div.getAttribute('data-source') + ',';
+			} catch (e) {
+				//something is function
+			}
 		}
 		for (var i = 0, length = this.fileList.childNodes.length; i < length; i++) {
+			try {
 				let div = this.fileList.childNodes[i];
 				fileList = fileList + div.getAttribute('data-source') + ',';
+			} catch (e) {
+				//something is function
+			}
 		}
 		let media = { images: imgList, files: fileList };
 		return media;

public/assets/scripts/dash/libraries/FipamoAdminAPI.js

@@ -234,23 +234,26 @@ class FipamoAdminAPI {
    ```
    */
 	pageActions(task, data) {
-		let url, event, content;
+		let url, event, content, type;
 		switch (task) {
 			case TASK_PAGE_CREATE:
 				url = API_NEW_PAGE;
 				event = TASK_PAGE_CREATE;
 				content = CONTENT_TYPE_JSON;
+				type = REQUEST_TYPE_POST;
 				break;
 			case TASK_PAGE_EDIT:
 				url = API_EDIT_PAGE;
 				event = TASK_PAGE_EDIT;
 				content = CONTENT_TYPE_JSON;
+				type = REQUEST_TYPE_PUT;
 				break;
 
 			case TASK_PAGE_DELETE:
 				url = API_DELETE_PAGE;
 				event = TASK_PAGE_DELETE;
 				content = CONTENT_TYPE_JSON;
+				type = REQUEST_TYPE_DELETE;
 				break;
 
 			default:
@@ -268,7 +271,7 @@ class FipamoAdminAPI {
 			this._request(
 				this.baseURL ? this.baseURL + url : url,
 				event,
-				REQUEST_TYPE_POST,
+				type,
 				content,
 				data
 			)

resources/views/back/page.blade.php

@@ -46,11 +46,10 @@
                 <label for="page-files-upload">DRAG AND DROP FILES OR CLICK TO SELECT</label>
             </div>
             <label role="list-title">IMAGES AND VIDEO</label>
-            <div role="page-images-list">
+            <div id="page-images-list" role="page-images-list">
                 @if(count($media)>1)
                     @foreach($media as $item)
                         @if($item['type'] == "mp4")
-
                             <div id="{{ $loop->index }}" class="video-item" data-source="{{ $item['file'] }}">
                                 <video>
                                     <source src="{{ $item['file'] }}"/>

routes/api.php

@@ -2,6 +2,7 @@
 
 use Illuminate\Support\Facades\Route;
 use App\Http\Controllers\API\AuthAPIController;
+use App\Http\Controllers\API\PageAPIController;
 
 /*
 |--------------------------------------------------------------------------
@@ -14,4 +15,6 @@ use App\Http\Controllers\API\AuthAPIController;
 |
 */
 
+//check if session is active
 Route::get("/v1/status", [AuthAPIController::class, 'status']);
+Route::put("/v1/page/write", [PageAPIController::class, 'write']);