mirror of
https://github.com/esx-framework/esx_core.git
synced 2026-08-31 22:02:27 +00:00
deviljin112
ff62e87e0e
Fixed up other app.js missing delete Contact, moved the phone slightly more to the right of the screen, Added Polish Translation.
513 lines
12 KiB
JavaScript
513 lines
12 KiB
JavaScript
(function(){
|
|
|
|
let ContactTpl =
|
|
'<div class="contact {{online}}">' +
|
|
'<div class="sender-info">' +
|
|
'<div class="center">' +
|
|
'<span class="sender">{{sender}}</span><br/><span class="phone-number">#{{phoneNumber}}</span>' +
|
|
'</div>' +
|
|
'</div>' +
|
|
'<div class="actions">' +
|
|
'<span class="del-contact" data-contact-number="{{phoneNumberData}}" data-contact-name="{{senderData}}">X</span>' +
|
|
'<span class="new-msg newMsg-btn" data-contact-number="{{phoneNumberData}}" data-contact-name="{{senderData}}"></span>' +
|
|
'</div>' +
|
|
'</div>'
|
|
;
|
|
|
|
let MessageTpl =
|
|
'<div class="message">' +
|
|
'<div class="sender-info">' +
|
|
'<div class="center">' +
|
|
'<span class="sender">{{sender}}</span><br/><span class="phone-number">#{{phoneNumber}}</span>' +
|
|
'</div>' +
|
|
'</div>' +
|
|
'<div class="body">{{message}}</div>' +
|
|
'<div class="actions"><span class="new-msg {{anonyme}} reply-btn" data-contact-number="{{phoneNumberData}}" data-contact-name="{{senderData}}"></span><span class="gps {{activeGPS}} gps-btn" data-gpsX="{{gpsLocationX}}" data-gpsY="{{gpsLocationY}}"></span><span class="ok-btn {{showOK}}" data-contact-number="{{okNumberData}}" data-contact-job="{{jobData}}"></span></div>' +
|
|
'</div>'
|
|
;
|
|
|
|
let SpecialContactTpl = '<li class="phone-icon" style="background-image: url(\'{{base64Icon}}\');" data-number="{{number}}" data-name="{{name}}">{{name}}</li>';
|
|
|
|
let contacts = [];
|
|
let specialContacts = [];
|
|
let menu = [];
|
|
let currentItem = 0;
|
|
let currentVal = null;
|
|
let isMessageEditorOpen = false;
|
|
let isMessagesOpen = false;
|
|
let isPhoneShowed = false;
|
|
|
|
let showMain = function() {
|
|
$('.screen').removeClass('active');
|
|
$('.screen *').attr('disabled', 'disabled');
|
|
}
|
|
|
|
let showRepertoire = function() {
|
|
$('#repertoire').addClass('active');
|
|
}
|
|
|
|
let hideRepertoire = function() {
|
|
$('#repertoire').removeClass('active');
|
|
}
|
|
|
|
let showMessages = function(){
|
|
$('#messages').addClass('active');
|
|
isMessagesOpen = true;
|
|
}
|
|
|
|
let hideMessages = function(){
|
|
$('#messages').removeClass('active');
|
|
isMessagesOpen = false;
|
|
}
|
|
|
|
let showAddContact = function() {
|
|
$('#contact').addClass('active');
|
|
$('.screen *').attr('disabled', 'disabled');
|
|
$('.screen.active *').removeAttr('disabled');
|
|
}
|
|
|
|
let hideAddContact = function() {
|
|
$('#contact').removeClass('active');
|
|
$('#contact_name').val('');
|
|
$('#contact_number').val('');
|
|
}
|
|
|
|
let showNewMessage = function(cnum, cname) {
|
|
$('#writer').addClass('active');
|
|
$('#writer_number').val(cnum);
|
|
$('#writer .header-title').html(cname);
|
|
$('.screen *').attr('disabled', 'disabled');
|
|
$('.screen.active *').removeAttr('disabled');
|
|
}
|
|
|
|
let hideNewMessage = function() {
|
|
$('#writer').removeClass('active');
|
|
$('#writer_number').val('');
|
|
$('#writer_message').val('');
|
|
$('#writer .header-title').html('');
|
|
}
|
|
|
|
let showGPS = function(xPos, yPos) {
|
|
$.post('http://esx_phone/setGPS', JSON.stringify({
|
|
x: parseFloat(xPos),
|
|
y: parseFloat(yPos)
|
|
}
|
|
));
|
|
}
|
|
|
|
let renderContacts = function(){
|
|
|
|
let contactHTML = '';
|
|
|
|
if(contacts.length > 0) {
|
|
|
|
for(let i=0; i<contacts.length; i++) {
|
|
|
|
let view = {
|
|
phoneNumber : contacts[i].value,
|
|
sender : contacts[i].label,
|
|
phoneNumberData: contacts[i].value,
|
|
senderData : contacts[i].label,
|
|
online : contacts[i].online ? 'online' : '',
|
|
anonyme : contacts[i].anonyme ? 'online' : ''
|
|
}
|
|
|
|
let html = Mustache.render(ContactTpl, view);
|
|
|
|
contactHTML += html;
|
|
}
|
|
|
|
} else {
|
|
contactHTML = '<div class="contact no-item online"><p class="no-item">Keine Kontakte</p></div>';
|
|
}
|
|
|
|
$('#phone #repertoire .repertoire-list').html(contactHTML);
|
|
|
|
$('.contact .del-contact').click(function() {
|
|
let name = $(this).attr('data-contact-name');
|
|
let phoneNumber = $(this).attr('data-contact-number');
|
|
|
|
$.post('http://esx_phone/remove_contact', JSON.stringify({
|
|
contactName: name,
|
|
phoneNumber: phoneNumber
|
|
}))
|
|
});
|
|
|
|
$('.contact.online .new-msg').click(function() {
|
|
showNewMessage($(this).attr('data-contact-number'), $(this).attr('data-contact-name'));
|
|
});
|
|
|
|
}
|
|
|
|
$('.contact.online .new-msg').click(function() {
|
|
showNewMessage($(this).attr('data-contact-number'));
|
|
});
|
|
|
|
let reloadPhone = function(phoneData){
|
|
|
|
contacts = [];
|
|
|
|
for(let i=0; i<phoneData.contacts.length; i++){
|
|
contacts.push({
|
|
label : phoneData.contacts[i].name,
|
|
value : phoneData.contacts[i].number,
|
|
online: phoneData.contacts[i].online
|
|
})
|
|
}
|
|
|
|
renderContacts();
|
|
|
|
$('#phone-number').text('#' + phoneData.phoneNumber);
|
|
}
|
|
|
|
let showPhone = function(phoneData){
|
|
reloadPhone(phoneData);
|
|
$('#phone').show();
|
|
showMain();
|
|
isPhoneShowed = true;
|
|
}
|
|
|
|
let hidePhone = function(){
|
|
$('#phone').hide();
|
|
isPhoneShowed = false;
|
|
}
|
|
|
|
let messages = [];
|
|
|
|
let addMessage = function(phoneNumber, pmessage, pposition, panonyme, pjob){
|
|
|
|
messages.push({
|
|
value : phoneNumber,
|
|
message : pmessage,
|
|
position: pposition,
|
|
anonyme : panonyme,
|
|
job : pjob
|
|
})
|
|
|
|
let messageHTML = '';
|
|
|
|
if(messages.length > 0) {
|
|
|
|
for(let i=0; i<messages.length; i++) {
|
|
|
|
let fromName = "Unknown";
|
|
let fromNumber = messages[i].value;
|
|
let anonyme = null;
|
|
|
|
if(messages[i].job != "player")
|
|
fromName = messages[i].job;
|
|
|
|
if(messages[i].anonyme) {
|
|
|
|
if(messages[i].job == "player")
|
|
fromName = "Anonymous";
|
|
|
|
fromNumber = "Anonymous";
|
|
anonyme = 'anonyme';
|
|
|
|
} else {
|
|
|
|
for(let j=0; j<contacts.length; j++)
|
|
if(contacts[j].value == messages[i].value)
|
|
if(messages[i].job == "player")
|
|
fromName = contacts[j].label;
|
|
|
|
anonyme = '';
|
|
}
|
|
|
|
let view = {
|
|
anonyme : anonyme,
|
|
phoneNumber : fromNumber,
|
|
sender : fromName,
|
|
message : messages[i].message,
|
|
phoneNumberData: fromNumber,
|
|
senderData : fromName,
|
|
okNumberData : fromNumber,
|
|
gpsLocationX : (messages[i].job == 'player') ? '' : messages[i].position.x,
|
|
gpsLocationY : (messages[i].job == 'player') ? '' : messages[i].position.y,
|
|
activeGPS : (messages[i].job == 'player') ? '' : (messages[i].position) ? 'active' : '',
|
|
jobData : (messages[i].job == 'player') ? '' : messages[i].job,
|
|
showOK : (messages[i].job == 'player') ? '' : 'showOK'
|
|
}
|
|
|
|
let html = Mustache.render(MessageTpl, view);
|
|
|
|
messageHTML = html + messageHTML;
|
|
}
|
|
} else {
|
|
messageHTML = '<div class="message no-item"><p class="no-item">Keine Nachrichten</p></div>';
|
|
}
|
|
|
|
$('#phone #messages .messages-list').html(messageHTML);
|
|
|
|
$('.message .new-msg').click(function() {
|
|
showNewMessage($(this).attr('data-contact-number'), $(this).attr('data-contact-name'));
|
|
});
|
|
|
|
$('.message .gps').click(function() {
|
|
showGPS($(this).attr('data-gpsX'), $(this).attr('data-gpsY'));
|
|
});
|
|
|
|
$('.message .ok-btn').click(function() {
|
|
$.post('http://esx_phone/send', JSON.stringify({
|
|
message: $(this).attr('data-contact-job') + ": Received !",
|
|
number : $(this).attr('data-contact-number'),
|
|
anonyme: false
|
|
}))
|
|
});
|
|
}
|
|
|
|
let scrollMessages = function(direction){
|
|
|
|
let element = $('#messages .container')[0];
|
|
|
|
if(direction == 'UP')
|
|
element.scrollTop -= 100;
|
|
|
|
if(direction == 'DOWN')
|
|
element.scrollTop += 100;
|
|
}
|
|
|
|
let addSpecialContact = function(name, number, base64Icon){
|
|
|
|
let found = false
|
|
|
|
for(let i=0; i<specialContacts.length; i++)
|
|
if(specialContacts[i].number == number)
|
|
found = true;
|
|
|
|
if(!found){
|
|
|
|
specialContacts.push({
|
|
name : name,
|
|
number : number,
|
|
base64Icon: base64Icon
|
|
});
|
|
|
|
specialContacts.sort((a,b) => {
|
|
return a.name.localeCompare(b.name);
|
|
});
|
|
|
|
renderSpecialContacts();
|
|
|
|
}
|
|
|
|
}
|
|
|
|
let removeSpecialContact = function(number){
|
|
|
|
for(let i=0; i<specialContacts.length; i++){
|
|
if(specialContacts[i].number == number){
|
|
specialContacts.splice(i, 1);
|
|
break;
|
|
}
|
|
}
|
|
|
|
renderSpecialContacts();
|
|
|
|
}
|
|
|
|
let renderSpecialContacts = function(){
|
|
|
|
$('.phone-icon').unbind('click');
|
|
|
|
$('#phone .menu .home').html(
|
|
'<li class="phone-icon" id="phone-icon-rep">Kontakte</li>' +
|
|
'<li class="phone-icon" id="phone-icon-msg">Nachrichten</li>'
|
|
);
|
|
|
|
for(let i=0; i<specialContacts.length; i++){
|
|
let elem = $(Mustache.render(SpecialContactTpl, specialContacts[i]));
|
|
$('#phone .menu .home').append(elem);
|
|
}
|
|
|
|
$('.phone-icon').click(function(event) {
|
|
|
|
let id = $(this).attr('id');
|
|
|
|
switch(id) {
|
|
|
|
case 'phone-icon-rep' : {
|
|
showRepertoire();
|
|
break;
|
|
}
|
|
|
|
case 'phone-icon-msg' : {
|
|
showMessages();
|
|
break;
|
|
}
|
|
|
|
default : {
|
|
|
|
let number = $(this).data('number');
|
|
let name = $(this).data('name');
|
|
|
|
showNewMessage(number, name);
|
|
|
|
break;
|
|
}
|
|
}
|
|
|
|
});
|
|
}
|
|
|
|
$('#writer_send').click(function(){
|
|
|
|
let phoneNumber = null
|
|
|
|
if(typeof $('#writer_number').val() == 'number')
|
|
phoneNumber = parseInt($('#writer_number').val());
|
|
else if (typeof $('#writer_number').val() == 'string')
|
|
phoneNumber = $('#writer_number').val();
|
|
|
|
$.post('http://esx_phone/send', JSON.stringify({
|
|
message: $('#writer_message').val(),
|
|
number : phoneNumber,
|
|
anonyme: $('#writer_anonyme').is(':checked')
|
|
}))
|
|
|
|
});
|
|
|
|
$('#contact_send').click(function(){
|
|
|
|
$.post('http://esx_phone/add_contact', JSON.stringify({
|
|
contactName: $('#contact_name').val(),
|
|
phoneNumber: $('#contact_number').val()
|
|
}))
|
|
|
|
});
|
|
|
|
// ACTIONS BTNS
|
|
$('#btn-head-back-msg').click(function() {
|
|
hideNewMessage();
|
|
hideMessages();
|
|
});
|
|
|
|
$('#btn-head-back-rep').click(function() {
|
|
hideRepertoire();
|
|
});
|
|
|
|
$('#btn-head-back-writer, #writer_cancel').click(function() {
|
|
hideNewMessage();
|
|
});
|
|
|
|
$('#btn-head-back-contact, #contact_cancel').click(function() {
|
|
hideAddContact();
|
|
});
|
|
|
|
$('#btn-head-new-message').click(function() {
|
|
showNewMessage('', 'Nouveau message');
|
|
});
|
|
|
|
$('#btn-head-new-contact').click(function() {
|
|
showAddContact();
|
|
});
|
|
|
|
$('.phone-icon').click(function(event) {
|
|
|
|
let id = $(this).attr('id');
|
|
|
|
switch(id) {
|
|
|
|
case 'phone-icon-rep' : {
|
|
showRepertoire();
|
|
break;
|
|
}
|
|
|
|
case 'phone-icon-msg' : {
|
|
showMessages();
|
|
break;
|
|
}
|
|
|
|
default : {
|
|
|
|
let number = $(this).data('number');
|
|
let name = $(this).data('name');
|
|
|
|
showNewMessage(number, name);
|
|
|
|
break;
|
|
}
|
|
}
|
|
|
|
});
|
|
|
|
window.onData = function(data){
|
|
|
|
if(data.scroll === true){
|
|
if(isMessagesOpen)
|
|
scrollMessages(data.direction);
|
|
}
|
|
|
|
if(data.reloadPhone === true){
|
|
reloadPhone(data.phoneData);
|
|
}
|
|
|
|
if(data.showPhone === true){
|
|
showPhone(data.phoneData);
|
|
}
|
|
|
|
if(data.showPhone === false){
|
|
hidePhone();
|
|
}
|
|
|
|
if(data.showMessageEditor === false){
|
|
hideNewMessage();
|
|
}
|
|
|
|
if(data.newMessage === true){
|
|
addMessage(data.phoneNumber, data.message, data.position, data.anonyme, data.job);
|
|
}
|
|
|
|
if(data.contactAdded === true){
|
|
reloadPhone(data.phoneData);
|
|
hideAddContact();
|
|
}
|
|
|
|
if(data.contactRemoved === true){
|
|
reloadPhone(data.phoneData);
|
|
}
|
|
|
|
if(data.addSpecialContact === true){
|
|
addSpecialContact(data.name, data.number, data.base64Icon);
|
|
}
|
|
|
|
if(data.removeSpecialContact === true){
|
|
removeSpecialContact(data.number);
|
|
}
|
|
|
|
if(data.move && isPhoneShowed){
|
|
|
|
if(data.move == 'UP'){
|
|
scroll('UP');
|
|
}
|
|
|
|
if(data.move == 'DOWN'){
|
|
scroll('DOWN');
|
|
}
|
|
}
|
|
|
|
if(data.enterPressed){
|
|
|
|
if(isPhoneShowed) {
|
|
|
|
$.post('http://esx_phone/select', JSON.stringify({
|
|
val : currentVal
|
|
}));
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
window.onload = function(e){ window.addEventListener('message', function(event){ onData(event.data) }); }
|
|
|
|
document.onkeydown = function (data) {
|
|
if ((data.which == 120 || data.which == 27) && isPhoneShowed) { // || data.which == 8
|
|
$.post('http://esx_phone/escape');
|
|
}
|
|
};
|
|
|
|
})();
|