Questa e' la riedizione italiana del post originariamente pubblicato sul mio blog personale.

Ho cominciato ad usare Bespin in maniera intensiva, lunghe sessioni di editing utili a testare quanto esso sia confacente alle mie necessità.

Bespin è davvero un buon prodotto e sono rimasto molto soddisfatto nell'utilizzarlo come collaboration editor general purpose ma io sono un programmatore molto pigro ed ho bisogno di molte piccole funzionalità, non ancora presenti in Bespin, che rendono la mia vita di sviluppatore più semplice.

Bespin supporta i cosiddetti plugin che permettono agli utenti di scrivere codice Javascript che viene agilmente "plugged" all'interno dell'editor e così ho iniziato a studiare il programming model di Bespin.

Ci sono centinaia di API ma ho concentrato la mia attenzione solo sulle specifiche aree riportate di seguito, scoprendo un eccellente supporto allo sviluppatore.

• Gestione generale del testo (supporto Unicode, posizionamento cursore e cos' via)
• Selezione del testo
• Undo/Redo di gruppi di operazioni sul testo
• Clipboard

Maggiori dettagli sull'installazione e l'uso dei plugin sono disponibili sulla wiki di Bespin.

Breve introduzione all'architettura di bespin

Quando i plugin interagiscono con l'editor prima o poi devono usare alcuni componenti fondamentali:

• l'editor stesso; mantiene i riferimenti alle varie strutture dell'editor
• editing session; Il file buffer attualmente modificato dall'utente
• model; Il piu' importante dei componenti, permette di accedere al testo astraendosi dalla rappresentazione interna del caratteri (ad esempio Unicode), qualunque cosa viene vista come righe e colonne
• action; spostare il cursore, gestire la cronologia delle modifiche (undo/redo) e molte altre azioni relative al testo

E' possibile accedere ai componenti utilizzando i singleton di Bespin

bespin.get('editor') // access to the editor component

oppure navigando la struttura dati (ok bisogna comunque sempre partire da un singleton :P )

bespin.get('editSession').editor // access to the editor component starting from editSession

Il plugin "Comment Selection"

Per capire come funzionano le API di Bespin ho scritto un plugin stupido ma utile (almeno per me) usato per commentare una selezione di testo basandosi sul linguaggio del file, così le linee selezionate di un file CSS saranno commentate utilizzando /* ... */, queste HTML utilizzando <!-- ... --> e così via.

La selezione viene trattata come un'unica operazione sul testo, se vengono commentate dieci linee e l'utente fa undo tutte le linee vengono ripristinate, l'utente non deve fare dieci volte undo!!

Raggruppare le operazioni per undo/redo è possibile grazie ai metodi beginEdit()/endEdit()

    editor.ui.actions.beginEdit("commentSelection");
    ...
    editor.ui.actions.endEdit();

Basta parlare, voglio leggere il codice sorgente!

Il codice del plugin è molto semplice.

Otteniamo le informazioni sulla selezione (non il testo) e poi usiamo il model per inserire i caratteri, questo permette di trarre beneficio dell'history manager (undo/redo) e della rappresentazione interna del caratteri.

exports.commentSelection = function(instruction) {
    var currPath = bespin.get('editSession').path;
    var extFile = bespin.util.path.fileType(currPath);
    var commentDelimiters = exports.getCommentDelimitersByLang(extFile);

    if (typeof (commentDelimiters) == "undefined") {
      return;
    }

    var selection = bespin.get('editor').getSelection();
    var model = bespin.get('editSession').editor.model;
    var editor = bespin.get('editSession').editor;

    var startRow;
    var endRow;
    if (selection) {
      startRow = selection.startModelPos.row;
      endRow = selection.endModelPos.row;
    } else {
      startRow = endRow = editor.getCursorPos().row;
    }
    instruction.addOutput(startRow + "," + endRow + " model" + model);
    editor.ui.actions.beginEdit("commentSelection");
    for (var r = startRow; r <= endRow; r++) {
      var modelPos = {row : r, col : 0};
      model.insertCharacters(modelPos, commentDelimiters.begin);
      modelPos.col = model.rows[r].length;
      model.insertCharacters(modelPos, commentDelimiters.end);
      }
    editor.ui.actions.endEdit();
}

E' possibile vedere il codice sorgente completo seguendomi su bespin.mozilla.com, effettuare il login e dalla command line digitare

follow dafi

Gli aficionados ad SVN possono sfogliare il codice qui