diff --git a/customize.dist/src/less2/include/alertify.less b/customize.dist/src/less2/include/alertify.less index 557f391c1..52019a912 100644 --- a/customize.dist/src/less2/include/alertify.less +++ b/customize.dist/src/less2/include/alertify.less @@ -182,6 +182,7 @@ margin-bottom: 10px; box-sizing: content-box; span { + .tools_unselectable(); font-size: 20px; height: 40px; line-height: 40px; @@ -190,12 +191,16 @@ border-left: 1px solid lighten(@alertify-base, 10%); border-right: 1px solid lighten(@alertify-base, 10%); cursor: pointer; - &:hover { + &:not(.disabled):hover { background-color: @alertify-light-bg; } + &.disabled { + color: #949494; + cursor: not-allowed; + } } span.alertify-tabs-active { - background-color: @alertify-fore; + background-color: @alertify-fore !important; border-left: 1px solid @alertify-fore; border-right: 1px solid @alertify-fore; color: @alertify-base; @@ -386,18 +391,13 @@ } } div.wide { - div.alertify-tabs { - p.msg:not(:last-child) { - border-bottom: 1px solid @alertify-fore; - } - } .cp-share-columns { display: flex; flex-flow: row; & > .cp-share-column { width: 50%; - padding: 0 10px; + //padding: 0 10px; position: relative; &.contains-nav { nav { @@ -414,7 +414,20 @@ } } &:first-child { - border-right: 1px solid @alertify-fore; + margin-right: @alertify_padding-base; + } + &:last-child { + margin-left: @alertify_padding-base; + } + } + & > .cp-share-column-mid { + display: flex; + align-items: center; + button { + width: 50px; + margin: 0; + min-width: 0; + font-size: 18px; } } } diff --git a/www/common/common-interface.js b/www/common/common-interface.js index fca655360..5795520ae 100644 --- a/www/common/common-interface.js +++ b/www/common/common-interface.js @@ -218,14 +218,15 @@ define([ var titles = []; var active = 0; tabs.forEach(function (tab, i) { - if (!tab.content || !tab.title) { return; } + if (!(tab.content || tab.disabled) || !tab.title) { return; } var content = h('div.alertify-tabs-content', tab.content); - var title = h('span.alertify-tabs-title', tab.title); + var title = h('span.alertify-tabs-title'+ (tab.disabled ? '.disabled' : ''), tab.title); if (tab.icon) { var icon = h('i', {class: tab.icon}); $(title).prepend(' ').prepend(icon); } $(title).click(function () { + if (tab.disabled) { return; } var old = tabs[active]; if (old.onHide) { old.onHide(); } titles.forEach(function (t) { $(t).removeClass('alertify-tabs-active'); }); @@ -239,7 +240,7 @@ define([ }); titles.push(title); contents.push(content); - if (tab.active) { active = i; } + if (tab.active && !tab.disabled) { active = i; } }); if (contents.length) { $(contents[active]).addClass('alertify-tabs-content-active'); diff --git a/www/common/common-ui-elements.js b/www/common/common-ui-elements.js index 67c4518fa..cebf5047e 100644 --- a/www/common/common-ui-elements.js +++ b/www/common/common-ui-elements.js @@ -284,6 +284,12 @@ define([ UIElements.getProperties = function (common, opts, cb) { var data; var content; + var button = [{ + className: 'cancel', + name: Messages.filePicker_close, + onClick: function () {}, + keys: [13,27] + }]; NThen(function (waitFor) { getPropertiesData(common, opts, waitFor(function (e, _data) { if (e) { @@ -298,10 +304,17 @@ define([ waitFor.abort(); return void cb(e); } - content = c[0]; + content = UI.dialog.customModal(c[0], { + buttons: button + }); })); }).nThen(function () { - var modal = UI.alert(content); + var tabs = UI.dialog.tabs([{ + title: Messages.fc_prop, + icon: "fa fa-info-circle", + content: content + }]); + var modal = UI.openCustomModal(tabs); cb (void 0, modal); }); }; diff --git a/www/common/inner/access.js b/www/common/inner/access.js index 139a52d64..cccae9477 100644 --- a/www/common/inner/access.js +++ b/www/common/inner/access.js @@ -9,11 +9,11 @@ define([ '/bower_components/nthen/index.js', ], function ($, Util, Hash, UI, UIElements, h, Messages, nThen) { -console.log(UI, UIElements, h); - var Access = {}; - var createOwnerModal = function (common, data) { + var getOwnersTab = function (common, data, opts, _cb) { + var cb = Util.once(Util.mkAsync(_cb)); + var friends = common.getFriends(true); var sframeChan = common.getSframeChannel(); var priv = common.getMetadataMgr().getPrivateData(); @@ -23,13 +23,19 @@ console.log(UI, UIElements, h); var owners = data.owners || []; var pending_owners = data.pending_owners || []; var teams = priv.teams; + var teamsData = Util.tryParse(JSON.stringify(priv.teams)) || {}; var teamOwner = data.teamId; + opts = opts || {}; var redrawAll = function () {}; - var div1 = h('div.cp-usergrid-user.cp-share-column.cp-ownership'); - var div2 = h('div.cp-usergrid-user.cp-share-column.cp-ownership'); + var addBtn = h('button.btn.btn-primary.fa.fa-arrow-left'); + + var div1 = h('div.cp-share-column.cp-ownership'); + var divMid = h('div.cp-share-column-mid', addBtn); + var div2 = h('div.cp-share-column.cp-ownership'); var $div1 = $(div1); + $divMid = $(divMid); var $div2 = $(div2); // Remove owner column @@ -105,7 +111,7 @@ console.log(UI, UIElements, h); err = err || (res && res.error); if (err) { waitFor.abort(); - redrawAll(); + redrawAll(true); var text = err === "INSUFFICIENT_PERMISSIONS" ? Messages.fm_forbidden : Messages.error; return void UI.warn(text); @@ -127,7 +133,7 @@ console.log(UI, UIElements, h); }, waitFor()); }); }).nThen(function () { - redrawAll(); + redrawAll(true); }); }); $div.append(h('p', removeButton)); @@ -154,7 +160,6 @@ console.log(UI, UIElements, h); }); $div.append(addCol.div); - var teamsData = Util.tryParse(JSON.stringify(priv.teams)) || {}; Object.keys(teamsData).forEach(function (id) { var t = teamsData[id]; t.teamId = id; @@ -171,293 +176,289 @@ console.log(UI, UIElements, h); $div.append(teamsList.div); // When clicking on the add button, we get the selected users. - var addButton = h('button.no-margin', Messages.owner_addButton); - $(addButton).click(function () { - // Check selection - var $sel = $div.find('.cp-usergrid-user.cp-selected'); - var sel = $sel.toArray(); - if (!sel.length) { return; } - var toAdd = sel.map(function (el) { - var curve = $(el).attr('data-curve'); - // If the pad is woned by a team, we can transfer ownership to ourselves - if (curve === user.curvePublic && teamOwner) { return priv.edPublic; } - var friend = friends[curve]; - if (!friend) { return; } - return friend.edPublic; - }).filter(function (x) { return x; }); - var toAddTeams = sel.map(function (el) { - var team = teamsData[$(el).attr('data-teamid')]; - if (!team || !team.edPublic) { return; } - return { - edPublic: team.edPublic, - id: $(el).attr('data-teamid') - }; - }).filter(function (x) { return x; }); + //var addButton = h('button.no-margin', Messages.owner_addButton); // XXX + //$div.append(h('p', addButton)); + return $div; + }; - nThen(function (waitFor) { - var msg = Messages.owner_addConfirm; - UI.confirm(msg, waitFor(function (yes) { - if (!yes) { + $(addBtn).click(function () { + var $div = $div2.find('.cp-share-column'); + // Check selection + var $sel = $div.find('.cp-usergrid-user.cp-selected'); + var sel = $sel.toArray(); + if (!sel.length) { return; } + var toAdd = sel.map(function (el) { + var curve = $(el).attr('data-curve'); + // If the pad is woned by a team, we can transfer ownership to ourselves + if (curve === user.curvePublic && teamOwner) { return priv.edPublic; } + var friend = friends[curve]; + if (!friend) { return; } + return friend.edPublic; + }).filter(function (x) { return x; }); + var toAddTeams = sel.map(function (el) { + var team = teamsData[$(el).attr('data-teamid')]; + if (!team || !team.edPublic) { return; } + return { + edPublic: team.edPublic, + id: $(el).attr('data-teamid') + }; + }).filter(function (x) { return x; }); + + nThen(function (waitFor) { + var msg = Messages.owner_addConfirm; + UI.confirm(msg, waitFor(function (yes) { + if (!yes) { + waitFor.abort(); + return; + } + })); + }).nThen(function (waitFor) { + // Add one of our teams as an owner + if (toAddTeams.length) { + // Send the command + sframeChan.query('Q_SET_PAD_METADATA', { + channel: channel, + command: 'ADD_OWNERS', + value: toAddTeams.map(function (obj) { return obj.edPublic; }), + teamId: teamOwner + }, waitFor(function (err, res) { + err = err || (res && res.error); + if (err) { waitFor.abort(); - return; + redrawAll(true); + var text = err === "INSUFFICIENT_PERMISSIONS" ? + Messages.fm_forbidden : Messages.error; + return void UI.warn(text); } + var isTemplate = priv.isTemplate || opts.isTemplate; + toAddTeams.forEach(function (obj) { + sframeChan.query('Q_STORE_IN_TEAM', { + href: data.href || data.rohref, + password: data.password, + path: isTemplate ? ['template'] : undefined, + title: data.title || '', + teamId: obj.id + }, waitFor(function (err) { + if (err) { return void console.error(err); } + })); + }); })); - }).nThen(function (waitFor) { - // Add one of our teams as an owner - if (toAddTeams.length) { - // Send the command - sframeChan.query('Q_SET_PAD_METADATA', { - channel: channel, - command: 'ADD_OWNERS', - value: toAddTeams.map(function (obj) { return obj.edPublic; }), - teamId: teamOwner - }, waitFor(function (err, res) { - err = err || (res && res.error); - if (err) { - waitFor.abort(); - redrawAll(); - var text = err === "INSUFFICIENT_PERMISSIONS" ? - Messages.fm_forbidden : Messages.error; - return void UI.warn(text); - } - var isTemplate = priv.isTemplate || data.isTemplate; - toAddTeams.forEach(function (obj) { - sframeChan.query('Q_STORE_IN_TEAM', { - href: data.href || data.rohref, - password: data.password, - path: isTemplate ? ['template'] : undefined, - title: data.title || '', - teamId: obj.id - }, waitFor(function (err) { - if (err) { return void console.error(err); } - })); - }); - })); - } - }).nThen(function (waitFor) { - // Offer ownership to a friend - if (toAdd.length) { - // Send the command - sframeChan.query('Q_SET_PAD_METADATA', { - channel: channel, - command: 'ADD_PENDING_OWNERS', - value: toAdd, - teamId: teamOwner - }, waitFor(function (err, res) { - err = err || (res && res.error); - if (err) { - waitFor.abort(); - redrawAll(); - var text = err === "INSUFFICIENT_PERMISSIONS" ? Messages.fm_forbidden - : Messages.error; - return void UI.warn(text); - } - })); - } - }).nThen(function (waitFor) { - sel.forEach(function (el) { - var curve = $(el).attr('data-curve'); - var friend = curve === user.curvePublic ? user : friends[curve]; - if (!friend) { return; } - common.mailbox.sendTo("ADD_OWNER", { - channel: channel, - href: data.href, - password: data.password, - title: data.title - }, { - channel: friend.notifications, - curvePublic: friend.curvePublic - }, waitFor()); - }); - }).nThen(function () { - redrawAll(); - UI.log(Messages.saved); + } + }).nThen(function (waitFor) { + // Offer ownership to a friend + if (toAdd.length) { + // Send the command + sframeChan.query('Q_SET_PAD_METADATA', { + channel: channel, + command: 'ADD_PENDING_OWNERS', + value: toAdd, + teamId: teamOwner + }, waitFor(function (err, res) { + err = err || (res && res.error); + if (err) { + waitFor.abort(); + redrawAll(true); + var text = err === "INSUFFICIENT_PERMISSIONS" ? Messages.fm_forbidden + : Messages.error; + return void UI.warn(text); + } + })); + } + }).nThen(function (waitFor) { + sel.forEach(function (el) { + var curve = $(el).attr('data-curve'); + var friend = curve === user.curvePublic ? user : friends[curve]; + if (!friend) { return; } + common.mailbox.sendTo("ADD_OWNER", { + channel: channel, + href: data.href, + password: data.password, + title: data.title + }, { + channel: friend.notifications, + curvePublic: friend.curvePublic + }, waitFor()); }); + }).nThen(function () { + redrawAll(true); + UI.log(Messages.saved); }); - $div.append(h('p', addButton)); - return $div; - }; + }); - redrawAll = function (md) { - var todo = function (obj) { - if (obj && obj.error) { return; } - owners = obj.owners || []; - pending_owners = obj.pending_owners || []; + redrawAll = function (reload) { + nThen(function (waitFor) { + if (!reload) { return; } + common.getPadMetadata({ + channel: data.channel + }, waitFor(function (md) { + data.owners = md.owners || []; + data.pending_owners = md.pending_owners || []; + })); + }).nThen(function () { + owners = data.owners || []; + pending_owners = data.pending_owners || []; $div1.empty(); $div2.empty(); $div1.append(drawRemove(false)).append(drawRemove(true)); $div2.append(drawAdd()); - }; - - if (md) { return void todo(md); } - common.getPadMetadata({ - channel: data.channel - }, todo); + }); }; - - $div1.append(drawRemove(false)).append(drawRemove(true)); - $div2.append(drawAdd()); + redrawAll(); var handler = sframeChan.on('EV_RT_METADATA', function (md) { if (!$div1.length) { return void handler.stop(); } - owners = md.owners || []; - pending_owners = md.pending_owners || []; - redrawAll(md); + data.owners = md.owners || []; + data.pending_owners = md.pending_owners || []; + redrawAll(); }); // Create modal var link = h('div.cp-share-columns', [ div1, + divMid, div2 - /*drawRemove()[0], - drawAdd()[0]*/ ]); - var linkButtons = [{ - className: 'cancel', - name: Messages.filePicker_close, - onClick: function () {}, - keys: [27] - }]; - return UI.dialog.customModal(link, {buttons: linkButtons}); + cb(void 0, link); }; - var getRightsProperties = function (common, data, cb) { - var $div = $('
'); - if (!data) { return void cb(void 0, $div); } - - var draw = function () { - var $d = $('
'); - var priv = common.getMetadataMgr().getPrivateData(); - var user = common.getMetadataMgr().getUserData(); - var edPublic = priv.edPublic; - var owned = false; - var _owners = {}; - if (data.owners && data.owners.length) { - if (data.owners.indexOf(edPublic) !== -1) { - owned = true; - } else { - Object.keys(priv.teams || {}).some(function (id) { - var team = priv.teams[id] || {}; - if (team.viewer) { return; } - if (data.owners.indexOf(team.edPublic) === -1) { return; } - owned = id; - return true; - }); - } - var strangers = 0; - data.owners.forEach(function (ed) { - // If a friend is an owner, add their name to the list - // otherwise, increment the list of strangers - - // Our edPublic? print "Yourself" - if (ed === edPublic) { - _owners[ed] = { - selected: true, - name: user.name, - avatar: user.avatar - }; - return; - } - // One of our teams? print the team name - if (Object.keys(priv.teams || {}).some(function (id) { - var team = priv.teams[id] || {}; - if (team.edPublic !== ed) { return; } - _owners[ed] = { - name: team.name, - avatar: team.avatar - }; - return true; - })) { - return; - } - // One of our friends? print the friend name - if (Object.keys(priv.friends || {}).some(function (c) { - var friend = priv.friends[c] || {}; - if (friend.edPublic !== ed || c === 'me') { return; } - _owners[friend.edPublic] = { - name: friend.displayName, - avatar: friend.avatar - }; - return true; - })) { - return; - } - // Otherwise it's a stranger - strangers++; + var isOwned = function (common, data) { + data = data || {}; + var priv = common.getMetadataMgr().getPrivateData(); + var edPublic = priv.edPublic; + var owned = false; + if (data.owners && data.owners.length) { + if (data.owners.indexOf(edPublic) !== -1) { + owned = true; + } else { + Object.keys(priv.teams || {}).some(function (id) { + var team = priv.teams[id] || {}; + if (team.viewer) { return; } + if (data.owners.indexOf(team.edPublic) === -1) { return; } + owned = id; + return true; }); - if (strangers) { - _owners['stangers'] = { - name: Messages._getKey('properties_unknownUser', [strangers]), - }; - } } - var _ownersGrid = UIElements.getUserGrid(Messages.creation_owners, { - common: common, - noSelect: true, - data: _owners, - large: true - }, function () {}); - if (_ownersGrid && Object.keys(_owners).length) { - $d.append(_ownersGrid.div); - } else { - $d.append([ - h('label', Messages.creation_owners), - ]); - $d.append(UI.dialog.selectable(Messages.creation_noOwner, { - id: 'cp-app-prop-owners', - })); + } + return owned; + }; + var getUserList = function (common, list) { + if (!Array.isArray(list)) { return; } + var priv = common.getMetadataMgr().getPrivateData(); + var user = common.getMetadataMgr().getUserData(); + var edPublic = priv.edPublic; + var strangers = 0; + var _owners = {}; + list.forEach(function (ed) { + // If a friend is an owner, add their name to the list + // otherwise, increment the list of strangers + + // Our edPublic? print "Yourself" + if (ed === edPublic) { + _owners[ed] = { + //selected: true, + name: user.name, + avatar: user.avatar + }; + return; } - - var parsed; - if (data.href || data.roHref) { - parsed = Hash.parsePadUrl(data.href || data.roHref); + // One of our teams? print the team name + if (Object.keys(priv.teams || {}).some(function (id) { + var team = priv.teams[id] || {}; + if (team.edPublic !== ed) { return; } + _owners[ed] = { + name: team.name, + avatar: team.avatar + }; + return true; + })) { + return; } - if (owned && parsed.hashData.type === 'pad') { - var manageOwners = h('button.no-margin', Messages.owner_openModalButton); - $(manageOwners).click(function () { - data.teamId = typeof(owned) !== "boolean" ? owned : undefined; - var modal = createOwnerModal(common, data); - UI.openCustomModal(modal, { - wide: true, - }); - }); - $d.append(h('p', manageOwners)); + // One of our friends? print the friend name + if (Object.keys(priv.friends || {}).some(function (c) { + var friend = priv.friends[c] || {}; + if (friend.edPublic !== ed || c === 'me') { return; } + _owners[friend.edPublic] = { + name: friend.displayName, + avatar: friend.avatar + }; + return true; + })) { + return; } + // Otherwise it's a stranger + _owners[ed] = { + name: '???', // XXX unkwown? + }; + strangers++; + }); + if (!Object.keys(_owners).length) { return; } + /* + if (strangers) { + _owners['stangers'] = { + name: Messages._getKey('properties_unknownUser', [strangers]), + }; + } + */ + return UIElements.getUserGrid(null, { + common: common, + noSelect: true, + data: _owners, + large: true + }, function () {}); + }; - if (!data.noExpiration) { + var getAccessTab = function (common, data, opts, _cb) { + var cb = Util.once(Util.mkAsync(_cb)); + opts = opts || {}; + + var priv = common.getMetadataMgr().getPrivateData(); + var edPublic = priv.edPublic; + + var $div = $(h('div.cp-share-columns')); + if (!data) { return void cb(void 0, $div); } + + var div1 = h('div.cp-usergrid-user.cp-share-column.cp-access'); + var div2 = h('div.cp-usergrid-user.cp-share-column.cp-access'); + var $div1 = $(div1).appendTo($div); + var $div2 = $(div2).appendTo($div); + + var parsed = Hash.parsePadUrl(data.href || data.roHref); + if (!parsed || !parsed.hashData) { return void console.error("Invalid href"); } + + var drawLeft = function () { + var $d = $('
'); + + var owned = isOwned(common, data); + + if (!opts.noExpiration) { var expire = Messages.creation_expireFalse; if (data.expire && typeof (data.expire) === "number") { expire = new Date(data.expire).toLocaleString(); } - $('