angus
September 24, 2020, 11:13pm
2
The way that I’ve dealt with this in the past is by packaging the buttons in a html helper, which will render the raw html in the raw templates, which you can then insert via a raw plugin outlet. Here’s an example:
import { registerUnbound } from 'discourse-common/lib/helpers';
import { renderUnboundPreview, buttonHTML } from '../lib/utilities';
registerUnbound('preview-unbound', function(thumbnails, params) {
return new Handlebars.SafeString(renderUnboundPreview(thumbnails, params));
});
registerUnbound('list-button', function(button, params) {
return new Handlebars.SafeString(buttonHTML(button, params));
});
The button click is handled in the topic-list-item component, e.g.
$el.closest ('.topic-details').addClass ('visited');
}
},
_setupExcerptClick () {
this.$ ('.topic-excerpt').on ('click.topic-excerpt', () => {
DiscourseURL.routeTo (this.get ('topic.lastReadUrl'));
});
},
_sizeThumbnails () {
this.$ ('.topic-thumbnail img').on ('load', function () {
$ (this).css ({
width: $ (this)[0].naturalWidth,
});
});
},
_setupActions () {
let postId = this.get ('topic.topic_post_id'),
$bookmark = this.$ ('.topic-bookmark'),
@merefield May also have some thoughts
Also, you’ll probably want to use the theme javascripts folder structure instead of adding scripts to the header.html. See
4 Likes
