src/js/locale/h-ruby.js
function renderComplexRuby( $ruby ) {
  var frag = $.create( '!' )
  var clazz = $ruby.classList
  var $cloned, $rb, $ru, maxspan

  frag.appendChild( $.clone( $ruby ))
  $cloned = frag.firstChild

  $rb = $ru = $.tag( 'rb', $cloned )
  maxspan = $rb.length

  // First of all, deal with Zhuyin containers
  // individually
  //
  // Note that we only support one single Zhuyin
  // container in each complex ruby
  void function( $rtc ) {
    if ( !$rtc )  return

    $ru = $
      .tag( 'rt', $rtc )
      .map(function( $rt, i ) {
        if ( !$rb[ i ] )  return
        var ret = createZhuyinRu( $rb[ i ], $rt )

        try {
          $rb[ i ].parentNode.replaceChild( ret, $rb[ i ] )
        } catch ( e ) {}
        return ret
      })

    // Remove the container once it's useless
    $.remove( $rtc )
    $cloned.setAttribute( 'rightangle', 'true' )
  }( $cloned.querySelector( 'rtc.zhuyin' ))

  // Then, normal annotations other than Zhuyin
  $
  .qsa( 'rtc:not(.zhuyin)', $cloned )
  .forEach(function( $rtc, order ) {
    var ret
    ret = $
      .tag( 'rt', $rtc )
      .map(function( $rt, i ) {
        var rbspan = Number( $rt.getAttribute( 'rbspan' ) || 1 )
        var span = 0
        var aRb = []
        var $rb, ret

        if ( rbspan > maxspan )  rbspan = maxspan

        do {
          try {
            $rb = $ru.shift()
            aRb.push( $rb )
          } catch (e) {}

          if ( typeof $rb === 'undefined' )  break
          span += Number( $rb.getAttribute( 'span' ) || 1 )
        } while ( rbspan > span )

        if ( rbspan < span ) {
          if ( aRb.length > 1 ) {
            console.error( 'An impossible `rbspan` value detected.', ruby )
            return
          }
          aRb  = $.tag( 'rb', aRb[0] )
          $ru  = aRb.slice( rbspan ).concat( $ru )
          aRb  = aRb.slice( 0, rbspan )
          span = rbspan
        }

        ret = createNormalRu( aRb, $rt, {
          'class': clazz,
          span: span,
          order: order
        })

        try {
          aRb[0].parentNode.replaceChild( ret, aRb.shift() )
          aRb.map( $.remove )
        } catch (e) {}
        return ret
      })
    $ru = ret
    if ( order === 1 )  $cloned.setAttribute( 'doubleline', 'true' )

    // Remove the container once it's useless
    $.remove( $rtc )
  })
  return createCustomRuby( frag )
}
function renderComplexRuby( $ruby ) {
  var frag = $.create( '!' )
  var clazz = $ruby.classList
  var $cloned, $rb, $ru, maxspan

  frag.appendChild( $.clone( $ruby ))
  $cloned = frag.firstChild

  $rb = $ru = $.tag( 'rb', $cloned )
  maxspan = $rb.length

  // First of all, deal with Zhuyin containers
  // individually
  //
  // Note that we only support one single Zhuyin
  // container in each complex ruby
  void function( $rtc ) {
    if ( !$rtc )  return

    $ru = $
      .tag( 'rt', $rtc )
      .map(function( $rt, i ) {
        if ( !$rb[ i ] )  return
        var ret = createZhuyinRu( $rb[ i ], $rt )

        try {
          $rb[ i ].parentNode.replaceChild( ret, $rb[ i ] )
        } catch ( e ) {}
        return ret
      })

    // Remove the container once it's useless
    $.remove( $rtc )
    $cloned.setAttribute( 'rightangle', 'true' )
  }( $cloned.querySelector( 'rtc.zhuyin' ))

  // Then, normal annotations other than Zhuyin
  $
  .qsa( 'rtc:not(.zhuyin)', $cloned )
  .forEach(function( $rtc, order ) {
    var ret
    ret = $
      .tag( 'rt', $rtc )
      .map(function( $rt, i ) {
        var rbspan = Number( $rt.getAttribute( 'rbspan' ) || 1 )
        var span = 0
        var aRb = []
        var $rb, ret

        if ( rbspan > maxspan )  rbspan = maxspan

        do {
          try {
            $rb = $ru.shift()
            aRb.push( $rb )
          } catch (e) {}

          if ( typeof $rb === 'undefined' )  break
          span += Number( $rb.getAttribute( 'span' ) || 1 )
        } while ( rbspan > span )

        if ( rbspan < span ) {
          if ( aRb.length > 1 ) {
            console.error( 'An impossible `rbspan` value detected.', ruby )
            return
          }
          aRb  = $.tag( 'rb', aRb[0] )
          $ru  = aRb.slice( rbspan ).concat( $ru )
          aRb  = aRb.slice( 0, rbspan )
          span = rbspan
        }

        ret = createNormalRu( aRb, $rt, {
          'class': clazz,
          span: span,
          order: order
        })

        try {
          aRb[0].parentNode.replaceChild( ret, aRb.shift() )
          aRb.map( $.remove )
        } catch (e) {}
        return ret
      })
    $ru = ret
    if ( order === 1 )  $cloned.setAttribute( 'doubleline', 'true' )

    // Remove the container once it's useless
    $.remove( $rtc )
  })
  return createCustomRuby( frag )
}
function renderComplexRuby ( $ruby ) { var frag = $ . create ( '!' ) var clazz = $ruby . classList var $cloned , $rb , $ru , maxspan frag . appendChild ( $ . clone ( $ruby ) ) $cloned = frag . firstChild $rb = $ru = $ . tag ( 'rb' , $cloned ) maxspan = $rb . length // First of all, deal with Zhuyin containers // individually // // Note that we only support one single Zhuyin // container in each complex ruby void function ( $rtc ) { if ( ! $rtc ) return $ru = $ . tag ( 'rt' , $rtc ) . map ( function ( $rt , i ) { if ( ! $rb [ i ] ) return var ret = createZhuyinRu ( $rb [ i ] , $rt ) try { $rb [ i ] . parentNode . replaceChild ( ret , $rb [ i ] ) } catch ( e ) { } return ret } ) // Remove the container once it's useless $ . remove ( $rtc ) $cloned . setAttribute ( 'rightangle' , 'true' ) } ( $cloned . querySelector ( 'rtc.zhuyin' ) ) // Then, normal annotations other than Zhuyin $ . qsa ( 'rtc:not(.zhuyin)' , $cloned ) . forEach ( function ( $rtc , order ) { var ret ret = $ . tag ( 'rt' , $rtc ) . map ( function ( $rt , i ) { var rbspan = Number ( $rt . getAttribute ( 'rbspan' ) || 1 ) var span = 0 var aRb = [ ] var $rb , ret if ( rbspan > maxspan ) rbspan = maxspan do { try { $rb = $ru . shift ( ) aRb . push ( $rb ) } catch ( e ) { } if ( typeof $rb === 'undefined' ) break span += Number ( $rb . getAttribute ( 'span' ) || 1 ) } while ( rbspan > span ) if ( rbspan < span ) { if ( aRb . length > 1 ) { console . error ( 'An impossible `rbspan` value detected.' , ruby ) return } aRb = $ . tag ( 'rb' , aRb [ 0 ] ) $ru = aRb . slice ( rbspan ) . concat ( $ru ) aRb = aRb . slice ( 0 , rbspan ) span = rbspan } ret = createNormalRu ( aRb , $rt , { 'class' : clazz , span : span , order : order } ) try { aRb [ 0 ] . parentNode . replaceChild ( ret , aRb . shift ( ) ) aRb . map ( $ . remove ) } catch ( e ) { } return ret } ) $ru = ret if ( order === 1 ) $cloned . setAttribute ( 'doubleline' , 'true' ) // Remove the container once it's useless $ . remove ( $rtc ) } ) return createCustomRuby ( frag ) }
3. Complex ruby polyfill - Double-lined annotation; - Right-angled annotation.
3 . Complex ruby polyfill - Double - lined annotation ; - Right - angled annotation .