First working version

README.md

@@ -1,2 +1,24 @@
-# LTI-IFrame-Autoresizer
-Automatically resize the iframe of an LTI tool
+# LTI IFrame Autoresizer
+Automatically resizes the iframe of an LTI tool
+
+## Installation
+
+From NPM:
+
+```sh
+npm install lti-iframe-autoresizer
+```
+
+From Yarn:
+
+```sh
+yarn add lti-iframe-autoresizer
+```
+
+## Usage Example
+
+```javascript
+import LtiResizer from 'lti-iframe-autoresizer';
+
+LtiResizer.init();
+```

package.json

@@ -0,0 +1,9 @@
+{
+  "name": "LTI-IFrame-Autoresizer",
+  "version": "1.0.0",
+  "description": "Automatically resize the iframe of an LTI tool",
+  "main": "src/autoresizer.js",
+  "repository": "https://github.com/renaatdemuynck/LTI-IFrame-Autoresizer.git",
+  "author": "Renaat De Muynck <[email protected]>",
+  "license": "MIT"
+}

src/autoresizer.js

@@ -0,0 +1,27 @@
+/**
+ * @file Automatically resize the iframe of an LTI tool
+ * @author Renaat De Muynck <[email protected]>
+ * @license MIT
+ */
+
+import ResizeObserver from 'resize-observer-polyfill';
+import Messenger from 'lti-messaging';
+
+export default {
+
+    init: function () {
+        // Don't run if not in iframe
+        if (window.parent === window) return;
+
+        document.addEventListener('DOMContentLoaded', function () {
+            const resizeObserver = new ResizeObserver(Messenger.frameResize);
+
+            // Request iframe resize when content is loaded
+            Messenger.frameResize();
+
+            // Request iframe resize when body changes size
+            resizeObserver.observe(document.body);
+        });
+    }
+
+};