You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
106 lines
3.1 KiB
106 lines
3.1 KiB
$(document).ready(()=>{
|
|
|
|
const baseUrl = `http://${window.location.hostname}`;
|
|
const canVibrate = "vibrate" in navigator || "mozVibrate" in navigator;
|
|
if (canVibrate && !("vibrate" in navigator)){navigator.vibrate = navigator.mozVibrate;}
|
|
|
|
const content = $('.content');
|
|
|
|
const urlString = window.location.href;
|
|
const url = new URL(urlString);
|
|
const sid = url.searchParams.get("sid");
|
|
|
|
$.getJSON( baseUrl + "/apis/getMessages.php", {
|
|
sid: sid
|
|
}).done( (session)=> {
|
|
console.log(session);
|
|
|
|
if(session.enabled){
|
|
$.each(session.messages, (index,item)=>{
|
|
if(item.timer != session.start){
|
|
const now = Date.now() / 1000;
|
|
const timer = Date.parse(item.timer) / 1000;
|
|
const start = Date.parse(session.start) / 1000;
|
|
|
|
if(now > timer){
|
|
showCloud(item.title, [item.short_text, item.long_text], item.image, item.actions, session.messages);
|
|
} else {
|
|
const delay = (timer - now);
|
|
setTimeout( ()=>{
|
|
showCloud(item.title, [item.short_text, item.long_text], item.image, item.actions, session.messages);
|
|
},1000*delay);
|
|
}
|
|
}
|
|
});
|
|
}
|
|
});
|
|
|
|
|
|
function showCloud(title, text, img, actions, messages){
|
|
|
|
const image = img ? `<img src="${img}"` : '';
|
|
const long_text = text[1] ? `<div class="long-text">
|
|
<button class="toggle button confirm">More...</button>
|
|
<div class="text-content">${text[1]}</div>
|
|
</div>` : '';
|
|
|
|
const cloud = $(`<div class="cloud left">
|
|
<div class="title">${title}</div>
|
|
<div class="short-text">${text[0]}</div>
|
|
${long_text}
|
|
${image}
|
|
</div>`);
|
|
|
|
cloud.find('.toggle').on('click', (e)=>{
|
|
const button = $(e.currentTarget);
|
|
const text = button.siblings('.text-content');
|
|
if(text.is(':visible')){
|
|
button.text('More...');
|
|
text.slideUp();
|
|
}else{
|
|
button.text('Less...');
|
|
text.slideDown();
|
|
}
|
|
});
|
|
content.append(cloud);
|
|
|
|
if(actions.length){
|
|
|
|
const actionsContainer = $('<div class="actions"></div>');
|
|
$.each(actions, (index, value)=>{
|
|
const button = $(`<button class="goto button dotted" data-goto="${value.mid}">${value.label}</button>`);
|
|
|
|
button.on('click', (e)=>{
|
|
const goto = $(e.currentTarget);
|
|
const messageId = goto.data('goto');
|
|
const fullMessage = messages.filter( (m)=> m.id == messageId);
|
|
showCloud(fullMessage[0].title, [fullMessage[0].short_text, fullMessage[0].long_text], fullMessage[0].image, fullMessage[0].actions, messages);
|
|
});
|
|
|
|
actionsContainer.append(button);
|
|
});
|
|
|
|
content.append(actionsContainer);
|
|
}
|
|
|
|
scrollBottom();
|
|
notify(false);
|
|
}
|
|
|
|
function scrollBottom(){
|
|
$('html, body').stop().animate({
|
|
scrollTop: $('.cloud').last().offset().top
|
|
}, 1000);
|
|
}
|
|
|
|
function notify(vibrate){
|
|
if(vibrate){ navigator.vibrate(500); }
|
|
$('#notify1')[0].play();
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|