paoda
/
polyglot
mirror of https://github.com/beatriceo/polyglot.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

Merge pull request #50 from beatriceo/fixes-again 

fixed modal (again)
This commit is contained in:
Beatrice Olivera 2018-09-04 11:24:03 +01:00 committed by GitHub
parent 482058e6bc 5650943209
commit a48f955914
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 102 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
app/javascript/packs/application.js
View File

@ -1,4 +1,5 @@
import "bootstrap"; import "bootstrap";
import ActionCable from 'actioncable'
import { triggerModalEvent } from "../components/modal.js"; import { triggerModalEvent } from "../components/modal.js";
@ -36,8 +37,66 @@ if (contactsPage) {
removeActiveClass(contacts); removeActiveClass(contacts);
} }
// const triggerCalleeModalEvent = () => {
// $("#calleeModal").modal('show');
// }
// export { triggerCalleeModalEvent }
const triggerCalleeModalEvent = () => { const triggerCalleeModalEvent = () => {
$("#calleeModal").modal('show'); $("#calleeModal").modal('show');
} }
// export { triggerCalleeModalEvent } // create App object with key cable == new consumer
(function() {
window.App || (window.App = {});
App.cable = ActionCable.createConsumer();
}).call(this);
const userIdElement = document.getElementById("my-user-id")
let userId = null
if (userIdElement) {
userId = parseInt(document.getElementById("my-user-id").dataset["userId"])
}
let chatRoomId = null
App.cable.subscriptions.create({
channel: 'NotificationsChannel'
}, {
connected: () => {
console.log('Connected to NotificationsChannel')
},
received: data => {
console.log("received broadcast")
if (data.head === 302 && data.body["caller"] === userId && data.path) {
window.location.pathname = data.path
} else if (data["message"]["user_id"] === userId) {
// DISPLAY ACCEPT BUTTON
const acceptButton = document.getElementById('accept-button')
acceptButton.style.display = "block"
triggerCalleeModalEvent()
document.getElementById('caller-name').innerHTML = data["message"]["caller_info"]
document.getElementById('caller-photo').src = data["message"]["caller_photo"]
chatRoomId = data["message"]["chat_room_id"]
console.log(`user with id: ${userId} needs to subscribe to chatroom ${[chatRoomId]}`)
} else {
console.log(data)
}
}
})
// Receive information from index.html.erb
const acceptButton = document.getElementById('accept-button')
if (acceptButton) {
acceptButton.addEventListener('click', event => {
document.getElementById('chat-room-id').value = chatRoomId
})
}

81
app/javascript/packs/notifications.js
View File

@ -1,56 +1,55 @@
import ActionCable from 'actioncable' // import ActionCable from 'actioncable'
// import { triggerCalleeModalEvent } from "./application"; // import { triggerCalleeModalEvent } from "./application";
const triggerCalleeModalEvent = () => { // const triggerCalleeModalEvent = () => {
$("#calleeModal").modal('show'); // $("#calleeModal").modal('show');
} // }
// // create App object with key cable == new consumer
// (function() {
// window.App || (window.App = {});
// create App object with key cable == new consumer // App.cable = ActionCable.createConsumer();
(function() {
window.App || (window.App = {});
App.cable = ActionCable.createConsumer(); // }).call(this);
}).call(this);
const userId = parseInt(document.getElementById("my-user-id").dataset["userId"]) // const userId = parseInt(document.getElementById("my-user-id").dataset["userId"])
let chatRoomId = null // let chatRoomId = null
App.cable.subscriptions.create({ // App.cable.subscriptions.create({
channel: 'NotificationsChannel' // channel: 'NotificationsChannel'
}, { // }, {
connected: () => { // connected: () => {
console.log('Connected to NotificationsChannel') // console.log('Connected to NotificationsChannel')
}, // },
received: data => { // received: data => {
console.log("received broadcast") // console.log("received broadcast")
if (data.head === 302 && data.body["caller"] === userId && data.path) { // if (data.head === 302 && data.body["caller"] === userId && data.path) {
window.location.pathname = data.path // window.location.pathname = data.path
} else if (data["message"]["user_id"] === userId) { // } else if (data["message"]["user_id"] === userId) {
// DISPLAY ACCEPT BUTTON // // DISPLAY ACCEPT BUTTON
const acceptButton = document.getElementById('accept-button') // const acceptButton = document.getElementById('accept-button')
acceptButton.style.display = "block" // acceptButton.style.display = "block"
triggerCalleeModalEvent() // triggerCalleeModalEvent()
document.getElementById('caller-name').innerHTML = data["message"]["caller_info"] // document.getElementById('caller-name').innerHTML = data["message"]["caller_info"]
document.getElementById('caller-photo').src = data["message"]["caller_photo"] // document.getElementById('caller-photo').src = data["message"]["caller_photo"]
chatRoomId = data["message"]["chat_room_id"] // chatRoomId = data["message"]["chat_room_id"]
console.log(`user with id: ${userId} needs to subscribe to chatroom ${[chatRoomId]}`) // console.log(`user with id: ${userId} needs to subscribe to chatroom ${[chatRoomId]}`)
} else { // } else {
console.log(data) // console.log(data)
} // }
} // }
}) // })
// Receive information from index.html.erb // // Receive information from index.html.erb
const acceptButton = document.getElementById('accept-button') // const acceptButton = document.getElementById('accept-button')
acceptButton.addEventListener('click', event => { // acceptButton.addEventListener('click', event => {
document.getElementById('chat-room-id').value = chatRoomId // document.getElementById('chat-room-id').value = chatRoomId
}) // })

2
app/views/layouts/application.html.erb
View File

@ -20,7 +20,7 @@
<%= render 'shared/navbar' unless params["action"] == "home" || params["action"] == "new" || params["action"] == "call" %> <%= render 'shared/navbar' unless params["action"] == "home" || params["action"] == "new" || params["action"] == "call" %>
<%= render 'shared/flashes' %> <%= render 'shared/flashes' %>
<%= yield %> <%= yield %>
<%= javascript_include_tag 'application' %>
<%= javascript_pack_tag 'application' %> <%= javascript_pack_tag 'application' %>
<%= javascript_include_tag 'application' %>
</body> </body>
</html> </html>

2
app/views/pages/index.html.erb
View File

@ -73,6 +73,6 @@
</div> </div>
<%= javascript_pack_tag 'local_video' %> <%= javascript_pack_tag 'local_video' %>
<%= javascript_pack_tag 'notifications' %> <%# javascript_pack_tag 'notifications' %>