diff --git a/composables/useShareOptionToggle.ts b/composables/useShareOptionToggle.ts new file mode 100644 index 00000000..9963850c --- /dev/null +++ b/composables/useShareOptionToggle.ts @@ -0,0 +1,57 @@ +/* + * Copyright (c) 2023, Terwer . All rights reserved. + * DO NOT ALTER OR REMOVE COPYRIGHT NOTICES OR THIS FILE HEADER. + * + * This code is free software; you can redistribute it and/or modify it + * under the terms of the GNU General Public License version 2 only, as + * published by the Free Software Foundation. Terwer designates this + * particular file as subject to the "Classpath" exception as provided + * by Terwer in the LICENSE file that accompanied this code. + * + * This code is distributed in the hope that it will be useful, but WITHOUT + * ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or + * FITNESS FOR A PARTICULAR PURPOSE. See the GNU General Public License + * version 2 for more details (a copy is included in the LICENSE file that + * accompanied this code). + * + * You should have received a copy of the GNU General Public License version + * 2 along with this work; if not, write to the Free Software Foundation, + * Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 USA. + * + * Please contact Terwer, Shenzhen, Guangdong, China, youweics@163.com + * or visit www.terwer.space if you need additional information or have any + * questions. + */ + +import { createAppLogger } from "~/common/appLogger" + +const logger = createAppLogger("use-share-option") + +export const useShareOptionToggle = (initialValue: boolean) => { + const optionState = ref(initialValue) + + const optionToggle = () => { + optionState.value = !optionState.value + sendMessageToParent("updateHeight") + } + + return { + optionState, + optionToggle, + } +} + +const sendMessageToParent = (type: string) => { + const win = window.self as any + if (!win.parent.siyuan) { + logger.info(`Not in siyuan-note plugin iframe environment, ignore message sending`) + return + } + + // 获取当前窗口对象 + const iframeWindow = window.self + + // 向父窗口发送消息 + iframeWindow.parent.postMessage({ type: type }, "*") + logger.info(`Sends a message to the parent window, type => ${type}`) +} diff --git a/locales/en_US.ts b/locales/en_US.ts index 7812a4fe..700836b9 100644 --- a/locales/en_US.ts +++ b/locales/en_US.ts @@ -80,4 +80,5 @@ export default { "share.help": "Learn about sharing", "share.copy.link": "Copy link", "share.set.home": "Set home", + "share.share": "Share", } diff --git a/locales/zh_CN.ts b/locales/zh_CN.ts index 6d4a4303..69ddbbec 100644 --- a/locales/zh_CN.ts +++ b/locales/zh_CN.ts @@ -79,4 +79,5 @@ export default { "share.help": "了解共享", "share.copy.link": "复制链接", "share.set.home": "设为主页", + "share.share": "分享", } diff --git a/package.json b/package.json index 81605476..c2c645b9 100644 --- a/package.json +++ b/package.json @@ -43,6 +43,7 @@ "@element-plus/icons-vue": "^2.1.0", "@pinia/nuxt": "^0.4.11", "cheerio": "1.0.0-rc.12", + "copy-to-clipboard": "^3.3.3", "element-plus": "^2.3.6", "highlight.js": "^11.8.0", "pinia": "^2.1.4", diff --git a/pages/share.vue b/pages/share.vue index 7abd97ad..d904e826 100644 --- a/pages/share.vue +++ b/pages/share.vue @@ -2,6 +2,8 @@ import { useSettingStore } from "~/stores/useSettingStore" import { useRouteQuery } from "@vueuse/router" import { createAppLogger } from "~/common/appLogger" +import { useShareOptionToggle } from "~/composables/useShareOptionToggle" +import copy from "copy-to-clipboard" const logger = createAppLogger("share-page") const { t } = useI18n() @@ -11,6 +13,14 @@ const id = useRouteQuery("id", "") const origin = useRouteQuery("origin", "") const isSsr = useRouteQuery("isSsr", "") const basePath = String(isSsr.value) === "true" ? "/plugins/siyuan-blog" : "/plugins/siyuan-blog/#" + +// lifecycles +// onBeforeMount(() => { +// const mainEl = document.querySelector(".el-main") as any +// mainEl.style.margin = "0" +// mainEl.style.padding = "0" +// }) + const setting = await getSetting() const title = `${t("blog.share")} - ${t("blog.share.options")}` const seoMeta = { @@ -21,9 +31,11 @@ useSeoMeta(seoMeta) // datas const formData = reactive({ - shared: false, + shareEnabled: false, shareLink: `${origin.value}${basePath}/s/${id.value}`, + optionEnabled: false, }) +const { optionState, optionToggle } = useShareOptionToggle(formData.optionEnabled) // methods const goSetting = async () => { @@ -34,28 +46,26 @@ const goHelp = async () => { window.open("https://blog.terwer.space/docs") } -const sendMessageToParent = (type: string) => { - const win = window.self as any - if (!win.parent.siyuan) { - logger.info(`Not in siyuan-note plugin iframe environment, ignore message sending`) - return - } - - // 获取当前窗口对象 - const iframeWindow = window.self - - // 向父窗口发送消息 - iframeWindow.parent.postMessage({ type: type }, "*") - logger.info(`Sends a message to the parent window, type => ${type}`) -} - -const toggleOption = () => { - sendMessageToParent("updateHeight") +const copyWebLink = () => { + copy(formData.shareLink) + ElMessage.success(t("main.opt.success")) }