4chan-x/foltor/foltor.coffee
2010-04-26 23:42:50 -07:00

129 lines
2.9 KiB
CoffeeScript

tag: (el) ->
document.createElement(el)
text: (s) ->
document.createTextNode(s)
position: (el) ->
id: el.id
if left: GM_getValue("${id}Left", '0px')
el.style.left: left
else
el.style.right: '0px'
if top: GM_getValue("${id}Top", '0px')
el.style.top: top
else
el.style.bottom: '0px'
move: {}
mousedown: (e) ->
div: this.parentNode
move.div: div
move.divX: div.offsetLeft
move.divY: div.offsetTop
move.clientX: e.clientX
move.clientY: e.clientY
move.bodyX: document.body.clientWidth
move.bodyY: document.body.clientHeight
window.addEventListener('mousemove', mousemove, true)
window.addEventListener('mouseup', mouseup, true)
mousemove: (e) ->
div: move.div
realX: move.divX + (e.clientX - move.clientX)# x + dx
left: if realX < 20 then 0 else realX
if move.bodyX - div.offsetWidth - realX < 20
div.style.left: ''
div.style.right: '0px'
else
div.style.left: left + 'px'
div.style.right: ''
realY: move.divY + (e.clientY - move.clientY)# y + dy
top: if realY < 20 then 0 else realY
if move.bodyY - div.offsetHeight - realY < 20
div.style.top: ''
div.style.bottom: '0px'
else
div.style.top: top + 'px'
div.style.bottom: ''
mouseup: ->
id: move.div.id
GM_setValue("${id}Left", move.div.style.left)
GM_setValue("${id}Top", move.div.style.top)
window.removeEventListener('mousemove', mousemove, true)
window.removeEventListener('mouseup', mouseup, true)
GM_addStyle('
#filter {
position: fixed;
text-align: right;
}
#filter:hover {
border: 1px solid;
}
#filter:not(:hover) {
background: rgba(0,0,0,0)
}
#filter:not(:hover) > div {
display: none;
}
#filter:not(:hover) > div.top {
display: block;
padding: 0;
}
#filter > div {
padding: 0 5px 0 5px;
}
#filter > .top {
padding: 5px 5px 0 5px;
}
#filter > .bottom {
padding: 0 5px 5px 5px;
}
.move {
cursor: move;
}
.pointer {
cursor: pointer;
}
')
filter: tag('div')
filter.id: 'filter'
filter.className: 'reply'
position(filter)
bar: tag('div')
bar.textContent: '4chon foltor'
bar.className: 'move top'
bar.addEventListener('mousedown', mousedown, true)
filter.appendChild(bar)
fields: [
'Name',
'Tripcode',
'Email',
'Subject',
'Comment',
'File',
]
for field in fields
div: tag('div')
label: tag('label')
label.appendChild(text(field))
label.appendChild(tag('input'))
div.appendChild(label)
filter.appendChild(div)
apply: tag('a')
apply.textContent: 'apply'
apply.className: 'pointer'
reset: tag('a')
reset.textContent: 'reset'
reset.className: 'pointer'
div: tag('div')
div.className: 'bottom'
div.appendChild(apply)
div.appendChild(text(' '))
div.appendChild(reset)
filter.appendChild(div)
document.body.appendChild(filter)