dist/vue-inview.js
function (el, $bd) {

  // generate class indetities
  // add prefix , number can't been the first character in classname
  var classId = "inview-" + shortid.generate()
  var elSize = classList(el).get().length

  // register class element
  classList(el).add(classId)
  createEl.register.push({classid: classId,rawName: $bd.rawName})

  // if directive value not registed
  if (!hasKey(createEl.values, classId) && isDefine($bd.value)) createEl.values[classId] = $bd.value

  // register handler
  var regHdlr = !isDefine($bd.arg) ? 'on' : isDefine($arg($bd.arg)) && $arg($bd.arg) === 'once' ? 'once' : isDefine($arg($bd.arg)) ?
                'on' : 'undefined'

  // create Object for handling element enter and exit
  var funcEvent = Object.create(null)

  // default event handler
  defaultAction($bd, function () {
    if (isDefine(createEl.values[classId]) && isFunc(createEl.values[classId])) createEl.values[classId](funcEvent)
  })
  var _$arg = isDefine($arg($bd.arg)) && $arg($bd.arg) !== 'on' || $arg($bd.arg) === 'once' ? $arg($bd.arg) : 'undefined'
  _$eventview(regHdlr,classId,{
    enter: function(el) {
      var elvalue
      // check the value of the directive has been registered
      if(hasKey(createEl.values,classId)) elvalue = createEl.values[classId]

      // for magic properties
      countEntered += 1
      _element_enter(el, classId)
      // end magic properties

      if (_$arg !== 'undefined' && objLength($bd.modifiers) === 0 && isDefine(elvalue)){
          _$arg === 'class' && object_class(elvalue, el)
          _$arg === 'style' && object_style(elvalue, el)
          _$arg === 'animate' && object_animation(elvalue, el)
          _$arg === 'parent' && object_parent(elvalue, el)
          if (_$arg === 'enter') isFunc(elvalue) ? elvalue(el) : console.warn('[in-view:${$bd.expression}] invalid method')
      }


      if (_$arg === 'on' || _$arg === 'once' && objLength($bd.modifiers) > 0 && isDefine(elvalue)){
        // register modifiers
        var $mdf = object_modifiers($bd.modifiers)
        // modifiers enter
        if ($mdf === 'enter') isFunc(elvalue) ? elvalue(el) : console.warn('[in-view:${$bd.expression}] invalid method')
        // modifiers class
        $mdf === 'class' && object_class(elvalue, el)
        // modifiers style
        $mdf === 'style' && object_style(elvalue, el)
        // modifiers animate
        $mdf === 'animate' && object_animation(elvalue, el)
        // set parent arguments
        $mdf === 'parent' && object_parent(elvalue, el)
      }

      isDefine(funcEvent.enter) && funcEvent.enter(el)
    },
    exit: function (el) {
      var elvalue

      // check the value of the directive has been registered
      if (hasKey(createEl.values,classId)) elvalue = createEl.values[classId]
      // for magic properties
      countExits += 1
      element_exit(el,classId)
      // end magic properties

      if (_$arg !== 'undefined' && isDefine(elvalue)) {
        if (_$arg === 'leave' && objLength($bd.modifiers)===0) isFunc(elvalue) ? elvalue(el) : console.warn('[in-view:${$bd.expression}] invalid method')
        if (objLength($bd.modifiers) > 0 && object_modifiers($bd.modifiers) === 'leave') {
          _$arg === 'class' && object_class(elvalue,el)
          _$arg === 'style' && object_style(elvalue,el)
          _$arg === 'animate' && object_animation(elvalue,el)
          _$arg === 'parent' && object_parent(elvalue, el)
        }
        if (_$arg === 'parent' && objLength($bd.modifiers) === 0) {
          object_parent(elvalue, el)
        }
      }

      // check if has modifiers
      if (_$arg === 'on' || _$arg === 'once' && objLength($bd.modifiers)>0 && isDefine(elvalue)) {
        // register modifiers
        var $mdf = object_modifiers($bd.modifiers)
        // modifiers leave
        if ($mdf === 'leave') isFunc(elvalue) ? elvalue(el) : console.warn('[in-view:${$bd.expression}] invalid method')
        // leave : class modifiers
        $mdf === 'class.leave' && object_class(elvalue,el)
        // leave : style modifiers
        $mdf === 'style.leave' && object_style(elvalue,el)
        // leave : animate modifiers
        $mdf === 'animate.leave' && object_animation(elvalue,el)
        // set parent arguments
        $mdf === 'parent' && object_parent(elvalue, el)
      }
      isDefine(funcEvent.exit) && funcEvent.exit(el)
    }
  })
}
function (el, $bd) {

  // generate class indetities
  // add prefix , number can't been the first character in classname
  var classId = "inview-" + shortid.generate()
  var elSize = classList(el).get().length

  // register class element
  classList(el).add(classId)
  createEl.register.push({classid: classId,rawName: $bd.rawName})

  // if directive value not registed
  if (!hasKey(createEl.values, classId) && isDefine($bd.value)) createEl.values[classId] = $bd.value

  // register handler
  var regHdlr = !isDefine($bd.arg) ? 'on' : isDefine($arg($bd.arg)) && $arg($bd.arg) === 'once' ? 'once' : isDefine($arg($bd.arg)) ?
                'on' : 'undefined'

  // create Object for handling element enter and exit
  var funcEvent = Object.create(null)

  // default event handler
  defaultAction($bd, function () {
    if (isDefine(createEl.values[classId]) && isFunc(createEl.values[classId])) createEl.values[classId](funcEvent)
  })
  var _$arg = isDefine($arg($bd.arg)) && $arg($bd.arg) !== 'on' || $arg($bd.arg) === 'once' ? $arg($bd.arg) : 'undefined'
  _$eventview(regHdlr,classId,{
    enter: function(el) {
      var elvalue
      // check the value of the directive has been registered
      if(hasKey(createEl.values,classId)) elvalue = createEl.values[classId]

      // for magic properties
      countEntered += 1
      _element_enter(el, classId)
      // end magic properties

      if (_$arg !== 'undefined' && objLength($bd.modifiers) === 0 && isDefine(elvalue)){
          _$arg === 'class' && object_class(elvalue, el)
          _$arg === 'style' && object_style(elvalue, el)
          _$arg === 'animate' && object_animation(elvalue, el)
          _$arg === 'parent' && object_parent(elvalue, el)
          if (_$arg === 'enter') isFunc(elvalue) ? elvalue(el) : console.warn('[in-view:${$bd.expression}] invalid method')
      }


      if (_$arg === 'on' || _$arg === 'once' && objLength($bd.modifiers) > 0 && isDefine(elvalue)){
        // register modifiers
        var $mdf = object_modifiers($bd.modifiers)
        // modifiers enter
        if ($mdf === 'enter') isFunc(elvalue) ? elvalue(el) : console.warn('[in-view:${$bd.expression}] invalid method')
        // modifiers class
        $mdf === 'class' && object_class(elvalue, el)
        // modifiers style
        $mdf === 'style' && object_style(elvalue, el)
        // modifiers animate
        $mdf === 'animate' && object_animation(elvalue, el)
        // set parent arguments
        $mdf === 'parent' && object_parent(elvalue, el)
      }

      isDefine(funcEvent.enter) && funcEvent.enter(el)
    },
    exit: function (el) {
      var elvalue

      // check the value of the directive has been registered
      if (hasKey(createEl.values,classId)) elvalue = createEl.values[classId]
      // for magic properties
      countExits += 1
      element_exit(el,classId)
      // end magic properties

      if (_$arg !== 'undefined' && isDefine(elvalue)) {
        if (_$arg === 'leave' && objLength($bd.modifiers)===0) isFunc(elvalue) ? elvalue(el) : console.warn('[in-view:${$bd.expression}] invalid method')
        if (objLength($bd.modifiers) > 0 && object_modifiers($bd.modifiers) === 'leave') {
          _$arg === 'class' && object_class(elvalue,el)
          _$arg === 'style' && object_style(elvalue,el)
          _$arg === 'animate' && object_animation(elvalue,el)
          _$arg === 'parent' && object_parent(elvalue, el)
        }
        if (_$arg === 'parent' && objLength($bd.modifiers) === 0) {
          object_parent(elvalue, el)
        }
      }

      // check if has modifiers
      if (_$arg === 'on' || _$arg === 'once' && objLength($bd.modifiers)>0 && isDefine(elvalue)) {
        // register modifiers
        var $mdf = object_modifiers($bd.modifiers)
        // modifiers leave
        if ($mdf === 'leave') isFunc(elvalue) ? elvalue(el) : console.warn('[in-view:${$bd.expression}] invalid method')
        // leave : class modifiers
        $mdf === 'class.leave' && object_class(elvalue,el)
        // leave : style modifiers
        $mdf === 'style.leave' && object_style(elvalue,el)
        // leave : animate modifiers
        $mdf === 'animate.leave' && object_animation(elvalue,el)
        // set parent arguments
        $mdf === 'parent' && object_parent(elvalue, el)
      }
      isDefine(funcEvent.exit) && funcEvent.exit(el)
    }
  })
}
(el → dom, $bd → object{*})
- inview directive handler