REFACTOR: color-scheme model (#7477)

app/assets/javascripts/admin/models/color-scheme.js.es6

@@ -3,8 +3,9 @@ import ColorSchemeColor from "admin/models/color-scheme-color";
 import computed from "ember-addons/ember-computed-decorators";
 
 const ColorScheme = Discourse.Model.extend(Ember.Copyable, {
-  init: function() {
+  init() {
     this._super(...arguments);
+
     this.startTrackingChanges();
   },
 
@@ -13,84 +14,67 @@ const ColorScheme = Discourse.Model.extend(Ember.Copyable, {
     return "" + this.name;
   },
 
-  startTrackingChanges: function() {
+  startTrackingChanges() {
-    this.set("originals", {
+    this.set("originals", { name: this.name });
-      name: this.get("name")
-    });
   },
 
   schemeJson() {
-    let buffer = [];
+    const buffer = [];
-    this.get("colors").forEach(c => {
+    this.colors.forEach(c => {
       buffer.push(`  "${c.get("name")}": "${c.get("hex")}"`);
     });
 
-    return [`"${this.get("name")}": {`, buffer.join(",\n"), "}"].join("\n");
+    return [`"${this.name}": {`, buffer.join(",\n"), "}"].join("\n");
   },
 
-  copy: function() {
+  copy() {
-    var newScheme = ColorScheme.create({
+    const newScheme = ColorScheme.create({
-      name: this.get("name"),
+      name: this.name,
       can_edit: true,
       colors: Ember.A()
     });
-    this.get("colors").forEach(c => {
+    this.colors.forEach(c => {
       newScheme.colors.pushObject(
-        ColorSchemeColor.create({
+        ColorSchemeColor.create(c.getProperties("name", "hex", "default_hex"))
-          name: c.get("name"),
-          hex: c.get("hex"),
-          default_hex: c.get("default_hex")
-        })
       );
     });
     return newScheme;
   },
 
   @computed("name", "colors.@each.changed", "saving")
-  changed() {
+  changed(name) {
     if (!this.originals) return false;
-    if (this.originals["name"] !== this.get("name")) return true;
+    if (this.originals.name !== name) return true;
-    if (
+    if (_.any(this.colors, c => c.get("changed"))) return true;
-      _.any(this.get("colors"), function(c) {
+
-        return c.get("changed");
-      })
-    )
-      return true;
     return false;
   },
 
   @computed("changed")
   disableSave(changed) {
-    if (this.get("theme_id")) {
+    if (this.theme_id) {
       return false;
     }
-    return (
+
-      !changed ||
+    return !changed || this.saving || _.any(this.colors, c => !c.get("valid"));
-      this.get("saving") ||
-      _.any(this.get("colors"), function(c) {
-        return !c.get("valid");
-      })
-    );
   },
 
   newRecord: Ember.computed.not("id"),
 
-  save: function(opts) {
+  save(opts) {
-    if (this.get("is_base") || this.get("disableSave")) return;
+    if (this.is_base || this.disableSave) return;
 
-    var self = this;
+    this.setProperties({ savingStatus: I18n.t("saving"), saving: true });
-    this.set("savingStatus", I18n.t("saving"));
-    this.set("saving", true);
 
-    var data = {};
+    const data = {};
 
     if (!opts || !opts.enabledOnly) {
       data.name = this.name;
-      data.base_scheme_id = this.get("base_scheme_id");
+      data.base_scheme_id = this.base_scheme_id;
       data.colors = [];
-      this.get("colors").forEach(c => {
+      this.colors.forEach(c => {
-        if (!self.id || c.get("changed")) {
+        if (!this.id || c.get("changed")) {
-          data.colors.pushObject({ name: c.get("name"), hex: c.get("hex") });
+          data.colors.pushObject(c.getProperties("name", "hex"));
         }
       });
     }
@@ -103,33 +87,34 @@ const ColorScheme = Discourse.Model.extend(Ember.Copyable, {
         dataType: "json",
         contentType: "application/json"
       }
-    ).then(function(result) {
+    ).then(result => {
       if (result.id) {
-        self.set("id", result.id);
+        this.set("id", result.id);
       }
+
       if (!opts || !opts.enabledOnly) {
-        self.startTrackingChanges();
+        this.startTrackingChanges();
-        self.get("colors").forEach(c => c.startTrackingChanges());
+        this.colors.forEach(c => c.startTrackingChanges());
       }
-      self.set("savingStatus", I18n.t("saved"));
+
-      self.set("saving", false);
+      this.setProperties({ savingStatus: I18n.t("saved"), saving: false });
-      self.notifyPropertyChange("description");
+      this.notifyPropertyChange("description");
     });
   },
 
-  destroy: function() {
+  destroy() {
     if (this.id) {
-      return ajax("/admin/color_schemes/" + this.id, { type: "DELETE" });
+      return ajax(`/admin/color_schemes/${this.id}`, { type: "DELETE" });
     }
   }
 });
 
-var ColorSchemes = Ember.ArrayProxy.extend({});
+const ColorSchemes = Ember.ArrayProxy.extend({});
 
 ColorScheme.reopenClass({
-  findAll: function() {
+  findAll() {
-    var colorSchemes = ColorSchemes.create({ content: [], loading: true });
+    const colorSchemes = ColorSchemes.create({ content: [], loading: true });
-    return ajax("/admin/color_schemes").then(function(all) {
+    return ajax("/admin/color_schemes").then(all => {
       all.forEach(colorScheme => {
         colorSchemes.pushObject(
           ColorScheme.create({
@@ -139,7 +124,7 @@ ColorScheme.reopenClass({
             theme_id: colorScheme.theme_id,
             theme_name: colorScheme.theme_name,
             base_scheme_id: colorScheme.base_scheme_id,
-            colors: colorScheme.colors.map(function(c) {
+            colors: colorScheme.colors.map(c => {
               return ColorSchemeColor.create({
                 name: c.name,
                 hex: c.hex,