mirror of
https://github.com/webbukkit/dynmap.git
synced 2024-11-24 11:15:21 +01:00
Separated chatbox to a separate component (into different files).
This commit is contained in:
parent
9a09cace54
commit
7464e5b809
@ -84,6 +84,9 @@ web:
|
||||
- type: chat
|
||||
- type: chatballoon
|
||||
focuschatballoons: false
|
||||
- type: chatbox
|
||||
showplayerfaces: true
|
||||
messagettl: 5
|
||||
|
||||
defaultworld: world
|
||||
worlds:
|
||||
|
@ -17,6 +17,7 @@
|
||||
|
||||
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
|
||||
<script type="text/javascript" src="js/jquery.json.js"></script>
|
||||
<script type="text/javascript" src="js/jquery.mousewheel.js"></script>
|
||||
<script type="text/javascript" src="//maps.google.com/maps/api/js?sensor=false"></script>
|
||||
<script type="text/javascript" src="js/custommarker.js"></script>
|
||||
<script type="text/javascript" src="js/minecraft.js"></script>
|
||||
@ -26,7 +27,8 @@
|
||||
<script type="text/javascript" src="js/clock.timeofday.js"></script>
|
||||
<script type="text/javascript" src="js/clock.digital.js"></script>
|
||||
<script type="text/javascript" src="js/chat.js"></script>
|
||||
<script type="text/javascript" src="js/jquery.mousewheel.js"></script>
|
||||
<script type="text/javascript" src="js/chatballoon.js"></script>
|
||||
<script type="text/javascript" src="js/chatbox.js"></script>
|
||||
<script type="text/javascript" src="config.js"></script>
|
||||
|
||||
<script type="text/javascript">
|
||||
|
@ -5,26 +5,12 @@ $.ajax({
|
||||
dataType: "jsonp",
|
||||
success: function(getip) { ip = getip.ip; }
|
||||
});
|
||||
function sendChat(me, message) {
|
||||
var data = '{"name":"'+ip+'","message":"'+message+'"}';
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: 'up/sendmessage',
|
||||
data: data,
|
||||
dataType: 'json',
|
||||
success: function(response) {
|
||||
//handle response
|
||||
if(response)
|
||||
me.onPlayerChat('', response);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// Provides 'chat'-events by looking at the world-updates.
|
||||
componentconstructors['chat'] = function(dynmap, configuration) {
|
||||
return {
|
||||
dynmap: dynmap,
|
||||
initialize: function() {
|
||||
// Provides 'chat'-events by monitoring the world-updates.
|
||||
$(dynmap).bind('worldupdate', function(event, update) {
|
||||
swtch(update.type, {
|
||||
chat: function() {
|
||||
@ -35,61 +21,25 @@ componentconstructors['chat'] = function(dynmap, configuration) {
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
if (dynmap.options.allowwebchat) {
|
||||
// Accepts 'sendchat'-events to send chat messages to the server.
|
||||
$(dynmap).bind('sendchat', function(event, message) {
|
||||
var data = '{"name":"'+ip+'","message":"'+message+'"}';
|
||||
$.ajax({
|
||||
type: 'POST',
|
||||
url: 'up/sendmessage',
|
||||
data: data,
|
||||
dataType: 'json',
|
||||
success: function(response) {
|
||||
//handle response
|
||||
if(response) {
|
||||
$(dynmap).trigger('chat', [{source: 'me', name: ip, text: message}]);
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
};
|
||||
|
||||
// TODO: Maybe split this to another file.
|
||||
componentconstructors['chatballoon'] = function(dynmap, configuration) {
|
||||
return {
|
||||
dynmap: dynmap,
|
||||
options: configuration,
|
||||
chatpopups: {},
|
||||
initialize: function() {
|
||||
var me = this;
|
||||
$(dynmap).bind('chat', function(event, message) {
|
||||
if (message.source != 'player') {
|
||||
return;
|
||||
}
|
||||
var player = dynmap.players[message.name];
|
||||
var playerMarker = player && player.marker;
|
||||
if (!playerMarker) {
|
||||
return;
|
||||
}
|
||||
var popup = me.chatpopups[message.name];
|
||||
if (!popup) {
|
||||
popup = { lines: [ message.text ] };
|
||||
} else {
|
||||
popup.lines[popup.lines.length] = message.text;
|
||||
}
|
||||
|
||||
var MAX_LINES = 5;
|
||||
if (popup.lines.length > MAX_LINES) {
|
||||
popup.lines = popup.lines.slice(1);
|
||||
}
|
||||
var htmlMessage = '<div id="content"><b>' + message.name + "</b><br/><br/>";
|
||||
var line;
|
||||
for (line in popup.lines) {
|
||||
htmlMessage = htmlMessage + popup.lines[line] + "<br/>";
|
||||
}
|
||||
htmlMessage = htmlMessage + "</div>";
|
||||
if (!popup.infoWindow) {
|
||||
popup.infoWindow = new google.maps.InfoWindow({
|
||||
disableAutoPan: !(me.options.focuschatballoons || false),
|
||||
content: htmlMessage
|
||||
});
|
||||
} else {
|
||||
popup.infoWindow.setContent(htmlMessage);
|
||||
}
|
||||
popup.infoWindow.open(dynmap.map, playerMarker);
|
||||
me.chatpopups[message.name] = popup;
|
||||
if (popup.timeout) { window.clearTimeout(popup.timeout); }
|
||||
popup.timeout = window.setTimeout(function() {
|
||||
popup.infoWindow.close();
|
||||
popup.infoWindow = null;
|
||||
delete me.chatpopups[message.name];
|
||||
}, 8000);
|
||||
});
|
||||
}
|
||||
};
|
||||
};
|
53
web/js/chatballoon.js
Normal file
53
web/js/chatballoon.js
Normal file
@ -0,0 +1,53 @@
|
||||
componentconstructors['chatballoon'] = function(dynmap, configuration) {
|
||||
return {
|
||||
dynmap: dynmap,
|
||||
options: configuration,
|
||||
chatpopups: {},
|
||||
initialize: function() {
|
||||
var me = this;
|
||||
$(dynmap).bind('chat', function(event, message) {
|
||||
if (message.source != 'player') {
|
||||
return;
|
||||
}
|
||||
var player = dynmap.players[message.name];
|
||||
var playerMarker = player && player.marker;
|
||||
if (!playerMarker) {
|
||||
return;
|
||||
}
|
||||
var popup = me.chatpopups[message.name];
|
||||
if (!popup) {
|
||||
popup = { lines: [ message.text ] };
|
||||
} else {
|
||||
popup.lines[popup.lines.length] = message.text;
|
||||
}
|
||||
|
||||
var MAX_LINES = 5;
|
||||
if (popup.lines.length > MAX_LINES) {
|
||||
popup.lines = popup.lines.slice(1);
|
||||
}
|
||||
var htmlMessage = '<div id="content"><b>' + message.name + "</b><br/><br/>";
|
||||
var line;
|
||||
for (line in popup.lines) {
|
||||
htmlMessage = htmlMessage + popup.lines[line] + "<br/>";
|
||||
}
|
||||
htmlMessage = htmlMessage + "</div>";
|
||||
if (!popup.infoWindow) {
|
||||
popup.infoWindow = new google.maps.InfoWindow({
|
||||
disableAutoPan: !(me.options.focuschatballoons || false),
|
||||
content: htmlMessage
|
||||
});
|
||||
} else {
|
||||
popup.infoWindow.setContent(htmlMessage);
|
||||
}
|
||||
popup.infoWindow.open(dynmap.map, playerMarker);
|
||||
me.chatpopups[message.name] = popup;
|
||||
if (popup.timeout) { window.clearTimeout(popup.timeout); }
|
||||
popup.timeout = window.setTimeout(function() {
|
||||
popup.infoWindow.close();
|
||||
popup.infoWindow = null;
|
||||
delete me.chatpopups[message.name];
|
||||
}, 8000);
|
||||
});
|
||||
}
|
||||
};
|
||||
};
|
74
web/js/chatbox.js
Normal file
74
web/js/chatbox.js
Normal file
@ -0,0 +1,74 @@
|
||||
componentconstructors['chatbox'] = function(dynmap, configuration) {
|
||||
return {
|
||||
dynmap: dynmap,
|
||||
initialize: function() {
|
||||
var chat = $('<div/>')
|
||||
.addClass('chat')
|
||||
.appendTo(dynmap.options.container);
|
||||
var messagelist = $('<div/>')
|
||||
.addClass('messagelist')
|
||||
.appendTo(chat);
|
||||
|
||||
if (dynmap.options.allowwebchat) {
|
||||
var chatinput = $('<input/>')
|
||||
.addClass('chatinput')
|
||||
.attr({
|
||||
id: 'chatinput',
|
||||
type: 'text',
|
||||
value: ''
|
||||
})
|
||||
.keydown(function(event) {
|
||||
if (event.keyCode == '13') {
|
||||
event.preventDefault();
|
||||
if(chatinput.val() != '') {
|
||||
$(dynmap).trigger('sendchat', [chatinput.val()]);
|
||||
chatinput.val('');
|
||||
}
|
||||
}
|
||||
})
|
||||
.appendTo(chat);
|
||||
}
|
||||
|
||||
$(dynmap).bind('chat', function(event, message) {
|
||||
var playerName = message.name;
|
||||
var messageRow = $('<div/>')
|
||||
.addClass('messagerow');
|
||||
|
||||
var playerIconContainer = $('<span/>')
|
||||
.addClass('messageicon');
|
||||
|
||||
if (message.source === 'player' && configuration.showplayerfaces) {
|
||||
getMinecraftHead(playerName, 16, function(head) {
|
||||
messageRow.icon = $(head)
|
||||
.addClass('playerIcon')
|
||||
.appendTo(playerIconContainer);
|
||||
});
|
||||
}
|
||||
|
||||
if (message.source === 'player' && configuration.showworld) {
|
||||
var playerWorldContainer = $('<span/>')
|
||||
.addClass('messagetext')
|
||||
.text('['+dynmap.players[message.name].location.world.name+']')
|
||||
.appendTo(messageRow);
|
||||
}
|
||||
|
||||
var playerNameContainer = $('<span/>')
|
||||
.addClass('messagetext')
|
||||
.text(' '+message.name+': ');
|
||||
|
||||
var playerMessageContainer = $('<span/>')
|
||||
.addClass('messagetext')
|
||||
.text(message.text);
|
||||
|
||||
messageRow.append(playerIconContainer,playerNameContainer,playerMessageContainer);
|
||||
//messageRow.append(playerIconContainer,playerWorldContainer,playerGroupContainer,playerNameContainer,playerMessageContainer);
|
||||
setTimeout(function() { messageRow.remove(); }, (configuration.messagettl * 1000));
|
||||
messagelist.append(messageRow);
|
||||
|
||||
messagelist.show();
|
||||
//var scrollHeight = jQuery(me.messagelist).attr('scrollHeight');
|
||||
messagelist.scrollTop(messagelist.scrollHeight());
|
||||
});
|
||||
}
|
||||
};
|
||||
};
|
@ -78,7 +78,6 @@ DynMap.prototype = {
|
||||
worlds: {},
|
||||
registeredTiles: [],
|
||||
players: {},
|
||||
chatPopups: [],
|
||||
lasttimestamp: '0',
|
||||
followingPlayer: '',
|
||||
configure: function(configuration) {
|
||||
@ -260,36 +259,6 @@ DynMap.prototype = {
|
||||
.addClass('compass')
|
||||
.appendTo(container);
|
||||
|
||||
// The chat
|
||||
if (me.options.showchatwindow) {
|
||||
var chat = me.chat = $('<div/>')
|
||||
.addClass('chat')
|
||||
.appendTo(container);
|
||||
var messagelist = me.messagelist = $('<div/>')
|
||||
.addClass('messagelist')
|
||||
.appendTo(chat);
|
||||
if (me.options.allowwebchat) {
|
||||
var chatinput = me.chatinput = $('<input/>')
|
||||
.addClass('chatinput')
|
||||
.attr({
|
||||
id: 'chatinput',
|
||||
type: 'text',
|
||||
value: ''
|
||||
})
|
||||
.keydown(function(event) {
|
||||
if (event.keyCode == '13') {
|
||||
event.preventDefault();
|
||||
if(chatinput.val() != '')
|
||||
{
|
||||
sendChat(me, chatinput.val());
|
||||
chatinput.val('');
|
||||
}
|
||||
}
|
||||
})
|
||||
.appendTo(chat);
|
||||
}
|
||||
}
|
||||
|
||||
// TODO: Enable hash-links.
|
||||
/*
|
||||
var link;
|
||||
@ -405,15 +374,7 @@ DynMap.prototype = {
|
||||
swtch(update.type, {
|
||||
tile: function() {
|
||||
me.onTileUpdated(update.name);
|
||||
},
|
||||
chat: function() {
|
||||
me.onPlayerChat(update.playerName, update.message);
|
||||
},
|
||||
webchat: function() {
|
||||
me.onPlayerChat('[WEB]' + update.playerName, update.message);
|
||||
}
|
||||
}, function(type) {
|
||||
console.log('Unknown type ', type, '!');
|
||||
});
|
||||
}
|
||||
/* remove older messages from chat*/
|
||||
@ -456,57 +417,6 @@ DynMap.prototype = {
|
||||
unregisterTile: function(mapType, tileName) {
|
||||
delete this.registeredTiles[tileName];
|
||||
},
|
||||
onPlayerChat: function(playerName, message) {
|
||||
var me = this;
|
||||
var chatPopups = this.chatPopups;
|
||||
var map = me.map;
|
||||
var player = me.players[playerName];
|
||||
var playerMarker = player && player.marker;
|
||||
if (me.options.showchatwindow) {
|
||||
var messagelist = me.messagelist;
|
||||
|
||||
var messageRow = $('<div/>')
|
||||
.addClass('messagerow');
|
||||
|
||||
var playerIconContainer = $('<span/>')
|
||||
.addClass('messageicon');
|
||||
|
||||
if (me.options.showplayerfacesinmenu) {
|
||||
getMinecraftHead(playerName, 16, function(head) {
|
||||
messageRow.icon = $(head)
|
||||
.addClass('playerIcon')
|
||||
.appendTo(playerIconContainer);
|
||||
});
|
||||
}
|
||||
|
||||
if (playerName !== 'Server') {
|
||||
var playerWorldContainer = $('<span/>')
|
||||
.addClass('messagetext')
|
||||
.text('['+me.world+']');
|
||||
|
||||
var playerGroupContainer = $('<span/>')
|
||||
.addClass('messagetext')
|
||||
.text('[Group]');
|
||||
}
|
||||
|
||||
var playerNameContainer = $('<span/>')
|
||||
.addClass('messagetext')
|
||||
.text(' '+playerName+': ');
|
||||
|
||||
var playerMessageContainer = $('<span/>')
|
||||
.addClass('messagetext')
|
||||
.text(message);
|
||||
|
||||
messageRow.append(playerIconContainer,playerNameContainer,playerMessageContainer);
|
||||
//messageRow.append(playerIconContainer,playerWorldContainer,playerGroupContainer,playerNameContainer,playerMessageContainer);
|
||||
setTimeout(function() { messageRow.remove(); }, (me.options.messagettl * 1000));
|
||||
messagelist.append(messageRow);
|
||||
|
||||
me.messagelist.show();
|
||||
//var scrollHeight = jQuery(me.messagelist).attr('scrollHeight');
|
||||
me.messagelist.scrollTop(me.messagelist.scrollHeight());
|
||||
}
|
||||
},
|
||||
onTileUpdated: function(tileName) {
|
||||
var me = this;
|
||||
var tile = this.registeredTiles[tileName];
|
||||
|
Loading…
Reference in New Issue
Block a user