diff --git a/package.json b/package.json index b72435e9..73354eaa 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vocechat-web", - "version": "0.9.59", + "version": "0.9.60", "homepage": "https://voce.chat", "dependencies": { "@metamask/onboarding": "^1.0.1", diff --git a/public/locales/en/setting.json b/public/locales/en/setting.json index e70abf6a..5f51f4e2 100644 --- a/public/locales/en/setting.json +++ b/public/locales/en/setting.json @@ -372,10 +372,10 @@ "param_open_height": "The height while widget opened", "param_welcome": "Custom welcome message", "param_position": "Widget position: left/right", - "param_icon_title": "Hover tooltip title on closed widget icon", - "param_icon_subtitle": "Hover tooltip subtitle on closed widget icon", - "param_icon_image": "Hover tooltip image URL on closed widget icon", - "param_icon_closable": "Whether the tooltip can be closed (true/false)", + "param_popup_title": "Popup tooltip title displayed next to the closed widget icon", + "param_popup_subtitle": "Popup tooltip subtitle displayed next to the closed widget icon", + "param_popup_image": "Popup tooltip image URL displayed next to the closed widget icon (optional)", + "param_popup_closable": "Whether the popup tooltip can be closed (true/false)", "share_link": "Share the widget link so that people can chat with you directly", "widget_faq": "Enable Let Everyone Join First" }, diff --git a/public/locales/zh/setting.json b/public/locales/zh/setting.json index 3ad0cba8..354125c1 100644 --- a/public/locales/zh/setting.json +++ b/public/locales/zh/setting.json @@ -371,10 +371,10 @@ "param_open_height": "挂件打开态的高度", "param_welcome": "自定义欢迎语", "param_position": "设置挂件位置，居左 (left) 或居右 (right)", - "param_icon_title": "关闭状态悬浮提示框标题", - "param_icon_subtitle": "关闭状态悬浮提示框副标题", - "param_icon_image": "关闭状态悬浮提示框图片地址", - "param_icon_closable": "提示框是否可关闭 (true/false)", + "param_popup_title": "关闭状态悬浮提示框标题", + "param_popup_subtitle": "关闭状态悬浮提示框副标题", + "param_popup_image": "关闭状态悬浮提示框图片地址", + "param_popup_closable": "提示框是否可关闭 (true/false)", "share_link": "分享此链接，别人可以通过该地址直接与你对话", "widget_faq": "允许公开注册" }, diff --git a/public/widget.js b/public/widget.js index 79d1cf18..322bdf4d 100644 --- a/public/widget.js +++ b/public/widget.js @@ -14,17 +14,17 @@ logo = "", position = "right", welcome = "", - iconTitle = "Need help?", - iconSubtitle = "Our staff are always ready to help!", - iconImage = "", - iconClosable = "true" + popupTitle = "Need help?", + popupSubtitle = "Our staff are always ready to help!", + popupImage = "", + popupClosable = "true" } = d.currentScript.dataset; const _src = d.currentScript.src; const wrapper = d.createElement("iframe"); wrapper.id = "VOCECHAT_WIDGET"; // 如果有提示框内容，关闭状态的宽度和高度需要更大 - const hasTooltip = iconTitle || iconSubtitle; + const hasTooltip = popupTitle || popupSubtitle; const actualCloseWidth = hasTooltip ? 320 : closeWidth; const actualCloseHeight = hasTooltip ? 120 : closeHeight; @@ -43,7 +43,7 @@ new URL(_src).origin }/widget.html?id=${id}&host=${hostId}&autoReg=${autoReg}&token=${loginToken}&themeColor=${encodeURIComponent( themeColor - )}&from=${encodeURIComponent(location.hostname)}&welcome=${encodeURIComponent(welcome)}&title=${encodeURIComponent(title)}&logo=${encodeURIComponent(logo)}&iconTitle=${encodeURIComponent(iconTitle)}&iconSubtitle=${encodeURIComponent(iconSubtitle)}&iconImage=${encodeURIComponent(iconImage)}&iconClosable=${iconClosable}`; + )}&from=${encodeURIComponent(location.hostname)}&welcome=${encodeURIComponent(welcome)}&title=${encodeURIComponent(title)}&logo=${encodeURIComponent(logo)}&popupTitle=${encodeURIComponent(popupTitle)}&popupSubtitle=${encodeURIComponent(popupSubtitle)}&popupImage=${encodeURIComponent(popupImage)}&popupClosable=${popupClosable}`; wrapper.width = actualCloseWidth; wrapper.height = actualCloseHeight; wrapper.frameborder = 0; diff --git a/src/routes/setting/Widget/ConfigDetails.tsx b/src/routes/setting/Widget/ConfigDetails.tsx index c9dce61c..59fe08d8 100644 --- a/src/routes/setting/Widget/ConfigDetails.tsx +++ b/src/routes/setting/Widget/ConfigDetails.tsx @@ -115,24 +115,24 @@ const ConfigDetails = ({}: Props) => { remarks: t("param_welcome") }, { - paramKey: "icon-title", + paramKey: "popup-title", paramDefault: "Need help?", - remarks: t("param_icon_title") + remarks: t("param_popup_title") }, { - paramKey: "icon-subtitle", + paramKey: "popup-subtitle", paramDefault: "Our staff are always ready to help!", - remarks: t("param_icon_subtitle") + remarks: t("param_popup_subtitle") }, { - paramKey: "icon-image", + paramKey: "popup-image", paramDefault: "-", - remarks: t("param_icon_image") + remarks: t("param_popup_image") }, { - paramKey: "icon-closable", + paramKey: "popup-closable", paramDefault: "true", - remarks: t("param_icon_closable") + remarks: t("param_popup_closable") } ].map((row) => ( diff --git a/src/routes/setting/Widget/index.tsx b/src/routes/setting/Widget/index.tsx index c451cad8..7c7f9414 100644 --- a/src/routes/setting/Widget/index.tsx +++ b/src/routes/setting/Widget/index.tsx @@ -33,7 +33,7 @@ export default function Widget() { {`\n`} diff --git a/src/widget/Icon.tsx b/src/widget/Icon.tsx index 2954c616..085f6812 100644 --- a/src/widget/Icon.tsx +++ b/src/widget/Icon.tsx @@ -10,7 +10,7 @@ type Props = { const Icon = ({ handleClick }: Props) => { const serverLogo = useAppSelector((store) => store.server.logo, shallowEqual); - const { iconTitle, iconSubtitle, iconImage, logo: customLogo, iconClosable } = useWidget(); + const { popupTitle, popupSubtitle, popupImage, logo: customLogo, popupClosable } = useWidget(); const [tooltipVisible, setTooltipVisible] = useState(true); // 优先使用自定义 logo，否则使用服务器 logo @@ -25,7 +25,7 @@ const Icon = ({ handleClick }: Props) => {
{/* 关闭按钮 */} - {iconClosable && ( + {popupClosable && ( )}
- {iconImage && ( + {popupImage && ( icon )}
- {iconTitle} + {popupTitle}
- {iconSubtitle} + {popupSubtitle}
diff --git a/src/widget/WidgetContext.tsx b/src/widget/WidgetContext.tsx index 079f8215..9f27e16f 100644 --- a/src/widget/WidgetContext.tsx +++ b/src/widget/WidgetContext.tsx @@ -18,10 +18,10 @@ const autoReg = decodeURIComponent(query.get("autoReg") || "true") == "true"; const token = decodeURIComponent(query.get("token") || ""); const color = decodeURIComponent(query.get("themeColor") || "#1fe1f9"); const from = decodeURIComponent(query.get("from") || "widget.link"); -const iconTitle = decodeURIComponent(query.get("iconTitle") || "Need help?"); -const iconSubtitle = decodeURIComponent(query.get("iconSubtitle") || "Our staff are always ready to help!"); -const iconImage = decodeURIComponent(query.get("iconImage") || ""); -const iconClosable = decodeURIComponent(query.get("iconClosable") || "true") == "true"; +const popupTitle = decodeURIComponent(query.get("popupTitle") || "Need help?"); +const popupSubtitle = decodeURIComponent(query.get("popupSubtitle") || "Our staff are always ready to help!"); +const popupImage = decodeURIComponent(query.get("popupImage") || ""); +const popupClosable = decodeURIComponent(query.get("popupClosable") || "true") == "true"; const fgColor = getContrastColor(color); const embed = isInIframe(); const WidgetContext = createContext({ @@ -38,10 +38,10 @@ const WidgetContext = createContext({ title, logo, welcome, - iconTitle, - iconSubtitle, - iconImage, - iconClosable, + popupTitle, + popupSubtitle, + popupImage, + popupClosable, serverVersion: "" }); @@ -68,10 +68,10 @@ function WidgetProvider({ children }: { children: ReactNode }) { inviteOnly: loginConfig?.who_can_sign_up == "InvitationOnly", title: title ? title : serverData?.name, logo: logo ? logo : serverData.logo, - iconTitle, - iconSubtitle, - iconImage, - iconClosable, + popupTitle, + popupSubtitle, + popupImage, + popupClosable, serverVersion: data }} >