all files / directives/ visible.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
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
75
 
 
 
1×
1×
 
2×
2×
2×
2×
2×
2×
2×
2×
1×
 
2×
 
2×
 
 
1×
1×
 
16×
16×
16×
16×
 
 
 
 
16×
16×
16×
16×
16×
11×
4×
4×
3×
3×
3×
 
 
 
11×
 
 
1×
 
 
 
 
5×
5×
5×
 
 
16×
13×
9×
 
 
 
16×
 
 
 
 
 
 
 
 
 
import { avalon } from '../seed/core'
import '../effect/index'
 
var none = 'none'
function parseDisplay(elem, val) {
    //用于取得此类标签的默认display值
    var doc = elem.ownerDocument
    var nodeName = elem.nodeName
    var key = '_' + nodeName
    Eif (!parseDisplay[key]) {
        var temp = doc.body.appendChild(doc.createElement(nodeName))
        val = avalon.css(temp, 'display')
        doc.body.removeChild(temp)
        if (val === none) {
            val = 'block'
        }
        parseDisplay[key] = val
    }
    return parseDisplay[key]
}
 
avalon.parseDisplay = parseDisplay
avalon.directive('visible', {
    diff: function (newVal, oldVal) {
        var n = !!newVal
        Eif (oldVal === void 0 || n !== oldVal) {
            this.value = n
            return true
        }
    },
    ready: true,
    update: function (vdom, show) {     
        var dom = vdom.dom
        Eif (dom && dom.nodeType === 1) {
            var display = dom.style.display
            var value
            if (show) {
                if (display === none) {
                    value = vdom.displayValue
                    if (!value) {
                        dom.style.display = ''
                        Eif (dom.style.cssText === '') {
                            dom.removeAttribute('style')
                        }
                    }
                }
                if (dom.style.display === '' && avalon(dom).css('display') === none &&
                    // fix firefox BUG,必须挂到页面上
                    avalon.contains(dom.ownerDocument, dom)) {
                    value = parseDisplay(dom)
                }
 
            } else {
 
                Eif (display !== none) {
                    value = none
                    vdom.displayValue = display
                }
            }
            var cb = function () {
                if (value !== void 0) {
                    dom.style.display = value
                }
            }
     
            avalon.applyEffect(dom, vdom, {
                hook: show ? 'onEnterDone' : 'onLeaveDone',
                cb: cb
            })
        }
 
    }
})