8 changed files with 340 additions and 0 deletions
Split View
Diff Options
-
40www/worker/app-worker.less
-
38www/worker/index.html
-
16www/worker/inner.html
-
68www/worker/inner.js
-
43www/worker/main.js
-
7www/worker/messages.js
-
80www/worker/todo.js
-
48www/worker/worker.js
@ -0,0 +1,40 @@ |
|||
@import (once) "../../customize/src/less2/include/browser.less"; |
|||
@import (once) "../../customize/src/less2/include/toolbar.less"; |
|||
@import (once) "../../customize/src/less2/include/markdown.less"; |
|||
@import (once) '../../customize/src/less2/include/fileupload.less'; |
|||
@import (once) '../../customize/src/less2/include/alertify.less'; |
|||
//@import (once) '../../customize/src/less/mixins.less'; |
|||
//@import (once) '../../customize/src/less/variables.less"; |
|||
|
|||
@import (once) '../../customize/src/less2/include/avatar.less'; |
|||
|
|||
|
|||
.toolbar_main(); |
|||
.fileupload_main(); |
|||
.alertify_main(); |
|||
|
|||
// body |
|||
&.cp-app-worker { |
|||
display: flex; |
|||
flex-flow: column; |
|||
|
|||
#cp-toolbar { |
|||
display: flex; // We need this to remove a 3px border at the bottom of the toolbar |
|||
} |
|||
|
|||
.cp-cryptpad-toolbar { |
|||
padding: 0px; |
|||
display: inline-block; |
|||
} |
|||
|
|||
#cp-app-worker-container { |
|||
display: flex; |
|||
flex: 1; |
|||
flex-flow: column; |
|||
padding: 20px; |
|||
align-items: center; |
|||
background-color: lighten(@colortheme_todo-bg, 15%); |
|||
min-height: 0; |
|||
} |
|||
} |
|||
|
|||
@ -0,0 +1,38 @@ |
|||
<!DOCTYPE html> |
|||
<html> |
|||
<head> |
|||
<title>CryptPad</title> |
|||
<meta content="text/html; charset=utf-8" http-equiv="content-type"/> |
|||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|||
<meta name="referrer" content="no-referrer" /> |
|||
<script async data-bootload="main.js" data-main="/common/boot.js?ver=1.0" src="/bower_components/requirejs/require.js?ver=2.3.5"></script> |
|||
<style> |
|||
html, body { |
|||
margin: 0px; |
|||
padding: 0px; |
|||
} |
|||
#sbox-iframe { |
|||
position:fixed; |
|||
top:0px; |
|||
left:0px; |
|||
bottom:0px; |
|||
right:0px; |
|||
width:100%; |
|||
height:100%; |
|||
border:none; |
|||
margin:0; |
|||
padding:0; |
|||
overflow:hidden; |
|||
} |
|||
#sbox-filePicker-iframe { |
|||
position: fixed; |
|||
top:0; left:0; |
|||
bottom:0; right:0; |
|||
width:100%; |
|||
height: 100%; |
|||
border: 0; |
|||
} |
|||
</style> |
|||
</head> |
|||
<body> |
|||
<iframe id="sbox-iframe"> |
|||
@ -0,0 +1,16 @@ |
|||
<!DOCTYPE html> |
|||
<html class="cp-app-noscroll"> |
|||
<head> |
|||
<meta content="text/html; charset=utf-8" http-equiv="content-type"/> |
|||
<script async data-bootload="/worker/inner.js" data-main="/common/sframe-boot.js?ver=1.4" src="/bower_components/requirejs/require.js?ver=2.3.5"></script> |
|||
<style> |
|||
.loading-hidden { display: none; } |
|||
</style> |
|||
</head> |
|||
<body class="cp-app-worker"> |
|||
<div id="cp-toolbar" class="cp-toolbar-container"></div> |
|||
<div id="cp-app-worker-container"> |
|||
Hello world! |
|||
</div> |
|||
</body> |
|||
|
|||
@ -0,0 +1,68 @@ |
|||
define([ |
|||
'jquery', |
|||
'/common/toolbar3.js', |
|||
'/common/cryptpad-common.js', |
|||
'/bower_components/nthen/index.js', |
|||
'/common/sframe-common.js', |
|||
|
|||
'css!/bower_components/bootstrap/dist/css/bootstrap.min.css', |
|||
'less!/bower_components/components-font-awesome/css/font-awesome.min.css', |
|||
'less!/customize/src/less2/main.less', |
|||
], function ( |
|||
$, |
|||
Toolbar, |
|||
Cryptpad, |
|||
nThen, |
|||
SFCommon, |
|||
) |
|||
{ |
|||
var Messages = Cryptpad.Messages; |
|||
var APP = window.APP = {}; |
|||
|
|||
var common; |
|||
var sFrameChan; |
|||
nThen(function (waitFor) { |
|||
$(waitFor(Cryptpad.addLoadingScreen)); |
|||
SFCommon.create(waitFor(function (c) { APP.common = common = c; })); |
|||
}).nThen(function (waitFor) { |
|||
sFrameChan = common.getSframeChannel(); |
|||
sFrameChan.onReady(waitFor()); |
|||
}).nThen(function (/*waitFor*/) { |
|||
var $body = $('body'); |
|||
var $container = $('#cp-app-worker-container'); |
|||
var $bar = $('.cp-toolbar-container'); |
|||
|
|||
var displayed = ['useradmin', 'newpad', 'limit', 'pageTitle']; |
|||
var configTb = { |
|||
displayed: displayed, |
|||
common: Cryptpad, |
|||
sfCommon: common, |
|||
$container: $bar, |
|||
pageTitle: 'Test WebWorkers', |
|||
metadataMgr: common.getMetadataMgr(), |
|||
}; |
|||
APP.toolbar = Toolbar.create(configTb); |
|||
APP.toolbar.$rightside.hide(); |
|||
|
|||
Cryptpad.removeLoadingScreen(); |
|||
if (!window.Worker) { |
|||
return void $container.text("WebWorkers not supported by your browser"); |
|||
} |
|||
console.log('ready'); |
|||
var myWorker = new SharedWorker('/worker/worker.js'); |
|||
console.log(myWorker); |
|||
console.log(myWorker.port); |
|||
myWorker.onerror = function (e) { console.error(e); }; |
|||
myWorker.port.onmessage = function (e) { |
|||
var data = e.data; |
|||
if (data && data.state === "READY") { |
|||
$container.append('<hr>worker.js ready'); |
|||
myWorker.port.postMessage(["Hello worker"]); |
|||
return; |
|||
} |
|||
$container.append('<br>'); |
|||
$container.append(e.data); |
|||
}; |
|||
$container.append('<hr>inner.js ready'); |
|||
}); |
|||
}); |
|||
@ -0,0 +1,43 @@ |
|||
// Load #1, load as little as possible because we are in a race to get the loading screen up.
|
|||
define([ |
|||
'/bower_components/nthen/index.js', |
|||
'/api/config', |
|||
'jquery', |
|||
'/common/requireconfig.js', |
|||
'/common/sframe-common-outer.js' |
|||
], function (nThen, ApiConfig, $, RequireConfig, SFCommonO) { |
|||
var requireConfig = RequireConfig(); |
|||
|
|||
// Loaded in load #2
|
|||
nThen(function (waitFor) { |
|||
$(waitFor()); |
|||
}).nThen(function (waitFor) { |
|||
var req = { |
|||
cfg: requireConfig, |
|||
req: [ '/common/loading.js' ], |
|||
pfx: window.location.origin |
|||
}; |
|||
window.rc = requireConfig; |
|||
window.apiconf = ApiConfig; |
|||
$('#sbox-iframe').attr('src', |
|||
ApiConfig.httpSafeOrigin + '/worker/inner.html?' + requireConfig.urlArgs + |
|||
'#' + encodeURIComponent(JSON.stringify(req))); |
|||
|
|||
// This is a cheap trick to avoid loading sframe-channel in parallel with the
|
|||
// loading screen setup.
|
|||
var done = waitFor(); |
|||
var onMsg = function (msg) { |
|||
var data = JSON.parse(msg.data); |
|||
if (data.q !== 'READY') { return; } |
|||
window.removeEventListener('message', onMsg); |
|||
var _done = done; |
|||
done = function () { }; |
|||
_done(); |
|||
}; |
|||
window.addEventListener('message', onMsg); |
|||
}).nThen(function (/*waitFor*/) { |
|||
SFCommonO.start({ |
|||
noRealtime: true, |
|||
}); |
|||
}); |
|||
}); |
|||
@ -0,0 +1,7 @@ |
|||
define(function () { |
|||
var out = {}; |
|||
|
|||
out.test = "Key from /worker/messages.js"; |
|||
|
|||
return out; |
|||
}); |
|||
@ -0,0 +1,80 @@ |
|||
define([ |
|||
|
|||
], function () { |
|||
var Todo = {}; |
|||
|
|||
/* data model |
|||
{ |
|||
"order": [ |
|||
"123456789abcdef0", |
|||
"23456789abcdef01", |
|||
"0123456789abcedf" |
|||
], |
|||
"data": { |
|||
"0123456789abcedf": { |
|||
"state": 0, // used to sort completed elements
|
|||
"task": "pewpewpew", |
|||
"ctime": +new Date(), // used to display chronologically
|
|||
"mtime": +new Date(), // used to display recent actions
|
|||
// "deadline": +new Date() + 1000 * 60 * 60 * 24 * 7
|
|||
}, |
|||
"123456789abcdef0": {}, |
|||
"23456789abcdef01": {} |
|||
} |
|||
} |
|||
*/ |
|||
|
|||
var val = function (proxy, id, k, v) { |
|||
var el = proxy.data[id]; |
|||
if (!el) { |
|||
throw new Error('expected an element'); |
|||
} |
|||
if (typeof(v) === 'function') { el[k] = v(el[k]); } |
|||
else { el[k] = v; } |
|||
return el[k]; |
|||
}; |
|||
|
|||
var initialize = function (proxy) { |
|||
// run migration
|
|||
if (typeof(proxy.data) !== 'object') { proxy.data = {}; } |
|||
if (!Array.isArray(proxy.order)) { proxy.order = []; } |
|||
if (typeof(proxy.type) !== 'string') { proxy.type = 'todo'; } |
|||
}; |
|||
|
|||
/* add (id, obj) push id to order, add object to data */ |
|||
var add = function (proxy, id, obj) { |
|||
if (!Array.isArray(proxy.order)) { |
|||
throw new Error('expected an array'); |
|||
} |
|||
proxy.order.unshift(id); |
|||
proxy.data[id] = obj; |
|||
}; |
|||
|
|||
/* delete (id) remove id from order, delete id from data */ |
|||
var remove = function (proxy, id) { |
|||
if (Array.isArray(proxy.order)) { |
|||
var i = proxy.order.indexOf(id); |
|||
proxy.order.splice(i, 1); |
|||
} |
|||
if (proxy.data[id]) { delete proxy.data[id]; } |
|||
}; |
|||
|
|||
Todo.init = function (proxy) { |
|||
var api = {}; |
|||
initialize(proxy); |
|||
|
|||
api.val = function (id, k, v) { |
|||
return val(proxy, id, k, v); |
|||
}; |
|||
api.add = function (id, obj) { |
|||
return add(proxy, id, obj); |
|||
}; |
|||
api.remove = function (id) { |
|||
return remove(proxy, id); |
|||
}; |
|||
|
|||
return api; |
|||
}; |
|||
|
|||
return Todo; |
|||
}); |
|||
@ -0,0 +1,48 @@ |
|||
var window = self; |
|||
var localStorage = { |
|||
setItem: function (k, v) { localStorage[k] = v; }, |
|||
getItem: function (k) { return localStorage[k]; } |
|||
}; |
|||
|
|||
importScripts('/bower_components/requirejs/require.js'); |
|||
|
|||
require.config({ |
|||
// fix up locations so that relative urls work.
|
|||
baseUrl: '/', |
|||
paths: { |
|||
// jquery declares itself as literally "jquery" so it cannot be pulled by path :(
|
|||
"jquery": "/bower_components/jquery/dist/jquery.min", |
|||
// json.sortify same
|
|||
"json.sortify": "/bower_components/json.sortify/dist/JSON.sortify", |
|||
//"pdfjs-dist/build/pdf": "/bower_components/pdfjs-dist/build/pdf",
|
|||
//"pdfjs-dist/build/pdf.worker": "/bower_components/pdfjs-dist/build/pdf.worker"
|
|||
cm: '/bower_components/codemirror' |
|||
}, |
|||
map: { |
|||
'*': { |
|||
'css': '/bower_components/require-css/css.js', |
|||
'less': '/common/RequireLess.js', |
|||
} |
|||
} |
|||
}); |
|||
|
|||
var i = 0; |
|||
|
|||
onconnect = function(e) { |
|||
console.log(e); |
|||
var port = e.ports[0]; |
|||
console.log('here'); |
|||
require([ |
|||
'/customize/messages.js', |
|||
], function (Messages) { |
|||
console.log(Messages); |
|||
var n = i; |
|||
port.postMessage({state: 'READY'}); |
|||
port.onmessage = function (e) { |
|||
console.log('worker received'); |
|||
console.log(e.data); |
|||
port.postMessage('hello CryptPad'+n+', ' + Messages.test); |
|||
}; |
|||
i++; |
|||
}); |
|||
}; |
|||
Write
Preview
Loading…
Cancel
Save