Add save and discard buttons on the Wikidata schema

extensions/wikidata/module/langs/translation-en.json

@@ -43,9 +43,12 @@
                 "datatype-not-supported-yet": "This datatype is not supported yet, sorry.",
                 "invalid-schema-warning-issues": "Your schema is incomplete, fix it to see the issues.",
                 "invalid-schema-warning-preview": "Your schema is incomplete, fix it to see the preview.",
-                "reset-button": "Reset",
-                "save-button": "Save",
+                "discard-button": "Discard changes",
+                "save-button": "Save schema",
                 "close-button": "Close",
+                "unsaved-changes-alt": "You have made unsaved changes to your Wikidata schema.",
+                "save-schema-alt": "Save the schema to OpenRefine. The changes will not be uploaded to Wikidata yet.",
+                "discard-schema-changes-alt": "Discard the changes made to the schema.",
                 "incomplete-schema-could-not-be-saved": "Your schema is incomplete so it cannot be saved yet.",
                 "unsaved-warning": "You have made unsaved changes to your Wikidata schema. Close anyway?"
         },

extensions/wikidata/module/scripts/dialogs/schema-alignment-dialog.js

@@ -79,7 +79,13 @@ SchemaAlignmentDialog.setUpTabs = function() {
         .attr('href', '#wikidata-preview-panel')
         .text($.i18n._('wikidata-schema')["edits-preview-tab-header"])
         .appendTo(this._toolPanel);
-  
+
+  this._unsavedIndicator = $('<span></span>')
+        .html('&nbsp;*')
+        .attr('title', $.i18n._('wikidata-schema')["unsaved-changes-alt"])
+        .hide()
+        .appendTo(schemaButton);
+ 
   $('.main-view-panel-tab-header').click(function() {
      var targetTab = $(this).attr('href');
      SchemaAlignmentDialog.switchTab(targetTab);
@@ -88,7 +94,6 @@ SchemaAlignmentDialog.setUpTabs = function() {
   /**
    * Init the schema tab
    */
-
   var schemaTab = $(DOM.loadHTML("wikidata", "scripts/schema-alignment-tab.html")).appendTo(this._schemaPanel);
   var schemaElmts = this._schemaElmts = DOM.bind(schemaTab);
   schemaElmts.dialogExplanation.text($.i18n._('wikidata-schema')["dialog-explanation"]);
@@ -97,6 +102,18 @@ SchemaAlignmentDialog.setUpTabs = function() {
     self._addItem();
     SchemaAlignmentDialog._hasChanged();
   });
+  schemaElmts.saveButton
+        .text($.i18n._('wikidata-schema')["save-button"])
+        .attr('title', $.i18n._('wikidata-schema')["save-schema-alt"])
+        .prop('disabled', true)
+        .addClass('disabled')
+        .click(function() { SchemaAlignmentDialog._save(); });
+  schemaElmts.discardButton
+        .text($.i18n._('wikidata-schema')["discard-button"])
+        .attr('title', $.i18n._('wikidata-schema')["discard-schema-changes-alt"])
+        .prop('disabled', true)
+        .addClass('disabled')
+        .click(function() { SchemaAlignmentDialog._discardChanges(); });
 
   this._wikibasePrefix = "http://www.wikidata.org/entity/"; // hardcoded for now
 
@@ -110,22 +127,21 @@ SchemaAlignmentDialog.setUpTabs = function() {
    * Init the issues tab
    */
   var issuesTab = $(DOM.loadHTML("wikidata", "scripts/issues-tab.html")).appendTo(this._issuesPanel);
-  var issuesElmts = this._schemaElmts = DOM.bind(issuesTab);
+  var issuesElmts = this._issuesElmts = DOM.bind(issuesTab);
   issuesElmts.invalidSchemaWarningIssues.text($.i18n._('wikidata-schema')["invalid-schema-warning-issues"]);
 
   /**
    * Init the preview tab
    */
-
   var previewTab = $(DOM.loadHTML("wikidata", "scripts/preview-tab.html")).appendTo(this._previewPanel);
-  var previewElmts = this._schemaElmts = DOM.bind(previewTab);
+  var previewElmts = this._previewElmts = DOM.bind(previewTab);
   previewElmts.previewExplanation.text($.i18n._('wikidata-schema')["preview-explanation"]);
   previewElmts.invalidSchemaWarningPreview.text($.i18n._('wikidata-schema')["invalid-schema-warning-preview"]);
 
   this._previewPanes = $(".schema-alignment-dialog-preview");
 
   // Load the existing schema
-  this._reset(theProject.overlayModels.wikibaseSchema, true);
+  this._reset(theProject.overlayModels.wikibaseSchema);
   // Perform initial preview
   this.preview();
 }
@@ -184,12 +200,6 @@ SchemaAlignmentDialog.launch = function(onDone) {
   // this._createDialog();
 }
 
-// Inject tabs in any project where the schema has been defined
-Refine.registerUpdateFunction(function(options) {
-    if(theProject.overlayModels.wikibaseSchema && !SchemaAlignmentDialog.isSetUp()) {
-    SchemaAlignmentDialog.setUpTabs();
-    }
-});
 
 var beforeUnload = function(e) {
   if (SchemaAlignmentDialog.isSetUp() && SchemaAlignmentDialog._hasUnsavedChanges === true) {
@@ -199,7 +209,7 @@ var beforeUnload = function(e) {
 
 $(window).bind('beforeunload', beforeUnload);
 
-SchemaAlignmentDialog._reset = function(schema, initial) {
+SchemaAlignmentDialog._reset = function(schema) {
   this._originalSchema = schema || { itemDocuments: [] };
   this._schema = cloneDeep(this._originalSchema); // this is what can be munched on
 
@@ -214,7 +224,6 @@ SchemaAlignmentDialog._reset = function(schema, initial) {
   if (!this._schema.itemDocuments.length) {
     // this._addItem();
   }
-  this.preview(initial);
 };
 
 SchemaAlignmentDialog._save = function(onDone) {
@@ -231,9 +240,8 @@ SchemaAlignmentDialog._save = function(onDone) {
       onDone: function() {
         theProject.overlayModels.wikibaseSchema = schema;
 
-        self._elmts.statusIndicator.hide();
         $('.invalid-schema-warning').hide();
-        self._hasUnsavedChanges = false;
+        self._changesCleared();
 
         if (onDone) onDone();
       },
@@ -244,6 +252,22 @@ SchemaAlignmentDialog._save = function(onDone) {
   );
 };
 
+SchemaAlignmentDialog._discardChanges = function() {
+  this._reset(theProject.overlayModels.wikibaseSchema);
+  this._changesCleared();
+}
+
+SchemaAlignmentDialog._changesCleared = function() {
+  this._hasUnsavedChanges = false;
+  this._unsavedIndicator.hide();
+  this._schemaElmts.saveButton
+        .prop('disabled', true)
+        .addClass('disabled');
+  this._schemaElmts.discardButton
+        .prop('disabled', true)
+        .addClass('disabled');
+}
+
 SchemaAlignmentDialog._createDraggableColumn = function(name, reconciled) {
   var cell = $("<div></div>").addClass('wbs-draggable-column').text(name);
   if (reconciled) {
@@ -1088,6 +1112,13 @@ SchemaAlignmentDialog.getJSON = function() {
 SchemaAlignmentDialog._hasChanged = function() {
   this._hasUnsavedChanges = true;
   SchemaAlignmentDialog.preview(false);
+  this._unsavedIndicator.show();
+  this._schemaElmts.saveButton
+        .prop('disabled', false)
+        .removeClass('disabled');
+  this._schemaElmts.discardButton
+        .prop('disabled', false)
+        .removeClass('disabled');
 }
 
 SchemaAlignmentDialog.preview = function(initial) {
@@ -1120,10 +1151,17 @@ SchemaAlignmentDialog.preview = function(initial) {
 };
 
 Refine.registerUpdateFunction(function(options) {
+   // Inject tabs in any project where the schema has been defined
+   if(theProject.overlayModels.wikibaseSchema && !SchemaAlignmentDialog.isSetUp()) {
+       SchemaAlignmentDialog.setUpTabs();
+   }
    if (SchemaAlignmentDialog.isSetUp() && (options.everythingChanged || options.modelsChanged ||
        options.rowsChanged || options.rowMetadataChanged || options.cellsChanged || options.engineChanged)) {
+       if (!SchemaAlignmentDialog._hasUnsavedChanges) {
+          SchemaAlignmentDialog._discardChanges();
+       }
        SchemaAlignmentDialog.updateColumns();
-       SchemaAlignmentDialog.preview(false);
+       SchemaAlignmentDialog.preview();
    }
 });
 

extensions/wikidata/module/scripts/schema-alignment-tab.html

@@ -1,4 +1,5 @@
 <div id="schema-alignment-tab">
+    <div class="schema-alignment-save"><button class="button button-primary" bind="saveButton"></button><button class="button button-primary" bind="discardButton"></button></div>
     <p class="panel-explanation" bind="dialogExplanation"></p>
     <div class="schema-alignment-dialog-canvas">
     <div class="schema-alignment-dialog-columns-area">

extensions/wikidata/module/styles/dialogs/schema-alignment-dialog.less

@@ -89,6 +89,19 @@ OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
   margin: 1em;
 }
 
+.schema-alignment-save {
+  float: right;
+  padding: 1em;
+}
+
+.schema-alignment-save button:disabled {
+  color: gray;
+}
+
+.schema-alignment-save button {
+  font-weight: normal;
+}
+
 .schema-alignment-dialog-columns-area {
   border: 1px solid #bcf;
   border-left: 0;