Paper.js Interoperabilität

Question

Ich möchte paper.js Funktionen von HTML-Schaltflächen auf meiner Seite aufrufen, aber ich glaube, die paper.js Funktionen existieren in ihrem eigenen Umfang. Die paper.js docs erwähnen Interoperabilität, die wie die rechte direkte Töne von mir dann auf eine Seite, die „coming soon“, sagt:

http://paperjs.org/tutorials/getting-started/paperscript-interoperability/

Wer weiß, wie ich eine Funktion in einem Papier erstellt aufrufen können. js Skript von meiner HTML Seite?

Answer 1

Entschuldigung für dieses fehlende Tutorial. Ich werde wirklich etwas Zeit investieren, um es endlich zu schreiben.

Ich habe diese Frage auf der Mailing-Liste im vergangenen Jahr beantwortet: https://groups.google.com/d/msg/paperjs/C6F0XFlplqM/_67AMqCR_nAJ

Scoped PaperScript innerhalb des globalen Bereich laufen, und haben Zugriff auf alle Elemente des globalen Bereich. Die normalen JavaScripts, die im globalen Bereich (= Fenster) ausgeführt werden, sehen diese PaperScopes nicht und haben keinen Zugriff auf ihre Variablen.

Es gibt eine einfache Lösung zum Austausch von Informationen zwischen den beiden: Erklären Sie einfach eine globale Struktur, die Sie verwenden, um Tings hin und her zu tauschen, z.

window.globals = { 
    someValue: 10, 
    someFunction: function() { alert(globals.someValue); } 
}; 

In Ihrem PaperScript, können Sie dann diese zugreifen einfach durch 'Globals', da es im Fenster Anwendungsbereich ist:

globals.someValue = 20; 
globals.someFunction(); 

Und in der gleichen Art und Weise, können Sie Verwenden Sie diese Struktur aus normalem JavaScript.

Answer 2

Ich wollte nur etwas Klärung für jeden hinzufügen, der darauf eingeht.

Für PaperScript-to-JavaScript Interoperabilität, gehen Sie wie folgt ...

In HTML-Datei:

<button type="button" id="btn">Click Me!</button> 

in JavaScript-Datei:

$(document).ready(init); 

function init(jQuery) { 
    $("#btn").click(window.globals.paperClicked); 
} 

// PaperScript Interop 
window.globals = { 
    paperClicked: function() {} 
} 

In PaperScript Datei:

// JavaScript Interop 
globals.paperClicked = internalClicked; 

function internalClicked() { 
    alert('clicked!'); 
}