diff --git a/admin/assets/javascripts/discourse/components/house-ads-chooser.js b/admin/assets/javascripts/discourse/components/house-ads-chooser.js index 5984b12..d12b2bb 100644 --- a/admin/assets/javascripts/discourse/components/house-ads-chooser.js +++ b/admin/assets/javascripts/discourse/components/house-ads-chooser.js @@ -1,41 +1,44 @@ -import { computed } from "@ember/object"; +import { action, computed } from "@ember/object"; +import { classNames } from "@ember-decorators/component"; import { makeArray } from "discourse-common/lib/helpers"; import MultiSelectComponent from "select-kit/components/multi-select"; -export default MultiSelectComponent.extend({ - classNames: ["house-ads-chooser"], - filterable: true, - filterPlaceholder: "admin.adplugin.house_ads.filter_placeholder", - tokenSeparator: "|", - allowCreate: false, - allowAny: false, - settingValue: "", - valueAttribute: null, - nameProperty: null, +@classNames("house-ads-chooser") +export default class HouseAdsChooser extends MultiSelectComponent { + filterable = true; + filterPlaceholder = "admin.adplugin.house_ads.filter_placeholder"; + tokenSeparator = "|"; + allowCreate = false; + allowAny = false; + settingValue = ""; + valueAttribute = null; + nameProperty = null; - value: computed("settingValue", function () { + @computed("settingValue") + get value() { return this.settingValue .toString() .split(this.tokenSeparator) .filter(Boolean); - }), + } // TODO: kept for legacy, remove when Discourse is 2.5 mutateValues(values) { this.set("settingValue", values.join(this.tokenSeparator)); - }, + } + computeValues() { return this.settingValue.split(this.tokenSeparator).filter(Boolean); - }, + } - content: computed("choices", function () { + @computed("choices") + get content() { return makeArray(this.choices); - }), + } - actions: { - onChange(value) { - const settingValue = makeArray(value).join(this.tokenSeparator); - this.onChange?.(settingValue); - }, - }, -}); + @action + onChange(value) { + const settingValue = makeArray(value).join(this.tokenSeparator); + this.onChange?.(settingValue); + } +} diff --git a/admin/assets/javascripts/discourse/components/house-ads-list-setting.js b/admin/assets/javascripts/discourse/components/house-ads-list-setting.js index 152851a..38e4389 100644 --- a/admin/assets/javascripts/discourse/components/house-ads-list-setting.js +++ b/admin/assets/javascripts/discourse/components/house-ads-list-setting.js @@ -1,7 +1,8 @@ import { mapBy } from "@ember/object/computed"; +import { classNames } from "@ember-decorators/component"; import HouseAdsSetting from "discourse/plugins/discourse-adplugin/discourse/components/house-ads-setting"; -export default HouseAdsSetting.extend({ - classNames: "house-ads-setting house-ads-list-setting", - adNames: mapBy("allAds", "name"), -}); +@classNames("house-ads-setting house-ads-list-setting") +export default class HouseAdsListSetting extends HouseAdsSetting { + @mapBy("allAds", "name") adNames; +} diff --git a/admin/assets/javascripts/discourse/components/house-ads-setting.js b/admin/assets/javascripts/discourse/components/house-ads-setting.js index 6f55e07..bf5937a 100644 --- a/admin/assets/javascripts/discourse/components/house-ads-setting.js +++ b/admin/assets/javascripts/discourse/components/house-ads-setting.js @@ -1,58 +1,58 @@ import Component from "@ember/component"; +import { action } from "@ember/object"; +import { classNames } from "@ember-decorators/component"; import { ajax } from "discourse/lib/ajax"; import { popupAjaxError } from "discourse/lib/ajax-error"; import { i18n, propertyNotEqual } from "discourse/lib/computed"; import I18n from "I18n"; -export default Component.extend({ - classNames: "house-ads-setting", - adValue: "", - saving: false, - savingStatus: "", - title: i18n("name", "admin.adplugin.house_ads.%@.title"), - help: i18n("name", "admin.adplugin.house_ads.%@.description"), - changed: propertyNotEqual("adValue", "value"), +@classNames("house-ads-setting") +export default class HouseAdsSetting extends Component { + adValue = ""; + saving = false; + savingStatus = ""; + + @i18n("name", "admin.adplugin.house_ads.%@.title") title; + @i18n("name", "admin.adplugin.house_ads.%@.description") help; + @propertyNotEqual("adValue", "value") changed; init() { - this._super(...arguments); + super.init(...arguments); this.set("adValue", this.get("value")); - }, + } - actions: { - save() { - if (!this.get("saving")) { - this.setProperties({ - saving: true, - savingStatus: I18n.t("saving"), - }); + @action + save() { + if (!this.get("saving")) { + this.setProperties({ + saving: true, + savingStatus: I18n.t("saving"), + }); - ajax( - `/admin/plugins/pluginad/house_settings/${this.get("name")}.json`, - { - type: "PUT", - data: { value: this.get("adValue") }, - } - ) - .then(() => { - const adSettings = this.get("adSettings"); - adSettings.set(this.get("name"), this.get("adValue")); - this.setProperties({ - value: this.get("adValue"), - savingStatus: I18n.t("saved"), - }); - }) - .catch(popupAjaxError) - .finally(() => { - this.setProperties({ - saving: false, - savingStatus: "", - }); + ajax(`/admin/plugins/pluginad/house_settings/${this.get("name")}.json`, { + type: "PUT", + data: { value: this.get("adValue") }, + }) + .then(() => { + const adSettings = this.get("adSettings"); + adSettings.set(this.get("name"), this.get("adValue")); + this.setProperties({ + value: this.get("adValue"), + savingStatus: I18n.t("saved"), }); - } - }, + }) + .catch(popupAjaxError) + .finally(() => { + this.setProperties({ + saving: false, + savingStatus: "", + }); + }); + } + } - cancel() { - this.set("adValue", this.get("value")); - }, - }, -}); + @action + cancel() { + this.set("adValue", this.get("value")); + } +} diff --git a/admin/assets/javascripts/discourse/controllers/admin-plugins-house-ads-index.js b/admin/assets/javascripts/discourse/controllers/admin-plugins-house-ads-index.js index 93b1920..063ffa1 100644 --- a/admin/assets/javascripts/discourse/controllers/admin-plugins-house-ads-index.js +++ b/admin/assets/javascripts/discourse/controllers/admin-plugins-house-ads-index.js @@ -1,8 +1,8 @@ import Controller, { inject as controller } from "@ember/controller"; import { alias } from "@ember/object/computed"; -export default Controller.extend({ - adminPluginsHouseAds: controller("adminPlugins.houseAds"), - houseAds: alias("adminPluginsHouseAds.model"), - adSettings: alias("adminPluginsHouseAds.houseAdsSettings"), -}); +export default class AdminPluginsHouseAdsIndexController extends Controller { + @controller("adminPlugins.houseAds") adminPluginsHouseAds; + @alias("adminPluginsHouseAds.model") houseAds; + @alias("adminPluginsHouseAds.houseAdsSettings") adSettings; +} diff --git a/admin/assets/javascripts/discourse/controllers/admin-plugins-house-ads.js b/admin/assets/javascripts/discourse/controllers/admin-plugins-house-ads.js index 382125e..bf16782 100644 --- a/admin/assets/javascripts/discourse/controllers/admin-plugins-house-ads.js +++ b/admin/assets/javascripts/discourse/controllers/admin-plugins-house-ads.js @@ -1,5 +1,5 @@ import Controller from "@ember/controller"; -export default Controller.extend({ - loadingAds: true, -}); +export default class AdminPluginsHouseAdsController extends Controller { + loadingAds = true; +} diff --git a/admin/assets/javascripts/discourse/routes/admin-plugins-house-ads-index.js b/admin/assets/javascripts/discourse/routes/admin-plugins-house-ads-index.js index 674064e..8a9bdd3 100644 --- a/admin/assets/javascripts/discourse/routes/admin-plugins-house-ads-index.js +++ b/admin/assets/javascripts/discourse/routes/admin-plugins-house-ads-index.js @@ -2,11 +2,11 @@ import { action } from "@ember/object"; import { service } from "@ember/service"; import DiscourseRoute from "discourse/routes/discourse"; -export default DiscourseRoute.extend({ - router: service(), +export default class AdminPluginsHouseAdsIndex extends DiscourseRoute { + @service router; @action moreSettings() { this.router.transitionTo("adminSiteSettingsCategory", "ad_plugin"); - }, -}); + } +} diff --git a/admin/assets/javascripts/discourse/routes/admin-plugins-house-ads-show.js b/admin/assets/javascripts/discourse/routes/admin-plugins-house-ads-show.js index 29e4dd4..60858ae 100644 --- a/admin/assets/javascripts/discourse/routes/admin-plugins-house-ads-show.js +++ b/admin/assets/javascripts/discourse/routes/admin-plugins-house-ads-show.js @@ -2,7 +2,7 @@ import { TrackedObject } from "@ember-compat/tracked-built-ins"; import DiscourseRoute from "discourse/routes/discourse"; import I18n from "I18n"; -export default DiscourseRoute.extend({ +export default class AdminPluginsHouseAdsShow extends DiscourseRoute { model(params) { if (params.ad_id === "new") { return new TrackedObject({ @@ -19,5 +19,5 @@ export default DiscourseRoute.extend({ ) ); } - }, -}); + } +} diff --git a/admin/assets/javascripts/discourse/routes/admin-plugins-house-ads.js b/admin/assets/javascripts/discourse/routes/admin-plugins-house-ads.js index 4f2a38e..0f176bf 100644 --- a/admin/assets/javascripts/discourse/routes/admin-plugins-house-ads.js +++ b/admin/assets/javascripts/discourse/routes/admin-plugins-house-ads.js @@ -2,15 +2,15 @@ import EmberObject from "@ember/object"; import { ajax } from "discourse/lib/ajax"; import DiscourseRoute from "discourse/routes/discourse"; -export default DiscourseRoute.extend({ - settings: null, +export default class AdminPluginsHouseAds extends DiscourseRoute { + settings = null; model() { return ajax("/admin/plugins/pluginad/house_creatives.json").then((data) => { this.set("settings", EmberObject.create(data.settings)); return data.house_ads.map((ad) => EmberObject.create(ad)); }); - }, + } setupController(controller, model) { controller.setProperties({ @@ -18,5 +18,5 @@ export default DiscourseRoute.extend({ houseAdsSettings: this.get("settings"), loadingAds: false, }); - }, -}); + } +} diff --git a/assets/javascripts/discourse/components/ad-component.js b/assets/javascripts/discourse/components/ad-component.js index eae09bc..8df4688 100644 --- a/assets/javascripts/discourse/components/ad-component.js +++ b/assets/javascripts/discourse/components/ad-component.js @@ -7,28 +7,30 @@ import { isNthTopicListItem, } from "discourse/plugins/discourse-adplugin/discourse/helpers/slot-position"; -export default Component.extend({ - router: service(), +export default class AdComponent extends Component { + @service router; - currentCategoryId: or( + @or( "router.currentRoute.attributes.category.id", "router.currentRoute.parent.attributes.category_id" - ), + ) + currentCategoryId; - currentCategorySlug: or( + @or( "router.currentRoute.attributes.category.slug", "router.currentRoute.parent.attributes.category.slug" - ), + ) + currentCategorySlug; // Server needs to compute this in case hidden tags are being used. - topicTagsDisableAds: alias( - "router.currentRoute.parent.attributes.tags_disable_ads" - ), + @alias("router.currentRoute.parent.attributes.tags_disable_ads") + topicTagsDisableAds; - isRestrictedCategory: or( + @or( "router.currentRoute.attributes.category.read_restricted", "router.currentRoute.parent.attributes.category.read_restricted" - ), + ) + isRestrictedCategory; @discourseComputed( "router.currentRoute.attributes.__type", @@ -38,12 +40,12 @@ export default Component.extend({ if (type === "tag" && tag) { return tag; } - }, + } @discourseComputed("router.currentRoute.parent.attributes.archetype") isPersonalMessage(topicType) { return topicType === "private_message"; - }, + } @discourseComputed showToGroups() { @@ -52,7 +54,7 @@ export default Component.extend({ } return this.currentUser.show_to_groups; - }, + } @discourseComputed( "currentCategoryId", @@ -82,13 +84,13 @@ export default Component.extend({ (!isRestrictedCategory || !this.siteSettings.no_ads_for_restricted_categories) ); - }, + } isNthPost(n) { return isNthPost(n, this.get("postNumber")); - }, + } isNthTopicListItem(n) { return isNthTopicListItem(n, this.get("indexNumber")); - }, -}); + } +} diff --git a/assets/javascripts/discourse/components/ad-slot.js b/assets/javascripts/discourse/components/ad-slot.js index 639f6fd..0555386 100644 --- a/assets/javascripts/discourse/components/ad-slot.js +++ b/assets/javascripts/discourse/components/ad-slot.js @@ -1,6 +1,7 @@ import EmberObject from "@ember/object"; import { service } from "@ember/service"; import { isBlank } from "@ember/utils"; +import { tagName } from "@ember-decorators/component"; import discourseComputed from "discourse-common/utils/decorators"; import AdComponent from "discourse/plugins/discourse-adplugin/discourse/components/ad-component"; import { @@ -173,9 +174,9 @@ export function slotContenders( return types; } -export default AdComponent.extend({ - router: service(), - tagName: "", +@tagName("") +export default class AdSlot extends AdComponent { + @service router; /** * For a given ad placement and optionally a post number if in between posts, @@ -190,7 +191,7 @@ export default AdComponent.extend({ indexNumber, postNumber ); - }, + } /** * Returns a list of the names of ad components that should be rendered @@ -238,5 +239,5 @@ export default AdComponent.extend({ } return networkNames; - }, -}); + } +} diff --git a/assets/javascripts/discourse/components/adbutler-ad.js b/assets/javascripts/discourse/components/adbutler-ad.js index 6f8a6e2..06c0b33 100644 --- a/assets/javascripts/discourse/components/adbutler-ad.js +++ b/assets/javascripts/discourse/components/adbutler-ad.js @@ -27,9 +27,9 @@ function loadAdbutler(adserverHostname) { return _promise; } -export default AdComponent.extend({ - divs: null, - publisherId: null, +export default class AdbutlerAd extends AdComponent { + divs = null; + publisherId = null; init() { let dimensions = [728, 90]; @@ -70,8 +70,8 @@ export default AdComponent.extend({ dimensions, }); - this._super(); - }, + super.init(); + } _triggerAds() { if (isTesting()) { @@ -104,12 +104,12 @@ export default AdComponent.extend({ } }.bind(this) ); - }, + } didInsertElement() { - this._super(); + super.didInsertElement(); scheduleOnce("afterRender", this, this._triggerAds); - }, + } @discourseComputed showAdbutlerAds() { @@ -118,7 +118,7 @@ export default AdComponent.extend({ } return this.currentUser.show_adbutler_ads; - }, + } @discourseComputed( "publisherId", @@ -141,7 +141,7 @@ export default AdComponent.extend({ showAfterPost && showOnCurrentPage ); - }, + } @discourseComputed("postNumber") showAfterPost(postNumber) { @@ -149,5 +149,5 @@ export default AdComponent.extend({ return true; } return this.isNthPost(parseInt(this.siteSettings.adbutler_nth_post, 10)); - }, -}); + } +} diff --git a/assets/javascripts/discourse/components/amazon-product-links.js b/assets/javascripts/discourse/components/amazon-product-links.js index 7133b98..5aa8476 100644 --- a/assets/javascripts/discourse/components/amazon-product-links.js +++ b/assets/javascripts/discourse/components/amazon-product-links.js @@ -1,17 +1,13 @@ import { and } from "@ember/object/computed"; import { htmlSafe } from "@ember/template"; +import { classNames } from "@ember-decorators/component"; import discourseComputed from "discourse-common/utils/decorators"; import AdComponent from "discourse/plugins/discourse-adplugin/discourse/components/ad-component"; -export default AdComponent.extend({ - classNames: ["amazon-product-links"], - - showAd: and( - "showAmazonAds", - "showToGroups", - "showAfterPost", - "showOnCurrentPage" - ), +@classNames("amazon-product-links") +export default class AmazonProductLinks extends AdComponent { + @and("showAmazonAds", "showToGroups", "showAfterPost", "showOnCurrentPage") + showAd; init() { const data = { @@ -145,33 +141,33 @@ export default AdComponent.extend({ this.set("user_input_mobile", data[placement]["user_input_mobile"]); this.set("mobile_amazon_height", data[placement]["mobile_amazon_height"]); this.set("mobile_amazon_width", data[placement]["mobile_amazon_width"]); - this._super(); - }, + super.init(); + } @discourseComputed("amazon_width", "amazon_height") adWrapperStyle(w, h) { return htmlSafe(`width: ${w}px; height: ${h}px;`); - }, + } @discourseComputed("mobile_amazon_width", "mobile_amazon_height") adWrapperStyleMobile(w, h) { return htmlSafe(`width: ${w}px; height: ${h}px;`); - }, + } @discourseComputed("mobile_amazon_width") adTitleStyleMobile(w) { return htmlSafe(`width: ${w}px;`); - }, + } @discourseComputed("user_input") userInput(userInput) { return htmlSafe(`${userInput}`); - }, + } @discourseComputed("user_input_mobile") userInputMobile(userInput) { return htmlSafe(`${userInput}`); - }, + } @discourseComputed showAmazonAds() { @@ -180,7 +176,7 @@ export default AdComponent.extend({ } return this.currentUser.show_amazon_ads; - }, + } @discourseComputed("postNumber") showAfterPost(postNumber) { @@ -189,5 +185,5 @@ export default AdComponent.extend({ } return this.isNthPost(parseInt(this.siteSettings.amazon_nth_post_code, 10)); - }, -}); + } +} diff --git a/assets/javascripts/discourse/components/carbonads-ad.js b/assets/javascripts/discourse/components/carbonads-ad.js index d323661..b60a189 100644 --- a/assets/javascripts/discourse/components/carbonads-ad.js +++ b/assets/javascripts/discourse/components/carbonads-ad.js @@ -2,22 +2,22 @@ import { htmlSafe } from "@ember/template"; import discourseComputed from "discourse-common/utils/decorators"; import AdComponent from "discourse/plugins/discourse-adplugin/discourse/components/ad-component"; -export default AdComponent.extend({ - serve_id: null, - placement: null, +export default class CarbonadsAd extends AdComponent { + serve_id = null; + placement = null; init() { this.set("serve_id", this.siteSettings.carbonads_serve_id); this.set("placement", this.siteSettings.carbonads_placement); - this._super(); - }, + super.init(); + } @discourseComputed("serve_id", "placement") url(serveId, placement) { return htmlSafe( `//cdn.carbonads.com/carbon.js?serve=${serveId}&placement=${placement}` ); - }, + } @discourseComputed showCarbonAds() { @@ -26,7 +26,7 @@ export default AdComponent.extend({ } return this.currentUser.show_carbon_ads; - }, + } @discourseComputed( "placement", @@ -39,5 +39,5 @@ export default AdComponent.extend({ return ( placement && serveId && showCarbonAds && showToGroups && showOnCurrentPage ); - }, -}); + } +} diff --git a/assets/javascripts/discourse/components/google-adsense.js b/assets/javascripts/discourse/components/google-adsense.js index 4850b34..be1ea73 100644 --- a/assets/javascripts/discourse/components/google-adsense.js +++ b/assets/javascripts/discourse/components/google-adsense.js @@ -1,5 +1,6 @@ import { scheduleOnce } from "@ember/runloop"; import { htmlSafe } from "@ember/template"; +import { classNameBindings } from "@ember-decorators/component"; import RSVP from "rsvp"; import loadScript from "discourse/lib/load-script"; import { isTesting } from "discourse-common/config/environment"; @@ -97,19 +98,17 @@ const MOBILE_SETTINGS = { }, }; -export default AdComponent.extend({ - classNameBindings: [ - ":google-adsense", - "classForSlot", - "isResponsive:adsense-responsive", - ], - loadedGoogletag: false, - - publisher_id: null, - ad_width: null, - ad_height: null, - - adRequested: false, +@classNameBindings( + ":google-adsense", + "classForSlot", + "isResponsive:adsense-responsive" +) +export default class GoogleAdsense extends AdComponent { + loadedGoogletag = false; + publisher_id = null; + ad_width = null; + ad_height = null; + adRequested = false; init() { let config, size; @@ -138,8 +137,8 @@ export default AdComponent.extend({ this.set("ad_height", parseAdHeight(size)); this.set("ad_code", this.siteSettings[config.code]); this.set("publisher_id", this.siteSettings.adsense_publisher_code); - this._super(); - }, + super.init(); + } async _triggerAds() { if (isTesting()) { @@ -162,49 +161,49 @@ export default AdComponent.extend({ // eslint-disable-next-line no-console console.error("Adsense error:", ex); } - }, + } didInsertElement() { - this._super(); + super.didInsertElement(); if (!this.get("showAd")) { return; } scheduleOnce("afterRender", this, this._triggerAds); - }, + } @discourseComputed("ad_width") isResponsive(adWidth) { return ["auto", "fluid"].includes(adWidth); - }, + } @discourseComputed("ad_width") isFluid(adWidth) { return adWidth === "fluid"; - }, + } @discourseComputed("placement", "showAd") classForSlot(placement, showAd) { return showAd ? htmlSafe(`adsense-${placement}`) : ""; - }, + } @discourseComputed("isResponsive", "isFluid") autoAdFormat(isResponsive, isFluid) { return isResponsive ? htmlSafe(isFluid ? "fluid" : "auto") : false; - }, + } @discourseComputed("ad_width", "ad_height", "isResponsive") adWrapperStyle(w, h, isResponsive) { return htmlSafe(isResponsive ? "" : `width: ${w}; height: ${h};`); - }, + } @discourseComputed("adWrapperStyle", "isResponsive") adInsStyle(adWrapperStyle, isResponsive) { return htmlSafe( `display: ${isResponsive ? "block" : "inline-block"}; ${adWrapperStyle}` ); - }, + } @discourseComputed showAdsenseAds() { @@ -213,7 +212,7 @@ export default AdComponent.extend({ } return this.currentUser.show_adsense_ads; - }, + } @discourseComputed( "publisher_id", @@ -236,7 +235,7 @@ export default AdComponent.extend({ showAfterPost && showOnCurrentPage ); - }, + } @discourseComputed("postNumber") showAfterPost(postNumber) { @@ -247,5 +246,5 @@ export default AdComponent.extend({ return this.isNthPost( parseInt(this.siteSettings.adsense_nth_post_code, 10) ); - }, -}); + } +} diff --git a/assets/javascripts/discourse/components/google-dfp-ad.js b/assets/javascripts/discourse/components/google-dfp-ad.js index 9021419..264ca3d 100755 --- a/assets/javascripts/discourse/components/google-dfp-ad.js +++ b/assets/javascripts/discourse/components/google-dfp-ad.js @@ -1,5 +1,6 @@ import { alias } from "@ember/object/computed"; import { htmlSafe } from "@ember/template"; +import { classNameBindings, classNames } from "@ember-decorators/component"; import RSVP from "rsvp"; import loadScript from "discourse/lib/load-script"; import { isTesting } from "discourse-common/config/environment"; @@ -241,13 +242,15 @@ function loadGoogle() { return _promise; } -export default AdComponent.extend({ - classNameBindings: ["adUnitClass"], - classNames: ["google-dfp-ad"], - loadedGoogletag: false, - lastAdRefresh: null, - width: alias("size.width"), - height: alias("size.height"), +@classNameBindings("adUnitClass") +@classNames("google-dfp-ad") +export default class GoogleDfpAd extends AdComponent { + loadedGoogletag = false; + lastAdRefresh = null; + + @alias("size.width") width; + + @alias("size.height") height; @discourseComputed size() { @@ -256,7 +259,7 @@ export default AdComponent.extend({ this.siteSettings, this.site.mobileView ); - }, + } @discourseComputed( "siteSettings.dfp_publisher_id", @@ -269,7 +272,7 @@ export default AdComponent.extend({ } else { return globalId; } - }, + } @discourseComputed("placement", "postNumber") divId(placement, postNumber) { @@ -279,26 +282,26 @@ export default AdComponent.extend({ } else { return `div-gpt-ad-${slotNum}-${placement}`; } - }, + } @discourseComputed("placement", "showAd") adUnitClass(placement, showAd) { return showAd ? `dfp-ad-${placement}` : ""; - }, + } @discourseComputed("width", "height") adWrapperStyle(w, h) { if (w !== "fluid") { return htmlSafe(`width: ${w}px; height: ${h}px;`); } - }, + } @discourseComputed("width") adTitleStyleMobile(w) { if (w !== "fluid") { return htmlSafe(`width: ${w}px;`); } - }, + } @discourseComputed( "publisherId", @@ -324,7 +327,7 @@ export default AdComponent.extend({ showOnCurrentPage && size ); - }, + } @discourseComputed showDfpAds() { @@ -333,7 +336,7 @@ export default AdComponent.extend({ } return this.currentUser.show_dfp_ads; - }, + } @discourseComputed("postNumber") showAfterPost(postNumber) { @@ -342,7 +345,7 @@ export default AdComponent.extend({ } return this.isNthPost(parseInt(this.siteSettings.dfp_nth_post_code, 10)); - }, + } // 3 second delay between calls to refresh ads in a component. // Ember often calls updated() more than once, and *sometimes* @@ -353,7 +356,7 @@ export default AdComponent.extend({ return true; } return new Date() - lastAdRefresh > 3000; - }, + } @on("didUpdate") updated() { @@ -376,7 +379,7 @@ export default AdComponent.extend({ window.googletag.pubads().refresh([ad]); }); } - }, + } @on("didInsertElement") _initGoogleDFP() { @@ -410,18 +413,18 @@ export default AdComponent.extend({ } }); }); - }, + } willRender() { - this._super(...arguments); + super.willRender(...arguments); if (!this.get("showAd")) { return; } - }, + } @on("willDestroyElement") cleanup() { destroySlot(this.get("divId")); - }, -}); + } +} diff --git a/assets/javascripts/discourse/components/house-ad.js b/assets/javascripts/discourse/components/house-ad.js index 0a63bc5..2745aa5 100644 --- a/assets/javascripts/discourse/components/house-ad.js +++ b/assets/javascripts/discourse/components/house-ad.js @@ -1,4 +1,9 @@ import { isBlank } from "@ember/utils"; +import { + attributeBindings, + classNameBindings, + classNames, +} from "@ember-decorators/component"; import discourseComputed from "discourse-common/utils/decorators"; import AdComponent from "discourse/plugins/discourse-adplugin/discourse/components/ad-component"; @@ -10,21 +15,21 @@ const adIndex = { topic_list_between: null, }; -export default AdComponent.extend({ - classNames: ["house-creative"], - classNameBindings: ["adUnitClass"], - attributeBindings: ["colspanAttribute:colspan"], - adHtml: "", +@classNames("house-creative") +@classNameBindings("adUnitClass") +@attributeBindings("colspanAttribute:colspan") +export default class HouseAd extends AdComponent { + adHtml = ""; @discourseComputed colspanAttribute() { return this.tagName === "td" ? "5" : null; - }, + } @discourseComputed("placement", "showAd") adUnitClass(placement, showAd) { return showAd ? `house-${placement}` : ""; - }, + } @discourseComputed( "showToGroups", @@ -43,7 +48,7 @@ export default AdComponent.extend({ (showAfterPost || showAfterTopicListItem) && showOnCurrentPage ); - }, + } @discourseComputed("postNumber", "placement") showAfterPost(postNumber, placement) { @@ -54,7 +59,7 @@ export default AdComponent.extend({ return this.isNthPost( parseInt(this.site.get("house_creatives.settings.after_nth_post"), 10) ); - }, + } @discourseComputed("placement") showAfterTopicListItem(placement) { @@ -65,7 +70,7 @@ export default AdComponent.extend({ return this.isNthTopicListItem( parseInt(this.site.get("house_creatives.settings.after_nth_topic"), 10) ); - }, + } chooseAdHtml() { const houseAds = this.site.get("house_creatives"), @@ -89,7 +94,7 @@ export default AdComponent.extend({ adIndex[placement] = (adIndex[placement] + 1) % filteredAds.length; return ad.html; } - }, + } adsNamesForSlot(placement) { const houseAds = this.site.get("house_creatives"); @@ -105,14 +110,14 @@ export default AdComponent.extend({ } else { return []; } - }, + } refreshAd() { this.set("adHtml", this.chooseAdHtml()); - }, + } didInsertElement() { - this._super(...arguments); + super.didInsertElement(...arguments); if (!this.get("showAd")) { return; @@ -140,5 +145,5 @@ export default AdComponent.extend({ } this.refreshAd(); - }, -}); + } +}