Javascript Hooks

Using the javascript launcher

Hooking into muut.js events via javascript requires that you use the javascript launcher instead of the quick embed method.

here is some iformation on the javascript launcher and whatnot so people know what's up. (I think I can handle this one)

Hooking into events

Hooking into events uses the muut javascript object to pull information. So, some things I don't understand happen and this is the result. I will need tero or jay's help to figure this one out.

muut(function(app) {
   app.on('post', function(post) {
    console.info('meta', post.meta)
   })
 })

A good example of this in action is below

<!-- without this CSS you'll just get a page full of text -->
<link rel="stylesheet" href="https://cdn.muut.com/1/moot.css">
<!-- here is the client :D the type of tag used isn't that important
only that it's class is the same as the one in the script
You can use an ID as well, just be sure to use # in the launcher instead of . -->
    <div class="client"></div>
<!-- the page requires jquery since we're using the javascript launcher -->
<script src="https://code.jquery.com/jquery.min.js"></script>
<!-- The muut.min.js should always come after jquery and the launcher class (.client in this case) -->
  <script src="https://cdn.muut.com/1/moot.min.js"></script>
<script>
// This bit is the part that actually processes the metadata
 muut(function(app) {
   app.on('post', function(post) {
    console.info('meta', post.meta)
   })
 })
// javascript launcher. This is how Muut shows up on the page and it must come last relative to the stuff above
 $('.client').muut({ url: 'https://muut.com/[community-name]'
 })
</script>

Events list

app events
'before:post', post
'post', post
'before:load', page
'load', page
'categories'
'reload'
'destroy'
'error'
'ready'

page events — first argument for app.load() listener
'before:more' — when more threads are about to be loaded
'more', page

'collapse' — when the whole page is collapsed
'moot' — when a new thread is rendered
'reload' — when the whole page is reloaded

real time events trough app.channel
'moot', moot. For example: — app.channel.on('moot', function(thread) { ... })
'beforethread', moot
'reply', post
'type', user, path
'like',
'unlike',
'error', key, data
'enter'
'leave'

thread events
'before:reply', post
'reply', For example: thread.on('reply', function(post) { ... })
'load', data
'reload'
'expand'
'collapse'

post events
'meta', meta
'more', more
'like'
'unlike'
'remove'
'edit'

user events trough app.user
'logout',
'update', properties
'newcount', amount