infra
/
cryptpad
2
1
Fork 0
Code Issues Pull Requests Projects Releases 1 Activity

refactor ui elements

Browse Source
pull/1/head
ansuz 7 years ago
parent bca9ba66cb
commit 809b56625d
3 changed files with 162 additions and 155 deletions
Show Stats Download Patch File Download Diff File

6
customize.dist/src/less2/include/alertify.less
Unescape Escape View File

@ -65,6 +65,12 @@
height: 100%;
z-index: 99999;
.message {
h1, h2, h3, h4, h5, h6 {
color: @alertify-fg;
}
}
h1, h2, h3 {
margin-top: 0;
}

285
www/common/common-interface.js
Unescape Escape View File

@ -56,21 +56,161 @@ define([
$(window).off('keyup', handler);
};
var dialog = UI.dialog = {};
dialog.selectable = function (value) {
var input = h('input', {
type: 'text',
readonly: 'readonly',
});
$(input).val(value).click(function () {
input.select();
});
return input;
};
dialog.okButton = function () {
return h('button.ok', { tabindex: '2', }, Messages.okButton);
};
dialog.cancelButton = function () {
return h('button.cancel', { tabindex: '1'}, Messages.cancelButton);
};
dialog.message = function (text) {
return h('p.message', text);
};
dialog.textInput = function (opt) {
return h('input', opt || {
placeholder: '',
type: 'text',
'class': 'cp-text-input',
});
};
dialog.nav = function (content) {
return h('nav', content || [
dialog.cancelButton(),
dialog.okButton(),
]);
};
dialog.frame = function (content) {
return h('div.alertify', [
h('div.dialog', [
h('div', content),
])
]);
};
UI.tokenField = function (target) {
var t = {
element: target || h('input'),
};
var $t = t.tokenfield = $(t.element).tokenfield();
t.getTokens = function () {
return $t.tokenfield('getTokens').map(function (token) {
return token.value;
});
};
t.preventDuplicates = function (cb) {
$t.on('tokenfield:createtoken', function (ev) {
var val;
if (t.getTokens().some(function (t) {
if (t === ev.attrs.value) { return ((val = t)); }
})) {
ev.preventDefault();
if (typeof(cb) === 'function') { cb(val); }
}
});
return t;
};
t.setTokens = function (tokens) {
$t.tokenfield('setTokens',
tokens.map(function (token) {
return {
value: token,
label: token,
};
}));
};
t.focus = function () {
var $temp = $t.closest('.tokenfield').find('.token-input');
$temp.css('width', '20%');
$t.tokenfield('focusInput', $temp[0]);
};
return t;
};
dialog.tagPrompt = function (tags, cb) {
var input = dialog.textInput();
var tagger = dialog.frame([
dialog.message('make some tags'), // TODO translate
input,
dialog.nav(),
]);
var field = UI.tokenField(input).preventDuplicates(function (val) {
UI.warn('Duplicate tag: ' + val); // TODO translate
});
var close = Util.once(function () {
var $t = $(tagger).fadeOut(150, function () { $t.remove(); });
});
var listener = listenForKeys(function () {}, function () {
close();
stopListening(listener);
});
var CB = Util.once(cb);
findOKButton(tagger).click(function () {
var tokens = field.getTokens();
close();
CB(tokens);
});
findCancelButton(tagger).click(function () {
close();
CB(null);
});
// :(
setTimeout(function () {
field.setTokens(tags);
field.focus();
});
return tagger;
};
UI.alert = function (msg, cb, force) {
cb = cb || function () {};
if (force !== true) { msg = Util.fixHTML(msg); }
var close = function () {
findOKButton().click();
};
var keyHandler = listenForKeys(close, close);
Alertify
.okBtn(Messages.okButton || 'OK')
.alert(msg, function (ev) {
cb(ev);
stopListening(keyHandler);
if (typeof(msg) === 'string' && force !== true) {
msg = Util.fixHTML(msg);
}
var ok = dialog.okButton();
var frame = dialog.frame([
dialog.message(msg),
dialog.nav(ok),
]);
var listener;
var close = Util.once(function () {
$(frame).fadeOut(150, function () { $(this).remove(); });
stopListening(listener);
});
window.setTimeout(function () {
findOKButton().focus();
listener = listenForKeys(close, close);
var $ok = $(ok).click(close);
document.body.appendChild(frame);
setTimeout(function () {
$ok.focus();
if (typeof(UI.notify) === 'function') {
UI.notify();
}
@ -369,126 +509,5 @@ define([
}
};
UI.tokenField = function (target) {
var t = {
element: target || h('input'),
};
var $t = t.tokenfield = $(t.element).tokenfield();
t.getTokens = function () {
return $t.tokenfield('getTokens').map(function (token) {
return token.value;
});
};
t.preventDuplicates = function (cb) {
$t.on('tokenfield:createtoken', function (ev) {
var val;
if (t.getTokens().some(function (t) {
if (t === ev.attrs.value) { return ((val = t)); }
})) {
ev.preventDefault();
if (typeof(cb) === 'function') { cb(val); }
}
});
return t;
};
t.setTokens = function (tokens) {
$t.tokenfield('setTokens',
tokens.map(function (token) {
return {
value: token,
label: token,
};
}));
};
t.focus = function () {
var $temp = $t.closest('.tokenfield').find('.token-input');
$temp.css('width', '20%');
$t.tokenfield('focusInput', $temp[0]);
};
return t;
};
var dialog = UI.dialog = {};
dialog.okButton = function () {
return h('button.ok', { tabindex: '2', }, Messages.okButton);
};
dialog.cancelButton = function () {
return h('button.cancel', { tabindex: '1'}, Messages.cancelButton);
};
dialog.message = function (text) {
return h('p.message', text);
};
dialog.textInput = function (opt) {
return h('input', opt || {
placeholder: '',
type: 'text',
'class': 'cp-text-input',
});
};
dialog.nav = function (content) {
return h('nav', content || [
dialog.cancelButton(),
dialog.okButton(),
]);
};
dialog.frame = function (content) {
return h('div.alertify', [
h('div.dialog', [
h('div', content),
])
]);
};
dialog.tagPrompt = function (tags, cb) {
var input = dialog.textInput();
var tagger = dialog.frame([
dialog.message('make some tags'), // TODO translate
input,
dialog.nav(),
]);
var field = UI.tokenField(input).preventDuplicates(function (val) {
UI.warn('Duplicate tag: ' + val); // TODO translate
});
var close = Util.once(function () {
var $t = $(tagger).fadeOut(150, function () { $t.remove(); });
});
var listener = listenForKeys(function () {}, function () {
close();
stopListening(listener);
});
var CB = Util.once(cb);
findOKButton(tagger).click(function () {
var tokens = field.getTokens();
close();
CB(tokens);
});
findCancelButton(tagger).click(function () {
close();
CB(null);
});
// :(
setTimeout(function () {
field.setTokens(tags);
field.focus();
});
return tagger;
};
return UI;
});

24
www/common/toolbar2.js
Unescape Escape View File

@ -516,29 +516,11 @@ define([
$('<h3>').text(Messages.fileEmbedTitle).appendTo($content);
var $script = $('<p>').text(Messages.fileEmbedScript).appendTo($content);
$('<br>').appendTo($script);
var scriptId = uid();
$('<input>', {
type: 'text',
id: scriptId,
readonly: 'readonly',
value: Cryptpad.getMediatagScript(),
}).appendTo($script);
$script.append(Cryptpad.dialog.selectable(Cryptpad.getMediatagScript()));
var $tag = $('<p>').text(Messages.fileEmbedTag).appendTo($content);
$('<br>').appendTo($tag);
var tagId = uid();
$('<input>', {
type:'text',
id: tagId,
readonly:'readonly',
value:Cryptpad.getMediatagFromHref(url),
}).appendTo($tag);
Cryptpad.alert($content.html(), null, true);
$('#'+scriptId).click(function () {
this.select();
});
$('#'+tagId).click(function () {
this.select();
});
$tag.append(Cryptpad.dialog.selectable(Cryptpad.getMediatagFromHref(url)));
Cryptpad.alert($content[0], null, true);
});
toolbar.$leftside.append($shareBlock);

Write Preview
Loading…
Cancel
Save