blob: 0c5a67aedbfb6277922a7179833539508e33757c (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
|
# User Preview
#================================
riot = require \riot
riot.mixin \user-preview do
init: ->
@on \mount ~>
scan.call @
@on \updated ~>
scan.call @
function scan
elems = @root.query-selector-all '[data-user-preview]:not([data-user-preview-attached])'
elems.for-each attach.bind @
function attach el
el.set-attribute \data-user-preview-attached true
user = el.get-attribute \data-user-preview
tag = null
show-timer = null
hide-timer = null
el.add-event-listener \mouseover ~>
clear-timeout show-timer
clear-timeout hide-timer
show-timer := set-timeout ~>
show!
, 500ms
el.add-event-listener \mouseleave ~>
clear-timeout show-timer
clear-timeout hide-timer
hide-timer := set-timeout ~>
close!
, 500ms
@on \unmount ~>
clear-timeout show-timer
clear-timeout hide-timer
close!
function show
if tag?
return
preview = document.create-element \mk-user-preview
rect = el.get-bounding-client-rect!
x = rect.left + el.offset-width + window.page-x-offset
y = rect.top + window.page-y-offset
preview.style.top = y + \px
preview.style.left = x + \px
preview.add-event-listener \mouseover ~>
clear-timeout hide-timer
preview.add-event-listener \mouseleave ~>
clear-timeout show-timer
hide-timer := set-timeout ~>
close!
, 500ms
tag := riot.mount (document.body.append-child preview), do
user: user
.0
function close
if tag?
tag.close!
tag := null
|
