PHP Classes

File: resources/assets/js/app2.js

Recommend this page to a friend!
  Classes of Ahmed Khan   PHP Realtime Chat with Laravel, Vue.js and Pusher   resources/assets/js/app2.js   Download  
File: resources/assets/js/app2.js
Role: Auxiliary data
Content type: text/plain
Description: Auxiliary data
Class: PHP Realtime Chat with Laravel, Vue.js and Pusher
Realtime chat application with an API and channels
Author: By
Last change:
Date: 2 years ago
Size: 2,021 bytes
 

Contents

Class file image Download
/** * First we will load all of this project's JavaScript dependencies which * includes Vue and other libraries. It is a great starting point when * building robust, powerful web applications using Vue and Laravel. */ require('./bootstrap'); /** * Next, we will create a fresh Vue application instance and attach it to * the page. Then, you may begin adding components to this application * or customize the JavaScript scaffolding to fit your unique needs. */ import VueResource from "vue-resource" import Echo from "laravel-echo" import Pusher from "pusher-js" Vue.use(VueResource); window.Echo = new Echo({ broadcaster: 'pusher', key: '' //Add your pusher key here }); const app = new Vue({ el: '#app', data: { countries: [], show : 0, error : 0, chatMessage : null, userId : null, chats : [] }, created(){ window.Echo.channel('chat-message'+window.userid) .listen('ChatMessage', (e) => { this.chats.push(e.user); console.log("pusher"); console.log(this.chats); this.userId = e.user.sourceuserid; this.show = 1; }); }, http: { headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') } }, methods: { sendMessage(){ this.chats.push({"message" : this.chatMessage , "name" : window.username}); console.log("send"); console.log(this.chats); this.$http.post('chat',{ 'userid' : this.userId, 'message' : this.chatMessage }).then(response => { this.chatMessage = ""; }, response => { this.error = 1; console.log("error"); console.log(response); }); }, getUserId(event){ this.userId = event.target.id; this.show = 1; console.log(this.userId); } }});