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) {

  
  
  var classId = "inview-" + shortid.generate()
  var elSize = classList(el).get().length

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

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

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

  
  var funcEvent = Object.create(null)

  
  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
      
      if(hasKey(createEl.values,classId)) elvalue = createEl.values[classId]

      
      countEntered += 1
      _element_enter(el, classId)
      

      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)){
        
        var $mdf = object_modifiers($bd.modifiers)
        
        if ($mdf === 'enter') isFunc(elvalue) ? elvalue(el) : console.warn('[in-view:${$bd.expression}] invalid method')
        
        $mdf === 'class' && object_class(elvalue, el)
        
        $mdf === 'style' && object_style(elvalue, el)
        
        $mdf === 'animate' && object_animation(elvalue, el)
        
        $mdf === 'parent' && object_parent(elvalue, el)
      }

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

      
      if (hasKey(createEl.values,classId)) elvalue = createEl.values[classId]
      
      countExits += 1
      element_exit(el,classId)
      

      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)
        }
      }

      
      if (_$arg === 'on' || _$arg === 'once' && objLength($bd.modifiers)>0 && isDefine(elvalue)) {
        
        var $mdf = object_modifiers($bd.modifiers)
        
        if ($mdf === 'leave') isFunc(elvalue) ? elvalue(el) : console.warn('[in-view:${$bd.expression}] invalid method')
        
        $mdf === 'class.leave' && object_class(elvalue,el)
        
        $mdf === 'style.leave' && object_style(elvalue,el)
        
        $mdf === 'animate.leave' && object_animation(elvalue,el)
        
        $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
( el → dom $bd → object { * } ) - inview directive handler