Improve link and text sharing UI

css/dialogs.css

@@ -554,13 +554,8 @@
 	#settingslist li:hover .setting_icon i {
 		color: var(--color-light);
 	}
-	.password_toggle {
-		display: inline-block;
-		margin-left: 4px;
-		margin-top: 4px;
-		width: 24px;
-		text-align: center;
-		vertical-align: text-bottom;
+	.form_input_tool {
+		width: 30px;
 	}
 
 	/*Keybinds*/

js/edit_sessions.js

@@ -462,7 +462,7 @@ BARS.defineActions(function() {
 				title: 'dialog.edit_session.title',
 				form: {
 					username: {type: 'text', label: 'edit_session.username', value: username},
-					token: {type: 'text', label: 'edit_session.token', value: token, readonly: !!session},
+					token: {type: 'text', label: 'edit_session.token', value: token, readonly: !!session, share_text: true},
 					about: {type: 'info', text: 'edit_session.about', condition: !session},
 					status: {type: 'info', text: `**${tl('edit_session.status')}**: ${(session && session.hosting) ? tl('edit_session.hosting') : tl('edit_session.connected')}`, condition: !!session},
 				},

js/interface/dialog.js

@@ -56,7 +56,7 @@ function buildForm(dialog) {
 						bar.append(list);
 					}
 					if (data.type == 'password') {
-						bar.append(`<div class="password_toggle">
+						bar.append(`<div class="password_toggle form_input_tool tool">
 								<i class="fas fa-eye-slash"></i>
 							</div>`)
 						input_element.type = 'password';
@@ -69,6 +69,45 @@ function buildForm(dialog) {
 							this_bar.find('.password_toggle i')[0].className = hidden ? 'fas fa-eye-slash' : 'fas fa-eye';
 						})
 					}
+					if (data.share_text && data.value) {
+						let text = data.value.toString();
+						let is_url = text.startsWith('https://');
+
+						let copy_button = Interface.createElement('div', {class: 'form_input_tool tool'}, Blockbench.getIconNode('content_paste'));
+						copy_button.addEventListener('click', e => {
+							if (isApp || navigator.clipboard) {
+								Clipbench.setText(text);
+								Blockbench.showQuickMessage('dialog.copied_to_clipboard');
+								input_element.focus();
+								document.execCommand('selectAll');
+
+							} else if (is_url) {
+								Blockbench.showMessageBox({
+									title: 'dialog.share_model.title',
+									message: `[${text}](${text})`,
+								})
+							}
+						});
+						bar.append(copy_button);
+
+						if (is_url) {
+							let open_button = Interface.createElement('div', {class: 'form_input_tool tool'}, Blockbench.getIconNode('open_in_browser'));
+							open_button.addEventListener('click', e => {
+								Blockbench.openLink(text);
+							});
+							bar.append(open_button);
+						}
+						if (navigator.share) {
+							let share_button = Interface.createElement('div', {class: 'form_input_tool tool'}, Blockbench.getIconNode('share'));
+							share_button.addEventListener('click', e => {
+								navigator.share({
+									label: data.label ? tl(data.label) : 'Share',
+									[is_url ? 'url' : 'text']: text
+								});
+							});
+							bar.append(share_button);
+						}
+					}
 					break;
 				case 'textarea':
 					input_element = Object.assign(document.createElement('textarea'), {

js/io/io.js

@@ -514,12 +514,15 @@ function uploadSketchfabModel() {
 					processData: false,
 					type: 'POST',
 					success: function(response) {
-						Blockbench.showMessageBox({
+						let url = `https://sketchfab.com/models/${response.uid}`
+						new Dialog('sketchfab_link', {
 							title: tl('message.sketchfab.success'),
-							message:
-								`[${formResult.name} on Sketchfab](https://sketchfab.com/models/${response.uid})`, //\n\n \n\n`+
 							icon: 'icon-sketchfab',
-						})
+							form: {
+								message: {type: 'info', text: `[${formResult.name} on Sketchfab](${url})`},
+								link: {type: 'text', value: url, readonly: true, share_text: true}
+							}
+						}).show();
 					},
 					error: function(response) {
 						Blockbench.showQuickMessage(tl('message.sketchfab.error') + `Error ${response.status}`, 1500)
@@ -848,24 +851,11 @@ BARS.defineActions(function() {
 						success: function(response) {
 							let link = `https://blckbn.ch/${response.id}`
 
-							let link_dialog = new Dialog({
+							new Dialog({
 								id: 'share_model_link',
 								title: 'dialog.share_model.title',
 								form: {
-									link: {type: 'text', value: link}
-								},
-								buttons: ['action.copy', 'dialog.close'],
-								onConfirm() {
-									link_dialog.hide();
-									if (isApp || navigator.clipboard) {
-										Clipbench.setText(link);
-										Blockbench.showQuickMessage('dialog.share_model.copied_to_clipboard');
-									} else {
-										Blockbench.showMessageBox({
-											title: 'dialog.share_model.title',
-											message: `[${link}](${link})`,
-										})
-									}
+									link: {type: 'text', value: link, readonly: true, share_text: true}
 								}
 							}).show();
 

lang/en.json

@@ -13,6 +13,7 @@
 	"dialog.continue": "Continue",
 	"dialog.ignore": "Ignore",
 	"dialog.dontshowagain": "Don't Show Again",
+	"dialog.copied_to_clipboard": "Copied to clipboard",
 
 	"data.cube": "Cube",
 	"data.locator": "Locator",
@@ -582,7 +583,6 @@
 	"dialog.share_model.title": "Share Model",
 	"dialog.share_model.expire_time": "Expire Time",
 	"dialog.share_model.thumbnail": "Thumbnail",
-	"dialog.share_model.copied_to_clipboard": "Link copied to clipboard",
 	"dialog.share_model.failed": "Failed to upload model",
 
 	"dialog.model_stats.title": "Model Stats",