Skip to content

Add room code clipboard fallback#5

Merged
TypeThe0ry merged 1 commit into
mainfrom
codex/-copyroomcode-fallback
Jun 27, 2026
Merged

Add room code clipboard fallback#5
TypeThe0ry merged 1 commit into
mainfrom
codex/-copyroomcode-fallback

Conversation

@TypeThe0ry

Copy link
Copy Markdown
Owner

Motivation

  • Provide a robust copy experience for room codes when the modern clipboard API is unavailable or rejects by adding a fallback path.
  • Ensure users always get a clear outcome: keep the success toast and show a clear failure message that instructs manual copy when automatic copy fails.
  • Avoid blind failures on older browsers or restrictive environments by presenting a selectable room-code UI as a last resort.

Description

  • Updated the copyRoomCode function in static/index.html to try navigator.clipboard.writeText first and fall back to a DOM-based copy when that fails.
  • Implemented a fallbackCopy that creates a temporary <textarea>, calls select() and document.execCommand('copy'), and reports success with the existing layer.msg('房号已复制:' + code) on success.
  • Added showManualCopy which opens a layer.open dialog containing a readonly, selectable <textarea> with the room code and shows the explicit failure message 复制失败,请手动复制房号:xxx when both copy attempts fail.
  • Added escapeHtml to safely render the room code inside the dialog and kept all UI messages and behavior consistent with existing patterns.

Testing

  • Ran git diff --check and it reported no issues.

Codex Task

@TypeThe0ry TypeThe0ry marked this pull request as ready for review June 27, 2026 10:52
Copilot AI review requested due to automatic review settings June 27, 2026 10:52
@TypeThe0ry TypeThe0ry merged commit 7faf354 into main Jun 27, 2026
1 check passed

Copilot AI left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR improves the “copy room code” UX in the lobby UI by adding a fallback path when the modern Clipboard API is unavailable or rejects, and providing a manual-copy dialog as a last resort.

Changes:

  • Updated copyRoomCode to try navigator.clipboard.writeText first, then fall back to a DOM-based copy via document.execCommand('copy').
  • Added a manual-copy modal (layer.open) that presents the room code in a selectable <textarea> when automatic copy fails.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread static/index.html
Comment on lines +1183 to +1207
var escapeHtml = function (text) {
return String(text).replace(/[&<>"']/g, function (ch) {
return ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;' })[ch];
});
};
var showManualCopy = function () {
layer.msg('复制失败,请手动复制房号:' + code);
layer.open({
type: 1,
title: '手动复制房号',
shadeClose: true,
area: ['min(320px, 90vw)', 'auto'],
content: '<div style="padding:18px;text-align:center;">' +
'<div style="margin-bottom:10px;color:#666;">复制失败,请手动复制房号:</div>' +
'<textarea readonly style="box-sizing:border-box;width:100%;min-height:52px;padding:12px;text-align:center;font-size:22px;font-weight:bold;letter-spacing:2px;resize:none;" onclick="this.select()">' + escapeHtml(code) + '</textarea>' +
'</div>',
success: function (layero) {
var field = layero && layero[0] ? layero[0].querySelector('textarea') : null;
if (field) {
field.focus();
field.select();
}
}
});
};
@TypeThe0ry TypeThe0ry deleted the codex/-copyroomcode-fallback branch June 27, 2026 11:15
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants