How to use nbdime - 10 common examples

function showDiff(data: {base: nbformat.INotebookContent, diff: IDiffEntry[]}): Promise {


  let rendermime = new RenderMimeRegistry({
    initialFactories: rendererFactories,
    sanitizer: defaultSanitizer,
    latexTypesetter: new MathJaxTypesetter({
      url: getConfigOption('mathjaxUrl'),
      config: getConfigOption('mathjaxConfig'),
    }),
  });

  let nbdModel = new NotebookDiffModel(data.base, data.diff);
  let nbdWidget = new NotebookDiffWidget(nbdModel, rendermime);

  let root = document.getElementById('nbdime-root');
  if (!root) {
    throw new Error('Missing root element "nbidme-root"');
  }
  root.innerHTML = '';
  // Hide unchanged cells by default:
  toggleShowUnchanged(!getConfigOption('hideUnchanged', true));

  let panel = new Panel();
  panel.id = 'main';
  Widget.attach(panel, root);
  panel.addWidget(nbdWidget);
  let work = nbdWidget.init();
  work.then(() => {

function showDiff(data: {base: nbformat.INotebookContent, diff: IDiffEntry[]}): Promise {


  let rendermime = new RenderMimeRegistry({
    initialFactories: rendererFactories,
    sanitizer: defaultSanitizer,
    latexTypesetter: new MathJaxTypesetter({
      url: getConfigOption('mathjaxUrl'),
      config: getConfigOption('mathjaxConfig'),
    }),
  });

  let nbdModel = new NotebookDiffModel(data.base, data.diff);
  let nbdWidget = new NotebookDiffWidget(nbdModel, rendermime);

  let root = document.getElementById('nbdime-root');
  if (!root) {
    throw new Error('Missing root element "nbidme-root"');
  }
  root.innerHTML = '';
  // Hide unchanged cells by default:
  toggleShowUnchanged(!getConfigOption('hideUnchanged', true));

  let panel = new Panel();
  panel.id = 'main';
  Widget.attach(panel, root);
  panel.addWidget(nbdWidget);
  let work = nbdWidget.init();
  work.then(() => {
    window.onresize = () => { panel.update(); };

function showMerge(data: {
    base: nbformat.INotebookContent,
    merge_decisions: IMergeDecision[]
    }): Promise {

  let rendermime = new RenderMimeRegistry({
    initialFactories: rendererFactories,
    sanitizer: defaultSanitizer,
  });

  let nbmModel = new NotebookMergeModel(data.base,
      data.merge_decisions);
  let nbmWidget = new NotebookMergeWidget(nbmModel, rendermime);

  let root = document.getElementById('nbdime-root');
  if (!root) {
    throw new Error('Missing root element "nbidme-root"');
  }
  root.innerHTML = '';
  // Hide unchanged cells by default:
  toggleShowUnchanged(!getConfigOption('hideUnchanged', true));

  let panel = new Panel();
  panel.id = 'main';
  Widget.attach(panel, root);
  panel.addWidget(nbmWidget);
  let work = nbmWidget.init();

function showMerge(data: {
    base: nbformat.INotebookContent,
    merge_decisions: IMergeDecision[]
    }): Promise {

  let rendermime = new RenderMimeRegistry({
    initialFactories: rendererFactories,
    sanitizer: defaultSanitizer,
  });

  let nbmModel = new NotebookMergeModel(data.base,
      data.merge_decisions);
  let nbmWidget = new NotebookMergeWidget(nbmModel, rendermime);

  let root = document.getElementById('nbdime-root');
  if (!root) {
    throw new Error('Missing root element "nbidme-root"');
  }
  root.innerHTML = '';
  // Hide unchanged cells by default:
  toggleShowUnchanged(!getConfigOption('hideUnchanged', true));

  let panel = new Panel();
  panel.id = 'main';
  Widget.attach(panel, root);
  panel.addWidget(nbmWidget);
  let work = nbmWidget.init();
  work.then(() => {
    window.onresize = () => { panel.update(); };

function ensureRendered(callback: () => void): void {
  for (let e of EditorWidget.editors) {
    e.setOption('viewportMargin', Infinity);
  }
  window.requestAnimationFrame(() => {
    // Assume entire viewport has been rendered now
    callback();
    for (let e of EditorWidget.editors) {
      // Reset to default according to docs
      e.setOption('viewportMargin', 10);
    }
  });
}

window.requestAnimationFrame(() => {
    // Assume entire viewport has been rendered now
    callback();
    for (let e of EditorWidget.editors) {
      // Reset to default according to docs
      e.setOption('viewportMargin', 10);
    }
  });
}

protected onData(data: JSONObject) {
    if (this.isDisposed) {
      return;
    }
    let base = data['base'] as nbformat.INotebookContent;
    let diff = data['diff'] as any as IDiffEntry[];
    let nbdModel = new NotebookDiffModel(base, diff);
    let nbdWidget = new NotebookDiffWidget(nbdModel, this.rendermime);

    this.scroller.addWidget(nbdWidget);
    let work = nbdWidget.init();
    work.then(() => {
      Private.markUnchangedRanges(this.scroller.node);
    })
    return work;
  }

protected onData(data: JSONObject) {
    if (this.isDisposed) {
      return;
    }
    let base = data['base'] as nbformat.INotebookContent;
    let diff = data['diff'] as any as IDiffEntry[];
    let nbdModel = new NotebookDiffModel(base, diff);
    let nbdWidget = new NotebookDiffWidget(nbdModel, this.rendermime);

    this.scroller.addWidget(nbdWidget);
    let work = nbdWidget.init();
    work.then(() => {
      Private.markUnchangedRanges(this.scroller.node);
    })
    return work;
  }

function getDiff(base: string, remote: string | undefined) {
  let baseUrl = getBaseUrl();
  requestDiff(base, remote, baseUrl, onDiffRequestCompleted, onDiffRequestFailed);
}

function getMerge(base: string, local: string, remote: string) {
  let baseUrl = getBaseUrl();
  requestMerge(base, local, remote, baseUrl, onMergeRequestCompleted, onMergeRequestFailed);
}