Merge pull request #1 from ellaestigoy/first-take
First take of component logic
This commit is contained in:
commit
aae721fc39
|
@ -1,4 +1,22 @@
|
||||||
.custom-need-access-prompt {
|
.custom-need-access-prompt {
|
||||||
background: red;
|
background: var(--tertiary-low);
|
||||||
display: block;
|
display: block;
|
||||||
|
position: fixed;
|
||||||
|
width: 100%;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
padding: 2em;
|
||||||
|
z-index: 999;
|
||||||
|
}
|
||||||
|
|
||||||
|
.topic-in-gated-category {
|
||||||
|
.topic-navigation {
|
||||||
|
visibility: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.post-stream {
|
||||||
|
max-height: 150vh;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
}
|
}
|
|
@ -1,8 +1,10 @@
|
||||||
import Component from "@ember/component";
|
import Component from "@ember/component";
|
||||||
import I18n from "I18n";
|
|
||||||
import discourseComputed from "discourse-common/utils/decorators";
|
import discourseComputed from "discourse-common/utils/decorators";
|
||||||
import { default as getURL } from "discourse-common/lib/get-url";
|
|
||||||
// import cookie from "discourse/lib/cookie";
|
const enabledCategories = settings.enabled_categories
|
||||||
|
.split("|")
|
||||||
|
.map((id) => parseInt(id, 10))
|
||||||
|
.filter((id) => id);
|
||||||
|
|
||||||
export default Component.extend({
|
export default Component.extend({
|
||||||
tagName: "",
|
tagName: "",
|
||||||
|
@ -10,32 +12,39 @@ export default Component.extend({
|
||||||
|
|
||||||
didInsertElement() {
|
didInsertElement() {
|
||||||
this._super(...arguments);
|
this._super(...arguments);
|
||||||
this.appEvents.on("cta:shown", this, this._triggerPrompt);
|
this.recalculate();
|
||||||
|
},
|
||||||
|
|
||||||
|
didUpdateAttrs() {
|
||||||
|
this._super(...arguments);
|
||||||
|
this.recalculate();
|
||||||
},
|
},
|
||||||
|
|
||||||
willDestroyElement() {
|
willDestroyElement() {
|
||||||
this.appEvents.off("cta:shown", this, this._triggerPrompt);
|
document.body.classList.remove("topic-in-gated-category");
|
||||||
},
|
},
|
||||||
|
|
||||||
_triggerPrompt() {
|
recalculate() {
|
||||||
this.set("hidden", false)
|
// do nothing if:
|
||||||
|
// a) topic does not have a category
|
||||||
|
// b) component setting is empty
|
||||||
|
// c) user is logged in
|
||||||
|
if (
|
||||||
|
!this.categoryId ||
|
||||||
|
enabledCategories.length === 0 ||
|
||||||
|
this.currentUser
|
||||||
|
) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (enabledCategories.includes(this.categoryId)) {
|
||||||
|
document.body.classList.add("topic-in-gated-category");
|
||||||
|
this.set("hidden", false);
|
||||||
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
@discourseComputed("hidden")
|
@discourseComputed("hidden")
|
||||||
shouldShow(hidden) {
|
shouldShow(hidden) {
|
||||||
return !hidden;
|
return !hidden;
|
||||||
},
|
},
|
||||||
|
|
||||||
// @action
|
|
||||||
// dismissBanner() {
|
|
||||||
// this.keyValueStore.setItem("anon-cta-never", "t");
|
|
||||||
// this.session.set("showSignupCta", false);
|
|
||||||
// this.set("hidden", true);
|
|
||||||
// },
|
|
||||||
|
|
||||||
// @action
|
|
||||||
// showBannerLater() {
|
|
||||||
// this.keyValueStore.setItem("anon-cta-hidden", Date.now());
|
|
||||||
// this.set("hidden", true)
|
|
||||||
// },
|
|
||||||
});
|
});
|
||||||
|
|
|
@ -1 +1 @@
|
||||||
{{need-access-prompt}}
|
{{need-access-prompt categoryId=model.category_id}}
|
|
@ -1,48 +0,0 @@
|
||||||
import { withPluginApi } from "discourse/lib/plugin-api";
|
|
||||||
import discourseComputed from "discourse-common/utils/decorators";
|
|
||||||
import { inject as service } from "@ember/service";
|
|
||||||
|
|
||||||
const enabledCategories = settings.enabled_categories
|
|
||||||
.split("|")
|
|
||||||
.map((id) => parseInt(id, 10))
|
|
||||||
.filter((id) => id);
|
|
||||||
|
|
||||||
const PLUGIN_ID = "discourse-gated-category";
|
|
||||||
|
|
||||||
export default {
|
|
||||||
name: "require-signup-on-select-category",
|
|
||||||
initialize() {
|
|
||||||
withPluginApi("0.8.14", (api) => this.initWithApi(api));
|
|
||||||
},
|
|
||||||
|
|
||||||
initWithApi(api) {
|
|
||||||
const site = api.container.lookup("site:main");
|
|
||||||
|
|
||||||
api.modifyClass("component:topic-list-item", {
|
|
||||||
pluginID: PLUGIN_ID,
|
|
||||||
excerptsRouter: service("router"),
|
|
||||||
|
|
||||||
@discourseComputed(
|
|
||||||
"excerptsRouter.currentRouteName",
|
|
||||||
"excerptsRouter.currentRoute.attributes.category.id"
|
|
||||||
)
|
|
||||||
requireSignUpCategoryId(currentRouteName, categoryId) {
|
|
||||||
if (!currentRouteName.match(/^discovery\./)) return;
|
|
||||||
return categoryId;
|
|
||||||
},
|
|
||||||
|
|
||||||
@discourseComputed("requireSignUpCategoryId")
|
|
||||||
expandPinned(viewingCategory) {
|
|
||||||
const overrideEverywhere =
|
|
||||||
enabledCategories.length === 0;
|
|
||||||
|
|
||||||
const overrideInCategory = enabledCategories.includes(viewingCategory);
|
|
||||||
|
|
||||||
return overrideEverywhere || overrideInCategory
|
|
||||||
? true
|
|
||||||
: this._super();
|
|
||||||
},
|
|
||||||
});
|
|
||||||
},
|
|
||||||
};
|
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
{{!-- {{#if shouldShow}} --}}
|
{{#if shouldShow}}
|
||||||
<div class="custom-need-access-prompt">
|
<div class="custom-need-access-prompt">
|
||||||
<h1>{{theme-setting "prompt_heading"}}</h1>
|
<h1>{{theme-setting "prompt_heading"}}</h1>
|
||||||
{{d-button action=(route-action "showCreateAccount") class="btn-primary sign-up-button" translatedLabel=(theme-setting "prompt_cta_label")}}
|
{{d-button action=(route-action "showCreateAccount") class="btn-primary sign-up-button" translatedLabel=(theme-setting "prompt_cta_label")}}
|
||||||
</div>
|
</div>
|
||||||
{{!-- {{/if}} --}}
|
{{/if}}
|
||||||
|
|
Loading…
Reference in New Issue