You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
262 lines
9.8 KiB
HTML
262 lines
9.8 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<!--<title>Sample - CKEditor</title>-->
|
|
<meta content="text/html; charset=utf-8" http-equiv="content-type"/>
|
|
<link rel="stylesheet" type="text/css" href="customize/index.css" />
|
|
<style>
|
|
#whatis {
|
|
padding-left: 15%;
|
|
padding-right: 15%;
|
|
font-size: medium;
|
|
padding-bottom: 1em;
|
|
}
|
|
.create {
|
|
background-color: rgb(77, 146, 68);
|
|
background-image: linear-gradient(rgb(39, 100, 0) 0%, rgb(77, 146, 68) 100%);
|
|
border-bottom-color: rgb(77, 146, 68);
|
|
color: rgb(243, 243, 243);
|
|
font-weight:bold;
|
|
font-size:large;
|
|
margin-right: 5px;
|
|
margin-left: 5px;
|
|
}
|
|
.buttons {
|
|
margin-bottom: 50px;
|
|
margin-top: 20px;
|
|
}
|
|
.button {
|
|
padding: 2px 6px 2px 6px;
|
|
border-top: 1px solid #CCCCCC;
|
|
border-right: 1px solid #333333;
|
|
border-bottom: 1px solid #333333;
|
|
border-left: 1px solid #CCCCCC;
|
|
}
|
|
|
|
table.scroll {
|
|
/* width: 100%; */ /* Optional */
|
|
/* border-collapse: collapse; */
|
|
border-spacing: 0;
|
|
border: 2px solid black;
|
|
margin-top: 20px;
|
|
margin-bottom: 20px;
|
|
}
|
|
|
|
table.scroll tbody,
|
|
table.scroll thead { display: block; }
|
|
|
|
table.scroll tbody { }
|
|
|
|
tbody { border-top: 2px solid black; }
|
|
|
|
tbody td {
|
|
/* width: 20%; */ /* Optional */
|
|
border-right: 1px solid black;
|
|
/* white-space: nowrap; */
|
|
padding-top: 0px;
|
|
padding-bottom: 0px;
|
|
padding-right: 20px;
|
|
}
|
|
|
|
tbody td:last-child, thead th:last-child {
|
|
border-right: none;
|
|
}
|
|
tbody tr:nth-child(odd) {
|
|
background-color: #ddd;
|
|
}
|
|
tbody tr th {
|
|
box-sizing: border-box;
|
|
border: 1px solid black;
|
|
}
|
|
tbody tr th:last-child {
|
|
border-right: 0px;
|
|
}
|
|
tbody tr th:first-of-type {
|
|
border-left: 0px;
|
|
}
|
|
|
|
.remove {
|
|
cursor: pointer;
|
|
color: #ab0000;
|
|
}
|
|
</style>
|
|
<script src="/bower_components/requirejs/require.js"></script>
|
|
<!-- Piwik -->
|
|
<script type="text/javascript">
|
|
if (window.location.href.indexOf('cryptpad.fr') !== -1) {
|
|
// This piwik is only relevant to cryptpad.fr
|
|
var _paq = _paq || [];
|
|
_paq.push(['trackPageView']);
|
|
_paq.push(['enableLinkTracking']);
|
|
(function() {
|
|
var u="//piwik.xwiki.com/";
|
|
_paq.push(['setTrackerUrl', u+'piwik.php']);
|
|
_paq.push(['setSiteId', 12]);
|
|
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
|
|
g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);
|
|
})();
|
|
}
|
|
</script>
|
|
<!-- End Piwik Code -->
|
|
</head>
|
|
<body>
|
|
<a href="https://github.com/xwiki-labs/cryptpad"><img style="position: absolute; top: 0; left: 0; border: 0;" src="https://camo.githubusercontent.com/121cd7cbdc3e4855075ea8b558508b91ac463ac2/68747470733a2f2f73332e616d617a6f6e6177732e636f6d2f6769746875622f726962626f6e732f666f726b6d655f6c6566745f677265656e5f3030373230302e706e67" alt="Fork me on GitHub" data-canonical-src="https://s3.amazonaws.com/github/ribbons/forkme_left_green_007200.png"></a>
|
|
<div id="whatis">
|
|
<center>
|
|
<img class="imgcenter" src="/customize/cryptofist_small.png" />
|
|
<h1>Unity is Strength - Collaboration is Key</h1>
|
|
|
|
<h2>With the support of</h2>
|
|
|
|
<img class="imgcenter" src="/customize/openpaas.png" />
|
|
|
|
</center>
|
|
<p>CryptPad is the <strong>zero knowledge</strong> realtime collaborative editor.
|
|
Encryption carried out in your web browser protects the data from the server, the cloud,
|
|
and the NSA.
|
|
The secret encryption key is stored in the URL <a href="https://en.wikipedia.org/wiki/Fragment_identifier">fragment identifier</a> which is never sent to the server but is available to javascript so by sharing the URL, you give authorization to others who want to participate.</p>
|
|
|
|
<p>This project uses the <a href="http://ckeditor.com/">CKEditor</a> Visual Editor
|
|
the <a href="https://github.com/xwiki-contrib/chainpad">ChainPad</a> realtime engine.</p>
|
|
|
|
</code></pre><h2 id="howitworks">How It Works</h2>
|
|
<p>CryptPad uses a variant of the
|
|
<a href="https://en.wikipedia.org/wiki/Operational_transformation">Operational transformation</a>
|
|
algorithm which is able to find distributed consensus using a Nakamoto Blockchain, a construct
|
|
popularized by <a href="https://en.wikipedia.org/wiki/Bitcoin">Bitcoin</a>. This way the
|
|
algorithm can avoid the need for a central server to resolve Operational Transform Edit
|
|
Conflicts and without the need for resolving conflicts, the server can be kept unaware of the
|
|
content which is being edited on the pad.</p>
|
|
|
|
<p><strong>NOTE</strong> Collaborative documents will be removed after 30 days of inactivity</p>
|
|
<center>
|
|
<noscript>
|
|
<p>
|
|
<strong>OOPS</strong> In order to do encryption in your browser, Javascript is really
|
|
<strong>really</strong> required.
|
|
</p>
|
|
</noscript>
|
|
<script>
|
|
require([
|
|
'/customize/DecorateToolbar.js',
|
|
'/common/cryptpad-common.js',
|
|
'/bower_components/lil-uri/uri.min.js',
|
|
'/bower_components/jquery/dist/jquery.min.js'
|
|
], function (DecorateToolbar, Cryptpad, LilUri) {
|
|
var $ = window.$;
|
|
DecorateToolbar.main($('#bottom-bar'));
|
|
|
|
var $table = $('table.scroll');
|
|
var $tbody = $table.find('tbody');
|
|
var $tryit = $('#tryit');
|
|
var now = new Date();
|
|
var hasRecent = false;
|
|
|
|
var memorySpan = Cryptpad.timeframe; // thirty days
|
|
|
|
var forgetPad = Cryptpad.forgetPad;
|
|
|
|
var padTypes = {
|
|
'/pad/': 'Pad',
|
|
'/code/': 'Code'
|
|
};
|
|
|
|
var truncateTitle = function (title, len) {
|
|
if (typeof(title) === 'string' && title.length > len) {
|
|
return title.slice(0, len) + '…';
|
|
}
|
|
return title;
|
|
};
|
|
|
|
var recentPads = Cryptpad.getRecentPads();
|
|
recentPads.sort(Cryptpad.mostRecent);
|
|
|
|
var makeRecentPadsTable = function () {
|
|
recentPads.length && recentPads.some(function (pad, index) {
|
|
if (!pad) return;
|
|
|
|
console.log(pad);
|
|
|
|
// don't link to old pads
|
|
if (now.getTime() - new Date(pad.atime).getTime() > memorySpan) return true;
|
|
|
|
hasRecent = true;
|
|
|
|
// split up the uri
|
|
var uri = LilUri(pad.href);
|
|
|
|
// derive the name
|
|
var name = padTypes[uri.path()];
|
|
|
|
var title = pad.title || uri.parts.hash.slice(0,8);
|
|
|
|
var date = new Date(pad.atime).toLocaleDateString();
|
|
var created = new Date(pad.ctime).toLocaleDateString();
|
|
|
|
if (date === now.toLocaleDateString()) {
|
|
date = new Date(pad.atime).toLocaleTimeString().replace(/ /g, '');
|
|
}
|
|
|
|
var id = 'pad-'+index;
|
|
$tbody.append('<tr id="'+id+'">' +
|
|
'<td>' + name + '</td>' +
|
|
//'<td>' + title + '</td>' +
|
|
'<td><a href="' + pad.href + '" title="'+ pad.title + '">' + truncateTitle(pad.title, 48) + '</a></td>' +
|
|
'<td>' + created + '</td>' + // created
|
|
'<td>' + date + '</td>' +
|
|
'<td class="remove">✖</td>'+
|
|
'</tr>');
|
|
|
|
var $row = $('#'+id);
|
|
$row.find('.remove').click(function () {
|
|
forgetPad(pad.href);
|
|
$row.fadeOut(750, function () {
|
|
$row.remove();
|
|
if (!$table.find('tr').find('td').length) {
|
|
$table.remove();
|
|
$tryit.text("Try it out!");
|
|
}
|
|
});
|
|
});
|
|
});
|
|
};
|
|
|
|
if (recentPads.length) {
|
|
recentPads.sort(Cryptpad.mostRecent);
|
|
makeRecentPadsTable();
|
|
}
|
|
if (hasRecent) {
|
|
$('table').attr('style', '');
|
|
$tryit.text('Your Recent pads (stored only in browser)');
|
|
}
|
|
});
|
|
</script>
|
|
<h5 id="tryit">Try it out!</h5>
|
|
|
|
<table class="recent scroll" style="display:none">
|
|
<tbody>
|
|
|
|
<tr>
|
|
<th>Type</th>
|
|
<!-- <th>Title</th> -->
|
|
<th>Link</th>
|
|
<th>Created</th>
|
|
<th>Last Accessed</th>
|
|
<th></th> <!-- remove column -->
|
|
</tr>
|
|
|
|
</tbody>
|
|
</table>
|
|
|
|
<div id="buttons" class="buttons">
|
|
<a id="create-pad" class="button create" href="/pad/">CREATE NEW WYSIWYG PAD</a>
|
|
<a id="create-code" class="button create" href="/code/">CREATE NEW CODE PAD</a>
|
|
</div>
|
|
</center>
|
|
</div>
|
|
|
|
<div id="bottom-bar"></div>
|
|
</body>
|
|
</html>
|
|
|