mirror of
https://github.com/oxen-io/session-desktop.git
synced 2023-12-14 02:12:57 +01:00
Syntactical sugar
This commit is contained in:
parent
d2ff34c1c0
commit
597c177ced
|
@ -803,7 +803,7 @@
|
|||
};
|
||||
|
||||
window.toasts = {};
|
||||
window.pushToast = (options) => {
|
||||
window.pushToast = options => {
|
||||
// Setting toasts with the same ID can be used to prevent identical
|
||||
// toasts from appearing at once (stacking).
|
||||
// If toast already exists, it will be reloaded (updated)
|
||||
|
@ -813,27 +813,29 @@
|
|||
description: options.description ? options.description : '',
|
||||
type: options.type ? options.type : '',
|
||||
id: options.id ? options.id : '',
|
||||
}
|
||||
};
|
||||
|
||||
// Give all toasts an ID. User may define.
|
||||
const toastID = options.id
|
||||
? options.id
|
||||
: Math.random().toString(36).substring(3);
|
||||
: Math.random()
|
||||
.toString(36)
|
||||
.substring(3);
|
||||
|
||||
let toastExists = false;
|
||||
// eslint-disable-next-line no-restricted-syntax
|
||||
for (const key in window.toasts) {
|
||||
if ((!!options.id) && (key === options.id)) {
|
||||
if (!!options.id && key === options.id) {
|
||||
toastExists = true;
|
||||
window.toasts[key].update(params);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (! toastExists){
|
||||
if (!toastExists) {
|
||||
// Make new Toast
|
||||
window.toasts[toastID] = new Whisper.SessionToastView({
|
||||
el: window.$('#session-toast-container'),
|
||||
el: window.$('#session-toast-container'),
|
||||
});
|
||||
|
||||
window.toasts[toastID].render();
|
||||
|
@ -844,13 +846,13 @@
|
|||
const maxToasts = 6;
|
||||
const numToasts = window.toasts.length;
|
||||
|
||||
if (numToasts > maxToasts){
|
||||
if (numToasts > maxToasts) {
|
||||
const finalToastID = window.toasts.keys[window.toasts.length];
|
||||
window.toasts[finalToastID].fadeToast();
|
||||
}
|
||||
|
||||
return toastID;
|
||||
}
|
||||
};
|
||||
|
||||
window.sendGroupInvitations = (serverInfo, pubkeys) => {
|
||||
pubkeys.forEach(async pubkey => {
|
||||
|
|
|
@ -1927,7 +1927,7 @@
|
|||
let message = this.memberView.replaceMentions(input.val());
|
||||
message = window.Signal.Emoji.replaceColons(message).trim();
|
||||
|
||||
const toastOptions = {type: 'info'};
|
||||
const toastOptions = { type: 'info' };
|
||||
if (extension.expired()) {
|
||||
toastOptions.title = i18n('expiredWarning');
|
||||
toastOptions.id = 'expiredWarning';
|
||||
|
|
|
@ -2,68 +2,66 @@
|
|||
|
||||
// eslint-disable-next-line func-names
|
||||
(function() {
|
||||
'use strict';
|
||||
'use strict';
|
||||
|
||||
window.Whisper = window.Whisper || {};
|
||||
window.Whisper = window.Whisper || {};
|
||||
|
||||
Whisper.SessionToastView = Whisper.View.extend({
|
||||
initialize(options) {
|
||||
this.props = {
|
||||
el: $('#session-toast-container'),
|
||||
title: options.title,
|
||||
description: options.description,
|
||||
fadeToast: this.fadeToast.bind(this),
|
||||
closeToast: this.closeToast.bind(this),
|
||||
};
|
||||
},
|
||||
Whisper.SessionToastView = Whisper.View.extend({
|
||||
initialize(options) {
|
||||
this.props = {
|
||||
el: $('#session-toast-container'),
|
||||
title: options.title,
|
||||
description: options.description,
|
||||
fadeToast: this.fadeToast.bind(this),
|
||||
closeToast: this.closeToast.bind(this),
|
||||
};
|
||||
},
|
||||
|
||||
render() {
|
||||
this.toastView = new Whisper.ReactWrapperView({
|
||||
className: 'session-toast-wrapper',
|
||||
Component: window.Signal.Components.SessionToast,
|
||||
props: this.props,
|
||||
});
|
||||
render() {
|
||||
this.toastView = new Whisper.ReactWrapperView({
|
||||
className: 'session-toast-wrapper',
|
||||
Component: window.Signal.Components.SessionToast,
|
||||
props: this.props,
|
||||
});
|
||||
|
||||
this.$el.append(this.toastView.el);
|
||||
},
|
||||
this.$el.append(this.toastView.el);
|
||||
},
|
||||
|
||||
update(options) {
|
||||
this.props.title = options.title;
|
||||
this.props.description = options.description ? options.description : '';
|
||||
this.props.type = options.type ? options.type : '';
|
||||
this.props.id = options.id ? options.id : '';
|
||||
update(options) {
|
||||
this.props.title = options.title;
|
||||
this.props.description = options.description ? options.description : '';
|
||||
this.props.type = options.type ? options.type : '';
|
||||
this.props.id = options.id ? options.id : '';
|
||||
|
||||
this.toastView.update(this.props);
|
||||
this.toastView.update(this.props);
|
||||
|
||||
this.showToast();
|
||||
clearTimeout(this.timer);
|
||||
this.timer = setTimeout(this.fadeToast.bind(this), 4000);
|
||||
this.showToast();
|
||||
clearTimeout(this.timer);
|
||||
this.timer = setTimeout(this.fadeToast.bind(this), 4000);
|
||||
},
|
||||
|
||||
},
|
||||
showToast() {
|
||||
this.toastView.$el.show();
|
||||
},
|
||||
|
||||
showToast() {
|
||||
this.toastView.$el.show();
|
||||
},
|
||||
fadeToast() {
|
||||
this.toastView.$el.fadeOut(500, () => {
|
||||
this.removeToast();
|
||||
});
|
||||
},
|
||||
|
||||
fadeToast() {
|
||||
this.toastView.$el.fadeOut(500, () => {
|
||||
this.removeToast();
|
||||
});
|
||||
},
|
||||
closeToast() {
|
||||
this.toastView.$el.fadeOut(125, () => {
|
||||
this.removeToast();
|
||||
});
|
||||
},
|
||||
|
||||
closeToast() {
|
||||
this.toastView.$el.fadeOut(125, () => {
|
||||
this.removeToast();
|
||||
});
|
||||
},
|
||||
removeToast() {
|
||||
this.toastView.remove();
|
||||
|
||||
removeToast() {
|
||||
this.toastView.remove();
|
||||
|
||||
if (this.props.id){
|
||||
delete window.toasts[this.props.id];
|
||||
}
|
||||
},
|
||||
|
||||
});
|
||||
})();
|
||||
if (this.props.id) {
|
||||
delete window.toasts[this.props.id];
|
||||
}
|
||||
},
|
||||
});
|
||||
})();
|
||||
|
|
|
@ -339,7 +339,7 @@ $session_message-container-border-radius: 5px;
|
|||
flex-direction: row;
|
||||
justify-content: flex-start;
|
||||
|
||||
&:nth-child(n + 6){
|
||||
&:nth-child(n + 6) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
|
|
|
@ -38,6 +38,7 @@ export class SessionToast extends React.PureComponent<Props> {
|
|||
|
||||
const toastType = type ? type : SessionToastType.Info;
|
||||
const toastDesc = description ? description : '';
|
||||
const toastIconSize = toastDesc ? SessionIconSize.Large : SessionIconSize.Medium;
|
||||
|
||||
let toastIcon;
|
||||
switch (type) {
|
||||
|
@ -57,10 +58,14 @@ export class SessionToast extends React.PureComponent<Props> {
|
|||
toastIcon = SessionIconType.Info;
|
||||
}
|
||||
|
||||
|
||||
return (
|
||||
<div className={classNames('session-toast', toastType)}>
|
||||
<div className="toast-icon">
|
||||
<SessionIcon iconType={toastIcon} iconSize={toastDesc ? SessionIconSize.Large : SessionIconSize.Medium } />
|
||||
<SessionIcon
|
||||
iconType={toastIcon}
|
||||
iconSize={toastIconSize}
|
||||
/>
|
||||
</div>
|
||||
<div className="toast-info">
|
||||
<div className="toast-info-container">
|
||||
|
|
|
@ -176,5 +176,4 @@ export const icons = {
|
|||
'M243.225,333.382c-13.6,0-25,11.4-25,25s11.4,25,25,25c13.1,0,25-11.4,24.4-24.4 C268.225,344.682,256.925,333.382,243.225,333.382z M474.625,421.982c15.7-27.1,15.8-59.4,0.2-86.4l-156.6-271.2c-15.5-27.3-43.5-43.5-74.9-43.5s-59.4,16.3-74.9,43.4 l-156.8,271.5c-15.6,27.3-15.5,59.8,0.3,86.9c15.6,26.8,43.5,42.9,74.7,42.9h312.8 C430.725,465.582,458.825,449.282,474.625,421.982z M440.625,402.382c-8.7,15-24.1,23.9-41.3,23.9h-312.8 c-17,0-32.3-8.7-40.8-23.4c-8.6-14.9-8.7-32.7-0.1-47.7l156.8-271.4c8.5-14.9,23.7-23.7,40.9-23.7c17.1,0,32.4,8.9,40.9,23.8 l156.7,271.4C449.325,369.882,449.225,387.482,440.625,402.382z M237.025,157.882c-11.9,3.4-19.3,14.2-19.3,27.3c0.6,7.9,1.1,15.9,1.7,23.8c1.7,30.1,3.4,59.6,5.1,89.7 c0.6,10.2,8.5,17.6,18.7,17.6c10.2,0,18.2-7.9,18.7-18.2c0-6.2,0-11.9,0.6-18.2c1.1-19.3,2.3-38.6,3.4-57.9 c0.6-12.5,1.7-25,2.3-37.5c0-4.5-0.6-8.5-2.3-12.5C260.825,160.782,248.925,155.082,237.025,157.882z',
|
||||
viewBox: '0 0 486.463 486.463',
|
||||
},
|
||||
|
||||
};
|
||||
|
|
Loading…
Reference in a new issue