Share Bubble
+ + +Visibility
+Choose who can see your Sharing Bubble.
+
+
+
+ Everyone
+ Friends Only
+ Lifetime
+How long the Sharing Bubble lasts. You can delete it at any time.
+
+
+
+ 2 Minutes
+ For Session
+
+
+
+
+
+
+
+
+
+
+ `;
+ document.body.appendChild(dialog);
+ return dialog;
+ },
+
+ show: function(contentDetails) {
+ const dialog = ContentShareMod.shareBubbleDialog;
+ const colors = ContentShareMod.applyThemeToDialog(dialog);
+
+ // Additional ShareBubble-specific theming
+ const optionSelects = dialog.querySelectorAll('.option-select');
+ optionSelects.forEach(element => {
+ element.style.borderColor = colors.border;
+ });
+
+ const grantAccessSection = dialog.querySelector('.grant-access-section');
+ const noAccessControlMessage = dialog.querySelector('.no-access-control-message');
+ const showGrantAccess = contentDetails.IsMine && !contentDetails.IsPublic;
+
+ if (grantAccessSection && noAccessControlMessage) {
+ grantAccessSection.style.display = showGrantAccess ? '' : 'none';
+ noAccessControlMessage.style.display = showGrantAccess ? 'none' : '';
+ }
+
+ dialog.classList.remove('hidden', 'out');
+ setTimeout(() => dialog.classList.add('in'), 50);
+
+ ContentShareMod.currentContentData = contentDetails;
+ },
+
+ hide: function() {
+ const dialog = ContentShareMod.shareBubbleDialog;
+ dialog.classList.remove('in');
+ dialog.classList.add('out');
+ setTimeout(() => {
+ dialog.classList.add('hidden');
+ dialog.classList.remove('out');
+ }, 200);
+ },
+
+ changeVisibility: function(element) {
+ document.getElementById('share-visibility').value = element.dataset.visibilityValue;
+ const buttons = ContentShareMod.shareBubbleDialog.querySelectorAll('.visibility-btn');
+ buttons.forEach(btn => btn.classList.remove('active'));
+ element.classList.add('active');
+ },
+
+ changeDuration: function(element) {
+ document.getElementById('share-duration').value = element.dataset.durationValue;
+ const buttons = ContentShareMod.shareBubbleDialog.querySelectorAll('.duration-btn');
+ buttons.forEach(btn => btn.classList.remove('active'));
+ element.classList.add('active');
+ },
+
+ changeAccess: function(element) {
+ document.getElementById('share-access').value = element.dataset.accessValue;
+ const buttons = ContentShareMod.shareBubbleDialog.querySelectorAll('.access-btn');
+ buttons.forEach(btn => btn.classList.remove('active'));
+ element.classList.add('active');
+
+ const descriptions = ContentShareMod.shareBubbleDialog.querySelectorAll('.access-desc');
+ descriptions.forEach(desc => {
+ desc.style.display = desc.dataset.accessType === element.dataset.accessValue ? '' : 'none';
+ });
+ },
+
+ submit: function(action) {
+ const contentDetails = ContentShareMod.currentContentData;
+ let bubbleImpl, bubbleContent, contentImage, contentName;
+
+ if (contentDetails.AvatarId) {
+ bubbleImpl = 'Avatar';
+ bubbleContent = contentDetails.AvatarId;
+ contentImage = contentDetails.AvatarImageCoui;
+ contentName = contentDetails.AvatarName;
+ } else if (contentDetails.SpawnableId) {
+ bubbleImpl = 'Spawnable';
+ bubbleContent = contentDetails.SpawnableId;
+ contentImage = contentDetails.SpawnableImageCoui;
+ contentName = contentDetails.SpawnableName;
+ } else if (contentDetails.WorldId) {
+ bubbleImpl = 'World';
+ bubbleContent = contentDetails.WorldId;
+ contentImage = contentDetails.WorldImageCoui;
+ contentName = contentDetails.WorldName;
+ } else if (contentDetails.UserId) {
+ bubbleImpl = 'User';
+ bubbleContent = contentDetails.UserId;
+ contentImage = contentDetails.UserImageCoui;
+ contentName = contentDetails.UserName;
+ } else {
+ console.error('No valid content ID found');
+ return;
+ }
+
+ const visibility = document.getElementById('share-visibility').value;
+ const duration = document.getElementById('share-duration').value;
+ const access = document.getElementById('share-access').value;
+
+ const shareRule = visibility === 'FriendsOnly' ? 'FriendsOnly' : 'Everyone';
+ const shareLifetime = duration === 'Session' ? 'Session' : 'TwoMinutes';
+ const shareAccess = access === 'Permanent' ? 'Permanent' :
+ access === 'Session' ? 'Session' : 'NoAccess';
+
+ if (ContentShareMod.debugMode) {
+ console.log('Sharing content:', {
+ action, bubbleImpl, bubbleContent,
+ shareRule, shareLifetime, shareAccess
+ });
+ }
+
+ engine.call('NAKCallShareContent', action, bubbleImpl, bubbleContent,
+ shareRule, shareLifetime, shareAccess, contentImage, contentName);
+
+ this.hide();
+ }
+ },
+
+ Unshare: {
+ currentPage: 1,
+ totalPages: 1,
+ sharesPerPage: 5,
+ sharesList: null,
+
+ initStyles: function() {
+ return `
+ .unshare-dialog {
+ width: 800px;
+ height: 1000px;
+ transform: translate(-50%, -60%);
+ display: flex;
+ flex-direction: column;
+ }
+
+ .unshare-dialog .shares-container {
+ flex: 1;
+ overflow-y: auto;
+ margin: 20px 0;
+ min-height: 0;
+ }
+
+ .unshare-dialog #shares-loading,
+ .unshare-dialog #shares-error,
+ .unshare-dialog #shares-empty {
+ text-align: center;
+ padding: 2em;
+ font-size: 1.1em;
+ }
+
+ .unshare-dialog #shares-error {
+ color: #ff6b6b;
+ }
+
+ .unshare-dialog .share-item {
+ display: flex;
+ align-items: center;
+ padding: 15px;
+ border: 1px solid rgba(255, 255, 255, 0.1);
+ margin-bottom: 10px;
+ background: rgba(0, 0, 0, 0.2);
+ border-radius: 4px;
+ min-height: 120px;
+ }
+
+ .unshare-dialog .share-item img {
+ width: 96px;
+ height: 96px;
+ border-radius: 4px;
+ margin-right: 15px;
+ cursor: pointer;
+ }
+
+ .unshare-dialog .share-item .user-name {
+ flex: 1;
+ font-size: 1.3em;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ margin-right: 15px;
+ cursor: pointer;
+ }
+
+ .unshare-dialog .action-btn {
+ width: 180px;
+ height: 60px;
+ font-size: 1.2em;
+ color: white;
+ border-radius: 4px;
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ margin-left: 10px;
+ padding: 0 20px;
+ text-align: center;
+ }
+
+ .unshare-dialog .revoke-btn {
+ background-color: #ff6b6b;
+ }
+
+ .unshare-dialog .undo-btn {
+ background-color: #4a9eff;
+ }
+
+ .unshare-dialog .action-btn:disabled {
+ opacity: 0.5;
+ cursor: not-allowed;
+ background-color: #666;
+ }
+
+ .unshare-dialog .pagination {
+ border-top: 1px solid rgba(255, 255, 255, 0.1);
+ padding-top: 20px;
+ }
+
+ .unshare-dialog .page-info {
+ font-size: 1.1em;
+ opacity: 0.8;
+ margin-bottom: 15px;
+ text-align: center;
+ }
+
+ .unshare-dialog .page-buttons {
+ display: flex;
+ justify-content: center;
+ gap: 20px;
+ }
+
+ .unshare-dialog .share-item.revoked {
+ opacity: 0.7;
+ }
+ `;
+ },
+
+ createDialog: function() {
+ const dialog = document.createElement('div');
+ dialog.id = 'content-unshare-dialog';
+ dialog.className = 'content-sharing-base-dialog unshare-dialog hidden';
+ dialog.innerHTML = `
+ Access Control
+
+
+
+
+ + Users cannot access your Private Content through this share. +
+
+
+ Keep
+ Instance Only
+ None
+ Manage Shares
+ + + + +
+
+ `;
+ document.body.appendChild(dialog);
+ return dialog;
+ },
+
+ show: function(contentDetails) {
+ const dialog = ContentShareMod.unshareDialog;
+ ContentShareMod.applyThemeToDialog(dialog);
+
+ dialog.classList.remove('hidden', 'out');
+ setTimeout(() => dialog.classList.add('in'), 50);
+
+ ContentShareMod.currentContentData = contentDetails;
+ this.currentPage = 1;
+ this.totalPages = 1;
+ this.sharesList = null;
+ this.requestShares();
+ },
+
+ hide: function() {
+ const dialog = ContentShareMod.unshareDialog;
+ dialog.classList.remove('in');
+ dialog.classList.add('out');
+ setTimeout(() => {
+ dialog.classList.add('hidden');
+ dialog.classList.remove('out');
+ }, 200);
+ },
+
+ requestShares: function() {
+ const dialog = ContentShareMod.unshareDialog;
+ const sharesContainer = dialog.querySelector('.shares-container');
+
+ sharesContainer.querySelector('#shares-loading').style.display = '';
+ sharesContainer.querySelector('#shares-error').style.display = 'none';
+ sharesContainer.querySelector('#shares-empty').style.display = 'none';
+ sharesContainer.querySelector('#shares-list').style.display = 'none';
+
+ const contentDetails = ContentShareMod.currentContentData;
+ const contentType = contentDetails.AvatarId ? 'Avatar' : 'Spawnable';
+ const contentId = contentDetails.AvatarId || contentDetails.SpawnableId;
+
+ engine.call('NAKGetContentShares', contentType, contentId);
+ },
+
+ handleSharesResponse: function(success, shares) {
+ const dialog = ContentShareMod.unshareDialog;
+ const sharesContainer = dialog.querySelector('.shares-container');
+ const loadingElement = sharesContainer.querySelector('#shares-loading');
+ const errorElement = sharesContainer.querySelector('#shares-error');
+ const emptyElement = sharesContainer.querySelector('#shares-empty');
+ const sharesListElement = sharesContainer.querySelector('#shares-list');
+
+ loadingElement.style.display = 'none';
+
+ if (!success) {
+ errorElement.style.display = '';
+ return;
+ }
+
+ try {
+ const response = JSON.parse(shares);
+ this.sharesList = response.Data.value;
+
+ if (!this.sharesList || this.sharesList.length === 0) {
+ emptyElement.style.display = '';
+ const pagination = dialog.querySelector('.pagination');
+ const [prevButton, nextButton] = pagination.querySelectorAll('.page-btn');
+ prevButton.disabled = true;
+ nextButton.disabled = true;
+ pagination.querySelector('.page-info').textContent = '1/1';
+ return;
+ }
+
+ this.totalPages = Math.ceil(this.sharesList.length / this.sharesPerPage);
+ this.updatePageContent();
+ } catch (error) {
+ console.error('Error parsing shares:', error);
+ errorElement.style.display = '';
+ }
+ },
+
+ updatePageContent: function() {
+ const dialog = ContentShareMod.unshareDialog;
+ const sharesListElement = dialog.querySelector('#shares-list');
+
+ const startIndex = (this.currentPage - 1) * this.sharesPerPage;
+ const endIndex = startIndex + this.sharesPerPage;
+ const currentShares = this.sharesList.slice(startIndex, endIndex);
+
+ sharesListElement.innerHTML = currentShares.map(share => `
+ 1/1
+
+
+ 
+ ${share.name}
+
+
+ `).join('');
+
+ sharesListElement.style.display = '';
+
+ const pagination = dialog.querySelector('.pagination');
+ pagination.querySelector('.page-info').textContent = `${this.currentPage}/${this.totalPages}`;
+ const [prevButton, nextButton] = pagination.querySelectorAll('.page-btn');
+ prevButton.disabled = this.currentPage === 1;
+ nextButton.disabled = this.currentPage === this.totalPages;
+ },
+
+ previousPage: function() {
+ if (this.currentPage > 1) {
+ this.currentPage--;
+ this.updatePageContent();
+ }
+ },
+
+ nextPage: function() {
+ if (this.currentPage < this.totalPages) {
+ this.currentPage++;
+ this.updatePageContent();
+ }
+ },
+
+ viewUserProfile: function(userId) {
+ this.hide();
+ getUserDetails(userId);
+ },
+
+ revokeShare: function(userId, buttonElement) {
+ const contentDetails = ContentShareMod.currentContentData;
+ const contentType = contentDetails.AvatarId ? 'Avatar' : 'Spawnable';
+ const contentId = contentDetails.AvatarId || contentDetails.SpawnableId;
+
+ buttonElement.disabled = true;
+ buttonElement.textContent = 'Revoking...';
+
+ engine.call('NAKRevokeContentShare', contentType, contentId, userId);
+ },
+
+ handleRevokeResponse: function(success, userId, error) {
+ const dialog = ContentShareMod.unshareDialog;
+ const shareItem = dialog.querySelector(`[data-user-id="${userId}"]`);
+ if (!shareItem) return;
+
+ const actionButton = shareItem.querySelector('button');
+
+ if (success) {
+ shareItem.classList.add('revoked');
+ actionButton.className = 'action-btn undo-btn button';
+ actionButton.textContent = 'Undo';
+ actionButton.onclick = () => {
+ actionButton.disabled = true;
+ actionButton.textContent = 'Restoring...';
+
+ const contentDetails = ContentShareMod.currentContentData;
+ const contentType = contentDetails.AvatarId ? 'Avatar' : 'Spawnable';
+ const contentId = contentDetails.AvatarId || contentDetails.SpawnableId;
+
+ engine.call('NAKCallShareContentDirect', contentType, contentId, userId);
+ };
+ uiPushShow("Share revoked successfully", 3);
+ } else {
+ actionButton.textContent = 'Failed';
+ actionButton.classList.add('failed');
+ uiPushShow(error || "Failed to revoke share", 3);
+
+ // Reset button after a moment
+ setTimeout(() => {
+ actionButton.disabled = false;
+ actionButton.textContent = 'Revoke';
+ actionButton.classList.remove('failed');
+ }, 1000);
+ }
+ },
+
+ handleShareResponse: function(success, userId, error) {
+ const dialog = ContentShareMod.unshareDialog;
+ const shareItem = dialog.querySelector(`[data-user-id="${userId}"]`);
+ if (!shareItem) return;
+
+ const actionButton = shareItem.querySelector('button');
+
+ if (success) {
+ this.requestShares();
+ uiPushShow("Share restored successfully", 3);
+ } else {
+ actionButton.textContent = 'Failed';
+ actionButton.classList.add('failed');
+ uiPushShow(error || "Failed to restore share", 3);
+
+ // Reset button after a moment
+ setTimeout(() => {
+ actionButton.disabled = false;
+ actionButton.textContent = 'Undo';
+ actionButton.classList.remove('failed');
+ }, 1000);
+ }
+ }
+ },
+
+ DirectShare: {
+ currentPage: 1,
+ totalPages: 1,
+ usersPerPage: 5,
+ usersList: null,
+ isInstanceUsers: true,
+
+ initStyles: function() {
+ return `
+ .direct-share-dialog {
+ width: 800px;
+ height: 1000px;
+ transform: translate(-50%, -60%);
+ display: flex;
+ flex-direction: column;
+ }
+
+ .direct-share-dialog .search-container {
+ margin: 20px 0;
+ padding: 10px;
+ background: rgba(0, 0, 0, 0.2);
+ border-radius: 4px;
+ }
+
+ .direct-share-dialog .search-input {
+ width: 100%;
+ padding: 10px;
+ border: none;
+ background: transparent;
+ color: inherit;
+ font-size: 1.1em;
+ }
+
+ .direct-share-dialog .source-indicator {
+ padding: 10px;
+ text-align: center;
+ opacity: 0.8;
+ background: rgba(0, 0, 0, 0.1);
+ border-radius: 4px;
+ margin-bottom: 20px;
+ }
+
+ .direct-share-dialog .users-container {
+ flex: 1;
+ overflow-y: auto;
+ margin-bottom: 20px;
+ min-height: 0;
+ }
+
+ .direct-share-dialog .user-item {
+ display: flex;
+ align-items: center;
+ padding: 15px;
+ border: 1px solid rgba(255, 255, 255, 0.1);
+ margin-bottom: 10px;
+ background: rgba(0, 0, 0, 0.2);
+ border-radius: 4px;
+ min-height: 96px;
+ }
+
+ .direct-share-dialog .user-item img {
+ width: 96px;
+ height: 96px;
+ margin-right: 15px;
+ cursor: pointer;
+ border-radius: 4px;
+ }
+
+ .direct-share-dialog .user-item .user-name {
+ flex: 1;
+ font-size: 1.3em;
+ white-space: nowrap;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ margin-right: 15px;
+ cursor: pointer;
+ }
+
+ .direct-share-dialog .user-item .action-btn {
+ width: 140px;
+ height: 50px;
+ font-size: 1.2em;
+ color: white;
+ background-color: rgba(27, 80, 55, 1);
+ border-radius: 4px;
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ }
+
+ .direct-share-dialog .user-item .action-btn:disabled {
+ opacity: 0.5;
+ cursor: not-allowed;
+ background-color: #4a9eff;
+ }
+
+ .direct-share-dialog .pagination {
+ border-top: 1px solid rgba(255, 255, 255, 0.1);
+ padding-top: 20px;
+ }
+
+ .direct-share-dialog .page-info {
+ font-size: 1.1em;
+ opacity: 0.8;
+ margin-bottom: 15px;
+ text-align: center;
+ }
+
+ .direct-share-dialog .page-buttons {
+ display: flex;
+ justify-content: center;
+ gap: 20px;
+ }
+
+ .direct-share-dialog .user-item .action-btn {
+ width: 180px;
+ height: 60px;
+ font-size: 1.2em;
+ color: white;
+ border-radius: 4px;
+ display: inline-flex;
+ align-items: center;
+ justify-content: center;
+ margin-left: 10px;
+ padding: 0 20px;
+ text-align: center;
+ background-color: rgba(27, 80, 55, 1);
+ }
+
+ .direct-share-dialog .user-item .action-btn:disabled {
+ opacity: 0.5;
+ cursor: not-allowed;
+ }
+
+ .direct-share-dialog .user-item .action-btn.shared {
+ background-color: #4a9eff;
+ }
+
+ .direct-share-dialog .user-item .action-btn.failed {
+ background-color: #ff6b6b;
+ }
+ `;
+ },
+
+ createDialog: function() {
+ const dialog = document.createElement('div');
+ dialog.id = 'content-direct-share-dialog';
+ dialog.className = 'content-sharing-base-dialog direct-share-dialog hidden';
+ dialog.innerHTML = `
+ Direct Share
+ + +
+
+
+ Loading users...
+
+
+
+
+
+ `;
+ document.body.appendChild(dialog);
+ return dialog;
+ },
+
+ show: function(contentDetails) {
+ const dialog = ContentShareMod.directShareDialog;
+ ContentShareMod.applyThemeToDialog(dialog);
+
+ dialog.classList.remove('hidden', 'out');
+ setTimeout(() => dialog.classList.add('in'), 50);
+
+ ContentShareMod.currentContentData = contentDetails;
+ this.currentPage = 1;
+ this.totalPages = 1;
+ this.usersList = null;
+ this.requestUsers(true);
+ },
+
+ hide: function() {
+ const dialog = ContentShareMod.directShareDialog;
+ dialog.classList.remove('in');
+ dialog.classList.add('out');
+ setTimeout(() => {
+ dialog.classList.add('hidden');
+ dialog.classList.remove('out');
+ }, 200);
+ },
+
+ handleUsersResponse: function(success, users, isInstanceUsers) {
+ const dialog = ContentShareMod.directShareDialog;
+ const usersContainer = dialog.querySelector('.users-container');
+ // const sourceIndicator = dialog.querySelector('.source-indicator');
+ const loadingElement = usersContainer.querySelector('#users-loading');
+ const errorElement = usersContainer.querySelector('#users-error');
+ const emptyElement = usersContainer.querySelector('#users-empty');
+ const usersListElement = usersContainer.querySelector('#users-list');
+
+ loadingElement.style.display = 'none';
+ // sourceIndicator.textContent = isInstanceUsers ?
+ // 'Showing users in current instance' :
+ // 'Showing search results';
+
+ // TODO: Add source indicator to html:
+ // Page 1/1
+
+
+ // Showing users in current instance
+ //
+
+ if (!success) {
+ errorElement.style.display = '';
+ return;
+ }
+
+ try {
+ const response = JSON.parse(users);
+ this.usersList = response.entries;
+ this.isInstanceUsers = isInstanceUsers;
+
+ if (!this.usersList || this.usersList.length === 0) {
+ emptyElement.style.display = '';
+ this.updatePagination();
+ return;
+ }
+
+ this.totalPages = Math.ceil(this.usersList.length / this.usersPerPage);
+ this.updatePageContent();
+ } catch (error) {
+ console.error('Error parsing users:', error);
+ errorElement.style.display = '';
+ }
+ },
+
+ handleSearch: function(event) {
+ if (event.key === 'Enter') {
+ const searchValue = event.target.value.trim();
+ // Pass true for instance users when empty search, false for search results
+ this.requestUsers(searchValue === '', searchValue);
+ }
+ },
+
+ requestUsers: function(isInstanceUsers, searchQuery = '') {
+ const dialog = ContentShareMod.directShareDialog;
+ const usersContainer = dialog.querySelector('.users-container');
+
+ usersContainer.querySelector('#users-loading').style.display = '';
+ usersContainer.querySelector('#users-error').style.display = 'none';
+ usersContainer.querySelector('#users-empty').style.display = 'none';
+ usersContainer.querySelector('#users-list').style.display = 'none';
+
+ engine.call('NAKGetUsersForSharing', searchQuery);
+ },
+
+ updatePageContent: function() {
+ const dialog = ContentShareMod.directShareDialog;
+ const usersListElement = dialog.querySelector('#users-list');
+
+ const startIndex = (this.currentPage - 1) * this.usersPerPage;
+ const endIndex = startIndex + this.usersPerPage;
+ const currentUsers = this.usersList.slice(startIndex, endIndex);
+
+ usersListElement.innerHTML = currentUsers.map(user => `
+
+ 
+ ${user.name}
+
+
+ `).join('');
+
+ usersListElement.style.display = '';
+ this.updatePagination();
+ },
+
+ updatePagination: function() {
+ const dialog = ContentShareMod.directShareDialog;
+ const pagination = dialog.querySelector('.pagination');
+ const [prevButton, nextButton] = pagination.querySelectorAll('.page-btn');
+
+ pagination.querySelector('.page-info').textContent = `Page ${this.currentPage}/${this.totalPages}`;
+ prevButton.disabled = this.currentPage === 1;
+ nextButton.disabled = this.currentPage === this.totalPages;
+ },
+
+ previousPage: function() {
+ if (this.currentPage > 1) {
+ this.currentPage--;
+ this.updatePageContent();
+ }
+ },
+
+ nextPage: function() {
+ if (this.currentPage < this.totalPages) {
+ this.currentPage++;
+ this.updatePageContent();
+ }
+ },
+
+ viewUserProfile: function(userId) {
+ this.hide();
+ getUserDetails(userId);
+ },
+
+ shareWithUser: function(userId, buttonElement) {
+ const contentDetails = ContentShareMod.currentContentData;
+ const contentType = contentDetails.AvatarId ? 'Avatar' : 'Spawnable';
+ const contentId = contentDetails.AvatarId || contentDetails.SpawnableId;
+ const contentName = contentDetails.AvatarName || contentDetails.SpawnableName;
+ const contentImage = contentDetails.AvatarImageURL || contentDetails.SpawnableImageURL;
+
+ buttonElement.disabled = true;
+ buttonElement.textContent = 'Sharing...';
+
+ engine.call('NAKCallShareContentDirect', contentType, contentId, userId, contentName, contentImage);
+ },
+
+ handleShareResponse: function(success, userId, error) {
+ const dialog = ContentShareMod.directShareDialog;
+ const userItem = dialog.querySelector(`[data-user-id="${userId}"]`);
+ if (!userItem) return;
+
+ const actionButton = userItem.querySelector('button');
+
+ if (success) {
+ actionButton.textContent = 'Shared';
+ actionButton.disabled = true;
+ actionButton.classList.add('shared');
+ uiPushShow("Content shared successfully", 3, "shareresponse");
+ } else {
+ actionButton.disabled = false;
+ actionButton.textContent = 'Failed';
+ actionButton.classList.add('failed');
+ uiPushShow(error || "Failed to share content", 3, "shareresponse");
+
+ // Reset button after a moment
+ setTimeout(() => {
+ actionButton.disabled = false;
+ actionButton.textContent = 'Share';
+ actionButton.classList.remove('failed', 'shared');
+ }, 1000);
+ }
+ }
+ },
+
+ ShareSelect: {
+ initStyles: function() {
+ return `
+ .share-select-dialog {
+ width: 650px;
+ height: 480px;
+ transform: translate(-50%, -80%);
+ }
+
+ .share-select-dialog .share-options {
+ display: flex;
+ flex-direction: column;
+ gap: 15px;
+ margin-top: 20px;
+ }
+
+ .share-select-dialog .share-option {
+ padding: 20px;
+ text-align: left;
+ cursor: pointer;
+ background: rgba(0, 0, 0, 0.2);
+ border: 1px solid rgba(255, 255, 255, 0.1);
+ border-radius: 4px;
+ transition: background-color 0.2s ease;
+ }
+
+ .share-select-dialog .share-option:hover {
+ background-color: rgba(27, 80, 55, 1);
+ border-color: rgba(255, 255, 255, 0.2);
+ }
+
+ .share-select-dialog h3 {
+ margin: 0 0 8px 0;
+ font-size: 1.2em;
+ }
+
+ .share-select-dialog p {
+ margin: 0;
+ opacity: 0.8;
+ font-size: 0.95em;
+ line-height: 1.4;
+ }
+ `;
+ },
+
+ createDialog: function() {
+ const dialog = document.createElement('div');
+ dialog.id = 'content-share-select-dialog';
+ dialog.className = 'content-sharing-base-dialog share-select-dialog hidden';
+ dialog.innerHTML = `
+