MergeDialog

O diálogo de comparação e merge exibe dois textos lado a lado, com as diferenças destacadas e os trechos iguais ocultos. Ele pode ser usado para mostrar ao usuário o que mudou entre duas versões de um conteúdo ou para que ele mescle as duas versões antes de gravar o resultado. Um mapa à direita, que também funciona como barra de rolagem, mostra onde estão todas as diferenças e permite ir até elas com um clique.

No merge, o destino, à direita, pode ser editado livremente e receber os trechos da origem pelos botões de seta. Os atalhos de teclado são os do WinMerge e do VS Code: Alt + seta para baixo ou para cima navega entre as diferenças, Alt + seta para a direita copia a diferença para o destino e Ctrl + F localiza textos. A lista completa está nos atalhos do sistema (Ctrl + /). O tamanho da fonte e o modo claro ou escuro podem ser alterados apenas no diálogo, sem mudar as preferências do sistema.

É o mesmo diálogo utilizado pelos processos de atualização e de revisão da VFS e está disponível em qualquer processo por meio da classe MergeDialog .

Exibindo as diferenças

O método compare exibe as diferenças sem permitir alterações. Neste exemplo, um botão da grade compara o texto do registro com a versão original:

const MergeDialog = require('@nginstack/web-framework/lib/dialogs/MergeDialog.js');

const mergeDialog = new MergeDialog(this);

grid.button('Comparar com o original', function (bt) {
  const ds = bt.parent.ds;
  mergeDialog.compare(ds.str('TEXTO_ORIGINAL'), ds.str('TEXTO'), {
    title: 'Alterações do texto',
    sourceLabel: 'Original',
    targetLabel: 'Atual'
  });
});

Mesclando antes de gravar

O método merge permite que o usuário edite o conteúdo da direita e copie para ele os trechos da esquerda. Ao confirmar, o processo recebe o conteúdo final. Se o usuário cancelar, recebe null.

grid.button('Mesclar com o original', function (bt) {
  const ds = bt.parent.ds;
  const bookmark = ds.bookmark;
  mergeDialog.merge(ds.str('TEXTO_ORIGINAL'), ds.str('TEXTO'), {
    title: 'Merge do texto',
    sourceLabel: 'Original',
    targetLabel: 'Atual',
    mediaType: 'text/javascript'
  }).then(function (merged) {
    if (merged === null) {
      return;
    }
    // O registro corrente pode ter mudado enquanto o diálogo estava aberto.
    ds.bookmark = bookmark;
    ds.setField('TEXTO', merged);
    ds.post();
  });
});

A opção mediaType informa o tipo de mídia do conteúdo, que define o destaque de sintaxe. Pode ser informado o código do tipo, como 'text/javascript', ou a sua chave, como a do campo iMimeType dos arquivos da VFS. Os scripts do Engine, como os de classes e de modelos de dados, são exibidos como JavaScript. Sem a opção, o conteúdo é exibido como texto simples.

Vários conteúdos em sequência

Para mesclar vários registros, abra o próximo diálogo somente depois que o anterior for fechado, dentro do then:

grid.button('Mesclar selecionados', function (bt) {
  const ds = bt.parent.ds;
  const bookmarks = bt.parent.selectedRecords;

  function mergeNext(index) {
    if (index >= bookmarks.length) {
      return;
    }
    ds.bookmark = bookmarks[index];
    mergeDialog.merge(ds.str('TEXTO_ORIGINAL'), ds.str('TEXTO'), {
      title: 'Merge ' + (index + 1) + ' de ' + bookmarks.length
    }).then(function (merged) {
      if (merged !== null) {
        ds.bookmark = bookmarks[index];
        ds.setField('TEXTO', merged);
        ds.post();
      }
      mergeNext(index + 1);
    });
  }

  mergeNext(0);
});

Se a mesma instância abrir um novo diálogo enquanto outro ainda estiver aberto, o anterior é fechado e tratado como cancelado.

Cuidados

• O diálogo não permite confirmar o merge enquanto o conteúdo tiver caracteres que não possam ser recebidos pelo Engine, e indica a linha onde eles se encontram. Assim, o processo recebe o conteúdo sem perda de caracteres.
• As quebras de linha do conteúdo da direita são mantidas, mesmo quando ele é editado. Se o resultado ficar igual ao conteúdo da esquerda, o processo recebe o conteúdo da esquerda sem alterações.