Enable avatars in pad2

This commit is contained in:
yflory 2017-08-21 12:01:38 +02:00
parent f88a6f63fe
commit 30aef71603
7 changed files with 130 additions and 10 deletions

View File

@ -829,6 +829,13 @@ define([
});
};
// SFRAME: talk to anon_rpc from the iframe
common.anonRpcMsg = function (msg, data, cb) {
if (!msg) { return; }
if (!anon_rpc) { return void cb('ANON_RPC_NOT_READY'); }
anon_rpc.send(msg, data, cb);
};
common.getFileSize = function (href, cb) {
if (!anon_rpc) { return void cb('ANON_RPC_NOT_READY'); }
//if (!pinsReady()) { return void cb('RPC_NOT_READY'); }
@ -1256,7 +1263,7 @@ define([
}
return arr;
};
var getFirstEmojiOrCharacter = function (str) {
var getFirstEmojiOrCharacter = common.getFirstEmojiOrCharacter = function (str) {
if (!str || !str.trim()) { return '?'; }
var emojis = emojiStringToArray(str);
return isEmoji(emojis[0])? emojis[0]: str[0];
@ -1645,6 +1652,7 @@ define([
return $block;
};
// SFRAME: moved to sframe-common-interface.js
common.createUserAdminMenu = function (config) {
var $displayedName = $('<span>', {'class': config.displayNameCls || 'displayName'});
var accountName = localStorage[common.userNameKey];

View File

@ -36,7 +36,6 @@ define([], function () {
// We don't want to add our user data to the object multiple times.
//var containsYou = false;
//console.log(metadataObj);
console.log(metadataObj.users);
Object.keys(metadataObj.users).forEach(function (x) {
if (members.indexOf(x) === -1) { return; }
mdo[x] = metadataObj.users[x];

View File

@ -1,10 +1,107 @@
define([
'jquery',
'/common/cryptpad-common.js'
], function ($, Cryptpad) {
'/common/cryptpad-common.js',
'/common/media-tag.js',
], function ($, Cryptpad, MediaTag) {
var UI = {};
var Messages = Cryptpad.Messages;
/**
* Requirements from cryptpad-common.js
* getFileSize
* - hrefToHexChannelId
* displayAvatar
* - getFirstEmojiOrCharacter
* - parsePadUrl
* - getSecrets
* - base64ToHex
* - getBlobPathFromHex
* - bytesToMegabytes
* createUserAdminMenu
* - fixHTML
* - createDropdown
*/
UI.getFileSize = function (Common, href, cb) {
var channelId = Cryptpad.hrefToHexChannelId(href);
Common.sendAnonRpcMsg("GET_FILE_SIZE", channelId, function (data) {
if (!data) { return void cb("No response"); }
if (data.error) { return void cb(data.error); }
if (data.response && data.response.length && typeof(data.response[0]) === 'number') {
return void cb(void 0, data.response[0]);
} else {
cb('INVALID_RESPONSE');
}
});
};
UI.displayAvatar = function (Common, $container, href, name, cb) {
var MutationObserver = window.MutationObserver;
var displayDefault = function () {
var text = Cryptpad.getFirstEmojiOrCharacter(name);
var $avatar = $('<span>', {'class': 'default'}).text(text);
$container.append($avatar);
if (cb) { cb(); }
};
if (!href) { return void displayDefault(); }
var parsed = Cryptpad.parsePadUrl(href);
var secret = Cryptpad.getSecrets('file', parsed.hash);
if (secret.keys && secret.channel) {
var cryptKey = secret.keys && secret.keys.fileKeyStr;
var hexFileName = Cryptpad.base64ToHex(secret.channel);
var src = Cryptpad.getBlobPathFromHex(hexFileName);
UI.getFileSize(Common, href, function (e, data) {
if (e) {
displayDefault();
return void console.error(e);
}
if (typeof data !== "number") { return void displayDefault(); }
if (Cryptpad.bytesToMegabytes(data) > 0.5) { return void displayDefault(); }
var $img = $('<media-tag>').appendTo($container);
$img.attr('src', src);
$img.attr('data-crypto-key', 'cryptpad:' + cryptKey);
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
if (mutation.type === 'childList' && mutation.addedNodes.length) {
if (mutation.addedNodes.length > 1 ||
mutation.addedNodes[0].nodeName !== 'IMG') {
$img.remove();
return void displayDefault();
}
var $image = $img.find('img');
var onLoad = function () {
var img = new Image();
img.onload = function () {
var w = img.width;
var h = img.height;
if (w>h) {
$image.css('max-height', '100%');
$img.css('flex-direction', 'column');
if (cb) { cb($img); }
return;
}
$image.css('max-width', '100%');
$img.css('flex-direction', 'row');
if (cb) { cb($img); }
};
img.src = $image.attr('src');
};
if ($image[0].complete) { onLoad(); }
$image.on('load', onLoad);
}
});
});
observer.observe($img[0], {
attributes: false,
childList: true,
characterData: false
});
MediaTag($img[0]);
});
}
};
UI.createUserAdminMenu = function (config) {
var Common = config.Common;
var metadataMgr = config.metadataMgr;
@ -118,10 +215,9 @@ define([
var newName = myData.name;
var url = myData.avatar;
$displayName.text(newName || Messages.anonymous);
console.log(newName || Messages.anonymous);
if (accountName) {
$avatar.html('');
Cryptpad.displayAvatar($avatar, url, newName, function ($img) {
UI.displayAvatar(Common, $avatar, url, newName, function ($img) {
if ($img) {
$userAdmin.find('button').addClass('avatar');
}

View File

@ -34,6 +34,7 @@ define([
// UI
funcs.createUserAdminMenu = UI.createUserAdminMenu;
funcs.displayAvatar = UI.displayAvatar;
// Title module
funcs.createTitle = Title.create;
@ -43,8 +44,6 @@ define([
return ctx.cpNfInner.metadataMgr.getMetadata().defaultTitle;
};
funcs.setDisplayName = function (name, cb) {
ctx.sframeChan.query('Q_SETTINGS_SET_DISPLAY_NAME', name, function (err) {
if (cb) { cb(err); }
@ -63,6 +62,15 @@ define([
});
};
funcs.sendAnonRpcMsg = function (msg, content, cb) {
ctx.sframeChan.query('Q_ANON_RPC_MESSAGE', {
msg: msg,
content: content
}, function (err, data) {
if (cb) { cb(data); }
});
};
/* funcs.storeLinkToClipboard = function (readOnly, cb) {
ctx.sframeChan.query('Q_STORE_LINK_TO_CLIPBOARD', readOnly, function (err) {
if (cb) { cb(err); }

View File

@ -54,4 +54,7 @@ define({
// Store the editing or readonly link of the current pad to the clipboard (share button)
'Q_STORE_LINK_TO_CLIPBOARD': true,
// Use anonymous rpc from inside the iframe (for avatars & pin usage)
'Q_ANON_RPC_MESSAGE': true,
});

View File

@ -234,7 +234,7 @@ define([
$span.append(avatars[data.avatar]);
$span.append($rightCol);
} else {
Cryptpad.displayAvatar($span, data.avatar, name, function ($img) {
Common.displayAvatar(Common, $span, data.avatar, name, function ($img) {
if (data.avatar && $img) {
avatars[data.avatar] = $img[0].outerHTML;
}

View File

@ -84,6 +84,12 @@ define([
}
});
sframeChan.on('Q_ANON_RPC_MESSAGE', function (data, cb) {
Cryptpad.anonRpcMsg(data.msg, data.content, function (err, response) {
cb({error: err, response: response});
});
});
sframeChan.on('Q_SET_PAD_TITLE_IN_DRIVE', function (newTitle, cb) {
Cryptpad.renamePad(newTitle, undefined, function (err) {
if (err) { cb('ERROR'); } else { cb(); }
@ -126,4 +132,4 @@ define([
});
});
});
});
});