anyproto/anytype-ts
1
0
Fork 0
mirror of https://github.com/anyproto/anytype-ts.git synced 2025-06-08 05:57:02 +09:00
Code Activity

JS-1640: confetti

Browse source
This commit is contained in:
Mike Mhlv 2023-03-26 21:37:09 +01:00
parent 394e9199a6
commit 2fc8c6803a
No known key found for this signature in database
GPG key ID: 82F8AC181346CE7F
5 changed files with 74 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

2
electron.js
View file

@ -37,7 +37,7 @@ let deeplinkingUrl = '';
let waitLibraryPromise = null;
let mainWindow = null;
let csp = [
"default-src 'self' 'unsafe-eval'",
"default-src 'self' 'unsafe-eval' blob:",
"img-src 'self' http://*:* https://*:* data: blob: file://*",
"media-src 'self' http://*:* https://*:* data: blob: file://*",
"style-src 'unsafe-inline' http://localhost:* file://*",

46
package-lock.json generated
View file

@ -73,6 +73,7 @@
"react": "^16.14.0",
"react-addons-shallow-compare": "^15.6.2",
"react-beautiful-dnd": "^13.0.0",
"react-canvas-confetti": "^1.3.0",
"react-dom": "^16.14.0",
"react-draggable-tags": "^1.0.2",
"react-hot-loader": "^4.13.0",
@ -1074,6 +1075,11 @@
"@types/responselike": "^1.0.0"
}
},
"node_modules/@types/canvas-confetti": {
"version": "1.4.2",
"resolved": "https://registry.npmjs.org/@types/canvas-confetti/-/canvas-confetti-1.4.2.tgz",
"integrity": "sha512-t45KUDHlwrD9PJVRHc5z1SlXhO82BQEgMKUXGEV1KnWLFMPA6Y5LfUsLTHHzH9KcKDHZLEiYYH5nIDcjRKWNTg=="
},
"node_modules/@types/connect": {
"version": "3.4.35",
"dev": true,
@ -3732,6 +3738,15 @@
],
"license": "CC-BY-4.0"
},
"node_modules/canvas-confetti": {
"version": "1.5.1",
"resolved": "https://registry.npmjs.org/canvas-confetti/-/canvas-confetti-1.5.1.tgz",
"integrity": "sha512-Ncz+oZJP6OvY7ti4E1slxVlyAV/3g7H7oQtcCDXgwGgARxPnwYY9PW5Oe+I8uvspYNtuHviAdgA0LfcKFWJfpg==",
"funding": {
"type": "donate",
"url": "https://www.paypal.me/kirilvatev"
}
},
"node_modules/canvas-fill-text-on-arc": {
"version": "1.0.4",
"license": "MIT"
@ -13711,6 +13726,18 @@
"react": "^16.8.0 || ^17.0.0"
}
},
"node_modules/react-canvas-confetti": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/react-canvas-confetti/-/react-canvas-confetti-1.3.0.tgz",
"integrity": "sha512-5qBYTux3GKIu77SZ72oZYk4yvy1r4Z8q/BgIuO7mZrkqv/wH9vM7Yr/BzcqApGy9qZtIctF1Q41EYyw3aSDBmg==",
"dependencies": {
"@types/canvas-confetti": "1.4.2",
"canvas-confetti": "1.5.1"
},
"peerDependencies": {
"react": "*"
}
},
"node_modules/react-dnd": {
"version": "16.0.1",
"dev": true,
@ -17997,6 +18024,11 @@
"@types/responselike": "^1.0.0"
}
},
"@types/canvas-confetti": {
"version": "1.4.2",
"resolved": "https://registry.npmjs.org/@types/canvas-confetti/-/canvas-confetti-1.4.2.tgz",
"integrity": "sha512-t45KUDHlwrD9PJVRHc5z1SlXhO82BQEgMKUXGEV1KnWLFMPA6Y5LfUsLTHHzH9KcKDHZLEiYYH5nIDcjRKWNTg=="
},
"@types/connect": {
"version": "3.4.35",
"dev": true,
@ -19985,6 +20017,11 @@
"caniuse-lite": {
"version": "1.0.30001363"
},
"canvas-confetti": {
"version": "1.5.1",
"resolved": "https://registry.npmjs.org/canvas-confetti/-/canvas-confetti-1.5.1.tgz",
"integrity": "sha512-Ncz+oZJP6OvY7ti4E1slxVlyAV/3g7H7oQtcCDXgwGgARxPnwYY9PW5Oe+I8uvspYNtuHviAdgA0LfcKFWJfpg=="
},
"canvas-fill-text-on-arc": {
"version": "1.0.4"
},
@ -26561,6 +26598,15 @@
}
}
},
"react-canvas-confetti": {
"version": "1.3.0",
"resolved": "https://registry.npmjs.org/react-canvas-confetti/-/react-canvas-confetti-1.3.0.tgz",
"integrity": "sha512-5qBYTux3GKIu77SZ72oZYk4yvy1r4Z8q/BgIuO7mZrkqv/wH9vM7Yr/BzcqApGy9qZtIctF1Q41EYyw3aSDBmg==",
"requires": {
"@types/canvas-confetti": "1.4.2",
"canvas-confetti": "1.5.1"
}
},
"react-dnd": {
"version": "16.0.1",
"dev": true,

1
package.json
View file

@ -152,6 +152,7 @@
"react": "^16.14.0",
"react-addons-shallow-compare": "^15.6.2",
"react-beautiful-dnd": "^13.0.0",
"react-canvas-confetti": "^1.3.0",
"react-dom": "^16.14.0",
"react-draggable-tags": "^1.0.2",
"react-hot-loader": "^4.13.0",

2
src/scss/menu/wizard.scss
View file

@ -23,6 +23,8 @@
video { margin-top: 12px; }
.confettiCanvas { position: absolute; pointer-events: none; width: 100%; height: 100%; left: 0; top: 0; }
.bottom {
position: absolute; bottom: 16px; width: calc(100% - 32px);
display: flex; flex-direction: row; align-items: stretch; justify-content: space-between;

25
src/ts/component/menu/wizard.tsx
View file

@ -5,14 +5,17 @@ import { I, Util, analytics, keyboard } from 'Lib';
import { menuStore } from 'Store';
import * as Docs from 'Docs';
import ReactCanvasConfetti from "react-canvas-confetti";
class MenuWizard extends React.Component<I.Menu> {
node: any = null;
confetti: any = null;
constructor (props: I.Menu) {
super(props);
this.onClose = this.onClose.bind(this)
this.onClose = this.onClose.bind(this);
};
render () {
@ -74,6 +77,8 @@ class MenuWizard extends React.Component<I.Menu> {
}
</div>
</div>
<ReactCanvasConfetti refConfetti={ins => this.confetti = ins} className="confettiCanvas" />
</div>
);
};
@ -86,6 +91,9 @@ class MenuWizard extends React.Component<I.Menu> {
componentDidUpdate () {
const { param, position } = this.props;
const { data } = param;
const { key, current } = data;
const { items } = Docs.Help.Wizard[key] || {};
const l = items.length;
const node = $(this.node);
if (data.onShow) {
@ -96,9 +104,24 @@ class MenuWizard extends React.Component<I.Menu> {
this.rebind();
Util.renderLinks(node);
if (current == l-1) {
this.fire();
};
// analytics.event('ScreenOnboarding');
};
fire () {
this.confetti({
particleCount: 150,
spread: 60,
origin: {
x: .5,
y: 1
}
});
};
onClose () {
this.props.close();
};