chat client: add fontSize option
This commit is contained in:
parent
f79820963c
commit
6de78fddf7
5 changed files with 90 additions and 75 deletions
|
@ -13,6 +13,7 @@ do($ = window.jQuery, window) ->
|
||||||
host: ''
|
host: ''
|
||||||
port: 6042
|
port: 6042
|
||||||
debug: false
|
debug: false
|
||||||
|
fontSize: undefined
|
||||||
buttonSelector: '.open-zammad-chat'
|
buttonSelector: '.open-zammad-chat'
|
||||||
|
|
||||||
_messageCount: 0
|
_messageCount: 0
|
||||||
|
@ -66,6 +67,7 @@ do($ = window.jQuery, window) ->
|
||||||
options.T = @T
|
options.T = @T
|
||||||
options.background = @options.background
|
options.background = @options.background
|
||||||
options.flat = @options.flat
|
options.flat = @options.flat
|
||||||
|
options.fontSize = @options.fontSize
|
||||||
return window.zammadChatTemplates[name](options)
|
return window.zammadChatTemplates[name](options)
|
||||||
|
|
||||||
constructor: (options) ->
|
constructor: (options) ->
|
||||||
|
|
|
@ -1,64 +1,3 @@
|
||||||
if (!window.zammadChatTemplates) {
|
|
||||||
window.zammadChatTemplates = {};
|
|
||||||
}
|
|
||||||
window.zammadChatTemplates["agent"] = function (__obj) {
|
|
||||||
if (!__obj) __obj = {};
|
|
||||||
var __out = [], __capture = function(callback) {
|
|
||||||
var out = __out, result;
|
|
||||||
__out = [];
|
|
||||||
callback.call(this);
|
|
||||||
result = __out.join('');
|
|
||||||
__out = out;
|
|
||||||
return __safe(result);
|
|
||||||
}, __sanitize = function(value) {
|
|
||||||
if (value && value.ecoSafe) {
|
|
||||||
return value;
|
|
||||||
} else if (typeof value !== 'undefined' && value != null) {
|
|
||||||
return __escape(value);
|
|
||||||
} else {
|
|
||||||
return '';
|
|
||||||
}
|
|
||||||
}, __safe, __objSafe = __obj.safe, __escape = __obj.escape;
|
|
||||||
__safe = __obj.safe = function(value) {
|
|
||||||
if (value && value.ecoSafe) {
|
|
||||||
return value;
|
|
||||||
} else {
|
|
||||||
if (!(typeof value !== 'undefined' && value != null)) value = '';
|
|
||||||
var result = new String(value);
|
|
||||||
result.ecoSafe = true;
|
|
||||||
return result;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
if (!__escape) {
|
|
||||||
__escape = __obj.escape = function(value) {
|
|
||||||
return ('' + value)
|
|
||||||
.replace(/&/g, '&')
|
|
||||||
.replace(/</g, '<')
|
|
||||||
.replace(/>/g, '>')
|
|
||||||
.replace(/"/g, '"');
|
|
||||||
};
|
|
||||||
}
|
|
||||||
(function() {
|
|
||||||
(function() {
|
|
||||||
if (this.agent.avatar) {
|
|
||||||
__out.push('\n<img class="zammad-chat-agent-avatar" src="');
|
|
||||||
__out.push(__sanitize(this.agent.avatar));
|
|
||||||
__out.push('">\n');
|
|
||||||
}
|
|
||||||
|
|
||||||
__out.push('\n<span class="zammad-chat-agent-sentence">\n <span class="zammad-chat-agent-name">');
|
|
||||||
|
|
||||||
__out.push(__sanitize(this.agent.name));
|
|
||||||
|
|
||||||
__out.push('</span>\n</span>');
|
|
||||||
|
|
||||||
}).call(this);
|
|
||||||
|
|
||||||
}).call(__obj);
|
|
||||||
__obj.safe = __objSafe, __obj.escape = __escape;
|
|
||||||
return __out.join('');
|
|
||||||
};
|
|
||||||
|
|
||||||
var bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; },
|
var bind = function(fn, me){ return function(){ return fn.apply(me, arguments); }; },
|
||||||
slice = [].slice;
|
slice = [].slice;
|
||||||
|
|
||||||
|
@ -74,6 +13,7 @@ var bind = function(fn, me){ return function(){ return fn.apply(me, arguments);
|
||||||
host: '',
|
host: '',
|
||||||
port: 6042,
|
port: 6042,
|
||||||
debug: false,
|
debug: false,
|
||||||
|
fontSize: void 0,
|
||||||
buttonSelector: '.open-zammad-chat'
|
buttonSelector: '.open-zammad-chat'
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -154,6 +94,7 @@ var bind = function(fn, me){ return function(){ return fn.apply(me, arguments);
|
||||||
options.T = _this.T;
|
options.T = _this.T;
|
||||||
options.background = _this.options.background;
|
options.background = _this.options.background;
|
||||||
options.flat = _this.options.flat;
|
options.flat = _this.options.flat;
|
||||||
|
options.fontSize = _this.options.fontSize;
|
||||||
return window.zammadChatTemplates[name](options);
|
return window.zammadChatTemplates[name](options);
|
||||||
};
|
};
|
||||||
})(this);
|
})(this);
|
||||||
|
@ -268,14 +209,17 @@ var bind = function(fn, me){ return function(){ return fn.apply(me, arguments);
|
||||||
break;
|
break;
|
||||||
case 'offline':
|
case 'offline':
|
||||||
this.onError('Zammad Chat: No agent online');
|
this.onError('Zammad Chat: No agent online');
|
||||||
|
this.hide();
|
||||||
this.wsClose();
|
this.wsClose();
|
||||||
break;
|
break;
|
||||||
case 'chat_disabled':
|
case 'chat_disabled':
|
||||||
this.onError('Zammad Chat: Chat is disabled');
|
this.onError('Zammad Chat: Chat is disabled');
|
||||||
|
this.hide();
|
||||||
this.wsClose();
|
this.wsClose();
|
||||||
break;
|
break;
|
||||||
case 'no_seats_available':
|
case 'no_seats_available':
|
||||||
this.onError('Zammad Chat: Too many clients in queue. Clients in queue: ', pipe.data.queue);
|
this.onError('Zammad Chat: Too many clients in queue. Clients in queue: ', pipe.data.queue);
|
||||||
|
this.hide();
|
||||||
this.wsClose();
|
this.wsClose();
|
||||||
break;
|
break;
|
||||||
case 'reconnect':
|
case 'reconnect':
|
||||||
|
@ -438,8 +382,6 @@ var bind = function(fn, me){ return function(){ return fn.apply(me, arguments);
|
||||||
if (this.onInitialQueueDelayId) {
|
if (this.onInitialQueueDelayId) {
|
||||||
clearTimeout(this.onInitialQueueDelayId);
|
clearTimeout(this.onInitialQueueDelayId);
|
||||||
}
|
}
|
||||||
sessionStorage.removeItem('sessionId');
|
|
||||||
sessionStorage.removeItem('unfinished_message');
|
|
||||||
return this.closeWindow();
|
return this.closeWindow();
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -458,7 +400,9 @@ var bind = function(fn, me){ return function(){ return fn.apply(me, arguments);
|
||||||
this.send('chat_session_close', {
|
this.send('chat_session_close', {
|
||||||
session_id: this.sessionId
|
session_id: this.sessionId
|
||||||
});
|
});
|
||||||
return this.setSessionId(void 0);
|
this.setSessionId(void 0);
|
||||||
|
sessionStorage.removeItem('unfinished_message');
|
||||||
|
return this.onWebSocketOpen();
|
||||||
};
|
};
|
||||||
|
|
||||||
ZammadChat.prototype.hide = function() {
|
ZammadChat.prototype.hide = function() {
|
||||||
|
@ -703,6 +647,67 @@ var bind = function(fn, me){ return function(){ return fn.apply(me, arguments);
|
||||||
return window.ZammadChat = ZammadChat;
|
return window.ZammadChat = ZammadChat;
|
||||||
})(window.jQuery, window);
|
})(window.jQuery, window);
|
||||||
|
|
||||||
|
if (!window.zammadChatTemplates) {
|
||||||
|
window.zammadChatTemplates = {};
|
||||||
|
}
|
||||||
|
window.zammadChatTemplates["agent"] = function (__obj) {
|
||||||
|
if (!__obj) __obj = {};
|
||||||
|
var __out = [], __capture = function(callback) {
|
||||||
|
var out = __out, result;
|
||||||
|
__out = [];
|
||||||
|
callback.call(this);
|
||||||
|
result = __out.join('');
|
||||||
|
__out = out;
|
||||||
|
return __safe(result);
|
||||||
|
}, __sanitize = function(value) {
|
||||||
|
if (value && value.ecoSafe) {
|
||||||
|
return value;
|
||||||
|
} else if (typeof value !== 'undefined' && value != null) {
|
||||||
|
return __escape(value);
|
||||||
|
} else {
|
||||||
|
return '';
|
||||||
|
}
|
||||||
|
}, __safe, __objSafe = __obj.safe, __escape = __obj.escape;
|
||||||
|
__safe = __obj.safe = function(value) {
|
||||||
|
if (value && value.ecoSafe) {
|
||||||
|
return value;
|
||||||
|
} else {
|
||||||
|
if (!(typeof value !== 'undefined' && value != null)) value = '';
|
||||||
|
var result = new String(value);
|
||||||
|
result.ecoSafe = true;
|
||||||
|
return result;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
if (!__escape) {
|
||||||
|
__escape = __obj.escape = function(value) {
|
||||||
|
return ('' + value)
|
||||||
|
.replace(/&/g, '&')
|
||||||
|
.replace(/</g, '<')
|
||||||
|
.replace(/>/g, '>')
|
||||||
|
.replace(/"/g, '"');
|
||||||
|
};
|
||||||
|
}
|
||||||
|
(function() {
|
||||||
|
(function() {
|
||||||
|
if (this.agent.avatar) {
|
||||||
|
__out.push('\n<img class="zammad-chat-agent-avatar" src="');
|
||||||
|
__out.push(__sanitize(this.agent.avatar));
|
||||||
|
__out.push('">\n');
|
||||||
|
}
|
||||||
|
|
||||||
|
__out.push('\n<span class="zammad-chat-agent-sentence">\n <span class="zammad-chat-agent-name">');
|
||||||
|
|
||||||
|
__out.push(__sanitize(this.agent.name));
|
||||||
|
|
||||||
|
__out.push('</span>\n</span>');
|
||||||
|
|
||||||
|
}).call(this);
|
||||||
|
|
||||||
|
}).call(__obj);
|
||||||
|
__obj.safe = __objSafe, __obj.escape = __escape;
|
||||||
|
return __out.join('');
|
||||||
|
};
|
||||||
|
|
||||||
/*!
|
/*!
|
||||||
* ----------------------------------------------------------------------------
|
* ----------------------------------------------------------------------------
|
||||||
* "THE BEER-WARE LICENSE" (Revision 42):
|
* "THE BEER-WARE LICENSE" (Revision 42):
|
||||||
|
@ -767,6 +772,7 @@ jQuery.fn.autoGrow = function(options) {
|
||||||
mirror.style.fontFamily = jQuery(this).css('font-family');
|
mirror.style.fontFamily = jQuery(this).css('font-family');
|
||||||
mirror.style.fontSize = jQuery(this).css('font-size');
|
mirror.style.fontSize = jQuery(this).css('font-size');
|
||||||
mirror.style.lineHeight = jQuery(this).css('line-height');
|
mirror.style.lineHeight = jQuery(this).css('line-height');
|
||||||
|
mirror.style.boxSizing = jQuery(this).css('box-sizing');
|
||||||
|
|
||||||
// Style the textarea
|
// Style the textarea
|
||||||
this.style.overflow = "hidden";
|
this.style.overflow = "hidden";
|
||||||
|
@ -828,7 +834,13 @@ window.zammadChatTemplates["chat"] = function (__obj) {
|
||||||
__out.push(__sanitize(' zammad-chat--flat'));
|
__out.push(__sanitize(' zammad-chat--flat'));
|
||||||
}
|
}
|
||||||
|
|
||||||
__out.push('">\n <div class="zammad-chat-header js-chat-open"');
|
__out.push('"');
|
||||||
|
|
||||||
|
if (this.fontSize) {
|
||||||
|
__out.push(__sanitize(" style='font-size: " + this.fontSize + "px'"));
|
||||||
|
}
|
||||||
|
|
||||||
|
__out.push('>\n <div class="zammad-chat-header js-chat-open"');
|
||||||
|
|
||||||
if (this.background) {
|
if (this.background) {
|
||||||
__out.push(__sanitize(" style='background: " + this.background + "'"));
|
__out.push(__sanitize(" style='background: " + this.background + "'"));
|
||||||
|
@ -903,11 +915,11 @@ window.zammadChatTemplates["loader"] = function (__obj) {
|
||||||
}
|
}
|
||||||
(function() {
|
(function() {
|
||||||
(function() {
|
(function() {
|
||||||
__out.push('<div class="zammad-chat-modal">\n <span class="zammad-chat-loading-animation">\n <span class="zammad-chat-loading-circle"></span>\n <span class="zammad-chat-loading-circle"></span>\n <span class="zammad-chat-loading-circle"></span>\n </span>\n <span class="zammad-chat-modal-text">');
|
__out.push('<div class="zammad-chat-modal">\n <div class="zammad-chat-modal-center">\n <div class="zammad-chat-modal-text">\n <span class="zammad-chat-loading-animation">\n <span class="zammad-chat-loading-circle"></span>\n <span class="zammad-chat-loading-circle"></span>\n <span class="zammad-chat-loading-circle"></span>\n </span>\n ');
|
||||||
|
|
||||||
__out.push(__sanitize(this.T('Connecting')));
|
__out.push(__sanitize(this.T('Connecting')));
|
||||||
|
|
||||||
__out.push('</span>\n</div>');
|
__out.push('\n </div>\n </div>\n</div>');
|
||||||
|
|
||||||
}).call(this);
|
}).call(this);
|
||||||
|
|
||||||
|
@ -1078,7 +1090,7 @@ window.zammadChatTemplates["timeout"] = function (__obj) {
|
||||||
}
|
}
|
||||||
(function() {
|
(function() {
|
||||||
(function() {
|
(function() {
|
||||||
__out.push('<div class="zammad-chat-modal">\n <div class="zammad-chat-modal-text">\n ');
|
__out.push('<div class="zammad-chat-modal">\n <div class="zammad-chat-modal-center">\n <div class="zammad-chat-modal-text">\n ');
|
||||||
|
|
||||||
__out.push(this.T('Since you didn\'t respond in the last %s your conversation with <strong>%s</strong> got closed.', this.delay + " " + this.unit, this.agent));
|
__out.push(this.T('Since you didn\'t respond in the last %s your conversation with <strong>%s</strong> got closed.', this.delay + " " + this.unit, this.agent));
|
||||||
|
|
||||||
|
@ -1092,7 +1104,7 @@ window.zammadChatTemplates["timeout"] = function (__obj) {
|
||||||
|
|
||||||
__out.push(__sanitize(this.T('Start new conversation')));
|
__out.push(__sanitize(this.T('Start new conversation')));
|
||||||
|
|
||||||
__out.push('</div>\n </div>\n</div>');
|
__out.push('</div>\n </div>\n </div>\n</div>');
|
||||||
|
|
||||||
}).call(this);
|
}).call(this);
|
||||||
|
|
||||||
|
@ -1253,7 +1265,7 @@ window.zammadChatTemplates["waiting"] = function (__obj) {
|
||||||
}
|
}
|
||||||
(function() {
|
(function() {
|
||||||
(function() {
|
(function() {
|
||||||
__out.push('<div class="zammad-chat-modal">\n <div class="zammad-chat-modal-text">\n <span class="zammad-chat-loading-animation">\n <span class="zammad-chat-loading-circle"></span>\n <span class="zammad-chat-loading-circle"></span>\n <span class="zammad-chat-loading-circle"></span>\n </span>\n ');
|
__out.push('<div class="zammad-chat-modal">\n <div class="zammad-chat-modal-center">\n <div class="zammad-chat-modal-text">\n <span class="zammad-chat-loading-animation">\n <span class="zammad-chat-loading-circle"></span>\n <span class="zammad-chat-loading-circle"></span>\n <span class="zammad-chat-loading-circle"></span>\n </span>\n ');
|
||||||
|
|
||||||
__out.push(this.T('All colleges are busy.'));
|
__out.push(this.T('All colleges are busy.'));
|
||||||
|
|
||||||
|
@ -1261,7 +1273,7 @@ window.zammadChatTemplates["waiting"] = function (__obj) {
|
||||||
|
|
||||||
__out.push(this.T('You are on waiting list position <strong>%s</strong>.', this.position));
|
__out.push(this.T('You are on waiting list position <strong>%s</strong>.', this.position));
|
||||||
|
|
||||||
__out.push('\n </div>\n</div>');
|
__out.push('\n </div>\n </div>\n</div>');
|
||||||
|
|
||||||
}).call(this);
|
}).call(this);
|
||||||
|
|
||||||
|
|
2
public/assets/chat/chat.min.js
vendored
2
public/assets/chat/chat.min.js
vendored
File diff suppressed because one or more lines are too long
|
@ -141,6 +141,7 @@
|
||||||
host: 'ws://localhost',
|
host: 'ws://localhost',
|
||||||
port: 6042,
|
port: 6042,
|
||||||
debug: true,
|
debug: true,
|
||||||
|
fontSize: 11
|
||||||
});
|
});
|
||||||
|
|
||||||
$('.settings :input').on({
|
$('.settings :input').on({
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
<div class="zammad-chat<%= ' zammad-chat--flat' if @flat %>">
|
<div class="zammad-chat<%= ' zammad-chat--flat' if @flat %>"<%= " style='font-size: #{ @fontSize }px'" if @fontSize %>>
|
||||||
<div class="zammad-chat-header js-chat-open"<%= " style='background: #{ @background }'" if @background %>>
|
<div class="zammad-chat-header js-chat-open"<%= " style='background: #{ @background }'" if @background %>>
|
||||||
<div class="zammad-chat-header-controls">
|
<div class="zammad-chat-header-controls">
|
||||||
<span class="zammad-chat-agent-status zammad-chat-is-hidden" data-status="online"></span>
|
<span class="zammad-chat-agent-status zammad-chat-is-hidden" data-status="online"></span>
|
||||||
|
|
Loading…
Reference in a new issue