Cleaned up export dialog, fixed copying

ThaumRystra · Jul 10, 2017 · 4a6fca9 · 4a6fca9
1 parent 3546412
commit 4a6fca9
Show file tree

Hide file tree

Showing 3 changed files with 47 additions and 26 deletions.
diff --git a/rpg-docs/client/views/character/export/exportDialog/exportDialog.css b/rpg-docs/client/views/character/export/exportDialog/exportDialog.css
@@ -0,0 +1,4 @@
+.exportDialog .iiexport {
+	overflow-y: auto;
+	width: 100% !important;
+}
diff --git a/rpg-docs/client/views/character/export/exportDialog/exportDialog.html b/rpg-docs/client/views/character/export/exportDialog/exportDialog.html
@@ -1,26 +1,28 @@
 <template name="exportDialog">
-	<div class="fit layout vertical">
+	<div class="exportDialog fit layout vertical">
 		{{#with character}}
-			<app-header-layout has-scrolling-region class="export flex">
-				<app-header fixed effects="waterfall">
-					<app-toolbar>
-					  <div main-title>Export Character to Improved Initiative</div>
-					</app-toolbar>
-				</app-header>
-				<div class="form flex layout vertical">
-					<paper-toggle-button id="exportFeatures" checked={{settings.exportFeatures}}>
-						Features
-					</paper-toggle-button>
-					<paper-toggle-button id="exportAttacks" checked={{settings.exportAttacks}}>
-						Attacks
-					</paper-toggle-button>
-					<paper-toggle-button id="exportDescription" checked={{settings.exportDescription}}>
-						Description
-					</paper-toggle-button>
-					<paper-textarea class="flex iiexport" label="JSON" value={{improvedInitiativeJson}}></paper-textarea>
-					<paper-button id="copyExportButton" class="red-button" raised>Copy to Clipboard</paper-button>
-				</div>
-			</app-header-layout>
+			<app-header fixed effects="waterfall">
+				<app-toolbar>
+				  <div main-title>Export Character to Improved Initiative</div>
+				</app-toolbar>
+			</app-header>
+			<div class="form flex layout vertical">
+				<paper-toggle-button id="exportFeatures" checked={{settings.exportFeatures}}>
+					Features
+				</paper-toggle-button>
+				<paper-toggle-button id="exportAttacks" checked={{settings.exportAttacks}}>
+					Attacks
+				</paper-toggle-button>
+				<paper-toggle-button id="exportDescription" checked={{settings.exportDescription}}>
+					Description
+				</paper-toggle-button>
+				<div class="paper-font-title padded">JSON</div>
+				<textarea class="flex iiexport">{{improvedInitiativeJson}}</textarea>
+				<paper-button id="copyExportButton" class="red-button" raised>
+					<iron-icon icon="content-copy"></iron-icon>
+					Copy to Clipboard
+				</paper-button>
+			</div>
 			<div class="buttons layout horizontal end-justified">
 				<paper-button class="doneButton"> Done </paper-button>
 			</div>

diff --git a/rpg-docs/client/views/character/export/exportDialog/exportDialog.js b/rpg-docs/client/views/character/export/exportDialog/exportDialog.js
@@ -30,16 +30,31 @@ Template.exportDialog.events({
 	},
 	"click #copyExportButton": function(event, template){
 		var copyTextarea = template.find(".iiexport");
-		copyTextarea && copyTextarea.select();
+		copyTextarea.select();
+		var msg;
 		try {
 			var successful = document.execCommand("copy");
-			var msg = successful ? "successful" : "unsuccessful";
-			console.log("Copying text command was " + msg);
+			var msg = successful ? "JSON copied to clipboard" : "Unable to copy JSON";
 		} catch (err) {
-			console.log("Oops, unable to copy");
+			msg = "Unable to copy JSON";
+		} finally {
+			clearSelection();
+			GlobalUI.toast(msg);
 		}
 	},
 	"click .doneButton": function(event, instance){
 		popDialogStack();
 	},
-})
+});
+
+var clearSelection = function(){
+	if (window.getSelection) {
+		if (window.getSelection().empty) {  // Chrome
+			window.getSelection().empty();
+		} else if (window.getSelection().removeAllRanges) {  // Firefox
+			window.getSelection().removeAllRanges();
+		}
+	} else if (document.selection) {  // IE?
+		document.selection.empty();
+	}
+};