fox-send/app/ui/expiryOptions.js

76 lines
1.9 KiB
JavaScript
Raw Permalink Normal View History

2018-10-25 02:07:10 +00:00
const html = require('choo/html');
const raw = require('choo/html/raw');
const { secondsToL10nId } = require('../utils');
const selectbox = require('./selectbox');
module.exports = function(state, emit) {
const el = html`
2019-02-11 21:48:06 +00:00
<div class="px-1">
2019-01-24 20:31:20 +00:00
${raw(
state.translate('archiveExpiryInfo', {
2019-01-24 20:31:20 +00:00
downloadCount:
'<span class="lg:inline-block md:block sm:inline-block block"></span><select id="dlCount"></select>',
timespan: '<select id="timespan"></select>'
})
)}
2018-11-16 20:39:36 +00:00
</div>
`;
2018-10-25 02:07:10 +00:00
if (el.__encoded) {
// we're rendering on the server
return el;
}
const counts = state.DEFAULTS.DOWNLOAD_COUNTS.filter(
2018-10-25 02:07:10 +00:00
i => state.capabilities.account || i <= state.user.maxDownloads
);
const dlCountSelect = el.querySelector('#dlCount');
el.replaceChild(
selectbox(
2019-02-12 19:50:06 +00:00
state.archive.dlimit,
2018-10-25 02:07:10 +00:00
counts,
num => state.translate('downloadCount', { num }),
value => {
const max = state.user.maxDownloads;
2019-02-12 19:50:06 +00:00
state.archive.dlimit = Math.min(value, max);
2018-10-25 02:07:10 +00:00
if (value > max) {
2019-02-12 19:50:06 +00:00
emit('signup-cta', 'count');
} else {
emit('render');
2018-10-25 02:07:10 +00:00
}
},
'expire-after-dl-count-select'
2018-10-25 02:07:10 +00:00
),
dlCountSelect
);
const expires = state.DEFAULTS.EXPIRE_TIMES_SECONDS.filter(
2018-10-25 02:07:10 +00:00
i => state.capabilities.account || i <= state.user.maxExpireSeconds
);
const timeSelect = el.querySelector('#timespan');
el.replaceChild(
selectbox(
2019-02-12 19:50:06 +00:00
state.archive.timeLimit,
2018-10-25 02:07:10 +00:00
expires,
num => {
const l10n = secondsToL10nId(num);
return state.translate(l10n.id, l10n);
},
value => {
const max = state.user.maxExpireSeconds;
2019-02-12 19:50:06 +00:00
state.archive.timeLimit = Math.min(value, max);
2018-10-25 02:07:10 +00:00
if (value > max) {
2019-02-12 19:50:06 +00:00
emit('signup-cta', 'time');
} else {
emit('render');
2018-10-25 02:07:10 +00:00
}
},
'expire-after-time-select'
2018-10-25 02:07:10 +00:00
),
timeSelect
);
return el;
};