') && message.messageHtml.includes('')) {
+ returnedButtons.push(JSX_(buttons.$, {
+ key: "copy-msg",
+ className: "tiny-button simpletip copy-txt-block",
+ icon: "sprite-fm-mono icon-copy",
+ attrs: {
+ 'data-simpletip': l.copy_txt_block_tip,
+ 'data-simpletipoffset': '3',
+ 'data-simpletipposition': 'top'
+ },
+ onClick: () => {
+ copyToClipboard(message.textContents.replace(/```/g, ''), l.copy_txt_block_toast);
+ }
+ }));
+ }
+ if (parentButtons) {
+ returnedButtons.push(parentButtons);
+ }
+ return returnedButtons;
+ }
+ getContents() {
+ const {
+ message,
+ chatRoom,
+ onUpdate,
+ isBeingEdited,
+ spinnerElement
+ } = this.props;
+ let textMessage = message.messageHtml;
+ const IS_GEOLOCATION = this.isGeoLocation(message);
+ const {
+ lng,
+ la: latitude
+ } = IS_GEOLOCATION && message.meta.extra[0];
+ if (message.textContents === '' && !message.dialogType) {
+ message.deleted = true;
+ }
+ let subMessageComponent = [];
+ if (!message.deleted) {
+ if (this.isRichPreview(message)) {
+ if (!message.meta.requiresConfirmation) {
+ subMessageComponent = [...subMessageComponent, JSX_(MetaRichpreview, {
+ key: "richprev",
+ message,
+ chatRoom
+ })];
+ } else if (!isBeingEdited()) {
+ if (message.source === Message.SOURCE.SENT || message.confirmed === true) {
+ subMessageComponent = [...subMessageComponent, JSX_(MetaRichprevConfirmation, {
+ key: "confirm",
+ message,
+ chatRoom
+ })];
+ }
+ }
+ }
+ if (message.megaLinks) {
+ subMessageComponent = [...subMessageComponent, JSX_(MetaRichpreviewMegaLinks, {
+ key: "richprevml",
+ message,
+ chatRoom
+ })];
+ }
+ }
+ let messageDisplayBlock;
+ if (isBeingEdited() === true) {
+ let msgContents = message.textContents;
+ msgContents = megaChat.plugins.emoticonsFilter.fromUtfToShort(msgContents);
+ messageDisplayBlock = JSX_(typingArea.T, {
+ iconClass: "small-icon writing-pen textarea-icon",
+ initialText: msgContents,
+ text: this.state.editText || msgContents,
+ chatRoom,
+ showButtons: true,
+ editing: true,
+ className: "edit-typing-area",
+ onUpdate: () => onUpdate ? onUpdate : null,
+ onConfirm: messageContents => {
+ this.props.onEditToggle(false);
+ if (this.props.onEditDone) {
+ Soon(() => {
+ const tmpMessageObj = {
+ textContents: messageContents
+ };
+ megaChat.plugins.emoticonsFilter.processOutgoingMessage({}, tmpMessageObj);
+ this.props.onEditDone(tmpMessageObj.textContents);
+ if (this.isMounted()) {
+ this.forceUpdate();
+ }
+ });
+ }
+ return true;
+ },
+ onResized: this.props.onResized ? this.props.onResized : false,
+ onValueChanged: val => {
+ this.setState({
+ editText: val
+ });
+ }
+ });
+ } else {
+ if (message.updated > 0 && !message.metaType) {
+ textMessage = `${textMessage} ${l[8887]} `;
+ }
+ if (this.props.initTextScrolling) {
+ messageDisplayBlock = JSX_(perfectScrollbar.O, {
+ className: "message text-block scroll"
+ }, JSX_("div", {
+ className: "message text-scroll"
+ }, JSX_(utils.P9, null, textMessage)));
+ } else {
+ messageDisplayBlock = JSX_("div", {
+ className: "message text-block"
+ }, JSX_(utils.P9, null, textMessage));
+ }
+ }
+ return JSX_(REaCt().Fragment, null, this.renderMessageIndicators(), IS_GEOLOCATION ? null : messageDisplayBlock, subMessageComponent, spinnerElement, IS_GEOLOCATION && JSX_(geoLocation, {
+ latitude,
+ lng
+ }));
+ }
+}
+// EXTERNAL MODULE: ./js/chat/ui/gifPanel/utils.jsx
+const gifPanel_utils = REQ_(1635);
+;// ./js/chat/ui/messages/types/giphy.jsx
+
+
+
+
+
+class Giphy extends AbstractGenericMessage {
+ constructor(...args) {
+ super(...args);
+ this.gifRef = REaCt().createRef();
+ this.viewStateListener = `viewstateChange.giphy--${this.getUniqueId()}`;
+ this.state = {
+ src: undefined
+ };
+ }
+ componentDidMount() {
+ super.componentDidMount();
+ megaChat.rebind(this.viewStateListener, ({
+ data
+ }) => {
+ const gifRef = this.gifRef && this.gifRef.current;
+ if (gifRef) {
+ const {
+ state
+ } = data;
+ if (state === 'active' && gifRef.paused || state !== 'active' && !gifRef.paused) {
+ this.toggle();
+ }
+ }
+ });
+ }
+ componentWillUnmount() {
+ super.componentWillUnmount();
+ megaChat.off(this.viewStateListener);
+ }
+ onVisibilityChange(isIntersecting) {
+ this.setState({
+ src: isIntersecting ? gifPanel_utils.nC.convert(this.props.message.meta.src) : undefined
+ }, () => {
+ let _this$gifRef;
+ (_this$gifRef = this.gifRef) == null || (_this$gifRef = _this$gifRef.current) == null || _this$gifRef[isIntersecting ? 'load' : 'pause']();
+ this.safeForceUpdate();
+ });
+ }
+ toggle() {
+ const video = this.gifRef.current;
+ Promise.resolve(video[video.paused ? 'play' : 'pause']()).catch(nop);
+ }
+ getMessageActionButtons() {
+ const {
+ onDelete,
+ message
+ } = this.props;
+ const $$BUTTONS = [message.isEditable() && JSX_(buttons.$, {
+ key: "delete-GIPHY-button",
+ className: "tiny-button",
+ icon: "sprite-fm-mono icon-options"
+ }, JSX_(dropdowns.ms, {
+ className: "white-context-menu attachments-dropdown",
+ noArrow: true,
+ positionMy: "left bottom",
+ positionAt: "right bottom",
+ horizOffset: 4
+ }, JSX_(dropdowns.tJ, {
+ icon: "sprite-fm-mono icon-dialog-close",
+ label: l[1730],
+ onClick: e => onDelete(e, message)
+ }))), super.getMessageActionButtons && super.getMessageActionButtons()];
+ return $$BUTTONS.filter(button => button);
+ }
+ getContents() {
+ const {
+ message,
+ hideActionButtons
+ } = this.props;
+ const {
+ s,
+ w,
+ h,
+ src
+ } = message.meta;
+ const autoPlay = parseInt(s, 10) < 4e6;
+ return JSX_("video", {
+ className: "giphy-block",
+ ref: this.gifRef,
+ title: message.textContents,
+ autoPlay,
+ loop: true,
+ muted: true,
+ controls: false,
+ width: w,
+ height: h,
+ style: {
+ cursor: autoPlay ? 'default' : 'pointer',
+ height: `${h}px`
+ },
+ onClick: () => !autoPlay && this.toggle(),
+ src: hideActionButtons ? gifPanel_utils.nC.convert(src) : this.state.src
+ });
+ }
+}
+;// ./js/chat/ui/messages/generic.jsx
+
+
+
+
+
+
+
+
+
+
+class GenericConversationMessage extends mixin.M {
+ constructor(props) {
+ super(props);
+ this.containerRef = REaCt().createRef();
+ this.state = {
+ editing: this.props.editing
+ };
+ this.pid = `__geom_${ String(Math.random()).substr(2)}`;
+ }
+ isBeingEdited() {
+ return this.state.editing === true || this.props.editing === true;
+ }
+ componentDidUpdate(oldProps, oldState) {
+ const isBeingEdited = this.isBeingEdited();
+ const isMounted = this.isMounted();
+ if (isBeingEdited && isMounted) {
+ let _this$containerRef;
+ const $generic = $((_this$containerRef = this.containerRef) == null ? void 0 : _this$containerRef.current);
+ const $textarea = $('textarea', $generic);
+ if ($textarea.length > 0 && !$textarea.is(":focus")) {
+ $textarea.trigger("focus");
+ moveCursortoToEnd($textarea[0]);
+ }
+ if (!oldState.editing && this.props.onEditStarted) {
+ this.props.onEditStarted($generic);
+ moveCursortoToEnd($textarea);
+ }
+ }
+ if (isMounted && !isBeingEdited && oldState.editing === true && this.props.onUpdate) {
+ this.props.onUpdate();
+ }
+ }
+ componentDidMount() {
+ let _this$containerRef2;
+ super.componentDidMount();
+ const $node = $((_this$containerRef2 = this.containerRef) == null ? void 0 : _this$containerRef2.current);
+ if (this.isBeingEdited() && this.isMounted()) {
+ const $textarea = $('textarea', $node);
+ if ($textarea.length > 0 && !$textarea.is(':focus')) {
+ $textarea.trigger('focus');
+ moveCursortoToEnd($textarea[0]);
+ }
+ }
+ }
+ haveMoreContactListeners() {
+ if (!this.props.message || !this.props.message.meta) {
+ return false;
+ }
+ if (this.props.message.meta && this.props.message.meta.participants) {
+ return this.props.message.meta.participants;
+ }
+ return false;
+ }
+ doDelete(e, msg) {
+ e.preventDefault(e);
+ e.stopPropagation(e);
+ if (msg.getState() === Message.STATE.NOT_SENT_EXPIRED) {
+ this.doCancelRetry(e, msg);
+ } else {
+ this.props.onDeleteClicked(this.props.message);
+ }
+ }
+ doCancelRetry(e, msg) {
+ e.preventDefault(e);
+ e.stopPropagation(e);
+ const {chatRoom} = this.props.message;
+ const {messageId} = msg;
+ chatRoom.messagesBuff.messages.removeByKey(messageId);
+ chatRoom.megaChat.plugins.chatdIntegration.discardMessage(chatRoom, messageId);
+ }
+ doRetry(e, msg) {
+ e.preventDefault(e);
+ e.stopPropagation(e);
+ const {chatRoom} = this.props.message;
+ this.doCancelRetry(e, msg);
+ chatRoom._sendMessageToTransport(msg).then(internalId => {
+ msg.internalId = internalId;
+ this.safeForceUpdate();
+ });
+ }
+ _favourite(h) {
+ if (M.isInvalidUserStatus()) {
+ return;
+ }
+ const newFavState = Number(!M.isFavourite(h));
+ M.favourite([h], newFavState);
+ }
+ _addFavouriteButtons(h, arr) {
+ const self = this;
+ if (M.getNodeRights(h) > 1) {
+ const isFav = M.isFavourite(h);
+ arr.push(JSX_(dropdowns.tJ, {
+ icon: `
+ sprite-fm-mono
+ context
+ ${isFav ? 'icon-favourite-removed' : 'icon-favourite'}
+ `,
+ label: isFav ? l[5872] : l[5871],
+ isFav,
+ key: "fav",
+ disabled: mega.paywall,
+ onClick: e => {
+ self._favourite(h);
+ e.stopPropagation();
+ e.preventDefault();
+ return false;
+ }
+ }));
+ return isFav;
+ }
+ return false;
+ }
+ _isNodeHavingALink(h) {
+ return M.getNodeShare(h) !== false;
+ }
+ _addLinkButtons(h, arr) {
+ const self = this;
+ const haveLink = self._isNodeHavingALink(h) === true;
+ const getManageLinkText = haveLink ? l[6909] : l[5622];
+ arr.push(JSX_(dropdowns.tJ, {
+ icon: `sprite-fm-mono icon-link${haveLink ? '-gear' : ''}`,
+ key: "getLinkButton",
+ label: getManageLinkText,
+ disabled: mega.paywall,
+ onClick: self._getLink.bind(self, h)
+ }));
+ if (haveLink) {
+ arr.push(JSX_(dropdowns.tJ, {
+ icon: "sprite-fm-mono context icon-link-remove",
+ key: "removeLinkButton",
+ label: l[6821],
+ disabled: mega.paywall,
+ onClick: self._removeLink.bind(self, h)
+ }));
+ return true;
+ }
+ return false;
+ }
+ _startDownload(v) {
+ M.addDownload([v]);
+ }
+ _addToCloudDrive(v, openSendToChat) {
+ $.selected = [v.h];
+ $.chatAttachmentShare = true;
+ if ($.dialog === 'onboardingDialog') {
+ closeDialog();
+ }
+ if (openSendToChat) {
+ openSendToChatDialog();
+ return;
+ }
+ openSaveToDialog(v, (node, target) => {
+ target = target || M.RootID;
+ M.injectNodes(node, target, res => {
+ if (!Array.isArray(res) || !res.length) {
+ if (d) {
+ console.warn('Unable to inject nodes... no longer existing?', res);
+ }
+ } else {
+ mega.ui.toast.show(mega.icu.format(l.toast_import_file, res.length).replace('%s', M.getNameByHandle(target)), 4, l[16797], {
+ actionButtonCallback() {
+ M.openFolder(target).then(() => {
+ if (window.selectionManager) {
+ let reset = false;
+ for (let i = res.length; i--;) {
+ const n = M.getNodeByHandle(res[i]);
+ if (n.p === target) {
+ if (reset) {
+ selectionManager.add_to_selection(n.h);
+ } else {
+ selectionManager.resetTo(n.h);
+ reset = true;
+ }
+ }
+ }
+ }
+ }).catch(dump);
+ }
+ });
+ }
+ });
+ }, false);
+ }
+ _getLink(h, e) {
+ if (u_type === 0) {
+ ephemeralDialog(l[1005]);
+ } else {
+ $.selected = [h];
+ mega.Share.initCopyrightsDialog([h]);
+ }
+ if (e) {
+ e.preventDefault();
+ e.stopPropagation();
+ }
+ }
+ _removeLink(h, e) {
+ if (u_type === 0) {
+ ephemeralDialog(l[1005]);
+ } else {
+ const exportLink = new mega.Share.ExportLink({
+ 'updateUI': true,
+ 'nodesToProcess': [h]
+ });
+ exportLink.removeExportLink();
+ }
+ if (e) {
+ e.preventDefault();
+ e.stopPropagation();
+ }
+ }
+ _startPreview(v, e) {
+ if ($(e && e.target).is('.tiny-button')) {
+ return;
+ }
+ assert(M.chat, 'Not in chat.');
+ if (e) {
+ e.preventDefault();
+ e.stopPropagation();
+ }
+ M.viewMediaFile(v);
+ }
+ render() {
+ const {
+ message,
+ chatRoom
+ } = this.props;
+ const {megaChat} = this.props.message.chatRoom;
+ const {textContents} = message;
+ let additionalClasses = "";
+ let spinnerElement = null;
+ let messageIsNowBeingSent = false;
+ if (this.props.className) {
+ additionalClasses += this.props.className;
+ }
+ if (message instanceof Message) {
+ if (!message.wasRendered || !message.messageHtml) {
+ message.messageHtml = htmlentities(textContents).replace(/\n/gi, "') && message.messageHtml.includes('')) {
- returnedButtons.push(REaCt().createElement(buttons.$, {
- key: "copy-msg",
- className: "tiny-button simpletip copy-txt-block",
- icon: "sprite-fm-mono icon-copy",
- attrs: {
- 'data-simpletip': l.copy_txt_block_tip,
- 'data-simpletipoffset': '3',
- 'data-simpletipposition': 'top'
- },
- onClick: () => {
- copyToClipboard(message.textContents.replace(/```/g, ''), l.copy_txt_block_toast);
- }
- }));
- }
- if (parentButtons) {
- returnedButtons.push(parentButtons);
+ shouldComponentUpdate(nextProps, nextState) {
+ if (!this.dialogBecameVisible) {
+ return false;
}
- return returnedButtons;
+ return super.shouldComponentUpdate(nextProps, nextState);
}
- getContents() {
- const {
- message,
- chatRoom,
- onUpdate,
- isBeingEdited,
- spinnerElement
- } = this.props;
- let textMessage = message.messageHtml;
- const IS_GEOLOCATION = this.isGeoLocation(message);
- const {
- lng,
- la: latitude
- } = IS_GEOLOCATION && message.meta.extra[0];
- if (message.textContents === '' && !message.dialogType) {
- message.deleted = true;
- }
- let subMessageComponent = [];
- if (!message.deleted) {
- if (this.isRichPreview(message)) {
- if (!message.meta.requiresConfirmation) {
- subMessageComponent = [...subMessageComponent, REaCt().createElement(MetaRichpreview, {
- key: "richprev",
- message,
- chatRoom
- })];
- } else if (!isBeingEdited()) {
- if (message.source === Message.SOURCE.SENT || message.confirmed === true) {
- subMessageComponent = [...subMessageComponent, REaCt().createElement(MetaRichprevConfirmation, {
- key: "confirm",
- message,
- chatRoom
- })];
- }
- }
+ componentDidMount() {
+ super.componentDidMount();
+ M.safeShowDialog(this.dialogName, () => {
+ if (!this.isMounted()) {
+ throw new Error(`${this.dialogName} component is no longer mounted.`);
}
- if (message.megaLinks) {
- subMessageComponent = [...subMessageComponent, REaCt().createElement(MetaRichpreviewMegaLinks, {
- key: "richprevml",
- message,
- chatRoom
- })];
+ this.dialogBecameVisible = 1;
+ this.forceUpdate();
+ });
+ }
+ componentWillUnmount() {
+ super.componentWillUnmount();
+ if (this.dialogBecameVisible) {
+ this.dialogBecameVisible = false;
+ console.assert($.dialog === this.dialogName);
+ if ($.dialog === this.dialogName) {
+ closeDialog();
}
}
- let messageDisplayBlock;
- if (isBeingEdited() === true) {
- let msgContents = message.textContents;
- msgContents = megaChat.plugins.emoticonsFilter.fromUtfToShort(msgContents);
- messageDisplayBlock = REaCt().createElement(typingArea.T, {
- iconClass: "small-icon writing-pen textarea-icon",
- initialText: msgContents,
- text: this.state.editText || msgContents,
- chatRoom,
- showButtons: true,
- editing: true,
- className: "edit-typing-area",
- onUpdate: () => onUpdate ? onUpdate : null,
- onConfirm: messageContents => {
- this.props.onEditToggle(false);
- if (this.props.onEditDone) {
- Soon(() => {
- const tmpMessageObj = {
- textContents: messageContents
- };
- megaChat.plugins.emoticonsFilter.processOutgoingMessage({}, tmpMessageObj);
- this.props.onEditDone(tmpMessageObj.textContents);
- if (this.isMounted()) {
- this.forceUpdate();
- }
- });
- }
- return true;
- },
- onResized: this.props.onResized ? this.props.onResized : false,
- onValueChanged: val => {
- this.setState({
- editText: val
- });
+ }
+ componentDidUpdate() {
+ assert(this.dialogBecameVisible);
+ super.componentDidUpdate();
+ if (++this.dialogBecameVisible === 2) {
+ requestAnimationFrame(() => {
+ const dialog = document.querySelectorAll(`.${this.dialogName}`);
+ console.assert(dialog.length === 1, `Unexpected ${this.dialogName} state.`);
+ console.assert($.dialog === this.dialogName, `${this.dialogName} state overridden.`);
+ if (dialog.length === 1 && $.dialog === this.dialogName) {
+ dialog[0].classList.remove('hidden', 'arrange-to-back');
}
});
- } else {
- if (message.updated > 0 && !message.metaType) {
- textMessage = `${textMessage} ${l[8887]} `;
- }
- if (this.props.initTextScrolling) {
- messageDisplayBlock = REaCt().createElement(perfectScrollbar.O, {
- className: "message text-block scroll"
- }, REaCt().createElement("div", {
- className: "message text-scroll"
- }, REaCt().createElement(utils.P9, null, textMessage)));
- } else {
- messageDisplayBlock = REaCt().createElement("div", {
- className: "message text-block"
- }, REaCt().createElement(utils.P9, null, textMessage));
- }
}
- return REaCt().createElement(REaCt().Fragment, null, this.renderMessageIndicators(), IS_GEOLOCATION ? null : messageDisplayBlock, subMessageComponent, spinnerElement, IS_GEOLOCATION && REaCt().createElement(geoLocation, {
- latitude,
- lng
- }));
}
}
-// EXTERNAL MODULE: ./js/chat/ui/gifPanel/gifPanel.jsx + 3 modules
-const gifPanel = REQ_(691);
-;// ./js/chat/ui/messages/types/giphy.jsx
-
-
-
-
-
-class Giphy extends AbstractGenericMessage {
- constructor(...args) {
- super(...args);
- this.gifRef = REaCt().createRef();
- this.viewStateListener = `viewstateChange.giphy--${this.getUniqueId()}`;
- this.state = {
- src: undefined
- };
+class ModalDialog extends mixins.w9 {
+ constructor(props) {
+ super(props);
+ this.domRef = REaCt().createRef();
+ this.onBlur = this.onBlur.bind(this);
+ this.onCloseClicked = this.onCloseClicked.bind(this);
+ this.onPopupDidMount = this.onPopupDidMount.bind(this);
}
componentDidMount() {
super.componentDidMount();
- megaChat.rebind(this.viewStateListener, ({
- data
- }) => {
- const gifRef = this.gifRef && this.gifRef.current;
- if (gifRef) {
- const {
- state
- } = data;
- if (state === 'active' && gifRef.paused || state !== 'active' && !gifRef.paused) {
- this.toggle();
+ if (!this.props.hideOverlay) {
+ $(document.body).addClass('overlayed');
+ $('.fm-dialog-overlay').removeClass('hidden');
+ }
+ $('textarea:focus').trigger("blur");
+ if (!this.props.noCloseOnClickOutside) {
+ const convApp = document.querySelector('.conversationsApp');
+ if (convApp) {
+ convApp.removeEventListener('click', this.onBlur);
+ convApp.addEventListener('click', this.onBlur);
+ }
+ $('.fm-modal-dialog').rebind(`click.modalDialogOv${ this.getUniqueId()}`, ({
+ target
+ }) => {
+ if ($(target).is('.fm-modal-dialog')) {
+ this.onBlur();
+ }
+ });
+ $('.fm-dialog-overlay').rebind(`click.modalDialog${ this.getUniqueId()}`, () => {
+ if (this.props.closeDlgOnClickOverlay) {
+ this.onBlur();
}
+ return false;
+ });
+ }
+ $(document).rebind(`keyup.modalDialog${ this.getUniqueId()}`, ({
+ keyCode
+ }) => {
+ if (!this.props.stopKeyPropagation && keyCode === 27) {
+ this.onBlur();
}
});
}
+ onBlur(e) {
+ let _this$domRef;
+ const $element = $((_this$domRef = this.domRef) == null ? void 0 : _this$domRef.current);
+ if (!e || !$(e.target).closest('.mega-dialog').is($element)) {
+ const convApp = document.querySelector('.conversationsApp');
+ if (convApp) {
+ convApp.removeEventListener('click', this.onBlur);
+ }
+ this.onCloseClicked();
+ }
+ }
componentWillUnmount() {
+ let _this$props$popupWill, _this$props;
super.componentWillUnmount();
- megaChat.off(this.viewStateListener);
+ if (!this.props.noCloseOnClickOutside) {
+ const convApp = document.querySelector('.conversationsApp');
+ if (convApp) {
+ convApp.removeEventListener('click', this.onBlur);
+ }
+ $('.fm-dialog-overlay').off(`click.modalDialog${ this.getUniqueId()}`);
+ }
+ if (!this.props.hideOverlay) {
+ $(document.body).removeClass('overlayed');
+ $('.fm-dialog-overlay').addClass('hidden');
+ }
+ $(this.domNode).off(`dialog-closed.modalDialog${ this.getUniqueId()}`);
+ $(document).off(`keyup.modalDialog${ this.getUniqueId()}`);
+ (_this$props$popupWill = (_this$props = this.props).popupWillUnmount) == null || _this$props$popupWill.call(_this$props);
}
- onVisibilityChange(isIntersecting) {
- this.setState({
- src: isIntersecting ? gifPanel.nC.convert(this.props.message.meta.src) : undefined
- }, () => {
- let _this$gifRef;
- (_this$gifRef = this.gifRef) == null || (_this$gifRef = _this$gifRef.current) == null || _this$gifRef[isIntersecting ? 'load' : 'pause']();
- this.safeForceUpdate();
- });
+ onCloseClicked() {
+ const self = this;
+ if (self.props.onClose) {
+ self.props.onClose(self);
+ }
}
- toggle() {
- const video = this.gifRef.current;
- Promise.resolve(video[video.paused ? 'play' : 'pause']()).catch(nop);
+ onPopupDidMount(elem) {
+ this.domNode = elem;
+ $(elem).rebind(`dialog-closed.modalDialog${ this.getUniqueId()}`, () => this.onCloseClicked());
+ if (this.props.popupDidMount) {
+ this.props.popupDidMount(elem);
+ }
}
- getMessageActionButtons() {
- const {
- onDelete,
- message
- } = this.props;
- const $$BUTTONS = [message.isEditable() && REaCt().createElement(buttons.$, {
- key: "delete-GIPHY-button",
- className: "tiny-button",
- icon: "sprite-fm-mono icon-options"
- }, REaCt().createElement(dropdowns.Dropdown, {
- className: "white-context-menu attachments-dropdown",
- noArrow: true,
- positionMy: "left bottom",
- positionAt: "right bottom",
- horizOffset: 4
- }, REaCt().createElement(dropdowns.DropdownItem, {
- icon: "sprite-fm-mono icon-dialog-close",
- label: l[1730],
- onClick: e => onDelete(e, message)
- }))), super.getMessageActionButtons && super.getMessageActionButtons()];
- return $$BUTTONS.filter(button => button);
- }
- getContents() {
- const {
- message,
- hideActionButtons
- } = this.props;
- const {
- s,
- w,
- h,
- src
- } = message.meta;
- const autoPlay = parseInt(s, 10) < 4e6;
- return REaCt().createElement("video", {
- className: "giphy-block",
- ref: this.gifRef,
- title: message.textContents,
- autoPlay,
- loop: true,
- muted: true,
- controls: false,
- width: w,
- height: h,
- style: {
- cursor: autoPlay ? 'default' : 'pointer',
- height: `${h}px`
- },
- onClick: () => !autoPlay && this.toggle(),
- src: hideActionButtons ? gifPanel.nC.convert(src) : this.state.src
+ render() {
+ const self = this;
+ let classes = 'mega-dialog';
+ let selectedNumEle = null;
+ let footer = null;
+ const extraFooterElements = [];
+ const otherElements = [];
+ let x = 0;
+ REaCt().Children.forEach(self.props.children, (child) => {
+ if (!child) {
+ return;
+ }
+ if (child.type.name === 'ExtraFooterElement') {
+ extraFooterElements.push(REaCt().cloneElement(child, {
+ key: x++
+ }));
+ } else {
+ otherElements.push(REaCt().cloneElement(child, {
+ key: x++
+ }));
+ }
});
+ if (self.props.className) {
+ classes += ` ${self.props.className}`;
+ }
+ if (self.props.dialogType) {
+ classes += ` dialog-template-${self.props.dialogType}`;
+ }
+ if (self.props.dialogName) {
+ classes += ` ${self.props.dialogName}`;
+ }
+ if (self.props.showSelectedNum && self.props.selectedNum) {
+ selectedNumEle = JSX_("div", {
+ className: "selected-num"
+ }, JSX_("span", null, self.props.selectedNum));
+ }
+ let buttons;
+ if (self.props.buttons) {
+ buttons = [];
+ self.props.buttons.forEach((v, i) => {
+ if (v) {
+ buttons.push(JSX_("button", {
+ className: (v.defaultClassname ? v.defaultClassname : "mega-button") + (v.className ? ` ${ v.className}` : "") + (self.props.dialogType === "action" ? "large" : ""),
+ onClick: e => {
+ if ($(e.target).is(".disabled")) {
+ return false;
+ }
+ if (v.onClick) {
+ v.onClick(e, self);
+ }
+ },
+ key: v.key + i
+ }, v.iconBefore ? JSX_("div", null, JSX_("i", {
+ className: v.iconBefore
+ })) : null, JSX_("span", null, v.label), v.iconAfter ? JSX_("div", null, JSX_("i", {
+ className: v.iconAfter
+ })) : null));
+ }
+ });
+ if (buttons && buttons.length > 0 || extraFooterElements && extraFooterElements.length > 0) {
+ footer = JSX_("footer", null, buttons && buttons.length > 0 ? JSX_("div", {
+ className: "footer-container"
+ }, buttons) : null, extraFooterElements && extraFooterElements.length > 0 ? JSX_("aside", null, extraFooterElements) : null);
+ }
+ }
+ return JSX_(utils.Ay.RenderTo, {
+ element: document.body,
+ className: "fm-modal-dialog",
+ popupDidMount: this.onPopupDidMount
+ }, JSX_("div", {
+ ref: this.domRef,
+ id: self.props.id,
+ className: classes,
+ "aria-labelledby": self.props.dialogName ? `${self.props.dialogName }-title` : null,
+ role: "dialog",
+ "aria-modal": "true",
+ onClick: self.props.onClick
+ }, JSX_("button", {
+ className: "close",
+ onClick: self.onCloseClicked
+ }, JSX_("i", {
+ className: "sprite-fm-mono icon-dialog-close"
+ })), self.props.title ? self.props.dialogType === "message" ? JSX_("header", null, self.props.icon ? JSX_("i", {
+ className: `graphic ${self.props.icon}`
+ }) : self.props.iconElement, JSX_("div", null, JSX_("h3", {
+ id: self.props.dialogName ? `${self.props.dialogName }-title` : null
+ }, self.props.title, selectedNumEle), self.props.subtitle ? JSX_("p", null, self.props.subtitle) : null, otherElements)) : JSX_("header", null, self.props.icon ? JSX_("i", {
+ className: `graphic ${self.props.icon}`
+ }) : self.props.iconElement, JSX_("h2", {
+ id: self.props.dialogName ? `${self.props.dialogName }-title` : null
+ }, self.props.title, selectedNumEle), self.props.subtitle ? JSX_("p", null, self.props.subtitle) : null) : null, self.props.dialogType !== "message" ? otherElements : null, buttons || extraFooterElements ? footer : null));
}
}
-;// ./js/chat/ui/messages/generic.jsx
-
-
-
-
-
-
-
-
-
-
-class GenericConversationMessage extends mixin.M {
+ModalDialog.defaultProps = {
+ 'hideable': true,
+ 'noCloseOnClickOutside': false,
+ 'closeDlgOnClickOverlay': true,
+ 'showSelectedNum': false,
+ 'selectedNum': 0
+};
+class SelectContactDialog extends mixins.w9 {
constructor(props) {
super(props);
- this.containerRef = REaCt().createRef();
+ this.dialogName = 'send-contact-dialog';
this.state = {
- editing: this.props.editing
+ selected: []
};
- this.pid = `__geom_${ String(Math.random()).substr(2)}`;
- }
- isBeingEdited() {
- return this.state.editing === true || this.props.editing === true;
+ this.state.selected = this.props.selected || [];
+ this.onSelected = this.onSelected.bind(this);
}
- componentDidUpdate(oldProps, oldState) {
- const isBeingEdited = this.isBeingEdited();
- const isMounted = this.isMounted();
- if (isBeingEdited && isMounted) {
- let _this$containerRef;
- const $generic = $((_this$containerRef = this.containerRef) == null ? void 0 : _this$containerRef.current);
- const $textarea = $('textarea', $generic);
- if ($textarea.length > 0 && !$textarea.is(":focus")) {
- $textarea.trigger("focus");
- moveCursortoToEnd($textarea[0]);
- }
- if (!oldState.editing && this.props.onEditStarted) {
- this.props.onEditStarted($generic);
- moveCursortoToEnd($textarea);
- }
- }
- if (isMounted && !isBeingEdited && oldState.editing === true && this.props.onUpdate) {
- this.props.onUpdate();
- }
+ onSelected(nodes) {
+ let _this$props$onSelecte, _this$props2;
+ this.setState({
+ selected: nodes
+ });
+ (_this$props$onSelecte = (_this$props2 = this.props).onSelected) == null || _this$props$onSelecte.call(_this$props2, nodes);
}
componentDidMount() {
- let _this$containerRef2;
super.componentDidMount();
- const $node = $((_this$containerRef2 = this.containerRef) == null ? void 0 : _this$containerRef2.current);
- if (this.isBeingEdited() && this.isMounted()) {
- const $textarea = $('textarea', $node);
- if ($textarea.length > 0 && !$textarea.is(':focus')) {
- $textarea.trigger('focus');
- moveCursortoToEnd($textarea[0]);
- }
- }
+ M.safeShowDialog(this.dialogName, () => $(`.${this.dialogName}`));
}
- haveMoreContactListeners() {
- if (!this.props.message || !this.props.message.meta) {
- return false;
- }
- if (this.props.message.meta && this.props.message.meta.participants) {
- return this.props.message.meta.participants;
+ componentWillUnmount() {
+ super.componentWillUnmount();
+ if ($.dialog === this.dialogName) {
+ closeDialog();
}
- return false;
}
- doDelete(e, msg) {
- e.preventDefault(e);
- e.stopPropagation(e);
- if (msg.getState() === Message.STATE.NOT_SENT_EXPIRED) {
- this.doCancelRetry(e, msg);
- } else {
- this.props.onDeleteClicked(this.props.message);
- }
- }
- doCancelRetry(e, msg) {
- e.preventDefault(e);
- e.stopPropagation(e);
- const {chatRoom} = this.props.message;
- const {messageId} = msg;
- chatRoom.messagesBuff.messages.removeByKey(messageId);
- chatRoom.megaChat.plugins.chatdIntegration.discardMessage(chatRoom, messageId);
- }
- doRetry(e, msg) {
- e.preventDefault(e);
- e.stopPropagation(e);
- const {chatRoom} = this.props.message;
- this.doCancelRetry(e, msg);
- chatRoom._sendMessageToTransport(msg).then(internalId => {
- msg.internalId = internalId;
- this.safeForceUpdate();
- });
+ render() {
+ return JSX_(ModalDialog, {
+ title: l.share_contact_title,
+ className: `
+ send-contact
+ contrast
+ small-footer
+ dialog-template-tool
+ ${this.props.className}
+ ${this.dialogName}
+ `,
+ selected: this.state.selected,
+ buttons: [{
+ key: "cancel",
+ label: this.props.cancelLabel,
+ onClick: ev => {
+ this.props.onClose();
+ ev.preventDefault();
+ ev.stopPropagation();
+ }
+ }, {
+ key: "select",
+ label: this.props.selectLabel,
+ className: this.state.selected.length === 0 ? 'positive disabled' : 'positive',
+ onClick: ev => {
+ if (this.state.selected.length > 0) {
+ let _this$props$onSelecte2, _this$props3;
+ (_this$props$onSelecte2 = (_this$props3 = this.props).onSelected) == null || _this$props$onSelecte2.call(_this$props3, this.state.selected);
+ this.props.onSelectClicked(this.state.selected);
+ }
+ ev.preventDefault();
+ ev.stopPropagation();
+ }
+ }],
+ onClose: this.props.onClose
+ }, JSX_("section", {
+ className: "content"
+ }, JSX_("div", {
+ className: "content-block"
+ }, JSX_(contacts.hU, {
+ megaChat: this.props.megaChat,
+ exclude: this.props.exclude,
+ selectableContacts: "true",
+ onSelectDone: this.props.onSelectClicked,
+ onSelected: this.onSelected,
+ onClose: this.props.onClose,
+ selected: this.state.selected,
+ contacts: M.u,
+ headerClasses: "left-aligned",
+ multiple: true
+ }))));
}
- _favourite(h) {
- if (M.isInvalidUserStatus()) {
- return;
- }
- const newFavState = Number(!M.isFavourite(h));
- M.favourite([h], newFavState);
+}
+SelectContactDialog.clickTime = 0;
+SelectContactDialog.defaultProps = {
+ selectLabel: l.share_contact_action,
+ cancelLabel: l.msg_dlg_cancel,
+ hideable: true
+};
+class ConfirmDialog extends mixins.w9 {
+ static saveState(o) {
+ const state = mega.config.get('xcod') >>> 0;
+ mega.config.set('xcod', state | 1 << o.props.pref);
}
- _addFavouriteButtons(h, arr) {
- const self = this;
- if (M.getNodeRights(h) > 1) {
- const isFav = M.isFavourite(h);
- arr.push(REaCt().createElement(dropdowns.DropdownItem, {
- icon: `
- sprite-fm-mono
- context
- ${isFav ? 'icon-favourite-removed' : 'icon-favourite'}
- `,
- label: isFav ? l[5872] : l[5871],
- isFav,
- key: "fav",
- disabled: mega.paywall,
- onClick: e => {
- self._favourite(h);
- e.stopPropagation();
- e.preventDefault();
- return false;
- }
- }));
- return isFav;
- }
- return false;
+ static clearState(o) {
+ const state = mega.config.get('xcod') >>> 0;
+ mega.config.set('xcod', state & ~(1 << o.props.pref));
}
- _isNodeHavingALink(h) {
- return M.getNodeShare(h) !== false;
+ static autoConfirm(o) {
+ console.assert(o.props.pref > 0);
+ const state = mega.config.get('xcod') >>> 0;
+ return !!(state & 1 << o.props.pref);
}
- _addLinkButtons(h, arr) {
- const self = this;
- const haveLink = self._isNodeHavingALink(h) === true;
- const getManageLinkText = haveLink ? l[6909] : l[5622];
- arr.push(REaCt().createElement(dropdowns.DropdownItem, {
- icon: `sprite-fm-mono icon-link${haveLink ? '-gear' : ''}`,
- key: "getLinkButton",
- label: getManageLinkText,
- disabled: mega.paywall,
- onClick: self._getLink.bind(self, h)
- }));
- if (haveLink) {
- arr.push(REaCt().createElement(dropdowns.DropdownItem, {
- icon: "sprite-fm-mono context icon-link-remove",
- key: "removeLinkButton",
- label: l[6821],
- disabled: mega.paywall,
- onClick: self._removeLink.bind(self, h)
- }));
- return true;
- }
- return false;
+ constructor(props) {
+ super(props);
+ this.dialogName = 'confirm-dialog';
+ this._wasAutoConfirmed = undefined;
+ this._keyUpEventName = `keyup.confirmDialog${ this.getUniqueId()}`;
+ this.dialogName = this.props.name || this.dialogName;
+ lazy(this, '_autoConfirm', () => this.props.onConfirmClicked && this.props.dontShowAgainCheckbox && ConfirmDialog.autoConfirm(this));
}
- _startDownload(v) {
- M.addDownload([v]);
+ unbindEvents() {
+ $(document).off(this._keyUpEventName);
}
- _addToCloudDrive(v, openSendToChat) {
- $.selected = [v.h];
- $.chatAttachmentShare = true;
- if ($.dialog === 'onboardingDialog') {
- closeDialog();
- }
- if (openSendToChat) {
- openSendToChatDialog();
- return;
- }
- openSaveToDialog(v, (node, target) => {
- target = target || M.RootID;
- M.injectNodes(node, target, res => {
- if (!Array.isArray(res) || !res.length) {
- if (d) {
- console.warn('Unable to inject nodes... no longer existing?', res);
+ componentDidMount() {
+ super.componentDidMount();
+ M.safeShowDialog(this.dialogName, () => {
+ queueMicrotask(() => {
+ if (!this.isMounted()) {
+ return;
+ }
+ if (this._autoConfirm) {
+ if (!this._wasAutoConfirmed) {
+ this._wasAutoConfirmed = 1;
+ queueMicrotask(() => {
+ this.onConfirmClicked();
+ });
}
- } else {
- mega.ui.toast.show(mega.icu.format(l.toast_import_file, res.length).replace('%s', M.getNameByHandle(target)), 4, l[16797], {
- actionButtonCallback() {
- M.openFolder(target).then(() => {
- if (window.selectionManager) {
- let reset = false;
- for (let i = res.length; i--;) {
- const n = M.getNodeByHandle(res[i]);
- if (n.p === target) {
- if (reset) {
- selectionManager.add_to_selection(n.h);
- } else {
- selectionManager.resetTo(n.h);
- reset = true;
- }
- }
- }
- }
- }).catch(dump);
- }
- });
+ return;
}
+ $(document).rebind(this._keyUpEventName, e => {
+ if (e.which === 13 || e.keyCode === 13) {
+ if (!this.isMounted()) {
+ this.unbindEvents();
+ return;
+ }
+ this.onConfirmClicked();
+ return false;
+ }
+ });
});
- }, false);
+ });
}
- _getLink(h, e) {
- if (u_type === 0) {
- ephemeralDialog(l[1005]);
- } else {
- $.selected = [h];
- mega.Share.initCopyrightsDialog([h]);
- }
- if (e) {
- e.preventDefault();
- e.stopPropagation();
+ componentWillUnmount() {
+ super.componentWillUnmount();
+ this.unbindEvents();
+ if ($.dialog === this.dialogName) {
+ closeDialog();
}
+ delete this._wasAutoConfirmed;
}
- _removeLink(h, e) {
- if (u_type === 0) {
- ephemeralDialog(l[1005]);
- } else {
- const exportLink = new mega.Share.ExportLink({
- 'updateUI': true,
- 'nodesToProcess': [h]
- });
- exportLink.removeExportLink();
- }
- if (e) {
- e.preventDefault();
- e.stopPropagation();
+ onConfirmClicked() {
+ this.unbindEvents();
+ if (this.props.onConfirmClicked) {
+ this.props.onConfirmClicked();
}
}
- _startPreview(v, e) {
- if ($(e && e.target).is('.tiny-button')) {
- return;
+ render() {
+ const self = this;
+ if (this._autoConfirm) {
+ return null;
}
- assert(M.chat, 'Not in chat.');
- if (e) {
- e.preventDefault();
- e.stopPropagation();
+ const classes = `delete-message${ self.props.name ? ` ${self.props.name}` : "" }${self.props.className ? ` ${self.props.className}` : ""}`;
+ let dontShowCheckbox = null;
+ if (self.props.dontShowAgainCheckbox) {
+ dontShowCheckbox = JSX_("div", {
+ className: "footer-checkbox"
+ }, JSX_(ui_forms.Checkbox, {
+ name: "delete-confirm",
+ id: "delete-confirm",
+ onLabelClick: (e, state) => {
+ if (state === true) {
+ ConfirmDialog.saveState(self);
+ } else {
+ ConfirmDialog.clearState(self);
+ }
+ }
+ }, l[7039]));
}
- M.viewMediaFile(v);
- }
- render() {
- const {
- message,
- chatRoom
- } = this.props;
- const {megaChat} = this.props.message.chatRoom;
- const {textContents} = message;
- let additionalClasses = "";
- let spinnerElement = null;
- let messageIsNowBeingSent = false;
- if (this.props.className) {
- additionalClasses += this.props.className;
- }
- if (message instanceof Message) {
- if (!message.wasRendered || !message.messageHtml) {
- message.messageHtml = htmlentities(textContents).replace(/\n/gi, "