Completed adding of customization system and bottom infobar
This commit is contained in:
@@ -48,6 +48,9 @@ define([
|
||||
' display: inline-block;',
|
||||
' width: 100%;',
|
||||
'}',
|
||||
'.' + TOOLBAR_CLS + ' a {',
|
||||
' float: right;',
|
||||
'}',
|
||||
'.' + TOOLBAR_CLS + ' div {',
|
||||
' padding: 0 10px;',
|
||||
' height: 1.5em;',
|
||||
@@ -55,6 +58,15 @@ define([
|
||||
' line-height: 25px;',
|
||||
' height: 22px;',
|
||||
'}',
|
||||
'.' + TOOLBAR_CLS + ' div.rtwysiwyg-back {',
|
||||
' padding: 0;',
|
||||
' font-weight: bold;',
|
||||
' cursor: pointer;',
|
||||
' color: #000;',
|
||||
'}',
|
||||
'.rtwysiwyg-toolbar-leftside div {',
|
||||
' float: left;',
|
||||
'}',
|
||||
'.rtwysiwyg-toolbar-leftside {',
|
||||
' float: left;',
|
||||
'}',
|
||||
@@ -79,6 +91,16 @@ define([
|
||||
return toolbar;
|
||||
};
|
||||
|
||||
var createEscape = function ($container) {
|
||||
var id = uid();
|
||||
$container.append('<div class="rtwysiwyg-back" id="' + id + '">⇐ Back</div>');
|
||||
var $ret = $container.find('#'+id);
|
||||
$ret.on('click', function () {
|
||||
window.location.href = '/';
|
||||
});
|
||||
return $ret[0];
|
||||
};
|
||||
|
||||
var createSpinner = function ($container) {
|
||||
var id = uid();
|
||||
$container.append('<div class="rtwysiwyg-spinner" id="'+id+'"></div>');
|
||||
@@ -97,7 +119,7 @@ define([
|
||||
|
||||
var createUserList = function ($container) {
|
||||
var id = uid();
|
||||
$container.prepend('<div class="' + USER_LIST_CLS + '" id="'+id+'"></div>');
|
||||
$container.append('<div class="' + USER_LIST_CLS + '" id="'+id+'"></div>');
|
||||
return $container.find('#'+id)[0];
|
||||
};
|
||||
|
||||
@@ -137,6 +159,7 @@ define([
|
||||
|
||||
var create = function ($container, myUserName, realtime) {
|
||||
var toolbar = createRealtimeToolbar($container);
|
||||
createEscape(toolbar.find('.rtwysiwyg-toolbar-leftside'));
|
||||
var userListElement = createUserList(toolbar.find('.rtwysiwyg-toolbar-leftside'));
|
||||
var spinner = createSpinner(toolbar.find('.rtwysiwyg-toolbar-rightside'));
|
||||
var lagElement = createLagElement(toolbar.find('.rtwysiwyg-toolbar-rightside'));
|
||||
|
||||
@@ -3,9 +3,24 @@
|
||||
<head>
|
||||
<meta content="text/html; charset=utf-8" http-equiv="content-type"/>
|
||||
<script data-main="main" src="/bower_components/requirejs/require.js"></script>
|
||||
<style>
|
||||
#pad-iframe {
|
||||
position:fixed;
|
||||
top:0px;
|
||||
left:0px;
|
||||
bottom:0px;
|
||||
right:0px;
|
||||
width:100%;
|
||||
height:100%;
|
||||
border:none;
|
||||
margin:0;
|
||||
padding:0;
|
||||
overflow:hidden;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<textarea style="display:none" cols="80" id="editor1" name="editor1" rows="10"></textarea>
|
||||
<iframe id="pad-iframe" src="inner.html"></iframe>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
12
www/pad/inner.html
Normal file
12
www/pad/inner.html
Normal file
@@ -0,0 +1,12 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<meta content="text/html; charset=utf-8" http-equiv="content-type"/>
|
||||
<script src="/bower_components/jquery/dist/jquery.min.js"></script>
|
||||
<script src="/bower_components/ckeditor/ckeditor.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<textarea style="display:none" id="editor1" name="editor1"></textarea>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -4,10 +4,11 @@ define([
|
||||
'/common/messages.js',
|
||||
'/common/crypto.js',
|
||||
'/bower_components/jquery/dist/jquery.min.js',
|
||||
'/bower_components/ckeditor/ckeditor.js',
|
||||
'/customize/pad.js'
|
||||
], function (Config, RTWysiwyg, Messages, Crypto) {
|
||||
var Ckeditor = window.CKEDITOR;
|
||||
var $ = window.jQuery;
|
||||
var ifrw = $('#pad-iframe')[0].contentWindow;
|
||||
var Ckeditor = ifrw.CKEDITOR;
|
||||
|
||||
$(function () {
|
||||
$(window).on('hashchange', function() {
|
||||
@@ -20,17 +21,19 @@ define([
|
||||
var key = Crypto.parseKey(window.location.hash.substring(1));
|
||||
var editor = Ckeditor.replace('editor1', {
|
||||
removeButtons: 'Source,Maximize',
|
||||
// This plugin inserts html crap into the document which is not part of the document
|
||||
// itself and causes problems when it's sent across the wire and reflected back.
|
||||
removePlugins: 'magicline'
|
||||
// magicline plugin inserts html crap into the document which is not part of the
|
||||
// document itself and causes problems when it's sent across the wire and reflected back
|
||||
removePlugins: 'magicline,resize'
|
||||
});
|
||||
editor.on('instanceReady', function () {
|
||||
editor.execCommand('maximize');
|
||||
var ifr = window.ifr = $('iframe')[0];
|
||||
ifr.contentDocument.body.innerHTML = Messages.initialState;
|
||||
|
||||
// (contenteditable) iframe in an iframe
|
||||
ifrw.$('iframe')[0].contentDocument.body.innerHTML = Messages.initialState;
|
||||
|
||||
var rtw =
|
||||
RTWysiwyg.start(Config.websocketURL,
|
||||
RTWysiwyg.start(ifrw,
|
||||
Config.websocketURL,
|
||||
Crypto.rand64(8),
|
||||
key.channel,
|
||||
key.cryptKey);
|
||||
|
||||
@@ -247,10 +247,11 @@ window.ErrorBox = ErrorBox;
|
||||
return out;
|
||||
};
|
||||
|
||||
var start = module.exports.start = function (websocketUrl, userName, channel, cryptKey)
|
||||
var start = module.exports.start =
|
||||
function (window, websocketUrl, userName, channel, cryptKey)
|
||||
{
|
||||
var passwd = 'y';
|
||||
var wysiwygDiv = document.getElementById('cke_1_contents');
|
||||
var wysiwygDiv = window.document.getElementById('cke_1_contents');
|
||||
var ifr = wysiwygDiv.getElementsByTagName('iframe')[0];
|
||||
var doc = ifr.contentWindow.document;
|
||||
var socket = makeWebsocket(websocketUrl);
|
||||
@@ -303,7 +304,7 @@ console.log(new Error().stack);
|
||||
{ transformFunction: Otaml.transform });
|
||||
|
||||
var toolbar = realtime.toolbar =
|
||||
Toolbar.create($('#cke_1_toolbox'), userName, realtime);
|
||||
Toolbar.create(window.$('#cke_1_toolbox'), userName, realtime);
|
||||
|
||||
onEvent = function () {
|
||||
if (isErrorState) { return; }
|
||||
|
||||
@@ -4,26 +4,26 @@
|
||||
<meta content="text/html; charset=utf-8" http-equiv="content-type"/>
|
||||
<script data-main="main" src="/bower_components/requirejs/require.js"></script>
|
||||
<style>
|
||||
iframe {
|
||||
#sheet-iframe {
|
||||
position:fixed;
|
||||
top:0px;
|
||||
left:0px;
|
||||
bottom:0px;
|
||||
right:0px;
|
||||
width:100%;
|
||||
height:100%;
|
||||
height:96%;
|
||||
border:none;
|
||||
margin:0;
|
||||
padding:0;
|
||||
overflow:hidden;
|
||||
}
|
||||
textarea {
|
||||
#sheet-json {
|
||||
display:none;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<iframe src="inner.html"></iframe>
|
||||
<textarea id="sheet-json"></textarea>
|
||||
<iframe id="sheet-iframe" src="inner.html"></iframe>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@@ -5,7 +5,8 @@ define([
|
||||
'/common/toolbar.js',
|
||||
'/common/chainpad.js',
|
||||
'/bower_components/jquery/dist/jquery.min.js',
|
||||
'/common/otaml.js'
|
||||
'/common/otaml.js',
|
||||
'/customize/sheet.js'
|
||||
], function (Config, Messages, Crypto, Toolbar) {
|
||||
var $ = jQuery;
|
||||
var ChainPad = window.ChainPad;
|
||||
|
||||
Reference in New Issue
Block a user