Merge pull request #603 from AiursoftWeb/share

 feat: allow share img/video/file from an conversation to another conversation.

src/app/Controllers/share.component.ts

@@ -3,12 +3,13 @@ import { Router } from '@angular/router';
 import { Values } from '../values';
 import { MessageService } from '../Services/MessageService';
 import { CacheService } from '../Services/CacheService';
-import Swal from 'sweetalert2';
+import Swal, { SweetAlertResult } from 'sweetalert2';
 import { KahlaUser } from '../Models/KahlaUser';
 import { GroupsResult } from '../Models/GroupsResults';
 import { ConversationApiService } from '../Services/ConversationApiService';
 import { AES } from 'crypto-js';
 import { FriendsApiService } from '../Services/FriendsApiService';
+import { ShareService } from '../Services/ShareService';
 
 @Component({
     templateUrl: '../Views/share.html',
@@ -21,15 +22,29 @@ import { FriendsApiService } from '../Services/FriendsApiService';
 export class ShareComponent implements OnInit {
     public loadingImgURL = Values.loadingImgURL;
     public showUsers = true;
+    public message: string;
+    public inApp = false;
 
     constructor(
         private router: Router,
         private messageService: MessageService,
         public cacheService: CacheService,
         private conversationApiService: ConversationApiService,
-        private friendsApiService: FriendsApiService) {
+        private friendsApiService: FriendsApiService,
+        private shareService: ShareService) {
     }
+
     public ngOnInit(): void {
+        if (this.shareService.share) {
+            this.shareService.share = false;
+            this.message = this.shareService.content;
+            this.inApp = true;
+        } else {
+            const parsedUrl = new URL(location.href);
+            const text = parsedUrl.searchParams.get('text');
+            const url = parsedUrl.searchParams.get('url');
+            this.message = `${text ? text : ''} ${url ? url : ''}`;
+        }
 
     }
 
@@ -50,37 +65,44 @@ export class ShareComponent implements OnInit {
                 });
         }
         const name = group ? (<GroupsResult>user).name : (<KahlaUser>user).nickName;
-        const parsedUrl = new URL(location.href);
-        const text = parsedUrl.searchParams.get('text');
-        const url = parsedUrl.searchParams.get('url');
-        const message = `${text ? text : ''} ${url ? url : ''}`;
-        Swal.fire({
-            title: 'Share message to',
-            text: `Are you sure to send this message to ${name}?`,
-            input: 'textarea',
-            inputValue: message,
-            showCancelButton: true,
-        }).then(input => {
-            if (input.value) {
+        let dialog: Promise<SweetAlertResult>;
+        const isResource = this.message.startsWith('[img]') || this.message.startsWith('[video]') || this.message.startsWith('[file]');
+        if (isResource) {
+            const msgType = this.message.startsWith('[img]') ? 'image' : (this.message.startsWith('[video]') ? 'video' : 'file');
+            dialog = Swal.fire({
+                title: `Share ${msgType}?`,
+                text: `Are you sure to send this ${msgType} to ${name}?`,
+                showCancelButton: true,
+            });
+        } else {
+            dialog = Swal.fire({
+                title: 'Share message to',
+                text: `Are you sure to send this message to ${name}?`,
+                input: 'textarea',
+                inputValue: this.message,
+                showCancelButton: true,
+            });
+        }
+        dialog.then(input => {
+            const msg = isResource ? this.message : input.value;
+            if (!input.dismiss && msg) {
                 if (this.messageService.conversation &&
                     this.messageService.conversation.id === conversationID) {
-                    this.sendMessage(input.value);
+                    this.sendMessage(msg);
                 } else {
                     this.conversationApiService.ConversationDetail(conversationID)
                         .subscribe(result => {
                             this.messageService.conversation = result.value;
-                            this.sendMessage(input.value);
+                            this.sendMessage(msg);
                         });
                 }
             }
         });
     }
 
     private sendMessage(content: string): void {
-        const encryptedMessage = AES.encrypt(content, this.messageService.
-            conversation.aesKey).toString();
+        const encryptedMessage = AES.encrypt(content, this.messageService.conversation.aesKey).toString();
         const messageIDArry = this.messageService.getAtIDs(content);
-        content = messageIDArry[0];
         this.conversationApiService.SendMessage(this.messageService.conversation.id,
             encryptedMessage, messageIDArry.slice(1))
             .subscribe(result => {

src/app/Controllers/talking.component.ts

@@ -1,5 +1,5 @@
 import { Component, ElementRef, HostListener, OnDestroy, OnInit, ViewChild } from '@angular/core';
-import { ActivatedRoute, Params } from '@angular/router';
+import { ActivatedRoute, Params, Router } from '@angular/router';
 import { ConversationApiService } from '../Services/ConversationApiService';
 import { Message } from '../Models/Message';
 import { map, switchMap } from 'rxjs/operators';
@@ -15,6 +15,7 @@ import { KahlaUser } from '../Models/KahlaUser';
 import { ElectronService } from 'ngx-electron';
 import { HomeService } from '../Services/HomeService';
 import { HeaderComponent } from './header.component';
+import { ShareService } from '../Services/ShareService';
 
 declare var MediaRecorder: any;
 
@@ -56,12 +57,14 @@ export class TalkingComponent implements OnInit, OnDestroy {
 
     constructor(
         private route: ActivatedRoute,
+        private router: Router,
         private conversationApiService: ConversationApiService,
         public uploadService: UploadService,
         public messageService: MessageService,
         private timerService: TimerService,
         public _electronService: ElectronService,
         private homeService: HomeService,
+        private shareService: ShareService
     ) {
     }
 
@@ -415,6 +418,13 @@ export class TalkingComponent implements OnInit, OnDestroy {
         this.autoSaveInterval = null;
     }
 
+
+    public shareToOther(message: string): void {
+        this.shareService.share = true;
+        this.shareService.content = message;
+        this.router.navigate(['share-target']);
+    }
+
     public getAtListMaxHeight(): number {
         return window.innerHeight - this.chatInputHeight - 106;
     }

src/app/Models/Message.ts

@@ -7,6 +7,7 @@ export class Message {
     public sender: KahlaUser;
     public sendTime: Date;
     public content: string;
+    public contentRaw: string;
     public isEmoji = false;
     public read: boolean;
     public local = false;

src/app/Services/MessageService.ts

@@ -197,6 +197,7 @@ export class MessageService {
                     } catch (error) {
                         t.content = '';
                     }
+                    t.contentRaw = t.content;
                     t.timeStamp = new Date(t.sendTime).getTime();
                     if (t.content.match(/^\[(video|img)\].*/)) {
                         const fileKey = this.uploadService.getFileKey(t.content);
@@ -212,7 +213,6 @@ export class MessageService {
                                 imageWidth = realMaxWidth;
                                 imageHeight = Math.floor(realMaxWidth * ratio);
                             }
-
                             t.content = `[img]${Values.fileAddress}${t.content.substring(5).split('-')[0]}-${imageWidth}-${imageHeight}`;
                         }
                     } else if (t.content.match(/^\[(file|audio)\].*/)) {

src/app/Services/ShareService.ts

@@ -0,0 +1,9 @@
+import { Injectable } from '@angular/core';
+
+@Injectable({
+    providedIn: 'root'
+})
+export class ShareService {
+    public share: boolean;
+    public content: string;
+}

src/app/Styles/talking.scss

@@ -54,6 +54,10 @@
     width: 70%;
     margin-bottom: 1.5%;
 
+    .share {
+      cursor: pointer;
+    }
+
     span {
       color: #aaa;
     }

src/app/Views/share.html

@@ -1,4 +1,4 @@
-<app-header title="Choose to share" [returnButton]="false"></app-header>
+<app-header title="Choose to share" [returnButton]="inApp"></app-header>
 <div class="search-part">
     <div class="search-type">
         <div (click)="showUsersResults(true)" [ngClass]="{ 'selected': showUsers }">

src/app/Views/talking.html

@@ -2,7 +2,7 @@
 <ul id="messageList" class="message-list" (paste)="paste($event)" (drop)="drop($event)"
     (dragover)="preventDefault($event)" (click)="hideUserList()">
     <button *ngIf="!messageService.loadingMore && !messageService.noMoreMessages" class="load-more" (click)="LoadMore()" i18n="@@ClickToLoadMore">Click to load more</button>
-    <button *ngIf="messageService.loadingMore" class="load-more" i18n="@@Loading">Loading...</button> 
+    <button *ngIf="messageService.loadingMore" class="load-more" i18n="@@Loading">Loading...</button>
     <li *ngFor="let message of messageService.localMessages; trackBy: trackByMessages" [ngClass]="{'left': messageService.me && message.senderId != messageService.me.id, 'right': messageService.me && message.senderId == messageService.me.id}">
         <div class="last-read-bar" *ngIf="message.lastRead">--- LAST READ ---</div>
         <div *ngIf="message.local || message.timeStamp + messageService.conversation.maxLiveSeconds * 1000 > Date.now()">
@@ -73,6 +73,11 @@ <h5>{{message.content.split('-')[1]}}</h5>
                         </a>
                     </div>
                     <p *ngIf="!message.content.startsWith('[img]') && !message.content.startsWith('[file]') && !message.content.startsWith('[video]') && !message.content.startsWith('[audio]')"  [innerHTML]="message.content"></p>
+                    <div
+                        *ngIf="(message.content.startsWith('[img]') || message.content.startsWith('[file]') || message.content.startsWith('[video]')) && message.contentRaw">
+                        <i (click)="shareToOther(message.contentRaw)" class="share fa fa-share-alt"
+                           aria-hidden="true"></i>
+                    </div>
                 </div>
                 <p class="sendTime">
                     <span *ngIf="message.local" i18n="@@Sending">

src/app/app.module.ts

@@ -47,6 +47,7 @@ import { DevicesApiService } from './Services/DevicesApiService';
 import { ThemeService } from './Services/ThemeService';
 import { TimerService } from './Services/TimerService';
 import { HomeService } from './Services/HomeService';
+import { ShareService } from './Services/ShareService';
 
 @NgModule({
     imports: [
@@ -98,7 +99,8 @@ import { HomeService } from './Services/HomeService';
         DevicesApiService,
         ThemeService,
         TimerService,
-        HomeService
+        HomeService,
+        ShareService
     ],
     bootstrap: [AppComponent]
 })