[client] Fix copyToClipboard so it no longer copies things with weird formatting

This also switches to a non-deprecated clipboard API
This commit is contained in:
Laura Hausmann 2023-11-27 22:15:18 +01:00
parent 8a7c7cb0c9
commit 436fb826ac
Signed by: zotan
GPG key ID: D044E84C5BE01605
13 changed files with 46 additions and 74 deletions

View file

@ -197,9 +197,9 @@ function toggleSensitive() {
});
}
function copyUrl() {
copyToClipboard(props.file.url);
os.success();
async function copyUrl() {
await copyToClipboard(props.file.url);
await os.success();
}
/*
function addApp() {

View file

@ -35,9 +35,9 @@ const props = withDefaults(
},
);
const copy_ = () => {
copyToClipboard(props.copy);
os.success();
const copy_ = async () => {
await copyToClipboard(props.copy ?? '');
await os.success();
};
</script>

View file

@ -124,8 +124,8 @@ const contextmenu = $computed(() => {
{
icon: "ph-link-simple ph-bold ph-lg",
text: i18n.ts.copyLink,
action: () => {
copyToClipboard(pageUrl);
action: async () => {
await copyToClipboard(pageUrl);
},
},
];

View file

@ -463,8 +463,8 @@ function onContextmenu(ev: MouseEvent): void {
{
icon: "ph-link-simple ph-bold ph-lg",
text: i18n.ts.copyLink,
action: () => {
copyToClipboard(`${url}${notePage(appearNote)}`);
action: async () => {
await copyToClipboard(`${url}${notePage(appearNote)}`);
},
},
appearNote.user.host != null

View file

@ -378,8 +378,8 @@ function onContextmenu(ev: MouseEvent): void {
{
icon: "ph-link-simple ph-bold ph-lg",
text: i18n.ts.copyLink,
action: () => {
copyToClipboard(`${url}${notePage(appearNote)}`);
action: async () => {
await copyToClipboard(`${url}${notePage(appearNote)}`);
},
},
note.user.host != null

View file

@ -128,8 +128,8 @@ const contextmenu = $computed(() => [
{
icon: "ph-link-simple ph-bold ph-lg",
text: i18n.ts.copyLink,
action: () => {
copyToClipboard(url + router.getCurrentPath());
action: async () => {
await copyToClipboard(url + router.getCurrentPath());
},
},
]);

View file

@ -76,8 +76,8 @@ function onContextmenu(ev) {
{
icon: "ph-link-simple ph-bold ph-lg",
text: i18n.ts.copyLink,
action: () => {
copyToClipboard(`${url}${props.to}`);
action: async () => {
await copyToClipboard(`${url}${props.to}`);
},
},
],

View file

@ -28,9 +28,9 @@ function menu(ev) {
{
text: i18n.ts.copy,
icon: "ph-clipboard-text ph-bold ph-lg",
action: () => {
copyToClipboard(`:${props.emoji.name}:`);
os.success();
action: async () => {
await copyToClipboard(`:${props.emoji.name}:`);
await os.success();
},
},
{

View file

@ -245,9 +245,9 @@ function fetchPage() {
});
}
function copyUrl() {
copyToClipboard(window.location.href);
os.success();
async function copyUrl() {
await copyToClipboard(window.location.href);
await os.success();
}
function getBgImg(): string {

View file

@ -87,9 +87,9 @@ const selectedThemeCode = computed(() => {
return JSON5.stringify(selectedTheme.value, null, "\t");
});
function copyThemeCode() {
copyToClipboard(selectedThemeCode.value);
os.success();
async function copyThemeCode() {
await copyToClipboard(selectedThemeCode.value ?? '');
await os.success();
}
function uninstall() {

View file

@ -1,33 +1,5 @@
/**
* Clipboardに値をコピー(TODO: 文字列以外も対応)
*/
export default (val) => {
// 空div 生成
const tmp = document.createElement("div");
// 選択用のタグ生成
const pre = document.createElement("pre");
export async function copyToClipboard(val: string) {
await navigator.clipboard.writeText(val);
}
// 親要素のCSSで user-select: none だとコピーできないので書き換える
pre.style.webkitUserSelect = "auto";
pre.style.userSelect = "auto";
tmp.appendChild(pre).textContent = val;
// 要素を画面外へ
const s = tmp.style;
s.position = "fixed";
s.right = "200%";
// body に追加
document.body.appendChild(tmp);
// 要素を選択
document.getSelection().selectAllChildren(tmp);
// クリップボードにコピー
const result = document.execCommand("copy");
// 要素削除
document.body.removeChild(tmp);
return result;
};
export default copyToClipboard;

View file

@ -99,19 +99,19 @@ export function getNoteMenu(props: {
);
}
function copyContent(): void {
copyToClipboard(appearNote.text);
os.success();
async function copyContent(): Promise<void> {
await copyToClipboard(appearNote.text);
await os.success();
}
function copyLink(): void {
copyToClipboard(`${url}/notes/${appearNote.id}`);
os.success();
async function copyLink(): Promise<void> {
await copyToClipboard(`${url}/notes/${appearNote.id}`);
await os.success();
}
function copyOriginal(): void {
copyToClipboard(appearNote.url ?? appearNote.uri);
os.success();
async function copyOriginal(): Promise<void> {
await copyToClipboard(appearNote.url ?? appearNote.uri);
await os.success();
}
function togglePin(pin: boolean): void {

View file

@ -234,8 +234,8 @@ export function getUserMenu(user, router: Router = mainRouter) {
{
icon: "ph-at ph-bold ph-lg",
text: i18n.ts.copyUsername,
action: () => {
copyToClipboard(`@${user.username}@${user.host || host}`);
action: async () => {
await copyToClipboard(`@${user.username}@${user.host || host}`);
},
},
{
@ -253,22 +253,22 @@ export function getUserMenu(user, router: Router = mainRouter) {
{
icon: "ph-rss ph-bold ph-lg",
text: i18n.ts._feeds.rss,
action: () => {
copyToClipboard(`https://${host}/@${user.username}.rss`);
action: async () => {
await copyToClipboard(`https://${host}/@${user.username}.rss`);
},
},
{
icon: "ph-atom ph-bold ph-lg",
text: i18n.ts._feeds.atom,
action: () => {
copyToClipboard(`https://${host}/@${user.username}.atom`);
action: async () => {
await copyToClipboard(`https://${host}/@${user.username}.atom`);
},
},
{
icon: "ph-brackets-curly ph-bold ph-lg",
text: i18n.ts._feeds.jsonFeed,
action: () => {
copyToClipboard(`https://${host}/@${user.username}.json`);
action: async () => {
await copyToClipboard(`https://${host}/@${user.username}.json`);
},
},
],