added sw example

2016-11-14 16:29:04 +01:00 · 2016-11-14 16:29:04 +01:00 · afa05b62a1
commit afa05b62a1
parent 957d650f81
3 changed files with 105 additions and 0 deletions
--- a/Examples/ServiceWorker/index.html
+++ b/Examples/ServiceWorker/index.html
@ -0,0 +1,31 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <!-- quill does not include dist files! We are using the hosted version instead -->
+  <!--link rel="stylesheet" href="../bower_components/quill/dist/quill.snow.css" /-->
+  <link href="https://cdn.quilljs.com/1.0.4/quill.snow.css" rel="stylesheet">
+  <link href="//cdnjs.cloudflare.com/ajax/libs/KaTeX/0.5.1/katex.min.css" rel="stylesheet"> 
+  <link href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.2.0/styles/monokai-sublime.min.css" rel="stylesheet">
+  <style>
+    #quill-container {
+      border: 1px solid gray;
+      box-shadow: 0px 0px 10px gray;
+    }
+  </style>
+</head>
+<body>
+  <div id="quill-container">
+    <div id="quill">
+    </div>
+  </div>
+
+  <script src="//cdnjs.cloudflare.com/ajax/libs/KaTeX/0.5.1/katex.min.js" type="text/javascript"></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.2.0/highlight.min.js" type="text/javascript"></script>
+  <script src="https://cdn.quilljs.com/1.0.4/quill.js"></script>
+  <!-- quill does not include dist files! We are using the hosted version instead (see above)
+  <script src="../bower_components/quill/dist/quill.js"></script>
+  -->
+  <script src="../bower_components/yjs/y.es6"></script>
+  <script src="./index.js"></script>
+</body>
+</html>
--- a/Examples/ServiceWorker/index.js
+++ b/Examples/ServiceWorker/index.js
@ -0,0 +1,51 @@
+/* global Y, Quill */
+
+// initialize a shared object. This function call returns a promise!
+
+Y({
+  db: {
+    name: 'memory'
+  },
+  connector: {
+    name: 'websockets-client',
+    room: 'ServiceWorkerExample'
+  },
+  sourceDir: '/bower_components',
+  share: {
+    richtext: 'Richtext' // y.share.richtext is of type Y.Richtext
+  }
+}).then(function (y) {
+  window.yQuill = y
+
+  // create quill element
+  window.quill = new Quill('#quill', {
+    modules: {
+      formula: true,
+      syntax: true,
+      toolbar: [
+        [{ size: ['small', false, 'large', 'huge'] }],
+        ['bold', 'italic', 'underline'],
+        [{ color: [] }, { background: [] }],    // Snow theme fills in values
+        [{ script: 'sub' }, { script: 'super' }],
+        ['link', 'image'],
+        ['link', 'code-block'],
+        [{list: 'ordered' }]
+      ]
+    },
+    theme: 'snow'
+  });
+  // bind quill to richtext type
+  y.share.richtext.bind(window.quill)
+})
+
+if ('serviceWorker' in navigator) {
+  navigator.serviceWorker.register('./yjs-service-worker.js').then(function(registration) {
+    // Registration was successful
+    console.log('Yjs ServiceWorker registration successful with scope: ', registration.scope)
+    registration.active.postMessage('hi sw')
+    addEventListener('message', function () {console.log.apply(console, ['host received:'].concat(arguments))}, true)
+  }).catch(function(err) {
+    // registration failed :(
+    console.log('Yjs ServiceWorker registration failed: ', err)
+  });
+}
--- a/Examples/ServiceWorker/yjs-service-worker.js
+++ b/Examples/ServiceWorker/yjs-service-worker.js
@ -0,0 +1,23 @@
+importScripts(
+  '/bower_components/yjs/y.js',
+  '/bower_components/y-memory/y-memory.js',
+  '/bower_components/y-indexeddb/y-indexeddb.js',
+  '/bower_components/y-websockets-client/y-websockets-client.js'
+)
+
+Y({
+  db: {
+    name: 'memory'
+  },
+  connector: {
+    name: 'websockets-client',
+    room: 'ServiceWorkerExample',
+    options: { jsonp: false }
+  }
+}).then(function (y) {
+  console.log('y sw init')
+})
+
+addEventListener('message', function () {
+  console.log.apply(console, ['sw received:'].concat(arguments))
+}, true)