add new work done

src/apis/auth.php

@@ -10,14 +10,14 @@ $data = json_decode(file_get_contents("php://input"));
 if(isset($_GET['act']) && $_GET['act'] == 'login') {
   if($data->usr == 'admin' && $data->pwd == 'JohnHolmes') {
     $content->status = 200;
-    $content->authToken = base64_encode(date("Y-m-d"));
+    $content->authToken = base64_encode('admin:JohnHolmes'.date("Y-m-d"));
   } else {
     $content->status = 403;
   }
 } else if(isset($_GET['act']) && $_GET['act'] == 'check') {
-  if($data->token == base64_encode(date("Y-m-d"))) {
+  if($data->token == base64_encode('admin:JohnHolmes'.date("Y-m-d"))) {
     $content->status = 200;
-    $content->authToken = base64_encode(date("Y-m-d"));
+    $content->authToken = base64_encode('admin:JohnHolmes'.date("Y-m-d"));
   } else {
     $content->status = 403;
   }

src/apis/remove.php

@@ -0,0 +1,16 @@
+<?php
+@include 'conn.conn';
+$GLOBALS['conn'];
+$conn=@mysqli_connect($DATAhst,$DATAusr,$DATApwd,$DATAdtb)or die("CONNECTION ERROR");
+
+$content = null;
+$content->imageUrl = 'http://unsplash.it/800/600';
+
+header("Access-Control-Allow-Origin: *");
+header("Content-Type: application/json; charset=UTF-8");
+header("Access-Control-Allow-Methods: GET");
+header("Access-Control-Max-Age: 3600");
+
+echo json_encode($content);
+
+?>

src/app/admin/admin.component.html

@@ -29,12 +29,12 @@
     <div class="col p-5">
       <div class="edit-container" *ngIf="activeEditor == 'works-add'">
         <span class="title">Add work</span>
-        <form class="form row">
-          <div class="col-6">
+        <form class="form row" (submit)="saveWork()">
+          <div class="col-8">
             <span class="label">Title</span>
             <input type="text" class="input-text" name="title" [(ngModel)]="title">
           </div>
-          <div class="col-6">
+          <div class="col-4">
             <span class="label">Type</span>
             <select class="input-select" name="type" [(ngModel)]="type">
               <option value="entertainment">Entertainment</option>
@@ -47,6 +47,10 @@
             <span class="label">Content</span>
             <angular-editor [placeholder]="'Enter text here...'" [config]="editorConfig" name="content" [(ngModel)]="content"></angular-editor>
           </div>
+          <div class="col-12">
+            <span class="label">Tags</span>
+            <input type="text" class="input-text" name="tags" [(ngModel)]="tags">
+          </div>
           <div class="col-12">
             <span class="label">Gallery</span>
             <div class="gallery-container">
@@ -56,20 +60,12 @@
               </label>
 
               <div class="image-box" [ngClass]="{'main': image.main}" *ngFor="let image of selectedGallery">
-                <img class="image" [src]="image.url">
+                <img class="image" [src]="basePath+image.url">
                 <button class="remove" (click)="galleryRemove(image.url)"><span class="icon-trash-2"></span></button>
                 <button class="set-main" (click)="gallerySetMain(image.url)" *ngIf="!image.main"><span class="icon-check"></span></button>
               </div>
             </div>
           </div>
-          <div class="col-6">
-            <span class="label">Tags</span>
-            <input type="text" class="input-text" name="tags" [(ngModel)]="tags">
-          </div>
-          <div class="col-6">
-            <span class="label">Main image</span>
-            <input type="file" class="input-file" name="mainImage" [(ngModel)]="mainImage">
-          </div>
           <div class="col-6">
             <span class="label">Exhibitions</span>
             <select class="input-select" name="exhibitions">
@@ -97,7 +93,7 @@
               <input type="text" class="input-text" name="videoURL" [(ngModel)]="videoURL">
             </div>
             <div class="w-10 d-inline-block">
-              <button class="button button-transparent icon-plus-square px-0 w-100" (click)="videoAdd()"></button>
+              <span class="button button-transparent icon-plus-square px-0 w-100" (click)="videoAdd()"></span>
             </div>
 
             <span class="label font-12 pt-2">Selected Videos</span>
@@ -105,8 +101,12 @@
               {{sv.type}} | {{sv.url}}
             </span>
           </div>
+          <div class="col-12 pt-5">
+            <button class="button w-100" type="submit">Save</button>
+          </div>
         </form>
       </div>
     </div>
   </div>
 </div>
+

src/app/admin/admin.component.ts

@@ -13,6 +13,7 @@ import { editorConfig } from '../../config/config'
 export class AdminComponent implements OnInit {
 
   private restApi = `${environment.API_URL}`
+  public basePath = `${environment.BASE_PATH}`
 
   public authCheck: boolean = false
   public userName: string = ''
@@ -29,7 +30,7 @@ export class AdminComponent implements OnInit {
   public type: string = ''
   public content: string = ''
   public tags: string = ''
-  public mainImage: any = null
+  public mainImage: string = ''
   public videoType: string = ''
   public videoURL: string = ''
 
@@ -42,18 +43,6 @@ export class AdminComponent implements OnInit {
 
   ngOnInit(): void {
 
-    this.selectedGallery = [
-      {
-        main: true,
-        title: '',
-        url: 'http://unsplash.it/800/600'
-      },
-      {
-        title: '',
-        url: 'http://unsplash.it/800/700'
-      }
-    ]
-
     const body = { token: window.sessionStorage.getItem('authToken') }
     this.authService.authCheck(body).toPromise().then((response) => {
       this.authCheck = response.status == 200
@@ -119,6 +108,8 @@ export class AdminComponent implements OnInit {
   onFileChanged(e) {
     const file = (<HTMLInputElement>e.target).files[0]
     const uploadData = new FormData()
+    uploadData.append('token', window.sessionStorage.getItem('authToken'))
+    uploadData.append('path', 'assets')
     uploadData.append('file', file, file.name)
     this.apisService.uploadImage(uploadData).toPromise().then((response) => {
       this.selectedGallery.push({
@@ -143,7 +134,11 @@ export class AdminComponent implements OnInit {
   }
 
   galleryRemove(url): void {
-    this.apisService.removeImage(url).toPromise().then((response) => {
+    const body = {
+      token: window.sessionStorage.getItem('authToken'),
+      url: url
+    }
+    this.apisService.removeImage(body).toPromise().then((response) => {
       this.selectedGallery = this.selectedGallery.filter(item => item.url != url)
     },(error) => {
       console.error(error)
@@ -151,4 +146,55 @@ export class AdminComponent implements OnInit {
       console.error(e)
     })
   }
+
+  saveWork(): void {
+
+    let error = false
+    let errorMessages = []
+    const mainImage = this.selectedGallery.filter(item => item.main)
+
+    if(!this.title){
+      error = true
+      errorMessages.push('No title')
+    }
+    if(!this.type){
+      error = true
+      errorMessages.push('No type selected')
+    }
+    if(this.selectedGallery.length == 0 || mainImage.length == 0){
+      error = true
+      errorMessages.push('No main image selected')
+    }
+
+    if(error) {
+      console.log('ERORS:',errorMessages)
+    } else {
+      const body = {
+        token: window.sessionStorage.getItem('authToken'),
+        title: this.title,
+        content: this.content,
+        type: this.type,
+        tags: this.tags,
+        image: mainImage[0].url,
+        exhibitions: this.selectedExhibitions.map(a => a.id).join(','),
+        gallery: JSON.stringify(this.selectedGallery),
+        videos: JSON.stringify(this.selectedVideos)
+      }
+
+      this.apisService.saveWork(body).toPromise().then((response) => {
+        console.log(response)
+        this.title = ''
+        this.content = ''
+        this.type = ''
+        this.tags = ''
+        this.selectedExhibitions = []
+        this.selectedGallery = []
+        this.selectedVideos = []
+      },(error) => {
+        console.error(error)
+      }).catch((e) => {
+        console.error(e)
+      })
+    }
+  }
 }

src/app/services/apis.service.ts

@@ -38,9 +38,16 @@ export class ApisService extends BaseService {
     )
   }
 
-  removeImage(url): Observable<any> {
-    let urlApi = `${this.restApi}remove.php?url=${url}`
-    return this.http.get<any>(urlApi).pipe(
+  removeImage(body): Observable<any> {
+    let urlApi = `${this.restApi}remove.php`
+    return this.http.post<any>(urlApi, JSON.stringify(body)).pipe(
+      catchError(this.handleError)
+    )
+  }
+
+  saveWork(body): Observable<any> {
+    let urlApi = `${this.restApi}work.php?act=save`
+    return this.http.post<any>(urlApi, JSON.stringify(body)).pipe(
       catchError(this.handleError)
     )
   }

src/assets/scss/forms.scss

@@ -57,6 +57,7 @@ select {
   appearance: none;
   color: $white;
   border: none;
+  border-radius: 4px;
   background: $black;
   display: inline-block;
   padding: 10px 20px 10px 20px !important;

src/assets/scss/global.scss

@@ -28,6 +28,10 @@ button {
   .w-#{$size} {width: percentage($size/100) !important;}
 }
 
+.text-right {text-align: right !important;}
+.text-center {text-align: center !important;}
+.text-left {text-align: left !important;}
+
 .particles {
   position: fixed;
   top: 0;

src/environments/environment.prod.ts

@@ -1,4 +1,5 @@
 export const environment = {
   production: true,
-  API_URL: `https://apis.dslak.it/`
+  API_URL: `https://apis.dslak.it/`,
+  BASE_PATH: `https://apis.dslak.it/`
 }

src/environments/environment.ts

@@ -1,4 +1,5 @@
 export const environment = {
   production: false,
-  API_URL: `http://dslakng.local/apis/`
+  API_URL: `http://dslakng.local/apis/`,
+  BASE_PATH: `http://dslakng.local`
 }