Topic Color

[esiao]

NodeBB Topic Color

A NodeBB Plugin to add some colors to the topics titles.

Installation

As simple as that :

npm install nodebb-plugin-topic-color

Usage

1. After installation go to the ACP and enable the plugin.
2. Choose the groups that will be able to colorify their topics. Or create the Bucket group and put some users in it.
3. The magic happens with this simple instructions :

If you want some red you have the choice to use :

• Hexadecimal colors code like #ff0000 or even #f00
• RGB values rgb(255,0,0)
• And finaly css color codes red

To use it it's pretty simple :

%(color)[Text]

Screenshots

Create your groups. Add the bucket one if you want to manage exactly who is able to colorify their topics or if the users are in a group system :

Choose the groups you want to be able to use the colorify topics title feature :

This :

Will become this (note that Test tried to fool the plugin but unlucky for him there's groups permissions) :

And if there's no group selected don't worry the titles will be as clean as before (this could be a way to disable the feature but you must keep the plugin activated) :

[esiao]

New version.
Fixed the ugly url and the title of the page.

I need some help to improve the plugin, bring it further.

I have searched how to execute my function when the topic title is changed (In the topic)
Tested both action:topic.edit & action:post.edit no results.

As for the group system I guess it's possible. My logic is the following :

• Get the username it's possible with the data-original-title on the user pic.
• Then use User.getUidByUsername and Groups.isMember
• If is in group classic function, if not a cleaner to avoid colored titles for non permitted groups.

My problem is that I don't know how to call these two functions, I have added the modules in my library.js but I don't figured out how to actually use them.

I don't want to release it on NPM without this feature cause it could be Armagedon really quickly when you give such power to the user.
I would also know if the current syntax #hexcodeTitle is clear enough, on my rainbow one the title looks like this :
#ff000fR#ff0064a#ff00e5i#b100ffn#1b00ffb#009dffo#00d6ffw #00ff8cM#06ff00o#dbff00d#ff8c00e
Which is hard to get...

Anyway looking forward for your help, thanks in advace.
esiao.

[baris]

https://github.com/NodeBB/NodeBB/commit/c29dcc0ec9efaae65e4669dd08e639c4a05352f7 should fix the action:topic.edit the hook will be called after the topic data is updated so you can retrieve the new title with topics.getTopicField(tid, 'title')

[esiao]

Thanks for your kind help @baris
I've managed to create the hook and get the topic title and then change it but I've failed my goal I'll show you cause it's funny (I guess)

So yeah basically what I need to do is not to change the title data but trigger my function in main.js

https://github.com/esiao/nodebb-plugin-topic-color/blob/master/public/js/main.js#L29-L36

Is there a way to do so ?

Also I think that I'll be able to test User and Groups now that I've understood how the methods seems to work.

[baris]

You can try listening for the socket event that gets fired when a post is edited.

socket.on('event:post_edited', function(data) {
    console.log(data);
});

Check out https://github.com/NodeBB/NodeBB/blob/master/public/src/forum/topic/events.js#L88 it updates the title.

[esiao]

@baris You rocks
Okay so now I have a properly working plugin for all the basics which is colorify the titles. I need to clean my code a bit, update the regex (a big one but the content is a lot more easy to read).
Basically this is the teasing for v1.0.0 of the plugin expect it to come this week-end.
If I have the time I'll start to check the permissions part.

Anyway see you later hope you'll love it

[esiao]

And so version 0.0.1 of the plugin is officially out.
Updated the first post in consequence.

I finally decided to use the same markup as @toolito in nodebb-plugin-color
For a ease of reading and also to make it standard.
By the way, I've read that there's some issues with this plugin, I've figured out that the regex used is not optimized and I allow @toolito to freely abuse of mine (which solves the problem and test the content).

Thanks for your help, I will work on the permissions part in the future

[esiao]

Published v0.0.2 :

• The topic title in the header bar updates without the color codes.

I've also added a dev branch on my git repo to work on the permission feature.
I have two issues and need some help :

• The action:ajaxify.end seems to not fire my method. So I'm using action:topic.edit to run my tests

• My logic is the following :

• Get topic ID (Topics)

• Get Username from the topic data (uid is undefined for some reasons) (Users)

• Test if username is in Group (Groups)

If I test only one group it works, I haven't managed to get the multiple groups working. It returns [false,false] but both are true.
https://github.com/esiao/nodebb-plugin-topic-color/blob/dev/library.js#L21-L23
I think it's because my arguments are false but I don't know why, this array seems totally nice to me.

• Is there a way to use my allowed variable after in my main script ? My idea is to do the colorify if it's true and if it's false only do the prettify one in order to have some permissions.

• The final objective would be to have a Checkbox list with all groups in admin to allow a list of groups to colorify their titles and if some smart guys want to try out without being permitted just don't colorify the title but remove the code to keep it readable.

Thanks in advance for the future help.

[esiao]

Published v0.0.3DEV (only on github) :

• Some cleaning
• Group testing logic is working
• ACP integration

I need your help on several things :

• Show existing groups in the plugin controls. I've tried to follow what's done for groups.tpl in the source but it's not working (and I'm not surprised about it).
  https://github.com/esiao/nodebb-plugin-topic-color/blob/dev/public/templates/admin/plugins/topic-color.tpl#L14-L16
  I think I could use the Groups.list function but I haven't managed to require Groups in that file, so if there's a way out.

• Send my Data from ACP, I've not understood yet how the Settings and Meta are working but my JSON is ready to use.

• Use the testGroup method anywhere I need to, but I've managed to only get the tid with action:topic.edit

• Send my variable colorify to my main.js. I have tested the export and require thing (http://stackoverflow.com/questions/3922994/share-variables-between-files-in-node-js) but I don't get it to work.
  I think it's an issue with my path but I don't see why I'm wrong.
  https://github.com/esiao/nodebb-plugin-topic-color/blob/dev/public/js/main.js#L4

My final goal is to say if colorify is true do my colorifyTopics function. If not do a new one which will prettify the title for non permitted groups of users. Basically it would be https://github.com/esiao/nodebb-plugin-topic-color/blob/dev/public/js/main.js#L44-L50 for any item.

I really hope you can help me for this new version.

[esiao]

And so after a lot of time and tries I have finally done what I was expecting.

Upgrade to the latest version 1.0.1 (major update) which fixes some bugs and adds the groups permissions and settings from ACP.
I have updated the first post there's a lot of information and a fancy presentation check it out

For the tech part,
After trying every single hook and not retrieving the data I needed, I was going to abandon the plugin to the 0.0.2 version. But I've read somewhere on the forum (don't recall where) that there were actually an API for NodeBB by adding /api/ after the location origin. And I have to say amazing job on this guys it rocks. I was able to do what I had in mind after a lot of testing but this seems very promising for the future and I'm sure that I'll use it for my forum and maybe future plugins.
Anyway thanks a lot for the support and enjoy my plugin

[esiao]

New update 1.0.2 fixing a front-end bug that was preventing the plugin to work on Vanilla theme.
Sorry for that feel free to use it on Vanilla based theme and Lavender now

[esiao]

Well I have a problem. It seems that when a user without admin privileges is logged the plugin don't work as expected.
The reason is simple, I have to call /api/admin/plugins/topic-color to retrieve the configuration which is stored here. I do it from front so if the user is not admin there's a 403 and only the admin users have their topics name correctly displayed.
So is there a way to counter this ? I have thought of doing this in the plugin back but I haven't managed to send the config variable to my main.js after.

[esiao]

This is now fixed.
Please update to the 1.1.0 version :

• Fixed non admin users not able to see colorified topics of non admin users.
• Notifications are cleaned from the ugly code

I've just added a new renderer on the front pointing to /api/plugins/topic-color.

Edit :
Version 1.1.1 is out:

• Topics in user profile are now colorified.

Version 1.1.2 too :

• Topics in widget last topics are colorified.

[esiao]

Version 1.1.3 :

• Added preview on Home (Lavender theme and derivations)
• Added Notifications

Both in clean mode because there's no API information on home.

[a_5mith]

@esiao You sure?

https://community.nodebb.org/api/home/

Or did you mean something else.

[esiao]

@a_5mith Oh thanks didn't figured out it was /api/home. I was doing /api/ and getting a 404.
I will color the subject on home I'll edit this message if there's no reply when it's done

And now it's done :
Version 1.1.4 :

• Preview on home are colored

[julian]

Hahhha... uh-oh.

@esiao, an hour and a half ago, I removed the /api/home route, and now it's /api

I hope I didn't inadvertently break your plugin!

[esiao]

@julian Ahah okay I'll pull the changes and fix that, no problem just a new patch to come
edit : Version 1.1.5 out fixing that

[a_5mith]

@julian tut...

[esiao]

I've a question. There seems to be a change to the hook action:app.load becoming static:app.load. I've not updated the plugin tho because I have a bug when I change this in plugin.json.
Whenever I try to acces a page on the forum I have a :
Cannot GET /[route]

Going back to action app.load resolve this. Any clues of what is happening ? Or do I need to wait for next version to update my plugin ?
One more thing I've seen that I've forgotten the search results so there will be an update to expect and if I could include this aswell it could be nice.