Converted templates + wip

bzr revid: nicolas.vanhoren@openerp.com-20130819091741-focrd0tpwjv2vg8s
This commit is contained in:
niv-openerp
2013-08-19 11:17:41 +02:00
parent 285b8ceae7
commit 580287348d
5 changed files with 61 additions and 54 deletions
+1 -2
View File
@@ -29,12 +29,11 @@ require.config({
})(["livesupport", "jquery"], function(livesupport, jQuery) {
jQuery.noConflict();
console.log("loaded live support");
/*
livesupport.main({{url | json}}, {{db | json}}, "anonymous", "anonymous", {{channel | json}}, {
buttonText: {{buttonText | json}},
inputPlaceholder: {{inputPlaceholder | json}},
defaultMessage: {{(defaultMessage or None) | json}},
auto: window.oe_im_livechat_auto || false,
userName: {{userName | json}} || undefined,
});*/
});
});
@@ -3,6 +3,8 @@ define(["openerp", "underscore", "require", "jquery",
"jquery.achtung"], function(openerp, _, require, $) {
/* jshint es3: true */
"use strict";
var _t = openerp._t;
var livesupport = {};
@@ -19,24 +21,28 @@ define(["openerp", "underscore", "require", "jquery",
var defs = [];
options = options || {};
_.defaults(options, {
buttonText: "Chat with one of our collaborators",
inputPlaceholder: "How may I help you?",
buttonText: _t("Chat with one of our collaborators"),
inputPlaceholder: _t("How may I help you?"),
defaultMessage: null,
auto: false,
userName: "Anonymous"
userName: _t("Anonymous")
});
defaultInputPlaceholder = options.inputPlaceholder;
userName = options.userName;
// TODO : load QwebTemplates
defs.push(add_css("../css/livesupport.css"));
defs.push(add_css("./jquery.achtung.css"));
defs.push(add_css("im_livechat/static/ext/static/css/livesupport.css"));
defs.push(add_css("im_livechat/static/ext/static/lib/jquery-achtung/src/ui.achtung.css"));
$.when.apply($, defs).then(function() {
return $.when.apply($, defs).then(function() {
console.log("starting live support customer app");
connection = new openerp.Session(null, server_url, { override_session: true });
return connection.session_authenticate(db, login, password);
}).then(function() {
connection.rpc("/im_livechat/available", {db: db, channel: channel}).then(function(activated) {
return connection.rpc('/web/proxy/load', {path: '/im_livechat/static/ext/static/js/livesupport_templates.xml'}).then(function(xml) {
openerp.qweb.add_template(xml);
});
}).then(function() {
return connection.rpc("/im_livechat/available", {db: db, channel: channel}).then(function(activated) {
if (! activated & ! options.auto)
return;
var button = new livesupport.ChatButton(null, channel, options);
@@ -74,7 +80,7 @@ define(["openerp", "underscore", "require", "jquery",
this.text = options.buttonText;
},
render: function() {
this.$().append(templateEngine.chatButton({widget: this}));
this.$().append(openerp.qweb.render("chatButton", {widget: this}));
},
click: function() {
if (! this.manager) {
@@ -91,7 +97,7 @@ define(["openerp", "underscore", "require", "jquery",
def.reject();
}, 5000);
def.then(_.bind(this.chat, this), function() {
notification("It seems the connection to the server is encountering problems, please try again later.");
notification(_t("It seems the connection to the server is encountering problems, please try again later."));
});
},
chat: function() {
@@ -100,7 +106,7 @@ define(["openerp", "underscore", "require", "jquery",
return;
connection.model("im_livechat.channel").call("get_available_user", [this.channel]).then(function(user_id) {
if (! user_id) {
notification("None of our collaborators seems to be available, please try again later.");
notification(_t("None of our collaborators seems to be available, please try again later."));
return;
}
self.manager.ensure_users([user_id]).then(function() {
@@ -173,7 +179,7 @@ define(["openerp", "underscore", "require", "jquery",
var def = $.when(uuid);
if (! uuid) {
def = connection.connector.call("/longpolling/im/gen_uuid", {});
def = connection.rpc("/longpolling/im/gen_uuid", {});
}
return def.then(function(uuid) {
localStorage["oe_livesupport_uuid"] = uuid;
@@ -188,7 +194,7 @@ define(["openerp", "underscore", "require", "jquery",
delete self.users_cache[self.my_id];
self.me = me;
me.set("name", "You");
return connection.connector.call("/longpolling/im/activated", {});
return connection.rpc("/longpolling/im/activated", {});
}).then(function(activated) {
if (activated) {
self.activated = true;
@@ -236,7 +242,7 @@ define(["openerp", "underscore", "require", "jquery",
var user_ids = _.map(this.users_cache, function(el) {
return el.get("id");
});
connection.connector.call("/longpolling/im/poll", {
connection.rpc("/longpolling/im/poll", {
last: this.last,
users_watch: user_ids,
db: connection.database,
@@ -345,7 +351,7 @@ define(["openerp", "underscore", "require", "jquery",
this.inputPlaceholder = defaultInputPlaceholder;
},
render: function() {
this.$().append(templateEngine.conversation({widget: this}));
this.$().append(openerp.qweb.render("conversation", {widget: this}));
var change_status = function() {
this.$().toggleClass("oe_im_chatview_disconnected_status", this.user.get("im_status") === false);
this.$(".oe_im_chatview_online").toggle(this.user.get("im_status") === true);
@@ -427,7 +433,7 @@ define(["openerp", "underscore", "require", "jquery",
};
date = "" + zpad(date.getHours(), 2) + ":" + zpad(date.getMinutes(), 2);
this.last_bubble = $(templateEngine.conversation_bubble({"items": items, "user": user, "time": date}));
this.last_bubble = $(openerp.qweb.render("conversation_bubble", {"items": items, "user": user, "time": date}));
$(this.$(".oe_im_chatview_content").children()[0]).append(this.last_bubble);
this._go_bottom();
},
@@ -1,36 +0,0 @@
<%def name="conversation">
<div class="oe_im_chatview_header">
<img src="${toUrl('../img/green.png')}" class="oe_im_chatview_online"/>
${widget.user.get('name') || 'You'}
<button class="oe_im_chatview_close">×</button>
</div>
<div class="oe_im_chatview_disconnected">
${widget.user.get("name") + " is offline. He/She will receive your messages on his/her next connection."}
</div>
<div class="oe_im_chatview_content">
<div></div>
</div>
<div class="oe_im_chatview_footer">
<input class="oe_im_chatview_input" placeholder="${widget.inputPlaceholder}" />
</div>
</%def>
<%def name="conversation_bubble">
<div class="oe_im_chatview_bubble">
<div class="oe_im_chatview_clip">
<img class="oe_im_chatview_avatar" src="${user.get('image_url')}"/>
</div>
<div class="oe_im_chatview_from">${user.get('name') || 'You'}</div>
<div class="oe_im_chatview_bubble_list">
% _.each(items, function(item) {
<div class="oe_im_chatview_bubble_item">${item}</div>
% });
</div>
<div class="oe_im_chatview_time">${time}</div>
</div>
</%def>
<%def name="chatButton">
${widget.text}
</%def>
@@ -1 +0,0 @@
window.oe_livesupport_templates_callback("\n<%def name=\"conversation\">\n <div class=\"oe_im_chatview_header\">\n <img src=\"${toUrl('../img/green.png')}\" class=\"oe_im_chatview_online\"/>\n ${widget.user.get('name') || 'You'}\n <button class=\"oe_im_chatview_close\">\u00d7</button>\n </div>\n <div class=\"oe_im_chatview_disconnected\">\n ${widget.user.get(\"name\") + \" is offline. He/She will receive your messages on his/her next connection.\"}\n </div>\n <div class=\"oe_im_chatview_content\">\n <div></div>\n </div>\n <div class=\"oe_im_chatview_footer\">\n <input class=\"oe_im_chatview_input\" placeholder=\"${widget.inputPlaceholder}\" />\n </div>\n</%def>\n\n<%def name=\"conversation_bubble\">\n <div class=\"oe_im_chatview_bubble\">\n <div class=\"oe_im_chatview_clip\">\n <img class=\"oe_im_chatview_avatar\" src=\"${user.get('image_url')}\"/>\n </div>\n <div class=\"oe_im_chatview_from\">${user.get('name') || 'You'}</div>\n <div class=\"oe_im_chatview_bubble_list\">\n % _.each(items, function(item) {\n <div class=\"oe_im_chatview_bubble_item\">${item}</div>\n % });\n </div>\n <div class=\"oe_im_chatview_time\">${time}</div>\n </div>\n</%def>\n\n<%def name=\"chatButton\">\n ${widget.text}\n</%def>");
@@ -0,0 +1,39 @@
<?xml version="1.0" encoding="UTF-8"?>
<templates>
<t t-name="conversation">
<div class="oe_im_chatview_header">
<img t-att-src="toUrl('../img/green.png')" class="oe_im_chatview_online"/>
<t t-esc="widget.user.get('name') || _t('You')"/>
<button class="oe_im_chatview_close">×</button>
</div>
<div class="oe_im_chatview_disconnected">
<t t-esc='widget.user.get("name") + _t(" is offline. He/She will receive your messages on his/her next connection.")'/>
</div>
<div class="oe_im_chatview_content">
<div></div>
</div>
<div class="oe_im_chatview_footer">
<input class="oe_im_chatview_input" t-att-placeholder="widget.inputPlaceholder" />
</div>
</t>
<t t-name="conversation_bubble">
<div class="oe_im_chatview_bubble">
<div class="oe_im_chatview_clip">
<img class="oe_im_chatview_avatar" t-att-src="user.get('image_url')"/>
</div>
<div class="oe_im_chatview_from"><t t-esc="user.get('name') || _t('You')"/></div>
<div class="oe_im_chatview_bubble_list">
<t t-foreach="items" t-as="item">
<div class="oe_im_chatview_bubble_item"><t t-esc="item"/></div>
</t>
</div>
<div class="oe_im_chatview_time"><t t-esc="time"/></div>
</div>
</t>
<t t-name="chatButton">
<t t-esc="widget.text"/>
</t>
</templates>