Calendar improvements

pull/1/head
yflory 4 years ago
parent ba57a687c8
commit 5858396985

@ -423,3 +423,6 @@
// Calendar
@cp_calendar-border: @cryptpad_color_grey_600;
@cp_calendar-now: @cryptpad_color_brand_300;
@cp_calendar-now-fg: @cryptpad_color_grey_800;

@ -423,3 +423,5 @@
// Calendar
@cp_calendar-border: @cryptpad_color_grey_300;
@cp_calendar-now: @cryptpad_color_brand;
@cp_calendar-now-fg: @cryptpad_color_grey_200;

@ -23,7 +23,7 @@
align-items: center;
padding: 0 5px;
color: @cp_dropdown-fg;
&.preview {
&.preview:not(.fa-calendar) {
color: @cryptpad_color_red;
}
}

@ -41,7 +41,25 @@
}
}
}
.tui-full-calendar-weekday-filled {
background-color: @cp_dropdown-bg-hover !important;
}
.tui-full-calendar-timegrid-hourmarker-time {
color: @cp_calendar-now !important;
}
.tui-full-calendar-timegrid-hourmarker-line-left, .tui-full-calendar-timegrid-hourmarker-line-today {
border-color: @cp_calendar-now !important;
}
.tui-full-calendar-timegrid-todaymarker {
background-color: @cp_calendar-now !important;
}
.tui-full-calendar-month {
.tui-full-calendar-today .tui-full-calendar-weekday-grid-date-decorator {
background-color: @cp_calendar-now !important;
color: @cp_calendar-now-fg !important;
}
.tui-full-calendar-weekday-schedule-time .tui-full-calendar-weekday-schedule-title {
color: @cryptpad_text_col !important; // XXX
}
@ -193,12 +211,24 @@
& > div {
display: flex;
}
.cp-calendar-notif-list-container {
margin-bottom: 10px;
}
.cp-calendar-notif-list {
display: flex;
flex-flow: column;
.cp-notif-entry {
margin-bottom: 2px;
.cp-notif-value {
width: 170px;
display: inline-flex;
.cp-before {
flex: 1;
min-width: 0;
}
}
span:not(:last-child) {
margin-right: 20px;
margin-right: 5px;
}
}
}
@ -210,6 +240,7 @@
}
.cp-calendar-notif-form {
align-items: center;
margin-bottom: 20px;
input {
width: 100px;
}
@ -241,6 +272,7 @@
justify-content: space-between;
}
.cp-calendar-list {
overflow-y: auto;
.cp-calendar-team {
height: 30px;
.avatar_main(30px);
@ -256,13 +288,21 @@
align-items: center;
justify-content: center;
margin: 5px 0;
&:not(:first-child) {
margin-top: 30px;
}
}
.cp-calendar-entry {
display: flex;
align-items: center;
justify-content: space-between;
padding: 5px;
&:not(.cp-unclickable) {
cursor: pointer;
}
.cp-dropdown-container {
position: initial;
}
&.cp-ghost {
padding: 0;
button {
@ -291,8 +331,27 @@
&.cp-restricted {
color: @cp_drive-header-fg;
}
.cp-calendar-icon {
width: 36px;
display: inline-flex;
height: 36px;
margin: -5px;
align-items: center;
justify-content: center;
}
&.cp-active {
background: @cp_sidebar-left-active;
.cp-calendar-inactive {
display: none;
}
}
&:not(.cp-active) {
.cp-calendar-icon {
background: transparent !important;
}
.cp-calendar-active {
display: none;
}
}
.tools_unselectable();
.cp-calendar-color {

@ -71,8 +71,9 @@ Messages.calendar_deleteTeamConfirm = "Are you sure you want to delete this cale
Messages.calendar_deleteOwned = " It will still be visible for the users it has been shared with.";
Messages.calendar_errorNoCalendar = "No editable calendar selected!";
Messages.calendar_myCalendars = "My calendars";
Messages.calendar_tempCalendar = "Temp calendar";
Messages.calendar_tempCalendar = "Viewing";
Messages.calendar_import = "Import to my calendars";
Messages.calendar_import_temp = "Import this calendar";
Messages.calendar_newEvent = "New event";
Messages.calendar_new = "New calendar";
Messages.calendar_dateRange = "{0} - {1}";
@ -86,6 +87,7 @@ Messages.calendar_allDay = "All day";
Messages.calendar_minutes = "Minutes";
Messages.calendar_hours = "Hours";
Messages.calendar_days = "Days";
Messages.calendar_before = "before";
Messages.calendar_notifications = "Reminders";
Messages.calendar_addNotification = "Add reminder";
@ -148,7 +150,7 @@ Messages.calendar_noNotification = "None";
var brightness = Math.round(((parseInt(rgb[0]) * 299) +
(parseInt(rgb[1]) * 587) +
(parseInt(rgb[2]) * 114)) / 1000);
return (brightness > 125) ? 'black' : 'white';
return (brightness > 125) ? '#424242' : '#EEEEEE';
};
var getWeekDays = function () {
@ -181,7 +183,17 @@ Messages.calendar_noNotification = "None";
};
var getSchedules = function () {
var s = [];
Object.keys(APP.calendars).forEach(function (id) {
var calendars = Object.keys(APP.calendars);
if (APP.currentCalendar) {
var currentCal = calendars.filter(function (id) {
var c = APP.calendars[id];
var t = c.teams || [];
if (id !== APP.currentCalendar) { return; }
return t.length === 1 && t[0] === 0;
});
if (currentCal.length) { calendars = currentCal; }
}
calendars.forEach(function (id) {
var c = APP.calendars[id];
if (c.hidden || c.restricted || c.loading) { return; }
var data = c.content || {};
@ -633,18 +645,25 @@ Messages.calendar_noNotification = "None";
if (!md) { return; }
var active = data.hidden ? '' : '.cp-active';
var restricted = data.restricted ? '.cp-restricted' : '';
var calendar = h('div.cp-calendar-entry'+active+restricted, {
var temp = teamId === 0 ? '.cp-unclickable' : '';
var calendar = h('div.cp-calendar-entry'+active+restricted+temp, {
'data-uid': id
}, [
h('span.cp-calendar-color', {
h('span.cp-calendar-icon', {
style: 'background-color: '+md.color+';'
}, [
h('i.cp-calendar-active.fa.fa-calendar', {
style: 'color: '+getContrast(md.color)+';'
}),
h('i.cp-calendar-inactive.fa.fa-calendar-o')
]),
h('span.cp-calendar-title', md.title),
data.restricted ? h('i.fa.fa-ban', {title: Messages.fm_restricted}) :
(isReadOnly(id, teamId) ? h('i.fa.fa-eye', {title: Messages.readonly}) : undefined),
edit
]);
$(calendar).click(function () {
if (teamId === 0) { return; }
data.hidden = !data.hidden;
if (APP.$calendars) {
APP.$calendars.find('[data-uid="'+id+'"]').toggleClass('cp-active', !data.hidden);
@ -672,11 +691,29 @@ Messages.calendar_noNotification = "None";
});
};
var tempCalendars = filter(0);
if (tempCalendars.length) {
if (tempCalendars.length && tempCalendars[0] === APP.currentCalendar) {
APP.$calendars.append(h('div.cp-calendar-team', [
h('span', Messages.calendar_tempCalendar)
]));
makeCalendarEntry(tempCalendars[0], 0);
var importTemp = h('button', [
h('i.fa.fa-calendar-plus-o'),
h('span', Messages.calendar_import_temp),
h('span')
]);
$(importTemp).click(function () {
importCalendar({
id: tempCalendars[0],
teamId: 0
}, function (obj) {
if (obj && obj.error) {
console.error(obj.error);
return void UI.warn(obj.error);
}
});
});
APP.$calendars.append(h('div.cp-calendar-entry.cp-ghost', importTemp));
return;
}
var myCalendars = filter(1);
if (myCalendars.length) {
@ -687,6 +724,18 @@ Messages.calendar_noNotification = "None";
myCalendars.forEach(function (id) {
makeCalendarEntry(id, 1);
});
// Add new button
var $newContainer = $(h('div.cp-calendar-entry.cp-ghost')).appendTo($calendars);
var newButton = h('button', [
h('i.fa.fa-calendar-plus-o'),
h('span', Messages.calendar_new),
h('span')
]);
$(newButton).click(function () {
editCalendar();
}).appendTo($newContainer);
Object.keys(privateData.teams).forEach(function (teamId) {
var calendars = filter(teamId);
if (!calendars.length) { return; }
@ -701,17 +750,6 @@ Messages.calendar_noNotification = "None";
makeCalendarEntry(id, teamId);
});
});
// Add new button
var $newContainer = $(h('div.cp-calendar-entry.cp-ghost')).appendTo($calendars);
var newButton = h('button', [
h('i.fa.fa-plus'),
h('span', Messages.calendar_new),
h('span')
]);
$(newButton).click(function () {
editCalendar();
}).appendTo($newContainer);
});
onCalendarsUpdate.fire();
@ -978,7 +1016,7 @@ Messages.calendar_noNotification = "None";
$number.attr('max', max);
if ($number.val() > max) { $number.val(max); }
});
var addNotif = h('button.btn.btn-primary.fa.fa-plus');
var addNotif = h('button.btn.btn-primary-outline.fa.fa-plus');
var $list = $(h('div.cp-calendar-notif-list'));
var listContainer = h('div.cp-calendar-notif-list-container', [
h('span.cp-notif-label', Messages.calendar_notifications),
@ -987,14 +1025,17 @@ Messages.calendar_noNotification = "None";
]);
var addNotification = function (unit, value) {
var unitValue = (unit === "minutes") ? 1 : (unit === "hours" ? 60 : (60*24));
var del = h('button.btn.btn-danger.small.fa.fa-times');
var del = h('button.btn.btn-danger-outline.small.fa.fa-times');
var minutes = value * unitValue;
if ($list.find('[data-minutes="'+minutes+'"]').length) { return; }
var span = h('span.cp-notif-entry', {
'data-minutes': minutes
}, [
h('span.cp-notif-value', [
h('span', value),
h('span', Messages['calendar_'+unit]),
h('span.cp-before', Messages.calendar_before)
]),
del
]);
$(del).click(function () {
@ -1211,8 +1252,11 @@ Messages.calendar_noNotification = "None";
return;
}
if (privateData.calendarHash) {
var hash = privateData.hashes.editHash || privateData.hashes.viewHash;
var secret = Hash.getSecrets('calendar', hash, privateData.password);
APP.currentCalendar = secret.channel;
APP.module.execCommand('OPEN', {
hash: privateData.hashes.editHash || privateData.hashes.viewHash,
hash: hash,
password: privateData.password
}, function (obj) {
if (obj && obj.error) { console.error(obj.error); }

@ -211,6 +211,10 @@ define([
c.lm.setReadOnly(false, upgradeCrypto);
c.readOnly = false;
} else if (teamId === 0) {
// If we open a second tab with the same temp URL, push to tempId
if (c.stores.length === 1 && c.stores[0] === 0 && c.tempId.length && cfg.cId) {
c.tempId.push(cfg.cId);
}
// Existing calendars can't be "temp calendars" (unless they are an upgrade)
return void cb();
}
@ -229,7 +233,10 @@ define([
if (c.stores && c.stores.indexOf(teamId) !== -1) { return void cb(); }
// If we store a temp calendar to our account or team, remove this "temp calendar"
if (c.stores.indexOf(0) !== -1) { c.stores.splice(c.stores.indexOf(0), 1); }
if (c.stores.indexOf(0) !== -1) {
c.stores.splice(c.stores.indexOf(0), 1);
c.tempId = [];
}
c.stores.push(teamId);
if (!data.href) {
@ -245,12 +252,17 @@ define([
ready: false,
channel: channel,
readOnly: !data.href,
tempId: [],
stores: [teamId],
roStores: data.href ? [] : [teamId],
reminders: {},
hashes: {}
};
if (teamId === 0) {
c.tempId.push(cfg.cId);
}
var parsed = Hash.parsePadUrl(data.href || data.roHref);
var secret = Hash.getSecrets('calendar', parsed.hash, data.password);
@ -539,6 +551,7 @@ define([
title: '...'
};
openChannel(ctx, {
cId: cId,
storeId: 0,
data: cal
}, cb);
@ -815,6 +828,19 @@ define([
var removeClient = function (ctx, cId) {
var idx = ctx.clients.indexOf(cId);
ctx.clients.splice(idx, 1);
Object.keys(ctx.calendars).forEach(function (id) {
var cal = ctx.calendars[id];
if (cal.stores.length !== 1 || cal.stores[0] !== 0 || !cal.tempId.length) { return; }
// This is a temp calendar: check if the closed tab had this calendar opened
var idx = cal.tempId.indexOf(cId);
if (idx !== -1) { cal.tempId.splice(idx, 1); }
if (!cal.tempId.length) {
cal.stores = [];
// Close calendar
closeCalendar(ctx, id);
}
});
};
Calendar.init = function (cfg, waitFor, emit) {

Loading…
Cancel
Save