-
Notifications
You must be signed in to change notification settings - Fork 0
/
slider.js
42 lines (37 loc) · 979 Bytes
/
slider.js
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
const html = require('bel')
const lory = require('lory.js').lory
const icon = require('./icon')
module.exports = (props) => {
const elem = html`
<div onload=${handleLoad} class="slider js_slider">
<div class="frame js_frame">
<ul class="slides js_slides">
${props.slides.map(s => html`<li class="js_slide">${s}</li>`)}
</ul>
</div>
<span class="js_prev prev" onclick=${handlePrev}>
${icon('keyboard_arrow_left')}
</span>
<span class="js_prev next" onclick=${handleNext}>
${icon('keyboard_arrow_right')}
</span>
</div>
`
// tell nanomormph not to diff element
elem.isSameNode = (target) => {
return target && target.nodeName && target.nodeName === 'DIV'
}
var slider
function handleLoad (element) {
slider = lory(element, {
infinite: 1
})
}
function handleNext () {
slider.next()
}
function handlePrev () {
slider.prev()
}
return elem
}