1
0
Fork 0
mirror of https://github.com/YunoHost-Apps/tldraw_ynh.git synced 2024-09-03 20:35:54 +02:00
This commit is contained in:
Limezy 2022-09-29 20:36:34 +07:00
parent 5722d1d9d0
commit 379240a076
8 changed files with 220 additions and 72 deletions

View file

@ -8,10 +8,8 @@
domain="domain.tld"
path="/path"
is_public=1
language="fr"
admin="john"
password="1Strong-Password"
port="666"
publickey="public"
secretkey="secreet"
; Checks
pkg_linter=1
setup_sub_dir=1
@ -20,7 +18,6 @@
setup_private=1
setup_public=1
upgrade=1
upgrade=1 from_commit=CommitHash
backup_restore=1
multi_instance=1
port_already_use=0

2
conf/.env Normal file
View file

@ -0,0 +1,2 @@
LIVEBLOCKS_SECRET_KEY=__SECRETKEY__
NEXT_PUBLIC_LIVEBLOCKS_PUBLIC_API_KEY=__PUBLICKEY__

160
conf/MultiplayerMenu.tsx Normal file
View file

@ -0,0 +1,160 @@
import * as DropdownMenu from '@radix-ui/react-dropdown-menu'
import { CheckIcon, ClipboardIcon } from '@radix-ui/react-icons'
import { Utils } from '@tldraw/core'
import * as React from 'react'
import { FormattedMessage } from 'react-intl'
import { Divider } from '~components/Primitives/Divider'
import { DMContent, DMItem, DMTriggerIcon } from '~components/Primitives/DropdownMenu'
import { SmallIcon } from '~components/Primitives/SmallIcon'
import { MultiplayerIcon2 } from '~components/Primitives/icons/MultiplayerIcon2'
import { useTldrawApp } from '~hooks'
import { TLDR } from '~state/TLDR'
import { TDAssetType, TDSnapshot } from '~types'
const roomSelector = (state: TDSnapshot) => state.room
export const MultiplayerMenu = function MultiplayerMenu() {
const app = useTldrawApp()
const room = app.useStore(roomSelector)
const [copied, setCopied] = React.useState(false)
const rTimeout = React.useRef<any>(0)
const handleCopySelect = React.useCallback(() => {
setCopied(true)
TLDR.copyStringToClipboard(window.location.href)
clearTimeout(rTimeout.current)
rTimeout.current = setTimeout(() => setCopied(false), 1200)
}, [])
const handleCopyReadOnlySelect = React.useCallback(() => {
setCopied(true)
const segs = window.location.href.split('/')
segs[segs.length - 2] = 'v'
segs[segs.length - 1] = Utils.lns(segs[segs.length - 1])
TLDR.copyStringToClipboard(segs.join('/'))
clearTimeout(rTimeout.current)
rTimeout.current = setTimeout(() => setCopied(false), 1200)
}, [])
const handleCreateMultiplayerProject = React.useCallback(async () => {
if (app.isDirty) {
if (app.fileSystemHandle) {
if (window.confirm('Do you want to save changes to your current project?')) {
await app.saveProject()
}
} else {
if (window.confirm('Do you want to save your current project?')) {
await app.saveProject()
}
}
} else if (!app.fileSystemHandle) {
if (window.confirm('Do you want to save your current project?')) {
await app.saveProject()
}
}
}, [])
const handleCopyToMultiplayerProject = React.useCallback(async () => {
const nextDocument = Utils.deepClone(app.document)
app.setIsLoading(true)
try {
if (app.callbacks.onAssetUpload) {
for (const id in nextDocument.assets) {
const asset = nextDocument.assets[id]
if (asset.src.includes('base64')) {
const file = dataURLtoFile(
asset.src,
asset.fileName ?? asset.type === TDAssetType.Video ? 'image.png' : 'image.mp4'
)
const newSrc = await app.callbacks.onAssetUpload(app, file, id)
if (newSrc) {
asset.src = newSrc
} else {
asset.src = ''
}
}
}
}
const result = await fetch(`/api/create`, {
method: 'POST',
mode: 'no-cors',
headers: {
'Access-Control-Allow-Origin': '*',
'Content-Type': 'application/json',
},
body: JSON.stringify({
roomId: Utils.uniqueId(),
pageId: app.currentPageId,
document: nextDocument,
}),
}).then((d) => d.json())
if (result?.url) {
window.location.href = result.url
} else {
TLDR.warn(result?.message)
}
} catch (e) {
TLDR.warn((e as any).message)
}
app.setIsLoading(false)
}, [])
return (
<DropdownMenu.Root dir="ltr">
<DMTriggerIcon id="TD-MultiplayerMenuIcon" isActive={!!room}>
<MultiplayerIcon2 />
</DMTriggerIcon>
<DMContent variant="menu" id="TD-MultiplayerMenu" side="bottom" align="start" sideOffset={4}>
<DMItem id="TD-Multiplayer-CopyInviteLink" onClick={handleCopySelect} disabled={!room}>
<FormattedMessage id="copy.invite.link" />
<SmallIcon>{copied ? <CheckIcon /> : <ClipboardIcon />}</SmallIcon>
</DMItem>
<DMItem
id="TD-Multiplayer-CopyReadOnlyLink"
onClick={handleCopyReadOnlySelect}
disabled={!room}
>
<FormattedMessage id="copy.readonly.link" />
<SmallIcon>{copied ? <CheckIcon /> : <ClipboardIcon />}</SmallIcon>
</DMItem>
<Divider />
<DMItem
id="TD-Multiplayer-CreateMultiplayerProject"
onClick={handleCreateMultiplayerProject}
>
<a href="https://__DOMAIN____PATH__/r">
<FormattedMessage id="create.multiplayer.project" />
</a>
</DMItem>
<DMItem
id="TD-Multiplayer-CopyToMultiplayerProject"
onClick={handleCopyToMultiplayerProject}
>
<FormattedMessage id="copy.multiplayer.project" />
</DMItem>
</DMContent>
</DropdownMenu.Root>
)
}
function dataURLtoFile(dataurl: string, filename: string) {
const arr = dataurl.split(',')
const mime = arr[0]?.match(/:(.*?);/)?.[1]
const bstr = window.atob(arr[1])
let n = bstr.length
const u8arr = new Uint8Array(n)
while (n--) {
u8arr[n] = bstr.charCodeAt(n)
}
return new File([u8arr], filename, { type: mime })
}

View file

@ -1,7 +1,7 @@
SOURCE_URL=url of app's source
SOURCE_SUM=sha256 checksum
SOURCE_URL=https://github.com/tldraw/tldraw/archive/8e55e263bf45cb6d425178c638aec385ec01e62c.zip
SOURCE_SUM=sha256 d090aac97266e043418ec34d46e722dd69c7dace4bd30f39afb9478eb21271d1
SOURCE_SUM_PRG=sha256sum
SOURCE_FORMAT=tar.gz
SOURCE_FORMAT=zip
SOURCE_IN_SUBDIR=true
SOURCE_FILENAME=
SOURCE_EXTRACT=true

View file

@ -1,28 +1,16 @@
#sub_path_only rewrite ^__PATH__$ __PATH__/ permanent;
location __PATH__/ {
# Path to source
alias __FINALPATH__/;
proxy_pass http://127.0.0.1:__PORT__;
proxy_redirect off;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Host $server_name;
client_max_body_size 200M;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
### Example PHP configuration (remove it if not used)
index index.php;
# Common parameter to increase upload size limit in conjunction with dedicated php-fpm file
#client_max_body_size 50M;
try_files $uri $uri/ index.php;
location ~ [^/]\.php(/|$) {
fastcgi_split_path_info ^(.+?\.php)(/.*)$;
fastcgi_pass unix:/var/run/php/php__PHPVERSION__-fpm-__NAME__.sock;
fastcgi_index index.php;
include fastcgi_params;
fastcgi_param REMOTE_USER $remote_user;
fastcgi_param PATH_INFO $fastcgi_path_info;
fastcgi_param SCRIPT_FILENAME $request_filename;
}
### End of PHP configuration part
# Include SSOWAT user panel.
include conf.d/yunohost_panel.conf.inc;
}

View file

@ -6,8 +6,10 @@ After=network.target
Type=simple
User=__APP__
Group=__APP__
WorkingDirectory=__FINALPATH__/
ExecStart=__FINALPATH__/script
WorkingDirectory=__FINALPATH__/apps/www/
Environment="NODE_ENV=production"
Environment="__YNH_NODE_LOAD_PATH__"
ExecStart=__YNH_NPM__ start
StandardOutput=append:/var/log/__APP__/__APP__.log
StandardError=inherit

View file

@ -105,34 +105,39 @@ ynh_script_progression --message="Configuring NGINX web server..." --weight=1
ynh_add_nginx_config
#=================================================
# SPECIFIC SETUP
#=================================================
# ...
# ADD A CONFIGURATION
#=================================================
ynh_script_progression --message="Patching multiplayer file..." --weight=1
#=================================================
# CREATE DATA DIRECTORY
#=================================================
ynh_script_progression --message="Creating a data directory..." --weight=1
ynh_secure_remove --file="$final_path/packages/tldraw/src/components/TopPanel/MultiplayerMenu/MultiplayerMenu.tsx"
ynh_add_config --template="../conf/MultiplayerMenu.tsx" --destination="$final_path/packages/tldraw/src/components/TopPanel/MultiplayerMenu/MultiplayerMenu.tsx"
datadir=/home/yunohost.app/$app
ynh_app_setting_set --app=$app --key=datadir --value=$datadir
mkdir -p $datadir
chmod 750 "$datadir"
chmod -R o-rwx "$datadir"
chown -R $app:www-data "$datadir"
chmod 400 "$final_path/packages/tldraw/src/components/TopPanel/MultiplayerMenu/MultiplayerMenu.tsx"
chown $app:$app "$final_path/packages/tldraw/src/components/TopPanel/MultiplayerMenu/MultiplayerMenu.tsx"
#=================================================
# ADD A CONFIGURATION
#=================================================
ynh_script_progression --message="Adding a configuration file..." --weight=1
ynh_add_config --template="some_config_file" --destination="$final_path/some_config_file"
ynh_add_config --template="../conf/.env" --destination="$final_path/apps/www/.env"
chmod 400 "$final_path/some_config_file"
chown $app:$app "$final_path/some_config_file"
chmod 400 "$final_path/apps/www/.env"
chown $app:$app "$final_path/apps/www/.env"
#=================================================
# BUILD YARN DEPENDENCIES
#=================================================
pushd "$final_path"
ynh_use_nodejs
ynh_script_progression --message="Fetching Yarn dev dependencies... This can be very long, be patient !" --weight=18
ynh_exec_warn_less sudo -u $app env $ynh_node_load_PATH yarn install --network-timeout 1000000000 2>&1
ynh_script_progression --message="Cleaning cache... " --weight=3
ynh_exec_warn_less sudo -u $app env $ynh_node_load_PATH yarn cache clean 2>&1
ynh_script_progression --message="Building Yarn dev dependencies... This can be very long, be patient !" --weight=18
ynh_exec_warn_less sudo -u $app env $ynh_node_load_PATH yarn build 2>&1
popd
#=================================================
# SETUP SYSTEMD
@ -167,14 +172,6 @@ ynh_script_progression --message="Starting a systemd service..." --weight=1
# Start a systemd service
ynh_systemd_action --service_name=$app --action="start" --log_path="/var/log/$app/$app.log"
#=================================================
# SETUP FAIL2BAN
#=================================================
ynh_script_progression --message="Configuring Fail2Ban..." --weight=1
# Create a dedicated Fail2Ban config
ynh_add_fail2ban_config --logpath="/var/log/nginx/${domain}-error.log" --failregex="Regex to match into the log for a failed login"
#=================================================
# SETUP SSOWAT
#=================================================
@ -183,22 +180,9 @@ ynh_script_progression --message="Configuring permissions..." --weight=1
# Make app public if necessary
if [ $is_public -eq 1 ]
then
# Everyone can access the app.
# The "main" permission is automatically created before the install script.
ynh_permission_update --permission="main" --add="visitors"
fi
### N.B. : the following extra permissions only make sense if your app
### does have for example an admin interface or an API.
# Only the admin can access the admin panel of the app (if the app has an admin panel)
ynh_permission_create --permission="admin" --url="/admin" --allowed=$admin
# Everyone can access the API part
# We don't want to display the tile in the SSO so we put --show_tile="false"
# And we don't want the YunoHost admin to be able to remove visitors group to this permission, so we put --protected="true"
ynh_permission_create --permission="api" --url="/api" --allowed="visitors" --show_tile="false" --protected="true"
#=================================================
# RELOAD NGINX
#=================================================

View file

@ -0,0 +1,15 @@
diff --git a/apps/www/pages/r/[id].tsx b/apps/www/pages/r/[id].tsx
index 7f582cfa..9d9f9bed 100644
--- a/apps/www/pages/r/[id].tsx
+++ b/apps/www/pages/r/[id].tsx
@@ -16,10 +16,6 @@ interface RoomProps {
}
export default function Room({ id }: RoomProps) {
- if (typeof window !== 'undefined' && window.self !== window.top) {
- return <IFrameWarning url={`https://tldraw.com/r/${id}`} />
- }
-
return (
<>
<Head>