Working on a new theme but I need your Help Please

kacemlight

Hello,

I start working on a theme that should display each topic content below topic title and details in "Recet Topics" and "Category" pages. The theme make posts displayed like on facebook and twitter walls.

My problem is that I cannot intill now understand how node.js server side passes datas variables to template and how it works on nodebb. Is some one here can give me some tutorials or something that can help me..

For example I added this to category.tpl to display topic content post but nothing is displayed, it seems that the variable {topics.posts.content} is null :

<div class="content">
{topics.posts.content}
</div>

but if I write :

<div class="content">
{topics.title}
</div>

I can see the title.

How to passe topic post content to the category view in NodeBB ?

Thanks

pichalite

@kacemlight post content is not available on the category page api

You can see what's available in the category page api for one of the categories in this community using this link

https://community.nodebb.org/api/category/2/general-discussion

kacemlight

Yes I know. Is there a way to add post content to the category page API ?
Thanks,

pichalite

@kacemlight You will have to modify core for that

yariplus

@kacemlight

You can modify the api data using the hook in the page's controller method.

In your case, filter:category.build
https://github.com/NodeBB/NodeBB/blob/97ce08f5af2b0a324b10682246fc19aaa85d98da/src/controllers/categories.js#L273

But it's not a simple task afaik. You'll need to pull the post data from the database yourself, filter it based on the users' privileges, and arrange it in the way you want. Basically everything that happens in the topic controller, but substituting the users' settings for your own.

kacemlight

@yariplus Thanks for your help. I think it will not be easy to do it.

kacemlight

I don't know yet how it really works, how server passe API data via template to client-side. Has someone here a tutorial or something that can help me ?

Thanks,

yariplus

You should look at how plugins do it, because you have to do the same.

In your plugin.json, you need to add a library file and a hooks array. Create the library file and in it define the hook function. The hooks that you want likely end in .build, but not all pages have a build hook. The function gets passed an object with a templateData member object. You modify templateData and pass back the original object. Whatever you add to templateData is exposed in the template. e.g...

// plugin.json

{
	"id": "nodebb-theme-persona",
	"scripts": [
		"lib/persona.js",
		"lib/modules/nprogress.js",
		"lib/modules/autohidingnavbar.min.js",
		"lib/modules/slideout.min.js"
	],
	"library": "library.js",
	"hooks": [
		{ "hook": "filter:category.build", "method": "filter_category_build" }
	]
}

// library.js
module.exports = {
filter_category_build: function (data, callback) {
	console.dir(data.templateData); // See what's inside.
	data.templateData.banana = "Best Fruit"; // Add some data.
	callback(null, data); // Send it back.
}
};

// category.tpl

{banana} // Prints "Best Fruit"

If you want to pass an array (such as for attaching posts data), you also have to make sure you use , e.g.

data.templateData.fruits = [
	{ color: "red", fruit: "apple"},
	{ color: "yellow", fruit: "banana"}
]

<!-- BEGIN fruits -->
<p> {fruits.color} {fruits.fruit} </p>
<!-- END fruits -->

// Prints:
// red apple
// yellow banana

kacemlight

@yariplus said:

plugins

Thank youuuu I finally start understanding how it works. I'm not good at Node.js and js Frameworks. But I'm an expert JEE and web architecture. I wish that I could catch up..