Yes, I had this problem once too. I’ve added a backup edit category button that will appear if these conditions are met.
https://github.com/angusmcleod/discourse-layouts/commit/c350bd7f569abf968b331f48cf121cb85a2c93c9
1 Like
Hi Angus,
we’ve had a widget showing the top solutions in the right sidebar together installed with the layouts plugin, here:
https://github.com/Alavi1412/developing-answers
It was working fine, until we currently installed nginx outside docker. after that this widget is not being shown in the sidebar anymore!
do you have any clue why that may have happened?
does it have anything to do with https protocol? (our only guess at the moment!)
What errors are you seeing in your console and logs?
no errors in the admin log panel. no errors in browser console either!
Can it be because of the way I used href in my code?
For example I have this code in plugin
contents.push(h("h2.novatitle",[h("a",{attributes:{href:"https://padpors.com/t/نوآوری-جمعی-در-پادپُرس-چه-جوری-کار-میکنه؟/3601#No" ,target: "_blank"}},"راه‌حل"),"های نوآوران"]));
$.ajax({
url: "https://padpors.com/t/3854.json",
dataType: 'json',
async: false,
success: function(data){
view2 = data.views;
}});
Can the nginx block a plugin?
What else can cause this problem?
NOTE: We are using HTTPS
NOTE: widgets are working correctly on local
You have three issues.
One is that the widget file needs to be the same name as the widget itself. I have submitted PRs to your two widget repos to fix this.
https://github.com/Alavi1412/developing-answers/pull/1
https://github.com/Alavi1412/developing-answers/pull/1
The second issue is a CORS issue with some of the assets you’re using. I can’t fix that. You’ll need to update the CORS permissions or change where the assets are hosted.
The third issue is a bug in the developing-solution widget when viewing a discovery category route. I have submitted a PR for a temporary fix for the issue. It won’t make the content you want to appear appear, but it will stop the exception from occurring and the widget containers themselves will appear in discovery category routes.
https://github.com/Alavi1412/developing-answers/pull/2
Generally you need to look more closely at better use of Promises to handle all the ajax requests you’re making. You need to wait until the ajax request resolves before you can use the requested data, i.e. after the request add .then(function(data){}).
Handling ajax requests is a little tricker in a vDom widget, without Ember’s computed properties and observers. In fact there probably shouldn’t be any ajax requests in a vDom widget. Nonetheless, have a look at how I’ve done it in this widget.
5 Likes
Thank you. But I have a problem with promises.
ajax(`/t/3854.json`).then(function (res) {
view2 = res.views;
return ajax(`/t/3766.json`);
})
.then(function (res){
view4 = res.views;
return ajax(`/t/2568.json`);
})
.then(function (res){
view1 = res.views;
contents.push(h("div.solution",[
h("a.image-sulotion", {attributes: {href: "https://padpors.com/t/%D8%A7%DB%8C%D8%B3%D8%AA%DA%AF%D8%A7%D9%87-%D9%87%D8%A7%DB%8C-%D8%AA%D9%88%D9%84%DB%8C%D8%AF-%D8%A8%DB%8C%D9%88%DA%AF%D8%A7%D8%B2-%D8%A7%D8%B2-%D8%AF%D9%88%D8%B1%D8%B1%DB%8C%D8%B2%D9%87%D8%A7%DB%8C-%D8%BA%D8%B0%D8%A7/2568"}}, h("img", {attributes:{src: "https://padpors.com/uploads/default/original/2X/b/b5242cbc6ca0a76e477a51fc187e47df1b37c85b.jpg"}})),
h("a.topiclink",{attributes: {href: "https://padpors.com/t/%D8%A7%DB%8C%D8%B3%D8%AA%DA%AF%D8%A7%D9%87-%D9%87%D8%A7%DB%8C-%D8%AA%D9%88%D9%84%DB%8C%D8%AF-%D8%A8%DB%8C%D9%88%DA%AF%D8%A7%D8%B2-%D8%A7%D8%B2-%D8%AF%D9%88%D8%B1%D8%B1%DB%8C%D8%B2%D9%87%D8%A7%DB%8C-%D8%BA%D8%B0%D8%A7/2568"}}, "رآکتور بیوگاز"),
h("a.novacate", {attributes:{ href: "https://padpors.com/c/nova-foodwaste"}}, "هدر رفت غذا") ,
h("span", "بازدید:" + view1),
h("div.level", Discourse.SiteSettings.developing_1)]));
contents.push(h("div.solution",[
h("a.image-sulotion", {attributes: {href: "https://padpors.com/t/پیاده-برو،-پاداش-بگیر/3854/16"}}, h("img", {attributes:{src: "https://padpors.com/uploads/default/original/2X/f/ff2f9cb328fc5708c1c2a51b9a3bfce1b6f5765c.jpg"}})),
h("a.topiclink",{attributes: {href: "https://padpors.com/t/پیاده-برو،-پاداش-بگیر/3854/16"}}, "پیاده برو، پاداش بگیر!"),
h("a.novacate", {attributes:{ href: "https://padpors.com/c/nova-pollution"}}, "آلودگی هوا") ,
h("span", "بازدید:" + view2),
h("div.level", Discourse.SiteSettings.developing_2)]));
contents.push(h("div.solution",[
h("a.image-sulotion", {attributes: {href: "https://padpors.com/t/چه-جوری-درختکاری-چریکی-رو-به-نفع-هوای-آلوده-رواج-بدیم؟/3766"}}, h("img", {attributes:{src: "https://padpors.com/uploads/default/original/2X/b/bcde56c436a83f58e6741a792bbc51da33f41673.jpg"}})),
h("a.topiclink",{attributes: {href: "https://padpors.com/t/چه-جوری-درختکاری-چریکی-رو-به-نفع-هوای-آلوده-رواج-بدیم؟/3766"}}, "درخت کاری چریکی"),
h("a.novacate", {attributes:{ href: "https://padpors.com/c/nova-pollution"}}, "آلودگی هوا") ,
h("span", "بازدید:" + view4),
h("div.level", Discourse.SiteSettings.developing_4)]));
return h('div.widget-inner', contents);
});
I have this code but it didn’t render anything in my page.
I also deleted the last main return h('div.widget-inner', contents) but nothing happened. just an empty widget.
You need to understand the concept before you can implement what you’re attempting.
First, try to get a single promise returning a single result from the server. Stick a console.log(res) in the .then(function{}) to see what is being returned.
Once you get that working, then try to display that single piece of data. Have a look at the widget I linked you to to see how to re-render the widget to display the data.
When you have successfully got a single promise to return data and you have displayed that single piece of data in the widget show me your code and we can work with that.
2 Likes
A slight issue regarding the plugin:
using the layouts plugin and without any widgets installed I got the blank page in category+tag page:
https://meta.discourse.org/t/empty-page-when-both-category-and-tag-are-filtered/60585
Sounds like an issue. Will take a look tomorrow.
Give it another try now. The sidebars will show up on all the tags routes now. The settings won’t all work perfectly as the tags routs in Discourse core are different from the other routes. I’ll fix the settings for tags a bit later today.
https://github.com/angusmcleod/discourse-layouts/commit/f399361492b340d0aeb5a81511fa8392cbff0e95
2 Likes
@angus
Can I add an attribute to my js widget code for using this .
In html we can simply do:
<script>
</script data-cfasync='true'>
but I don’t what should I do here.
I don’t think that is relevant to this plugin. If you’re adding scripts to your page head you should do it via Customize / Themes .
I didn’t mean that.
I want to add an attribute to my whole widget but I don’t know how
Invariably, the answer is to have a look at how other widgets work. For example.
Spend more time learning how widgets work. It’ll make what you’re trying to do a lot easier.
3 Likes
@angus
I have written this widget. This widget will show a list of your bookmarked topics beside you. But I have problem for remove bookmark button. When I press the remove button, It will remove the last Item in my bookmark list.
The problem is logical because when I press the button, the variable data has the value of the last index of the list.
How can I solve this probelm?
How can I set a special variable for each button?
What is the button meant to do? and what context is the widget meant to appear in? The Discovery list or Topics?
1 Like
Hi. Im just trying this out on my site. I enabled both sidebars on all the pages. On the main page (Latest) it looks fine. On categories is fine. But when I click on Top the topics ( <table id="ember2013" class="topic-list ember-view"> ) It runs over into the right sidebar.
Also I tried the widget that @jez made for the custom content however nothing shows up in the right sidebar. Is there a list of widgets people are working on for this? Im looking for a categories widget on the side.
FYI- @jez i forked your widget and made the corrections to get it working. The original name and everything is the same in the code itself. Only changed the name so I didnt get it confused. https://github.com/xavierxxx/custom-html-widget.git
1 Like
