From 24e03f324942125c8faa164d3da557649844672f Mon Sep 17 00:00:00 2001
From: Oliver Hamlet <oliver.hamlet@gmail.com>
Date: Wed, 24 Dec 2014 12:19:36 +0000
Subject: [PATCH] Dialogs now follow Material Design spec.

---
 resources/report/html/loot-dialog.html        | 24 ++++++++++++++++++-
 .../report/html/loot-message-dialog.html      |  4 ++--
 resources/report/js/script.js                 | 16 +++++--------
 3 files changed, 31 insertions(+), 13 deletions(-)

diff --git a/resources/report/html/loot-dialog.html b/resources/report/html/loot-dialog.html
index 19dc5227..0f80bcb5 100644
--- a/resources/report/html/loot-dialog.html
+++ b/resources/report/html/loot-dialog.html
@@ -12,6 +12,28 @@ Still missing compared to <dialog> are:
 <link rel="import" href="../bower_components/paper-dialog/paper-action-dialog.html">
 
 <polymer-element name="loot-dialog" extends="paper-action-dialog" transition="core-transition-center" layered="false">
+    <template>
+    <style>
+    :host {
+        margin: 24px 40px;
+    }
+    :host::shadow #actions {
+        padding: 16px 16px 8px;
+        /* This is and the div CSS would be better done by moving the div before
+           both content elements, this is a hack to do the same without editing
+           the HTML. */
+        justify-content: flex-end;
+    }
+    :host::shadow #actions > div {
+        flex: none;
+    }
+    :host::shadow h1 {
+        font-weight: 500;
+        font-size: 1.429rem;
+    }
+    </style>
+    <shadow></shadow>
+    </template>
     <script>
     Polymer({
         show: function() {
@@ -31,4 +53,4 @@ Still missing compared to <dialog> are:
         },
     });
     </script>
-</polymer-element>
\ No newline at end of file
+</polymer-element>
diff --git a/resources/report/html/loot-message-dialog.html b/resources/report/html/loot-message-dialog.html
index 5e7c32e6..fde9ee9d 100644
--- a/resources/report/html/loot-message-dialog.html
+++ b/resources/report/html/loot-message-dialog.html
@@ -71,7 +71,7 @@ was pressed.
 
             var cancel = document.createElement('paper-button');
             cancel.className = 'cancel';
-            cancel.setAttribute('affirmative', true);
+            cancel.setAttribute('dismissive', true);
             cancel.textContent = 'Cancel';
             this.appendChild(cancel);
         },
@@ -88,4 +88,4 @@ was pressed.
 
     });
     </script>
-</polymer-element>
\ No newline at end of file
+</polymer-element>
diff --git a/resources/report/js/script.js b/resources/report/js/script.js
index 78c6dda8..ee3851bc 100644
--- a/resources/report/js/script.js
+++ b/resources/report/js/script.js
@@ -412,13 +412,9 @@ function getConflictingPluginsFromFilter() {
 
     return Promise.resolve([]);
 }
-function showMessageDialog(title, text, yesNo, closeCallback) {
+function showMessageDialog(title, text, positiveText, closeCallback) {
     var dialog = document.createElement('loot-message-dialog');
-    if (yesNo) {
-        dialog.setButtonText(l10n.jed.translate('Yes').fetch(), l10n.jed.translate('No').fetch());
-    } else {
-        dialog.setButtonText(l10n.jed.translate('Yes').fetch(), l10n.jed.translate('Cancel').fetch());
-    }
+    dialog.setButtonText(positiveText, l10n.jed.translate('Cancel').fetch());
     dialog.showModal(title, text, closeCallback);
     document.body.appendChild(dialog);
 }
@@ -645,7 +641,7 @@ function redatePlugins(evt) {
         return;
     }
 
-    showMessageDialog('Redate Plugins', 'This feature is provided so that modders using the Creation Kit may set the load order it uses. A side-effect is that any subscribed Steam Workshop mods will be re-downloaded by Steam. Do you wish to continue?', false, function(result){
+    showMessageDialog('Redate Plugins?', 'This feature is provided so that modders using the Creation Kit may set the load order it uses. A side-effect is that any subscribed Steam Workshop mods will be re-downloaded by Steam. Do you wish to continue?', l10n.jed.translate('Redate').fetch(), function(result){
         if (result) {
             loot.query('redatePlugins').then(function(response){
                 toast('Plugins were successfully redated.');
@@ -654,7 +650,7 @@ function redatePlugins(evt) {
     });
 }
 function clearAllMetadata(evt) {
-    showMessageDialog('Clear All Metadata', 'Are you sure you want to clear all existing user-added metadata from all plugins?', false, function(result){
+    showMessageDialog('', 'Are you sure you want to clear all existing user-added metadata from all plugins?', l10n.jed.translate('Clear').fetch(), function(result){
         if (result) {
             loot.query('clearAllMetadata').then(JSON.parse).then(function(result){
                 if (result) {
@@ -806,7 +802,7 @@ function focusSearch(evt) {
     }
 }
 function handleUnappliedChangesClose(change) {
-    showMessageDialog('Unapplied Sorting Changes', 'You have not yet applied or cancelled your ' + change + '. Are you sure you want to quit?', true, function(result){
+    showMessageDialog('', 'You have not yet applied or cancelled your ' + change + '. Are you sure you want to quit?', l10n.jed.translate('Quit').fetch(), function(result){
         if (result) {
             /* Cancel any sorting and close any editors. Cheat by sending a
                cancelSort query for as many times as necessary. */
@@ -951,7 +947,7 @@ function handleCopyMetadata(evt) {
     }).catch(processCefError);
 }
 function handleClearMetadata(evt) {
-    showMessageDialog('Clear Plugin Metadata', 'Are you sure you want to clear all existing user-added metadata from "' + evt.target.getName() + '"?', false, function(result){
+    showMessageDialog('', 'Are you sure you want to clear all existing user-added metadata from "' + evt.target.getName() + '"?', l10n.jed.translate('Clear').fetch(), function(result){
         if (result) {
             var request = JSON.stringify({
                 name: 'clearPluginMetadata',