@dodona/papyros 0.1.58 → 0.1.62

package/README.md

@@ -44,6 +44,38 @@ The following options are supported:
 - standAlone: Whether to operate in stand-alone or embedded mode as described above.
 - locale: The locale to use, currently English and Dutch translations are provided.
 - programmingLanguage: The language to use in the CodeEditor and Backend
+- inputMode: How the users can provide input, according to the [InputMode enum](/src/InputManager.ts)
+
+Furthermore, you can provide fine-grained configuration in embedded mode by providing RenderOptions
+to each main component in the application. You minimally need to specify the ID of the parent element.
+You can also specify attributes, such as style or data, or classNames to be used.
+The main components are the following:
+- code -> the CodeEditor
+- panel -> the StatusPanel in the CodeEditor
+- input -> The field for the user input
+- output -> The panel for output of the code
+
+### User input
+
+Important to note is that handling asynchronous input in a synchronous way is not straightforward.
+This requires advanced features which are not available by default in your browser. We support two options
+
+The most efficient and practical way is using SharedArrayBuffers, which requires the presence of certain HTTP headers.
+The following headers must be set on resources using Papyros.
+```json
+'Cross-Origin-Opener-Policy': 'same-origin',
+'Cross-Origin-Embedder-Policy': 'require-corp'
+```
+If you are also embedding other components (such as iframes) in those pages, you will also need to set
+'Cross-Origin-Resource-Policy' to 'cross-origin' to make them work correctly. In order to limit the effect of this
+change, it is advised to restrict access using the 'Access-Control-Allow-Origin'-header to prevent abuse of including code.
+
+If you would like to use this project without enabling these HTTP headers, we provide a solution using a service worker.
+If your application does not use a service worker yet, a default service worker is pre-built and included in the package.
+Simply copy the file located [here](dist/inputServiceWorker.js) to a location of choice in your application where it can be served.
+Then, before launching your instance of Papyros, make a call to configureInput with the location of the folder and the name of the file.
+
+If you already use a service worker, simply include our functionality in your existing worker using imports. An example can be found [here](src/InputServiceWorker.ts). Afterwards, inform Papyros of this using configureInput as above.
 
 ## Documentation
 
@@ -71,4 +103,4 @@ You can view the results in your browser by visting http://localhost:8080.
 
 ## Try it online
 
-Start coding immediately in your [browser](https://docs.dodona.be/papyros/).
+Start coding immediately in your [browser](https://papyros.dodona.be/).

package/dist/Papyros.d.ts

@@ -37,7 +37,7 @@ interface PapyrosConfig {
     inputMode: InputMode;
 }
 interface PapyrosRenderOptions {
-    papyros: RenderOptions;
+    papyros?: RenderOptions;
     code?: RenderOptions;
     panel?: RenderOptions;
     input?: RenderOptions;
@@ -48,7 +48,6 @@ export declare class Papyros {
     codeState: PapyrosCodeState;
     inputManager: InputManager;
     outputManager: OutputManager;
-    inputURL: string;
     constructor(programmingLanguage: ProgrammingLanguage, inputMode: InputMode);
     get state(): PapyrosState;
     launch(): Promise<Papyros>;