TypeScript ceval.view类代码示例

export default function(ctrl: Controller): VNode {
  const showCeval = ctrl.vm.showComputer(),
    gaugeOn = ctrl.showEvalGauge();
  if (cevalShown !== showCeval) {
    if (!cevalShown) ctrl.vm.autoScrollNow = true;
    cevalShown = showCeval;
  }
  return h('main.puzzle', {
    class: {'gauge-on': gaugeOn},
    hook: {
      postpatch(old, vnode) {
        gridHacks.start(vnode.elm as HTMLElement)
        if (old.data!.gaugeOn !== gaugeOn) {
          if (ctrl.pref.coords == 2)
            $('body').toggleClass('coords-in', gaugeOn).toggleClass('coords-out', !gaugeOn);
          window.lichess.dispatchEvent(document.body, 'chessground.resize');
        }
        vnode.data!.gaugeOn = gaugeOn;
      }
    }
  }, [
    h('aside.puzzle__side', [
      side.puzzleBox(ctrl),
      side.userBox(ctrl)
    ]),
    h('div.puzzle__board.main-board' + (ctrl.pref.blindfold ? '.blindfold' : ''), {
      hook: hasTouchEvents ? undefined : bind('wheel', e => wheel(ctrl, e as WheelEvent))
    }, [
      chessground(ctrl),
      ctrl.promotion.view()
    ]),
    cevalView.renderGauge(ctrl),
    h('div.puzzle__tools', [
      // we need the wrapping div here
      // so the siblings are only updated when ceval is added
      h('div.ceval-wrap', {
        class: { none: !showCeval }
      }, showCeval ? [
        cevalView.renderCeval(ctrl),
        cevalView.renderPvs(ctrl)
      ] : []),
      renderAnalyse(ctrl),
      feedbackView(ctrl)
    ]),
    controls(ctrl),
    historyView(ctrl)
  ]);
}

function visualBoard(ctrl: Controller) {
  return h('div.lichess_board_wrap', [
    h('div.lichess_board', {
      hook: bind('wheel', e => wheel(ctrl, e as WheelEvent))
    }, [
      chessground(ctrl),
      ctrl.promotion.view()
    ]),
    cevalView.renderGauge(ctrl)
  ]);
}

export function renderMove(ctx: Ctx, node: Tree.Node): VNode[] {
  const ev: any = cevalView.getBestEval({client: node.ceval, server: node.eval}) || {};
  return [h('san', fixCrazySan(node.san!))]
    .concat((node.glyphs && ctx.showGlyphs) ? renderGlyphs(node.glyphs) : [])
    .concat(ctx.showEval ? (
      defined(ev.cp) ? [renderEval(normalizeEval(ev.cp))] : (
        defined(ev.mate) ? [renderEval('#' + ev.mate)] : []
      )
    ) : []);
}

export default function(ctrl: Controller): VNode {
  const showCeval = ctrl.vm.showComputer();
  if (cevalShown !== showCeval) {
    if (!cevalShown) ctrl.vm.autoScrollNow = true;
    cevalShown = showCeval;
  }
  return h('div#puzzle.cg-512', [
    h('div', {
      hook: {
        insert: _ => window.lichess.pubsub.emit('reset_zoom')()
      },
      class: { gauge_displayed: ctrl.showEvalGauge() }
    }, [
      h('div.lichess_game' + (ctrl.pref.blindfold ? '.blindfold' : ''), {
        hook: {
          insert: _ => window.lichess.pubsub.emit('content_loaded')()
        }
      }, [
        visualBoard(ctrl),
        h('div.lichess_ground', [
          // we need the wrapping div here
          // so the siblings are only updated when ceval is added
          h('div', showCeval ? [
            cevalView.renderCeval(ctrl),
            cevalView.renderPvs(ctrl)
          ] : []),
          renderAnalyse(ctrl),
          feedbackView(ctrl),
          buttons(ctrl)
        ])
      ])
    ]),
    h('div.underboard', [
      h('div.center', [
        historyView(ctrl)
      ])
    ])
  ]);
};

function visualBoard(ctrl: AnalyseCtrl) {
  return h('div.lichess_board_wrap', [
    ctrl.keyboardHelp ? keyboardView(ctrl) : null,
    ctrl.study ? studyView.overboard(ctrl.study) : null,
    h('div.lichess_board.' + ctrl.data.game.variant.key, {
      hook: ctrl.gamebookPlay() ? undefined : bind('wheel', e => wheel(ctrl, e as WheelEvent))
    }, [
      chessground.render(ctrl),
      renderPromotion(ctrl)
    ]),
    cevalView.renderGauge(ctrl)
  ]);
}

function visualBoard(ctrl: AnalyseCtrl, playerBars: VNode[] | undefined) {
  return h('div.lichess_board_wrap' + (playerBars ? '.' + ctrl.bottomColor() : ''), [
    ctrl.keyboardHelp ? keyboardView(ctrl) : null,
    ctrl.study ? studyView.overboard(ctrl.study) : null,
    playerBars ? playerBars[ctrl.bottomIsWhite() ? 1 : 0] : null,
    h('div.lichess_board.' + ctrl.data.game.variant.key, {
      hook: ctrl.gamebookPlay() ? undefined : bind('wheel', e => wheel(ctrl, e as WheelEvent))
    }, [
      chessground.render(ctrl),
      renderPromotion(ctrl)
    ]),
    playerBars ? playerBars[ctrl.bottomIsWhite() ? 0 : 1] : null,
    cevalView.renderGauge(ctrl)
  ]);
}

export default function(ctrl: AnalyseCtrl): VNode {
  const concealOf = makeConcealOf(ctrl),
  study = ctrl.study,
  showCevalPvs = !(ctrl.retro && ctrl.retro.isSolving()) && !ctrl.practice,
  menuIsOpen = ctrl.actionMenu.open,
  chapter = study && study.data.chapter,
  studyStateClass = chapter ? chapter.id + study!.vm.loading : 'nostudy',
  gamebookPlay = ctrl.gamebookPlay(),
  gamebookPlayView = gamebookPlay && gbPlay.render(gamebookPlay),
  gamebookEditView = gbEdit.running(ctrl) ? gbEdit.render(ctrl) : undefined,
  relayEdit = study && study.relay && relayManager(study.relay),
  playerBars = renderPlayerBars(ctrl),
  gaugeDisplayed = ctrl.showEvalGauge(),
  needsInnerCoords = !!gaugeDisplayed || !!playerBars;
  return h('div.analyse.cg-512', [
    h('div.' + studyStateClass, {
      hook: {
        insert: _ => {
          if (firstRender) {
            firstRender = false;
            if (ctrl.data.pref.coords === 1) li.loadedCss[innerCoordsCss] = true;
          }
          else li.pubsub.emit('reset_zoom')();
          forceInnerCoords(ctrl, needsInnerCoords);
        },
        update(_, _2) {
          forceInnerCoords(ctrl, needsInnerCoords);
        }
      },
      class: {
        'gauge_displayed': gaugeDisplayed,
        'no_computer': !ctrl.showComputer(),
        'gb_edit': !!gamebookEditView,
        'gb_play': !!gamebookPlayView,
        'relay_edit': !!relayEdit,
        'player_bars': !!playerBars,
      }
    }, [
      h('div.lichess_game', {
        hook: {
          insert: _ => li.pubsub.emit('content_loaded')()
        }
      }, [
        visualBoard(ctrl, playerBars),
        h('div.lichess_ground', gamebookPlayView || [
          menuIsOpen || playerBars ? null : renderClocks(ctrl),
          menuIsOpen ? null : crazyView(ctrl, ctrl.topColor(), 'top'),
          ...(menuIsOpen ? [actionMenu(ctrl)] : [
            cevalView.renderCeval(ctrl),
            showCevalPvs ? cevalView.renderPvs(ctrl) : null,
            renderAnalyse(ctrl, concealOf),
            gamebookEditView ? null : forkView(ctrl, concealOf),
            retroView(ctrl) || practiceView(ctrl) || explorerView(ctrl)
          ]),
          menuIsOpen ? null : crazyView(ctrl, ctrl.bottomColor(), 'bottom'),
          buttons(ctrl),
          gamebookEditView || relayEdit
        ])
      ])
    ]),
    ctrl.embed ? null : h('div.underboard', {
      class: { no_computer: !ctrl.showComputer() }
    }, [
      h('div.center', ctrl.study ? studyView.underboard(ctrl) : [inputs(ctrl)]),
      h('div.right', [acplView(ctrl)])
    ]),
    ctrl.embed || synthetic(ctrl.data) ? null : h('div.analeft', [
      ctrl.forecast ? forecastView(ctrl, ctrl.forecast) : null,
      game.playable(ctrl.data) ? h('div.back_to_game',
        h('a.button.text', {
          attrs: {
            href: ctrl.data.player.id ? router.player(ctrl.data) : router.game(ctrl.data),
            'data-icon': 'i'
          }
        }, ctrl.trans('backToGame'))
      ) : null
    ])
  ]);
};

export default function(ctrl: AnalyseCtrl): VNode {
  if (ctrl.nvui) return ctrl.nvui.render(ctrl);
  const concealOf = makeConcealOf(ctrl),
    study = ctrl.study,
    showCevalPvs = !(ctrl.retro && ctrl.retro.isSolving()) && !ctrl.practice,
    menuIsOpen = ctrl.actionMenu.open,
    chapter = study && study.data.chapter,
    gamebookPlay = ctrl.gamebookPlay(),
    gamebookPlayView = gamebookPlay && gbPlay.render(gamebookPlay),
    gamebookEditView = gbEdit.running(ctrl) ? gbEdit.render(ctrl) : undefined,
    playerBars = renderPlayerBars(ctrl),
    clocks = !playerBars && renderClocks(ctrl),
    gaugeOn = ctrl.showEvalGauge(),
    needsInnerCoords = !!gaugeOn || !!playerBars;
  return h('main.analyse.variant-' + ctrl.data.game.variant.key + (chapter ? '.' + chapter.id : ''), {
    hook: {
      insert: vn => {
        forceInnerCoords(ctrl, needsInnerCoords);
        if (!!playerBars != $('body').hasClass('header-margin')) {
          li.raf(() => {
            $('body').toggleClass('header-margin', !!playerBars);
            ctrl.redraw();
          });
        }
        gridHacks.start(vn.elm as HTMLElement);
      },
      update(_, _2) {
        forceInnerCoords(ctrl, needsInnerCoords);
      },
      postpatch(old, vnode) {
        if (old.data!.gaugeOn !== gaugeOn) li.dispatchEvent(document.body, 'chessground.resize');
        vnode.data!.gaugeOn = gaugeOn;
      }
    },
    class: {
      'comp-off': !ctrl.showComputer(),
      'gauge-on': gaugeOn,
      'has-players': !!playerBars,
      'has-clocks': !!clocks
    }
  }, [
    ctrl.keyboardHelp ? keyboardView(ctrl) : null,
    ctrl.study ? studyView.overboard(ctrl.study) : null,
    h('div.analyse__board.main-board', {
      hook: (window.lichess.hasTouchEvents || ctrl.gamebookPlay()) ? undefined : bind('wheel', (e: WheelEvent) => wheel(ctrl, e))
    }, [
      ...(clocks || []),
      playerBars ? playerBars[ctrl.bottomIsWhite() ? 1 : 0] : null,
      chessground.render(ctrl),
      playerBars ? playerBars[ctrl.bottomIsWhite() ? 0 : 1] : null,
      renderPromotion(ctrl)
    ]),
    gaugeOn ? cevalView.renderGauge(ctrl) : null,
    menuIsOpen ? null : crazyView(ctrl, ctrl.topColor(), 'top'),
    gamebookPlayView || h('div.analyse__tools', [
      ...(menuIsOpen ? [actionMenu(ctrl)] : [
        cevalView.renderCeval(ctrl),
        showCevalPvs ? cevalView.renderPvs(ctrl) : null,
        renderAnalyse(ctrl, concealOf),
        gamebookEditView,
        retroView(ctrl) || practiceView(ctrl) || explorerView(ctrl)
      ])
    ]),
    menuIsOpen ? null : crazyView(ctrl, ctrl.bottomColor(), 'bottom'),
    gamebookPlayView ? null : controls(ctrl),
    ctrl.embed ? null : h('div.analyse__underboard', {
      hook: (ctrl.synthetic || playable(ctrl.data)) ? undefined : onInsert(elm => serverSideUnderboard(elm, ctrl))
    }, ctrl.study ? studyView.underboard(ctrl) : [inputs(ctrl)]),
    acplView(ctrl),
    ctrl.embed ? null : (
      ctrl.studyPractice ? studyPracticeView.side(ctrl.study!) :
      h('aside.analyse__side', {
        hook: onInsert(elm => {
          ctrl.opts.$side && ctrl.opts.$side.length && $(elm).replaceWith(ctrl.opts.$side);
          $(elm).append($('.streamers').clone().removeClass('none'));
        })
      },
        ctrl.studyPractice ? [studyPracticeView.side(ctrl.study!)] : (
          ctrl.study ? [studyView.side(ctrl.study)] : [
            ctrl.forecast ? forecastView(ctrl, ctrl.forecast) : null,
            (!ctrl.synthetic && playable(ctrl.data)) ? h('div.back-to-game',
              h('a.button.button-empty.text', {
                attrs: {
                  href: router.game(ctrl.data),
                  'data-icon': 'i'
                }
              }, ctrl.trans.noarg('backToGame'))
            ) : null
          ]
        )
      )
    ),
    study && study.relay && relayManager(study.relay),
    ctrl.opts.chat && h('section.mchat', {
      hook: onInsert(_ => {
        if (ctrl.opts.chat.instance) ctrl.opts.chat.instance.destroy();
        ctrl.opts.chat.parseMoves = true;
        li.makeChat(ctrl.opts.chat, chat => {
          ctrl.opts.chat.instance = chat;
        });
//.........这里部分代码省略.........