Opération copier-coller HTML dans AIR

Adobe AIR 1.0 et les versions ultérieures

Dans Adobe AIR, l’environnement HTML fournit son propre comportement et son lot d’événements par défaut pour l’opération de copier-coller. Seul le code en cours d’exécution dans le sandbox de l’application est en mesure d’accéder directement au Presse-papiers du système via l’objet Clipboard.generalClipboard. Le code JavaScript d’un sandbox hors application peut accéder au Presse-papiers via l’objet événement envoyé en réponse à l’un des événements copier-coller envoyé par un élément provenant d’un document HTML.

Les événements copier-coller sont les suivants : copy, cut et paste. L’objet envoyé pour ces événements fournit un accès au Presse-papiers par la propriété clipboardData.

Comportement par défaut

Par défaut, AIR copie les éléments sélectionnées en réponse à la commande copier qui peut être engendrée soit par un raccourci-clavier, soit par un menu contextuel. Au sein des zones modifiables, AIR coupe du texte en réponse à des commandes couper ou bien colle du texte au curseur ou à la sélection en réponse à la commande coller.

Pour éviter le comportement par défaut, votre gestionnaire d’événement peut appeler la méthode preventDefault() de l’objet événement envoyé.

Utilisation de la propriété clipboardData de l’objet événement

La propriété clipboardData de l’objet événement envoyé à la suite de l’un des événements copier-coller vous permet de lire des données du Presse-papiers et d’écrire dedans.

Pour écrire dans le Presse-papiers lors de l’exécution d’un événement copier-coller, utilisez la méthode setData() de l’objet clipboardData en faisant passer les données à copier et le type de MIME :

function customCopy(event){ 
    event.clipboardData.setData("text/plain", "A copied string."); 
}

Pour accéder aux données en cours de collage, vous pouvez utiliser la méthode getData() de l’objet clipboardData en faisant passer le type de MIME du format de données. Les formats disponibles sont indiqués par la propriété types.

function customPaste(event){ 
    var pastedData = event.clipboardData("text/plain"); 
}

Il est possible d’accéder à la méthode getData() et à la propriété types uniquement dans l’objet d’événement envoyé par l’événement paste.

L’exemple ci-dessous illustre la façon de remplacer le comportement copier-coller par défaut dans une page HTML. Le gestionnaire d’événement copy met en italiques le texte copié et le copie dans le Presse-papiers sous la forme de texte HTML. Le gestionnaire d’événement cut copie les données sélectionnées dans le Presse-papiers et les supprime du document. Le gestionnaire paste insère le contenu du Presse-papiers sous forme de HTML en caractères gras :

<html> 
<head> 
    <title>Copy and Paste</title>             
    <script language="javascript" type="text/javascript"> 
        function onCopy(event){ 
            var selection = window.getSelection(); 
            event.clipboardData.setData("text/html","<i>" + selection + "</i>"); 
            event.preventDefault(); 
        } 
 
        function onCut(event){ 
             var selection = window.getSelection(); 
             event.clipboardData.setData("text/html","<i>" + selection + "</i>"); 
             var range = selection.getRangeAt(0); 
             range.extractContents(); 
             
            event.preventDefault(); 
        } 
 
        function onPaste(event){ 
            var insertion = document.createElement("b"); 
            insertion.innerHTML = event.clipboardData.getData("text/html"); 
             var selection = window.getSelection(); 
             var range = selection.getRangeAt(0); 
             range.insertNode(insertion); 
            event.preventDefault(); 
        } 
    </script> 
</head> 
<body onCopy="onCopy(event)" 
     onPaste="onPaste(event)" 
     onCut="onCut(event)"> 
<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium  
doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore  
veritatis et quasi architecto beatae vitae dicta sunt explicabo. Nemo enim ipsam 
voluptatem quia voluptas sit aspernatur aut odit aut fugit, sed quia consequuntur  
magni dolores eos qui ratione voluptatem sequi nesciunt.</p> 
</body> 
</html>