lainchan/js/inline.js

155 lines
3.5 KiB
JavaScript
Raw Normal View History

$(document).ready(function() {
2014-10-05 18:51:22 -04:00
var App = {
cache: {},
get: function(url, cb) {
var $page = App.cache[url]
if ($page)
return cb($page)
$.get(url, function(data) {
var $page = $(data)
App.cache[url] = $page
cb($page)
})
2014-10-05 19:20:25 -04:00
},
options: {
add: function(key, description, tab) {
tab || (tab = 'general')
var checked = App.options.get(key)
var $el = $(
'<div>' +
'<label>' +
'<input type="checkbox">' +
description +
'</label>' +
'</div>')
$el
.find('input')
.prop('checked', checked)
.on('change', App.options.check(key))
window.Options.extend_tab(tab, $el)
},
get: function(key) {
if (localStorage[key])
return JSON.parse(localStorage[key])
},
check: function(key) {
return function(e) {
var val = this.checked
localStorage[key] = JSON.stringify(val)
}
}
2014-10-05 18:51:22 -04:00
}
}
2014-09-24 15:49:18 -04:00
2014-09-24 00:25:34 -04:00
var inline = function(e) {
e.preventDefault()
2014-09-25 13:11:33 -04:00
var $root = $(this).closest('.post')
2014-10-03 16:32:41 -04:00
var targetNum = this.textContent.slice(2)
2014-09-24 00:25:34 -04:00
2014-10-03 16:40:05 -04:00
var srcOP = $root.closest('[id^=thread]').attr('id').match(/\d+/)[0]
2014-09-24 00:25:34 -04:00
2014-10-03 16:40:05 -04:00
var node, targetOP
2014-10-05 20:26:50 -04:00
var isBacklink = !!this.className
if (isBacklink) {
2014-10-03 16:40:05 -04:00
node = $root.find('> .intro')
targetOP = srcOP
} else {
node = $(this)
var to_search = inMod ? this.search : this.pathname;
targetOP = to_search.match(/(\d+).html/)[1]
2014-10-03 16:40:05 -04:00
}
2014-09-25 13:11:33 -04:00
2014-09-24 00:25:34 -04:00
var link = {
2014-10-05 20:26:50 -04:00
id: 'inline_' + targetNum,
isBacklink: isBacklink,
node: node
2014-09-24 00:25:34 -04:00
}
2014-09-24 15:17:30 -04:00
2014-10-03 16:40:05 -04:00
var selector = targetNum === targetOP
? '#op_' + srcOP
2014-10-03 16:40:05 -04:00
: '#reply_' + targetNum
2014-10-05 20:26:50 -04:00
var $clone = $root.find('#inline_' + targetNum)
if ($clone.length) {
$clone.remove()
$(selector)
.show()
.next()
.show()
return
}
2014-10-03 16:32:41 -04:00
if (srcOP === targetOP) {
2014-10-04 11:16:01 -04:00
if (targetNum === targetOP)
link.node = link.node.next()// bypass `(OP)`
2014-10-03 16:28:52 -04:00
2014-09-24 15:17:30 -04:00
var $target = $(selector)
2014-10-03 16:28:52 -04:00
if ($target.length)
return add(link, $target)
2014-09-24 15:49:18 -04:00
}
2014-10-05 19:52:00 -04:00
var $loading = $('<div class="inline post">loading...</div>')
.attr('id', link.id)
.insertAfter(link.node)
2014-10-05 18:51:22 -04:00
App.get(this.pathname, function($page) {
2014-10-05 19:52:00 -04:00
$loading.remove()
2014-10-05 18:51:22 -04:00
var $target = $page.find(selector)
2014-09-24 15:49:18 -04:00
add(link, $target)
})
2014-09-24 00:25:34 -04:00
}
var add = function(link, $target) {
var $clone = $target.clone(true)
2014-10-05 20:26:50 -04:00
if (link.isBacklink && App.options.get('hidePost'))
$target
.hide()
.next()
.hide()
$clone.find('.inline').remove()
2014-09-24 00:25:34 -04:00
$clone.attr({
2014-10-03 12:53:11 -04:00
"class": 'inline post',
2014-10-05 19:52:00 -04:00
id: link.id,
2014-10-03 16:28:52 -04:00
style: null// XXX remove post hover styling
2014-09-24 00:25:34 -04:00
})
2014-10-03 16:05:45 -04:00
$clone.insertAfter(link.node)
2014-09-24 00:25:34 -04:00
}
2014-09-23 22:52:06 -04:00
2015-03-20 04:09:21 -04:00
App.options.add('useInlining', _('Enable inlining'))
App.options.add('hidePost', _('Hide inlined backlinked posts'))
2014-10-05 19:20:25 -04:00
2014-09-23 22:52:06 -04:00
$('head').append(
'<style>' +
2014-10-04 09:48:29 -04:00
'.inline {' +
'border: 1px dashed black;' +
'white-space: normal;' +
'overflow: auto;' + // clearfix
'}' +
2014-09-23 22:52:06 -04:00
'</style>')
// don't attach to outbound links
2014-10-06 22:03:50 -04:00
if (App.options.get('useInlining')) {
var assign_inline = function() {
$('.body a[href*="'+location.pathname+'"]').not('[rel]').not('.toolong > a').add('.mentioned a')
2014-10-09 20:48:23 -04:00
.attr('onclick', null)// XXX disable highlightReply
2014-10-10 14:13:26 -04:00
.off('click')
2014-10-09 20:48:23 -04:00
.click(inline)
}
assign_inline();
$(document).on('new_post', function(e, post) {
assign_inline();
});
}
});