How to properly add HTML elements
-
I am writing a plugin which will modify the post create/display pages, it will enable the post to contain some more attributes, e.g., topic and city.
The goal is to add selectors and input boxes in the create page and also to render the display page differently.
I have read some code/docs and played with the hooks, but I'm not clear of how to modify the create page in the "right" way.
Beside this, I also have another question. I know that I could put the extra stuff in the post content, wrapped with tags, but what if I want to search or sort the new elements?
Please point me a direction or throw some useful links. Thanks!
-
Welcome to NodeBB madwyn!
First, remember there is no proper or correct way to do things. There may be a way the developers intend you to do things, but always use the method that makes the most sense to you.
It sounds like you want to add a field to the composer, the area where posts and topics are edited/created. This is not something I have seen plugins do before, and I don't see any hooks that would be useful for that specifically yet. In this case, you may want to examine the composer code and see where a new hook would be useful.
I tried to accomplish what you want myself, but there doesn't appear to be any non-hackish way to do it at present. A few things are missing.
- There's no way to filter what gets sent in the 'post' socket event. (No way for the server to get the extra data in any non-trivial way.)
- There's no way read the extra data should you manage to send it. (There are filters for posts, but they don't send the original data object, only the parts it wants.)
Appending the DOM with the extra input fields it rather easy once the data is in the server. You can edit the templates to use the new data, or listen for socket events and add it with jQuery.
I think you should look into where you can add the needed events in core and composer. It seems to me that you would need to rewrite a lot of code to work around the limitations I mentioned.
I'm not exactly sure what your second question is. The post content is all text, so you may be looking for string operations like match(), replace(), etc.. which use regex to select and modify the content.
-
Welcome, @madwyn!
@yariplus said:
First, remember there is no proper or correct way to do things. There may be a way the developers intend you to do things, but always use the method that makes the most sense to you.
Not to be pedantic, but I have to disagree here; there is a right and wrong way to do things, and your developer life will be much easier by learning to do it the right way.
I don't know what level of development experience you have @madwyn, but some of these approaches have served me well:
- You can find a lot of good examples in the (working) plugins for this forum.
- The Core developers here ( @julian, @psychobunny , and @baris) are more than happy to answer any platform-specific questions you have
- We here would be happy to code review anything for you if you're unsure
- StackOverflow is your friend.
I would advise against hacking something together that will work in the meantime. The NodeBB platform, while more stable now, is still in flux, so anything can change at any moment (especially in regards to the composer... the composer itself is a plugin). So unless you like having your stuff break constantly, work with the core team to see if you can get the hooks you need to be able to build something robust. NodeBB really, really doesn't need more broken and / or abandoned plugins
With that said, it sounds like you can accomplish what you want probably with a custom composer (or fork), and a parsing function.
I'm not sure what you envision by sorting by the new elements, but as for searching on them, that's another topic entirely... but not impossible (again, probably a custom / forked search plugin)
-
@yariplus and @BDHarrington7 , thanks for your reply.
I want to build something like "kindwave", but not as heavy. The plan it to build something based on NodeBB, rather than modify it. It's also because NodeBB is not mature, the internal structure evolves rapidly.
The final goal it to make one or more sections to have different create/display pages, at the meantime keeping the NodeBB forum functional as it is.
As for the second question. The threads in customised sections have new attributes, so these threads can be sorted/searched using these attributes. But if these attributes are embedded with tags in content, then I would assume searching and sorting won't be very efficient.
@BDHarrington7, I have done several small projects using Node.js, but I am still learning.
@yariplus, I have similar findings. There doesn't seem to have APIs for extend create/display pages, but I've seen plugins insert HTML elements into DOM. To me, this is kind of a hack. Maybe this is the only way (for now).
-
@yariplus, thank you very much! I found that composer is really the way to go.
I'm currently reading the code of default composer, it looks like a really good starting point.
There are two options: one is to modify the default composer; another is to implement something like "nodebb-plugin-poll" which basically injects HTML to composer.
I will need to read more code to get a better idea.
