web/cryptpad
2
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Use CodeMirror in /slide #2

Browse Source 
Fix title errors in the slide app caused by the present mode
This commit is contained in:
yflory 2016-10-03 14:21:39 +02:00
parent 8c33218ceb
commit 391728ee6d
9 changed files with 98 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
customize.dist/messages.js
View File

@ -79,7 +79,7 @@ define(['/customize/languageSelector.js',
'---', '---',
'\n', '\n',
'# How to use\n', '# How to use\n',
'1. Write your slides content using the markdown syntax\n', '1. Write your slides content using markdown syntax\n',
'2. Separate your slides with ---\n', '2. Separate your slides with ---\n',
'3. Click on the "Play" button to see the result' '3. Click on the "Play" button to see the result'
].join(''); ].join('');

2
customize.dist/translations/messages.fr.js
View File

@ -67,6 +67,8 @@ define(function () {
out.presentButton = 'PRÉSENTER'; out.presentButton = 'PRÉSENTER';
out.presentButtonTitle = "Entrer en mode présentation"; out.presentButtonTitle = "Entrer en mode présentation";
out.presentSuccess = 'Appuyer sur Échap pour quitter le mode présentation'; out.presentSuccess = 'Appuyer sur Échap pour quitter le mode présentation';
out.sourceButton = 'VOIR LA SOURCE';
out.sourceButtonTitle = "Quitter le mode présentation";
out.commitButton = 'VALIDER'; out.commitButton = 'VALIDER';

2
customize.dist/translations/messages.js
View File

@ -68,6 +68,8 @@ define(function () {
out.presentButton = 'PRESENT'; out.presentButton = 'PRESENT';
out.presentButtonTitle = "Enter presentation mode"; out.presentButtonTitle = "Enter presentation mode";
out.presentSuccess = 'Hit ESC to exit presentation mode'; out.presentSuccess = 'Hit ESC to exit presentation mode';
out.sourceButton = 'VIEW SOURCE';
out.sourceButtonTitle = "Leave presentation mode";
out.commitButton = 'COMMIT'; out.commitButton = 'COMMIT';

6
www/code/main.js
View File

@ -9,8 +9,8 @@ define([
'json.sortify', 'json.sortify',
'/bower_components/chainpad-json-validator/json-ot.js', '/bower_components/chainpad-json-validator/json-ot.js',
'/common/cryptpad-common.js', '/common/cryptpad-common.js',
'/code/modes.js', '/common/modes.js',
'/code/themes.js', '/common/themes.js',
'/common/visible.js', '/common/visible.js',
'/common/notify.js', '/common/notify.js',
'/bower_components/file-saver/FileSaver.min.js', '/bower_components/file-saver/FileSaver.min.js',
@ -80,7 +80,7 @@ define([
editor.setValue(Messages.codeInitialState); // HERE editor.setValue(Messages.codeInitialState); // HERE
var setTheme = module.setTheme = (function () { var setTheme = module.setTheme = (function () {
var path = './theme/'; var path = '/common/theme/';
var $head = $(ifrw.document.head); var $head = $(ifrw.document.head);

9
www/common/cryptpad-common.js
View File

@ -661,7 +661,14 @@ define([
case 'present': case 'present':
button = $('<button>', { button = $('<button>', {
title: Messages.presentButton + '\n' + Messages.presentButtonTitle, title: Messages.presentButton + '\n' + Messages.presentButtonTitle,
'class': "fa fa-play-circle", 'class': "fa fa-play-circle cryptpad-present-button", // class used in slide.js
style: 'font:'+size+' FontAwesome'
});
break;
case 'source':
button = $('<button>', {
title: Messages.sourceButton + '\n' + Messages.sourceButtonTitle,
'class': "fa fa-stop-circle cryptpad-source-button", // class used in slide.js
style: 'font:'+size+' FontAwesome' style: 'font:'+size+' FontAwesome'
}); });
break; break;

4
www/slide/index.html
View File

@ -32,6 +32,10 @@
padding:0; padding:0;
overflow:hidden; overflow:hidden;
} }
#pad-iframe.fullscreen {
top: 0px;
height: 100% !important;
}
</style> </style>
</head> </head>
<body> <body>

2
www/slide/inner.html
View File

@ -72,7 +72,7 @@
#modal.shown { #modal.shown {
display: block; display: block;
position: fixed; position: fixed;
top: 25px; top: 0px;
left: 0px; left: 0px;
z-index: 100; z-index: 100;
background-color: black; background-color: black;

70
www/slide/main.js
View File

@ -9,8 +9,8 @@ define([
'json.sortify', 'json.sortify',
'/bower_components/chainpad-json-validator/json-ot.js', '/bower_components/chainpad-json-validator/json-ot.js',
'/common/cryptpad-common.js', '/common/cryptpad-common.js',
'/code/modes.js', '/common/modes.js',
'/code/themes.js', '/common/themes.js',
'/common/visible.js', '/common/visible.js',
'/common/notify.js', '/common/notify.js',
'/slide/slide.js', '/slide/slide.js',
@ -38,15 +38,26 @@ define([
return JSONSortify(obj); return JSONSortify(obj);
}; };
var setTabTitle = function () {
var slideNumber = '';
if (Slide.index && Slide.content.length) {
slideNumber = ' (' + Slide.index + '/' + Slide.content.length + ')';
}
document.title = APP.title + slideNumber;
};
$(function () { $(function () {
var toolbar; var toolbar;
var secret = Cryptpad.getSecrets(); var secret = Cryptpad.getSecrets();
var readOnly = secret.keys && !secret.keys.editKeyStr; var readOnly = secret.keys && !secret.keys.editKeyStr;
Slide.readOnly = readOnly;
if (!secret.keys) { if (!secret.keys) {
secret.keys = secret.key; secret.keys = secret.key;
} }
var presentMode = Slide.isPresentURL();
var andThen = function (CMeditor) { var andThen = function (CMeditor) {
var CodeMirror = module.CodeMirror = CMeditor; var CodeMirror = module.CodeMirror = CMeditor;
CodeMirror.modeURL = "/bower_components/codemirror/mode/%N/%N.js"; CodeMirror.modeURL = "/bower_components/codemirror/mode/%N/%N.js";
@ -85,7 +96,7 @@ define([
editor.setValue(Messages.slideInitialState); // HERE editor.setValue(Messages.slideInitialState); // HERE
var setTheme = module.setTheme = (function () { var setTheme = module.setTheme = (function () {
var path = './theme/'; var path = '/common/theme/';
var $head = $(ifrw.document.head); var $head = $(ifrw.document.head);
@ -116,7 +127,7 @@ define([
var $modal = $pad.contents().find('#modal'); var $modal = $pad.contents().find('#modal');
var $content = $pad.contents().find('#content'); var $content = $pad.contents().find('#content');
Slide.setModal($modal, $content); Slide.setModal($modal, $content, $pad);
var enterPresentationMode = function (shouldLog) { var enterPresentationMode = function (shouldLog) {
Slide.show(true, $textarea.val()); Slide.show(true, $textarea.val());
@ -124,9 +135,12 @@ define([
Cryptpad.log(Messages.presentSuccess); Cryptpad.log(Messages.presentSuccess);
} }
}; };
var leavePresentationMode = function () {
Slide.show(false);
};
if (readOnly) { if (presentMode) {
enterPresentationMode(false); enterPresentationMode(true);
} }
var setEditable = module.setEditable = function (bool) { var setEditable = module.setEditable = function (bool) {
@ -180,7 +194,7 @@ define([
// append the userlist to the hyperjson structure // append the userlist to the hyperjson structure
obj.metadata = { obj.metadata = {
users: userList, users: userList,
title: document.title title: APP.title
}; };
// stringify the json and send it into chainpad // stringify the json and send it into chainpad
@ -244,10 +258,10 @@ define([
var parsed = Cryptpad.parsePadUrl(window.location.href); var parsed = Cryptpad.parsePadUrl(window.location.href);
var name = Cryptpad.getDefaultName(parsed, []); var name = Cryptpad.getDefaultName(parsed, []);
if (document.title.slice(0, name.length) === name) { if (APP.title.slice(0, name.length) === name) {
return getHeadingText() || document.title; return getHeadingText() || APP.title;
} else { } else {
return document.title || getHeadingText() || name; return APP.title || getHeadingText() || name;
} }
}; };
@ -358,7 +372,8 @@ define([
console.log(err); console.log(err);
return; return;
} }
document.title = APP.title = title; APP.title = title;
setTabTitle();
onLocal(); onLocal();
}); });
}); });
@ -379,7 +394,8 @@ define([
return; return;
} }
var parsed = Cryptpad.parsePadUrl(href); var parsed = Cryptpad.parsePadUrl(href);
document.title = APP.title = Cryptpad.getDefaultName(parsed, []); APP.title = Cryptpad.getDefaultName(parsed, []);
setTabTitle();
}); });
}); });
}); });
@ -390,7 +406,7 @@ define([
var $links = Cryptpad.createButton('readonly', true) var $links = Cryptpad.createButton('readonly', true)
.click(function () { .click(function () {
var baseUrl = window.location.origin + window.location.pathname + '#'; var baseUrl = window.location.origin + window.location.pathname + '#';
var url = baseUrl + viewHash; var url = baseUrl + viewHash + '/present';
var content = '<b>' + Messages.readonlyUrl + '</b><br><a href="' + url + '" target="_blank" rel="noopener noreferrer">' + url + '</a><br>'; var content = '<b>' + Messages.readonlyUrl + '</b><br><a href="' + url + '" target="_blank" rel="noopener noreferrer">' + url + '</a><br>';
Cryptpad.alert(content); Cryptpad.alert(content);
}); });
@ -401,8 +417,18 @@ define([
.click(function () { .click(function () {
enterPresentationMode(true); enterPresentationMode(true);
}); });
if (presentMode) {
$present.hide();
}
$rightside.append($present); $rightside.append($present);
var $leavePresent = Cryptpad.createButton('source', true)
.click(leavePresentationMode);
if (!presentMode) {
$leavePresent.hide();
}
$rightside.append($leavePresent);
$language = $('<span>', { $language = $('<span>', {
'style': "margin-right: 10px;" 'style': "margin-right: 10px;"
}).text(Messages.type.slide + " (Markdown)"); }).text(Messages.type.slide + " (Markdown)");
@ -441,12 +467,14 @@ define([
}); });
}; };
if (!readOnly) {
configureTheme(); configureTheme();
if (presentMode) {
$('#top-bar').hide();
} }
// set the hash // set the hash
if (!readOnly) { if (!window.location.hash || window.location.hash === '#') {
window.location.hash = editHash; window.location.hash = editHash;
} }
@ -468,15 +496,17 @@ define([
}; };
var updateTitle = function (newTitle) { var updateTitle = function (newTitle) {
if (newTitle === document.title) { return; } if (newTitle === APP.title) { return; }
// Change the title now, and set it back to the old value if there is an error // Change the title now, and set it back to the old value if there is an error
var oldTitle = document.title; var oldTitle = APP.title;
document.title = newTitle; APP.title = newTitle;
setTabTitle();
Cryptpad.setPadTitle(newTitle, function (err, data) { Cryptpad.setPadTitle(newTitle, function (err, data) {
if (err) { if (err) {
console.log("Couldn't set pad title"); console.log("Couldn't set pad title");
console.error(err); console.error(err);
document.title = oldTitle; APP.title = oldTitle;
setTabTitle();
return; return;
} }
}); });
@ -655,7 +685,7 @@ define([
content: localDoc, content: localDoc,
metadata: { metadata: {
users: userList, users: userList,
title: document.title title: APP.title
}, },
highlightMode: highlightMode, highlightMode: highlightMode,
}; };

26
www/slide/slide.js
View File

@ -17,9 +17,11 @@ define([
var ifrw = $('#pad-iframe')[0].contentWindow; var ifrw = $('#pad-iframe')[0].contentWindow;
var $modal; var $modal;
var $content; var $content;
Slide.setModal = function ($m, $c) { var $pad;
Slide.setModal = function ($m, $c, $p) {
$modal = Slide.$modal = $m; $modal = Slide.$modal = $m;
$content = Slide.$content = $c; $content = Slide.$content = $c;
$pad = Slide.$pad = $p;
}; };
Slide.onChange = function (f) { Slide.onChange = function (f) {
@ -110,16 +112,36 @@ define([
change(Slide.lastIndex, Slide.index); change(Slide.lastIndex, Slide.index);
}; };
var isPresentURL = Slide.isPresentURL = function () {
var hash = window.location.hash;
// Present mode has /present at the end of the hash
var urlLastFragment = hash.slice(hash.lastIndexOf('/')+1);
return urlLastFragment === "present";
};
var show = Slide.show = function (bool, content) { var show = Slide.show = function (bool, content) {
Slide.shown = bool; Slide.shown = bool;
if (bool) { if (bool) {
Slide.update(content); Slide.update(content);
Slide.draw(Slide.index); Slide.draw(Slide.index);
$modal.addClass('shown'); $modal.addClass('shown');
$(ifrw).focus();
change(null, Slide.index); change(null, Slide.index);
if (!isPresentURL()) {
window.location.hash += '/present';
}
$pad.contents().find('.cryptpad-present-button').hide();
$pad.contents().find('.cryptpad-source-button').show();
$pad.addClass('fullscreen');
$('.top-bar').hide();
return; return;
} }
window.location.hash = window.location.hash.replace(/\/present$/, '');
change(Slide.index, null); change(Slide.index, null);
$pad.contents().find('.cryptpad-present-button').show();
$pad.contents().find('.cryptpad-source-button').hide();
$pad.removeClass('fullscreen');
$('.top-bar').show();
$modal.removeClass('shown'); $modal.removeClass('shown');
}; };
@ -161,9 +183,7 @@ define([
Slide.right(); Slide.right();
break; break;
case 27: // esc case 27: // esc
if (!Slide.readOnly) {
show(false); show(false);
}
break; break;
default: default:
console.log(e.which); console.log(e.which);