import ModalFunctionality from "discourse/mixins/modal-functionality"; import { ajax } from "discourse/lib/ajax"; import { default as computed, observes } from "ember-addons/ember-computed-decorators"; import { popupAjaxError } from "discourse/lib/ajax-error"; const THEME_FIELD_VARIABLE_TYPE_IDS = [2, 3, 4]; const SCSS_VARIABLE_NAMES = [ // common/foundation/colors.scss "primary", "secondary", "tertiary", "quaternary", "header_background", "header_primary", "highlight", "danger", "success", "love", // common/foundation/math.scss "E", "PI", "LN2", "SQRT2", // common/foundation/variables.scss "small-width", "medium-width", "large-width", "google", "instagram", "facebook", "cas", "twitter", "yahoo", "github", "base-font-size", "base-line-height", "base-font-family", "primary-low", "primary-medium", "secondary-low", "secondary-medium", "tertiary-low", "quaternary-low", "highlight-low", "highlight-medium", "danger-low", "danger-medium", "success-low", "love-low" ]; export default Ember.Controller.extend(ModalFunctionality, { adminCustomizeThemesShow: Ember.inject.controller(), uploadUrl: "/admin/themes/upload_asset", onShow() { this.set("name", null); this.set("fileSelected", false); }, enabled: Em.computed.and("nameValid", "fileSelected"), disabled: Em.computed.not("enabled"), @computed("name", "adminCustomizeThemesShow.model.theme_fields") errorMessage(name, themeFields) { if (name) { if (!name.match(/^[a-z_][a-z0-9_-]*$/i)) { return I18n.t( "admin.customize.theme.variable_name_error.invalid_syntax" ); } else if (SCSS_VARIABLE_NAMES.includes(name.toLowerCase())) { return I18n.t("admin.customize.theme.variable_name_error.no_overwrite"); } else if ( themeFields.some( tf => THEME_FIELD_VARIABLE_TYPE_IDS.includes(tf.type_id) && name === tf.name ) ) { return I18n.t( "admin.customize.theme.variable_name_error.must_be_unique" ); } } return null; }, @computed("errorMessage") nameValid(errorMessage) { return null === errorMessage; }, @observes("name") uploadChanged() { const file = $("#file-input")[0]; this.set("fileSelected", file && file.files[0]); }, actions: { updateName() { let name = this.get("name"); if (Em.isEmpty(name)) { name = $("#file-input")[0].files[0].name; this.set("name", name.split(".")[0]); } this.uploadChanged(); }, upload() { const file = $("#file-input")[0].files[0]; const options = { type: "POST", processData: false, contentType: false, data: new FormData() }; options.data.append("file", file); ajax(this.get("uploadUrl"), options) .then(result => { const upload = { upload_id: result.upload_id, name: this.get("name"), original_filename: file.name }; this.get("adminCustomizeThemesShow").send("addUpload", upload); this.send("closeModal"); }) .catch(e => { popupAjaxError(e); }); } } });