create examples directory with old prototypes

2016-12-30 13:22:01 +01:00
parent 0abf45bdc5
commit ba4df1a22c
23 changed files with 26 additions and 10 deletions
--- a/www/examples/style/index.html
+++ b/www/examples/style/index.html
@@ -0,0 +1,61 @@
+    <!DOCTYPE html>
+    <html>
+    <head>
+        <meta content="text/html; charset=utf-8" http-equiv="content-type"/>
+        <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+        <script data-main="main" src="/bower_components/requirejs/require.js"></script>
+        <style></style>
+    </head>
+    <body>
+        <a id="edit" href="#" target="_blank">Edit this document's style</a>
+
+<h1>HTML Ipsum Presents</h1>
+           
+<p><strong>Pellentesque habitant morbi tristique</strong> senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. <em>Aenean ultricies mi vitae est.</em> Mauris placerat eleifend leo. Quisque sit amet est et sapien ullamcorper pharetra. Vestibulum erat wisi, condimentum sed, <code>commodo vitae</code>, ornare sit amet, wisi. Aenean fermentum, elit eget tincidunt condimentum, eros ipsum rutrum orci, sagittis tempus lacus enim ac dui. <a href="#">Donec non enim</a> in turpis pulvinar facilisis. Ut felis.</p>
+
+<h2>Header Level 2</h2>
+           
+<ol>
+   <li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li>
+   <li>Aliquam tincidunt mauris eu risus.</li>
+</ol>
+
+<blockquote><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus magna. Cras in mi at felis aliquet congue. Ut a est eget ligula molestie gravida. Curabitur massa. Donec eleifend, libero at sagittis mollis, tellus est malesuada tellus, at luctus turpis elit sit amet quam. Vivamus pretium ornare est.</p></blockquote>
+
+<h3>Header Level 3</h3>
+
+<ul>
+   <li>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</li>
+   <li>Aliquam tincidunt mauris eu risus.</li>
+</ul>
+
+<pre><code>
+#header h1 a { 
+    display: block; 
+    width: 300px; 
+    height: 80px; 
+}
+</code></pre>
+
+<table>
+    <thead>
+        <tr>
+            <th>th 1</th>
+            <th>th 2</th>
+        </tr>
+    </thead>
+    <tbody>
+        <tr>
+            <td>one</td>
+            <td>two</td>
+        </tr>
+        <tr>
+            <td>three</td>
+            <td>four</td>
+        </tr>
+    </tbody>
+</table>
+
+</body>
+</html>
+
--- a/www/examples/style/main.js
+++ b/www/examples/style/main.js
@@ -0,0 +1,78 @@
+define([
+    '/api/config?cb=' + Math.random().toString(16).substring(2),
+    '/bower_components/chainpad-netflux/chainpad-netflux.js',
+    '/bower_components/chainpad-crypto/crypto.js',
+    '/bower_components/textpatcher/TextPatcher.amd.js',
+    '/common/cryptpad-common.js',
+    '/bower_components/jquery/dist/jquery.min.js',
+], function (Config, Realtime, Crypto, TextPatcher, Cryptpad) {
+    // TODO consider adding support for less.js
+    var $ = window.jQuery;
+
+    var $style = $('style').first(),
+        $edit = $('#edit');
+
+    var module = window.APP = {};
+
+    var secret = Cryptpad.getSecrets();
+    var config = {
+        websocketURL: Config.websocketURL,
+        channel: secret.channel,
+        crypto: Crypto.createEncryptor(secret.key),
+    };
+
+    var userName = module.userName = config.userName = Crypto.rand64(8);
+
+    var lazyDraw = (function () {
+        var to,
+            delay = 500;
+        return function (content) {
+            if (to) { clearTimeout(to); }
+            to = setTimeout(function () {
+                $style.text(content);
+            },delay);
+        };
+    }());
+
+    var draw = function (content) { lazyDraw(content); };
+
+    var initializing = true;
+
+    var onInit = config.onInit = function (info) {
+        window.location.hash = info.channel + secret.key;
+        var realtime = module.realtime = info.realtime;
+        module.patchText = TextPatcher.create({
+            realtime: realtime,
+            logging: true,
+        });
+
+        $(window).on('hashchange', function() {
+            window.location.reload();
+        });
+    };
+
+    var onReady = config.onReady = function (info) {
+        var userDoc = module.realtime.getUserDoc();
+        draw(userDoc);
+        console.log("Ready");
+        initializing = false;
+    };
+
+    var onRemote = config.onRemote = function () {
+        draw(module.realtime.getUserDoc());
+    };
+
+    var onAbort = config.onAbort = function (info) {
+        // notify the user of the abort
+        window.alert("Network Connection Lost");
+    };
+
+    var onLocal = config.onLocal = function () {
+        // nope
+    };
+
+
+    $edit.attr('href', '/examples/text/'+ window.location.hash);
+
+    var rt = Realtime.start(config);
+});