-
Notifications
You must be signed in to change notification settings - Fork 0
/
message-handler.js
executable file
·117 lines (90 loc) · 3.08 KB
/
message-handler.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
var C = {};
C.LANGUAGES = [
'de',
'en',
'es',
'fr',
'it',
'ja',
'ko',
'zh'
];
function MessageHandler(id, onLanguageChange) {
this.languages = [];
this.$container = $("#" + id);
this.selectedLanguage = 'en';
this.onLanguageChange = onLanguageChange;
}
//Takes two strings, a message and a sender
//and returns at jQuery object with that message.
MessageHandler.prototype._createMessage = function(message) {
var messageTemplate = "<div class='chat-element'><span class='chat-sender'>{{SENDER}}</span> <span class='chat-message'>{{CONTENT}}</span></div>";
var message = messageTemplate.replace("{{SENDER}}", message.sender).replace("{{CONTENT}}", message.text);
$message = $(message);
return $message;
}
//Takes an element from the language object
//and returns a jquery object made from that element
MessageHandler.prototype._createLanguageButton = function(language) {
var languageButtonTemplate = "<li{{SELECTED}}>{{LANGUAGE}}</li>";
if(language === this.selectedLanguage) {
var selected = true;
}
if(selected) {
var languageButton = languageButtonTemplate.replace("{{LANGUAGE}}", language).replace("{{SELECTED}}", " class='is-selected'");
}
else {
var languageButton = languageButtonTemplate.replace("{{LANGUAGE}}", language).replace("{{SELECTED}}", "");
}
$languageButton = $(languageButton);
if(selected) {
this.selectedLanguageButton = $languageButton;
}
var handlerReference = this;
$languageButton.click(function() {
if(language != handlerReference.selectedLanguage) {
$this = $(this);
$this.addClass("is-selected");
if(handlerReference.selectedLanguageButton)
handlerReference.selectedLanguageButton.removeClass("is-selected");
handlerReference.selectedLanguage = language;
handlerReference.selectedLanguageButton = $this;
handlerReference.onLanguageChange(language);
}
});
return $languageButton;
}
MessageHandler.prototype._fillChat = function() {
var $chatWindow = $("<div class='chat-window'></div>");
var messages = Message.all();
var _this = this;
for (var i = 0; i < messages.length; i++) {
Message.translate(messages[i], this.selectedLanguage, function (message) {
$chatWindow.append(_this._createMessage(message));
});
};
return $chatWindow;
}
//Populate the language selector
MessageHandler.prototype._fillLanguageSelector = function() {
var $languageSelector = $("<div class='language-selector'></div>");
for (var i = 0; i < C.LANGUAGES.length; i++) {
$languageSelector.append(this._createLanguageButton(C.LANGUAGES[i]));
};
return $languageSelector;
}
MessageHandler.prototype._fillMessageHandler = function() {
var $chat = this._fillChat();
this.$container.empty();
this.$container.append(this._fillLanguageSelector());
this.$container.append($chat);
$chat.scrollTop(999999);
}
//Start the message handler (fill it with content)
MessageHandler.prototype.start = function() {
this._fillMessageHandler();
}
//Create a new message and refresh the sender
MessageHandler.prototype.refresh = function() {
this._fillMessageHandler();
}