refactored effects dir and changed effects exported name

This commit is contained in:
nurjinn jafar 2020-11-27 14:54:21 +01:00
parent ede67684e4
commit 6ce5d3b044
9 changed files with 110 additions and 48 deletions

View file

@ -46,7 +46,7 @@ import { EffectiveMembership, getEffectiveMembership, leaveRoomBehaviour } from
import SdkConfig from "./SdkConfig";
import SettingsStore from "./settings/SettingsStore";
import {UIFeature} from "./settings/UIFeature";
import effects from "./components/views/elements/effects"
import {CHAT_EFFECTS} from "./effects"
import CallHandler from "./CallHandler";
// XXX: workaround for https://github.com/microsoft/TypeScript/issues/31816
@ -1097,7 +1097,7 @@ export const Commands = [
hideCompletionAfterSpace: true,
}),
...effects.map((effect) => {
...CHAT_EFFECTS.map((effect) => {
return new Command({
command: effect.command,
description: effect.description(),

View file

@ -69,9 +69,9 @@ import AuxPanel from "../views/rooms/AuxPanel";
import RoomHeader from "../views/rooms/RoomHeader";
import {XOR} from "../../@types/common";
import { IThreepidInvite } from "../../stores/ThreepidInviteStore";
import EffectsOverlay from "../views/elements/effects/EffectsOverlay";
import {containsEmoji} from '../views/elements/effects/effectUtilities';
import effects from '../views/elements/effects'
import EffectsOverlay from "../views/elements/EffectsOverlay";
import {containsEmoji} from '../../effects/effectUtilities';
import {CHAT_EFFECTS} from '../../effects'
import { CallState, MatrixCall } from "matrix-js-sdk/src/webrtc/call";
import WidgetStore from "../../stores/WidgetStore";
import {UPDATE_EVENT} from "../../stores/AsyncStore";
@ -802,9 +802,9 @@ export default class RoomView extends React.Component<IProps, IState> {
if (!this.state.room ||
!this.state.matrixClientIsReady ||
this.state.room.getUnreadNotificationCount() === 0) return;
effects.forEach(effect => {
CHAT_EFFECTS.forEach(effect => {
if (containsEmoji(ev.getContent(), effect.emojis) || ev.getContent().msgtype === effect.msgType) {
dis.dispatch({action: `effects.${effect.command}`});
dis.dispatch({action: `CHAT_EFFECTS.${effect.command}`});
}
})
};

View file

@ -1,7 +1,24 @@
/*
Copyright 2020 Nurjin Jafar
Copyright 2020 Nordeck IT + Consulting GmbH.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
import React, { FunctionComponent, useEffect, useRef } from 'react';
import dis from '../../../../dispatcher/dispatcher';
import ICanvasEffect, { ICanvasEffectConstructable } from './ICanvasEffect.js';
import effects from './index'
import dis from '../../../dispatcher/dispatcher';
import ICanvasEffect, { ICanvasEffectConstructable } from '../../../effects/ICanvasEffect.js';
import {CHAT_EFFECTS} from '../../../effects'
export type EffectsOverlayProps = {
roomWidth: number;
@ -15,7 +32,7 @@ const EffectsOverlay: FunctionComponent<EffectsOverlayProps> = ({ roomWidth }) =
if (!name) return null;
let effect: ICanvasEffect | null = effectsRef.current[name] || null;
if (effect === null) {
const options = effects.find((e) => e.command === name)?.options
const options = CHAT_EFFECTS.find((e) => e.command === name)?.options
try {
const { default: Effect }: { default: ICanvasEffectConstructable } = await import(`./${name}`);
effect = new Effect(options);

View file

@ -1,8 +0,0 @@
/**
* Checks a message if it contains one of the provided emojis
* @param {Object} content The message
* @param {Array<string>} emojis The list of emojis to check for
*/
export const containsEmoji = (content: { msgtype: string, body: string }, emojis: Array<string>): boolean => {
return emojis.some((emoji) => content.body && content.body.includes(emoji));
}

View file

@ -42,8 +42,8 @@ import {Key, isOnlyCtrlOrCmdKeyEvent} from "../../../Keyboard";
import MatrixClientContext from "../../../contexts/MatrixClientContext";
import RateLimitedFunc from '../../../ratelimitedfunc';
import {Action} from "../../../dispatcher/actions";
import {containsEmoji} from "../elements/effects/effectUtilities";
import effects from '../elements/effects';
import {containsEmoji} from "../../../effects/effectUtilities";
import {CHAT_EFFECTS} from '../../../effects';
import SettingsStore from "../../../settings/SettingsStore";
import CountlyAnalytics from "../../../CountlyAnalytics";
@ -328,7 +328,7 @@ export default class SendMessageComposer extends React.Component {
});
}
dis.dispatch({action: "message_sent"});
effects.forEach((effect) => {
CHAT_EFFECTS.forEach((effect) => {
if (containsEmoji(content, effect.emojis)) {
dis.dispatch({action: `effects.${effect.command}`});
}

View file

@ -1,3 +1,20 @@
/*
Copyright 2020 Nurjin Jafar
Copyright 2020 Nordeck IT + Consulting GmbH.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
/**
* Defines the constructor of a canvas based room effect
*/

View file

@ -1,12 +1,22 @@
/*
Copyright 2020 Nurjin Jafar
Copyright 2020 Nordeck IT + Consulting GmbH.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
import ICanvasEffect from '../ICanvasEffect';
declare global {
interface Window {
mozRequestAnimationFrame: any;
oRequestAnimationFrame: any;
msRequestAnimationFrame: any;
}
}
export type ConfettiOptions = {
/**
@ -58,11 +68,7 @@ export default class Confetti implements ICanvasEffect {
}
private context: CanvasRenderingContext2D | null = null;
private supportsAnimationFrame = window.requestAnimationFrame ||
window.webkitRequestAnimationFrame ||
window.mozRequestAnimationFrame ||
window.oRequestAnimationFrame ||
window.msRequestAnimationFrame;
private supportsAnimationFrame = window.requestAnimationFrame;
private colors = ['rgba(30,144,255,', 'rgba(107,142,35,', 'rgba(255,215,0,',
'rgba(255,192,203,', 'rgba(106,90,205,', 'rgba(173,216,230,',
'rgba(238,130,238,', 'rgba(152,251,152,', 'rgba(70,130,180,',
@ -78,16 +84,6 @@ export default class Confetti implements ICanvasEffect {
if (!canvas) {
return;
}
window.requestAnimationFrame = (function() {
return window.requestAnimationFrame ||
window.webkitRequestAnimationFrame ||
window.mozRequestAnimationFrame ||
window.oRequestAnimationFrame ||
window.msRequestAnimationFrame ||
function(callback) {
return window.setTimeout(callback, this.options.frameInterval);
};
})();
this.context = canvas.getContext('2d');
this.particles = [];
const count = this.options.maxCount;

View file

@ -0,0 +1,25 @@
/*
Copyright 2020 Nurjin Jafar
Copyright 2020 Nordeck IT + Consulting GmbH.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
/**
* Checks a message if it contains one of the provided emojis
* @param {Object} content The message
* @param {Array<string>} emojis The list of emojis to check for
*/
export const containsEmoji = (content: { msgtype: string, body: string }, emojis: Array<string>): boolean => {
return emojis.some((emoji) => content.body && content.body.includes(emoji));
}

View file

@ -1,4 +1,21 @@
import { _t, _td } from "../../../../languageHandler";
/*
Copyright 2020 Nurjin Jafar
Copyright 2020 Nordeck IT + Consulting GmbH.
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
*/
import { _t, _td } from "../languageHandler";
export type Effect<TOptions extends { [key: string]: any }> = {
/**
@ -53,7 +70,7 @@ type ConfettiOptions = {
/**
* This configuration defines room effects that can be triggered by custom message types and emojis
*/
const effects: Array<Effect<{ [key: string]: any }>> = [
export const CHAT_EFFECTS: Array<Effect<{ [key: string]: any }>> = [
{
emojis: ['🎊', '🎉'],
msgType: 'nic.custom.confetti',
@ -70,6 +87,4 @@ const effects: Array<Effect<{ [key: string]: any }>> = [
} as Effect<ConfettiOptions>,
];
export default effects;