Skip to content

Commit e9d9e87

Browse files
GaneshKanduGaneshKandu
committed
Now files can also be sent while messaging
1 parent 7df0a60 commit e9d9e87

File tree

5 files changed

+157
-4
lines changed

5 files changed

+157
-4
lines changed

‎app/Http/Controllers/KchatController.php

Lines changed: 40 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@
44

55
use Illuminate\Http\Request;
66
use Illuminate\Support\Facades\DB;
7+
use Illuminate\Support\Str;
78

89
class KchatController extends Controller
910
{
@@ -159,4 +160,43 @@ function getConvo(Request $request){
159160
return json_encode($tmp);
160161

161162
}
163+
164+
function attachments(Request $request){
165+
166+
// Checking if user is part of conversation
167+
$tmp = DB::table('participants')->where(['conversation_id' => $request->chat, 'user_id' => Auth()->user()->id])->get()->toArray();
168+
169+
if(!count($tmp)){
170+
return false;
171+
}
172+
173+
$tmp = DB::table('settings')->where(['key' => 'uploadpath'])->get();
174+
175+
$uploadpath = $tmp[0]->value;
176+
177+
$tmp = $request->all();
178+
179+
$json = [];
180+
181+
foreach($tmp['files'] as $file){
182+
$tmp = [];
183+
$tmp['Name'] = $file->getClientOriginalName();
184+
$tmp['uuid'] = Str::uuid()->toString();
185+
$file->move($uploadpath, $tmp['uuid']);
186+
$tmp['MimeType'] = explode('/',$file->getClientMimeType());
187+
$json[] = $tmp;
188+
}
189+
190+
$id = DB::table('messages')->insertGetId([
191+
'user_id' => Auth()->user()->id,
192+
'message' => json_encode($json),
193+
'conversation_id' => $request->chat,
194+
'created_at' => now(),
195+
'type' => 2,
196+
]);
197+
198+
DB::table('conversations')->where('id', $request->chat)->update(['message_id' => $id]);
199+
200+
return true;
201+
}
162202
}

‎public/css/kchat.css

Lines changed: 21 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -507,13 +507,12 @@ img {
507507
border-bottom: 2px solid #fff
508508
}
509509

510-
.chat .chat-history ul {
510+
.chat .chat-history {
511511
padding: 0
512512
}
513513

514514
.chat .chat-history ul li {
515515
list-style: none;
516-
margin-bottom: 30px
517516
}
518517

519518
.chat .chat-history ul li:last-child {
@@ -785,4 +784,24 @@ input {
785784
#whiteboard-model{
786785
width: 800px;
787786
margin: auto;
787+
}
788+
789+
.file {
790+
list-style-type: none;
791+
margin: 0;
792+
padding: 0;
793+
overflow: hidden;
794+
display: flex;
795+
align-items: center;
796+
}
797+
798+
.file-icon {
799+
width: 30px;
800+
height: 30px;
801+
margin-right: 10px;
802+
}
803+
804+
.file-ul {
805+
background-color: #e8f1f3;
806+
padding: 10px;
788807
}

‎public/js/kchat.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,7 @@ $( "[ajax_post]" ).on( "click", function () {
6666
}
6767
}
6868

69-
console.log(Data);
69+
//console.log(Data);
7070

7171
$.ajax({
7272
type: "POST",

‎public/js/kchat.msg.js

Lines changed: 93 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -113,6 +113,23 @@ $(document).ready (function(){
113113
</li>
114114
`);
115115
}
116+
if(element.type == 2){
117+
Conversation = $(`
118+
<li class="bounceInDown" id="conversation${ element.id }" >
119+
<a href="/messages/?chat=${ element.conversation_id }" class="clearfix">
120+
<img src="${ element.photo }" alt="" class="img-circle">
121+
<div class="friend-name">
122+
<strong>${ element.conversation_name }<!--i class="mdi mdi-star favorite"></i--></strong>
123+
</div>
124+
<div class="last-message text-muted"><strong>${ element.first_name } ${ element.last_name } : </strong><i class="fa fa fa-paperclip fa" aria-hidden="true"></i></div>
125+
<small class="time text-muted timestamp"> ${ element.date } </small>
126+
<small class="chat-alert text-muted">
127+
<!-- i class="fa fa-check"></i-->
128+
</small>
129+
</a>
130+
</li>
131+
`);
132+
}
116133

117134
$('#MessageBox').prepend(Conversation);
118135

@@ -153,6 +170,28 @@ $(document).ready (function(){
153170
<div class="float-right show_whiteboard" data-msg="${ element.message }" ><i class="fa fa-pencil-square-o fa-2x" aria-hidden="true"></i></div>
154171
</li>
155172
`);
173+
}
174+
if(element.type == 2){
175+
176+
files = jQuery.parseJSON($("<div/>").html(element.message).text());
177+
178+
element.message = '<ul class="file-ul">';
179+
180+
for(i = 0 ; i < files.length ; i++){
181+
element.message += "<li class=\"file\"><a href=\"/messages/downattch/"+files[i].uuid+"\"><!--img class=\"file-icon\" src=\"file.png\" alt=\"icon\"--><i class=\"fa fa-file fa-2\" aria-hidden=\"true\"></i>&nbsp;&nbsp;"+files[i].Name+"</a></li>";
182+
}
183+
184+
element.message += '<ul>';
185+
186+
messages = $(`
187+
<li class="clearfix" id="msg${ element.id }" >
188+
<div class="message-data text-right">
189+
<span class="message-data-time"><strong>${ element.first_name } ${ element.last_name }</strong>${ element.created_at }</span>
190+
<img src="${ element.photo }" alt="avatar">
191+
</div>
192+
<div class="float-right">${element.message}</div>
193+
</li>
194+
`);
156195
}
157196
}else{
158197
messages = $(`
@@ -175,6 +214,28 @@ $(document).ready (function(){
175214
<div class="float-left show_whiteboard" data-msg="${ element.message }" ><i class="fa fa-pencil-square-o fa-2x" aria-hidden="true"></i></div>
176215
</li>
177216
`);
217+
}
218+
if(element.type == 2){
219+
220+
files = jQuery.parseJSON($("<div/>").html(element.message).text());
221+
222+
element.message = '<ul class="file-ul">';
223+
224+
for(i = 0 ; i < files.length ; i++){
225+
element.message += "<li class=\"file\"><a href=\"/messages/downattch/"+files[i].uuid+"\"><!--img class=\"file-icon\" src=\"file.png\" alt=\"icon\"--><i class=\"fa fa-file fa-2\" aria-hidden=\"true\"></i>&nbsp;&nbsp;"+files[i].Name+"</a></li>";
226+
}
227+
228+
element.message += '<ul>';
229+
230+
messages = $(`
231+
<li class="clearfix" id="msg${ element.id }" >
232+
<div class="message-data text-left">
233+
<span class="message-data-time"><strong>${ element.first_name } ${ element.last_name }</strong>${ element.created_at }</span>
234+
<img src="${ element.photo }" alt="avatar">
235+
</div>
236+
<div class="float-left">${element.message}</div>
237+
</li>
238+
`);
178239
}
179240
}
180241

@@ -344,5 +405,37 @@ $(document).ready (function(){
344405
});
345406

346407
});
408+
409+
$("#selectedFile").change(function(){
410+
411+
let Data = new FormData();
412+
413+
Data.append('_token',$('meta[name="csrf_token"]').attr('content'));
414+
415+
Data.append('chat',$('meta[name="conversation"]').attr('content'));
416+
417+
files = $('#selectedFile')[0].files;
418+
419+
for (let i = 0; i < files.length; i++) {
420+
Data.append('files[]', files[i]);
421+
}
422+
423+
//console.log(Data);
424+
425+
$.ajax({
426+
type: "POST",
427+
url: '/messages/attachments',
428+
data: Data,
429+
processData: false,
430+
contentType: false,
431+
success: function(result){
432+
console.log(result);
433+
},
434+
error: function(result){
435+
436+
}
437+
});
438+
439+
});
347440

348441
});

‎resources/views/common/msg.blade.php

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -84,7 +84,8 @@
8484
<span class="input-group-text"><i class="fa fa-pencil"></i></span>
8585
</div>
8686
<div class="input-group-append mb-1 mr-1" >
87-
<span class="input-group-text"><i class="fa fa-paperclip"></i></span>
87+
<input id="selectedFile" type="file" name="name" multiple="multiple" style="display: none;">
88+
<span class="input-group-text" onclick="document.getElementById('selectedFile').click();" ><i class="fa fa-paperclip"></i></span>
8889
</div>
8990
<textarea id="post_msg" class="form-control" ></textarea>
9091
</div>

0 commit comments

Comments
 (0)