blitzwing/cryptpad
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

New tooltips

Browse source
This commit is contained in:
yflory 2017-07-19 17:14:10 +02:00
parent 88813aee02
commit c33d2a2db0
9 changed files with 84 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
customize.dist/src/less/cryptpad.less
View file

@ -23,6 +23,11 @@ html.cp, .cp body {
.cp {
// add font for tooltips
.tippy-popper {
font: normal normal normal 16px Arial, Helvetica, Tahoma, Verdana, Sans-Serif;
}
// override bootstrap colors
.btn-primary {
background-color: @cp-blue;

1
www/code/inner.js
View file

@ -7,6 +7,7 @@ define([
'less!/code/code.less',
'less!/customize/src/less/toolbar.less',
'less!/customize/src/less/cryptpad.less',
'css!cm/lib/codemirror.css',
'css!cm/addon/dialog/dialog.css',
'css!cm/addon/fold/foldgutter.css',

64
www/common/common-interface.js
View file

@ -5,8 +5,10 @@ define([
'/customize/application_config.js',
'/bower_components/alertifyjs/dist/js/alertify.js',
'/common/notify.js',
'/common/visible.js'
], function ($, Messages, Util, AppConfig, Alertify, Notify, Visible) {
'/common/visible.js',
'/common/tippy.min.js',
'css!/common/tippy.css',
], function ($, Messages, Util, AppConfig, Alertify, Notify, Visible, Tippy) {
var UI = {};
@ -251,9 +253,13 @@ define([
});
}
UI.importContent = function (type, f) {
UI.importContent = function (type, f, cfg) {
return function () {
var $files = $('<input type="file">').click();
var $files = $('<input>', {type:"file"});
if (cfg && cfg.accept) {
$files.attr('accept', cfg.accept);
}
$files.click();
$files.on('change', function (e) {
var file = e.target.files[0];
var reader = new FileReader();
@ -288,5 +294,55 @@ define([
return $icon;
};
// Tooltips
UI.addTooltips = function () {
var MutationObserver = window.MutationObserver;
var addTippy = function (el) {
if (el.nodeName === 'IFRAME') { return; }
console.log(el);
Tippy(el, {
position: 'bottom',
distance: 0,
performance: true,
delay: [500, 0]
});
};
var $body = $('body');
var $padIframe = $('#pad-iframe').contents().find('body');
$('[title]').each(function (i, el) {
addTippy(el);
});
$('#pad-iframe').contents().find('[title]').each(function (i, el) {
addTippy(el);
});
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
if (mutation.type === 'childList' && mutation.addedNodes.length) {
$body.find('[title]').each(function (i, el) {
addTippy(el);
});
if (!$padIframe.length) { return; }
$padIframe.find('[title]').each(function (i, el) {
addTippy(el);
});
}
});
});
observer.observe($('body')[0], {
attributes: false,
childList: true,
characterData: false,
subtree: true
});
if ($('#pad-iframe').length) {
observer.observe($('#pad-iframe').contents().find('body')[0], {
attributes: false,
childList: true,
characterData: false,
subtree: true
});
}
};
return UI;
});

4
www/common/cryptpad-common.js
View file

@ -76,6 +76,7 @@ define([
common.notify = UI.notify;
common.unnotify = UI.unnotify;
common.getIcon = UI.getIcon;
common.addTooltips = UI.addTooltips;
// import common utilities for export
common.find = Util.find;
@ -1093,7 +1094,7 @@ define([
.click(prepareFeedback(type))
.click(UI.importContent('text/plain', function (content, file) {
callback(content, file);
}));
}, {accept: data ? data.accept : undefined}));
}
break;
case 'upload':
@ -1796,6 +1797,7 @@ define([
store = common.store = env.store = storeObj;
common.addDirectMessageHandler(common);
common.addTooltips();
var proxy = getProxy();
var network = getNetwork();

1
www/common/tippy.css Normal file
View file

File diff suppressed because one or more lines are too long

1
www/common/tippy.min.js vendored Normal file
View file

File diff suppressed because one or more lines are too long

9
www/common/toolbar2.js
View file

@ -1,7 +1,7 @@
define([
'jquery',
'/customize/application_config.js',
'/api/config'
'/api/config',
], function ($, Config, ApiConfig) {
var Messages = {};
var Cryptpad;
@ -206,7 +206,7 @@ define([
var pendingFriends = Cryptpad.getPendingInvites();
editUsersNames.forEach(function (data) {
var name = data.name || Messages.anonymous;
var $span = $('<span>', {'title': name, 'class': 'avatar'});
var $span = $('<span>', {'class': 'avatar'});
var $rightCol = $('<span>', {'class': 'right-col'});
var $nameSpan = $('<span>', {'class': 'name'}).text(name).appendTo($rightCol);
var proxy = Cryptpad.getProxy();
@ -214,9 +214,10 @@ define([
if (Cryptpad.isLoggedIn() && data.curvePublic) {
if (isMe) {
$nameSpan.attr('title', Messages._getKey('userlist_thisIsYou', [
$span.attr('title', Messages._getKey('userlist_thisIsYou', [
name
])).text(name);
]));
$nameSpan.text(name);
} else if (!proxy.friends || !proxy.friends[data.curvePublic]) {
if (pendingFriends.indexOf(data.netfluxId) !== -1) {
$('<span>', {'class': 'friend'}).text(Messages.userlist_pending)

14
www/drive/main.js
View file

@ -1116,18 +1116,18 @@ define([
var name = filesOp.getTitle(element);
// The element with the class '.name' is underlined when the 'li' is hovered
var $name = $('<span>', {'class': 'name', title: name}).text(name);
var $name = $('<span>', {'class': 'name'}).text(name);
$span.html('');
$span.append($name);
var hrefData = Cryptpad.parsePadUrl(data.href);
var type = Messages.type[hrefData.type] || hrefData.type;
var $type = $('<span>', {'class': 'type listElement', title: type}).text(type);
var $type = $('<span>', {'class': 'type listElement'}).text(type);
if (hrefData.hashData && hrefData.hashData.mode === 'view') {
$type.append(' (' + Messages.readonly+ ')');
}
var $adate = $('<span>', {'class': 'atime listElement', title: getDate(data.atime)}).text(getDate(data.atime));
var $cdate = $('<span>', {'class': 'ctime listElement', title: getDate(data.ctime)}).text(getDate(data.ctime));
var $adate = $('<span>', {'class': 'atime listElement'}).text(getDate(data.atime));
var $cdate = $('<span>', {'class': 'ctime listElement'}).text(getDate(data.ctime));
$span.append($type);
if (!isWorkgroup()) {
$span.append($adate).append($cdate);
@ -1140,9 +1140,9 @@ define([
// The element with the class '.name' is underlined when the 'li' is hovered
var sf = filesOp.hasSubfolder(element);
var files = filesOp.hasFile(element);
var $name = $('<span>', {'class': 'name', title: key}).text(key);
var $subfolders = $('<span>', {'class': 'folders listElement', title: sf}).text(sf);
var $files = $('<span>', {'class': 'files listElement', title: files}).text(files);
var $name = $('<span>', {'class': 'name'}).text(key);
var $subfolders = $('<span>', {'class': 'folders listElement'}).text(sf);
var $files = $('<span>', {'class': 'files listElement'}).text(files);
$span.append($name).append($subfolders).append($files);
};

2
www/pad/main.js
View file

@ -549,7 +549,7 @@ define([
var $templateButton = Cryptpad.createButton('template', true, templateObj);
$rightside.append($templateButton);
}
console.log('init');
/* add an export button */
var $export = Cryptpad.createButton('export', true, {}, exportFile);
$drawer.append($export);