Copiar e colar

O sistema de copiar e colar é criado com base em três elementos: objetos ICopyable, objetos ICopyData, que representam objetos copiados, e IPaster, que podem transformar os dados de cópia novamente em objetos copiáveis. Cada tipo de ICopyable precisa de uma IPaster associada que possa colar esses dados.

Esses sistemas são apresentados para o usuário usando opções do menu de contexto e atalhos de teclado.

Há pouquíssimas circunstâncias em que você quer implementar um paster personalizado ou que pode ser copiado em vários casos (por exemplo, o plug-in de seleção múltipla ou o plug-in de copiar e colar entre guias), porque geralmente objetos copiáveis são renderizados, e não é possível adicionar novos objetos renderizados ao Blockly. Os únicos objetos renderizados que podem existir em um espaço de trabalho são blocos, balões e comentários do espaço de trabalho.

Implementar uma cópia

Para criar um objeto copiável, você precisa implementar a interface ICopyable.

Selecionável

A interface ICopyable estende a interface ISelectable, o que significa que também é necessário implementar esses métodos e propriedades.

É necessário ser selecionável porque os atalhos do teclado analisam o objeto selecionado para descobrir o que copiar.

class MyCopyable implements ISelectable {
  constructor(workspace) {
    this.id = Blockly.utils.idGenerator.genUid();
    this.workspace = workspace;
  }

  select() {
    // Visually indicate this draggable is selected.
  }

  unselect() {
    // Visually indicate this draggable is not selected.
  }
}

Copiar

A interface ICopyable tem apenas um método, toCopyData, que retorna uma representação JSON serializável do estado do objeto copiável, que pode ser usada para recriar o objeto copiável.

Os dados de cópia também precisam incluir uma propriedade paster, que contém o nome da string registrado associado ao paster que vai colar esses dados da cópia. Para mais informações sobre pasters, consulte Implementar um paster.

class MyCopyable implements ICopyable {
  constructor(workspace, state) {
    this.workspace = workspace;
    this.myState = state;
  }

  toCopyData() {
    return {
      // This string matches the string used to register the paster.
      paster: 'MY_PASTER',
      state: this.myState,
    };
  }
}

Implementar um paster

Para criar um paster, implemente a interface IPaster. Ele só tem um método paste, que recebe os dados de cópia daquilo que ele cola, o espaço de trabalho para colar a coisa e uma coordenada opcional, que é o local em que a coisa é colada.

class MyPaster implements IPaster {
  paste(copyData, workspace, coordinate) {
    return new MyCopyable(workspace, copyData.state);
    // Optionally position the copyable at the passed coordinate.
    // Optionally select the copyable after it is pasted.
  }
}

Inscrição

Depois de implementar um paster, é necessário registrá-lo para encontrar o paster associado a determinados dados de cópia da propriedade paster.

// This string matches the string assigned to the 'paster' property.
Blockly.clipboard.registry.register('MY_PASTER', new MyPaster());