mirror of https://github.com/xwiki-labs/cryptpad
make register and login user clientside templates
This commit is contained in:
parent
ab54dcf84d
commit
118b83c420
|
@ -13,3 +13,4 @@ www/common/media-tag.js
|
|||
www/scratch
|
||||
|
||||
www/common/toolbar.js
|
||||
www/common/hyperscript.js
|
||||
|
|
|
@ -15,7 +15,7 @@ $(function () {
|
|||
var rightLink = function (ref, loc, txt) {
|
||||
return h('span.link.right', [
|
||||
h('a', { href: ref, 'data-localization': loc}, txt)
|
||||
])
|
||||
]);
|
||||
};
|
||||
|
||||
var $topbar = $(h('div#cryptpadTopBar', [
|
||||
|
@ -42,7 +42,7 @@ $(function () {
|
|||
})
|
||||
])
|
||||
]
|
||||
))
|
||||
));
|
||||
|
||||
var $main = $(h('div#mainBlock.hidden',
|
||||
typeof(Pages[location.pathname]) === 'function'?
|
||||
|
@ -59,7 +59,7 @@ $(function () {
|
|||
return h('li', [ l ]);
|
||||
}))
|
||||
)
|
||||
])
|
||||
]);
|
||||
};
|
||||
|
||||
var footLink = function (ref, loc, text) {
|
||||
|
@ -117,9 +117,14 @@ $(function () {
|
|||
} else if (/^\/user\//.test(location.pathname)) {
|
||||
// do nothing. bogus app.
|
||||
require([ '/user/main.js'], function () {});
|
||||
} else if (/^\/register\//.test(location.pathname)) {
|
||||
require([ '/register/main.js' ], function () {});
|
||||
} else if (/^\/login\//.test(location.pathname)) {
|
||||
require([ '/login/main.js' ], function () {});
|
||||
} else {
|
||||
setTimeout(function () {
|
||||
require([ '/customize/main.js', ], function () {});
|
||||
});
|
||||
}
|
||||
})});
|
||||
});
|
||||
});
|
||||
|
|
|
@ -5,25 +5,23 @@ define([
|
|||
var Pages = {};
|
||||
var Msg = Cryptpad.Messages;
|
||||
|
||||
Pages['/about.html'] = function () {
|
||||
var p2 = h('p');
|
||||
p2.innerHTML = Msg.main_p2;
|
||||
var setHTML = function (e, html) {
|
||||
e.innerHTML = html;
|
||||
return e;
|
||||
};
|
||||
|
||||
var hiw = h('p');
|
||||
hiw.innerHTML = Msg.main_howitworks_p1;
|
||||
Pages['/about.html'] = function () {
|
||||
return h('div#main_other', [
|
||||
h('center', [
|
||||
h('h1', Msg.about)
|
||||
]),
|
||||
p2,
|
||||
setHTML(h('p'), Msg.main_p2),
|
||||
h('h2', Msg.main_howitworks),
|
||||
hiw
|
||||
setHTML(h('p', Msg.main_howitworks_p1))
|
||||
]);
|
||||
};
|
||||
|
||||
Pages['/privacy.html'] = function () {
|
||||
var vpn = h('p');
|
||||
vpn.innerHTML = Msg.policy_choices_vpn;
|
||||
return h('div#main_other', [
|
||||
h('center', h('h1', Msg.policy_title)),
|
||||
h('h2', Msg.policy_whatweknow),
|
||||
|
@ -44,7 +42,7 @@ define([
|
|||
|
||||
h('h2', Msg.policy_choices),
|
||||
h('p', Msg.policy_choices_open),
|
||||
vpn,
|
||||
setHTML(h('p'), Msg.policy_choices_vpn),
|
||||
|
||||
h('br')
|
||||
]);
|
||||
|
@ -62,12 +60,10 @@ define([
|
|||
};
|
||||
|
||||
Pages['/contact.html'] = function () {
|
||||
var about = h('p');
|
||||
about.innerHTML = Msg.main_about_p2;
|
||||
return h('div#main_other', [
|
||||
h('center', h('h1', Msg.contact)),
|
||||
about
|
||||
])
|
||||
setHTML(h('p'), Msg.main_about_p2)
|
||||
]);
|
||||
};
|
||||
|
||||
var userForm = function () {
|
||||
|
@ -110,8 +106,6 @@ define([
|
|||
};
|
||||
|
||||
var indexContent = function () {
|
||||
var mainZK = h('p');
|
||||
mainZK.innerHTML = Msg.main_zeroKnowledge_p;
|
||||
return [
|
||||
h('div.page.category.first#knowmore', [
|
||||
h('center', [
|
||||
|
@ -128,7 +122,7 @@ define([
|
|||
]),
|
||||
h('div.right', [
|
||||
h('h2', Msg.main_zeroKnowledge),
|
||||
mainZK
|
||||
setHTML(h('p'), Msg.main_zeroKnowledge_p)
|
||||
])
|
||||
])
|
||||
]),
|
||||
|
@ -178,9 +172,6 @@ define([
|
|||
};
|
||||
|
||||
var appButton = function (alt, h2, img, p, url, btn, id) {
|
||||
var P = h('p');
|
||||
P.innerHTML = p;
|
||||
|
||||
return h('div.app', [
|
||||
h('center', [
|
||||
h('h2', h2),
|
||||
|
@ -189,7 +180,7 @@ define([
|
|||
src: img,
|
||||
})
|
||||
]),
|
||||
P,
|
||||
setHTML(h('p'), p),
|
||||
h('p.buttons', [
|
||||
h('a#' + id, {
|
||||
href: url,
|
||||
|
@ -241,19 +232,17 @@ define([
|
|||
])
|
||||
])
|
||||
])
|
||||
]
|
||||
];
|
||||
};
|
||||
|
||||
Pages['/'] = Pages['/index.html'] = function () {
|
||||
var slogan = h('p.left');
|
||||
slogan.innerHTML = Msg.main_info;
|
||||
return [
|
||||
h('div#main', [
|
||||
h('div.mainOverlay'),
|
||||
h('div#align-container', [
|
||||
h('div#main-container', [
|
||||
h('div#data.hidden', [
|
||||
slogan
|
||||
setHTML(h('p.left'), Msg.main_info),
|
||||
]),
|
||||
userForm(),
|
||||
h('div#loggedIn.hidden', [
|
||||
|
@ -269,8 +258,8 @@ define([
|
|||
]),
|
||||
])
|
||||
]
|
||||
.concat(indexContent())
|
||||
.concat(tryIt());
|
||||
.concat(tryIt())
|
||||
.concat(indexContent());
|
||||
};
|
||||
|
||||
Pages['/settings/'] = Pages['/settings/index.html'] = function () {
|
||||
|
@ -281,5 +270,86 @@ define([
|
|||
return h('div#container');
|
||||
};
|
||||
|
||||
Pages['/register/'] = Pages['/register/index.html'] = function () {
|
||||
return [h('div#main', [
|
||||
h('div.mainOverlay'),
|
||||
h('div#align-container', [
|
||||
h('div#data.hidden', [
|
||||
h('h1', Msg.register_header),
|
||||
h('br'),
|
||||
setHTML(h('p.left.register-explanation'), Msg.register_explanation)
|
||||
]),
|
||||
h('div#userForm.form-group.hidden', [
|
||||
h('input.form-control#username', {
|
||||
type: 'text',
|
||||
autocomplete: 'off',
|
||||
autocorrect: 'off',
|
||||
autocapitalize: 'off',
|
||||
spellcheck: false,
|
||||
placeholder: Msg.login_username,
|
||||
autofocus: true,
|
||||
}),
|
||||
h('input.form-control#password', {
|
||||
type: 'password',
|
||||
placeholder: Msg.login_password,
|
||||
}),
|
||||
h('input.form-control#password-confirm', {
|
||||
type: 'password',
|
||||
placeholder: Msg.login_confirm,
|
||||
}),
|
||||
h('input#import-recent', {
|
||||
type: 'checkbox',
|
||||
checked: true
|
||||
}),
|
||||
h('label', {
|
||||
'for': 'import-recent',
|
||||
}, Msg.register_importRecent),
|
||||
h('br'),
|
||||
h('input#accept-terms', {
|
||||
type: 'checkbox'
|
||||
}),
|
||||
setHTML(h('label', {
|
||||
'for': 'accept-terms',
|
||||
}), Msg.register_acceptTerms),
|
||||
h('br'),
|
||||
h('button#register.btn.btn-primary', Msg.login_register)
|
||||
])
|
||||
])
|
||||
])];
|
||||
};
|
||||
|
||||
Pages['/login/'] = Pages['/login/index.html'] = function () {
|
||||
return [h('div#main', [
|
||||
h('div.mainOverlay'),
|
||||
h('div#align-container',
|
||||
h('div#main-container', [
|
||||
h('div#data.hidden', setHTML(h('p.left'), Msg.main_info)),
|
||||
h('div#userForm.form-group.hidden', [
|
||||
h('input.form-control#name', {
|
||||
name: 'name',
|
||||
type: 'text',
|
||||
autocomplete: 'off',
|
||||
autocorrect: 'off',
|
||||
autocapitalize: 'off',
|
||||
spellcheck: false,
|
||||
placeholder: Msg.login_username,
|
||||
autofocus: true,
|
||||
}),
|
||||
h('input.form-control#password', {
|
||||
type: 'password',
|
||||
'name': 'password',
|
||||
placeholder: Msg.login_password,
|
||||
}),
|
||||
h('button.btn.btn-primary.login.first', Msg.login_login),
|
||||
h('div.extra', [
|
||||
h('p', Msg.login_notRegistered),
|
||||
h('button#register.btn.btn-success.register.first', Msg.login_register)
|
||||
])
|
||||
])
|
||||
])
|
||||
)
|
||||
])];
|
||||
};
|
||||
|
||||
return Pages;
|
||||
});
|
||||
|
|
|
@ -19,6 +19,6 @@
|
|||
"lint": "jshint --config .jshintrc --exclude-path .jshintignore .",
|
||||
"test": "node TestSelenium.js",
|
||||
"style": "lessc ./customize.dist/src/less/cryptpad.less > ./customize.dist/main.css && lessc ./customize.dist/src/less/toolbar.less > ./customize.dist/toolbar.css && lessc ./www/drive/file.less > ./www/drive/file.css && lessc ./www/settings/main.less > ./www/settings/main.css && lessc ./www/slide/slide.less > ./www/slide/slide.css && lessc ./www/whiteboard/whiteboard.less > ./www/whiteboard/whiteboard.css && lessc ./www/poll/poll.less > ./www/poll/poll.css && lessc ./www/file/file.less > ./www/file/file.css && lessc ./www/code/code.less > ./www/code/code.css",
|
||||
"template": "cd customize.dist/src && for page in ../index.html ../privacy.html ../terms.html ../about.html ../contact.html ../../www/settings/index.html ../../www/user/index.html;do echo $page; cp template.html $page; done;"
|
||||
"template": "cd customize.dist/src && for page in ../index.html ../privacy.html ../terms.html ../about.html ../contact.html ../../www/login/index.html ../../www/register/index.html ../../www/settings/index.html ../../www/user/index.html;do echo $page; cp template.html $page; done;"
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,76 +1,16 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="cp">
|
||||
<!-- If this file is not called customize.dist/src/template.html, it is generated -->
|
||||
<head>
|
||||
<title data-localization="main_title">Cryptpad: Log in</title>
|
||||
<title data-localization="main_title">Cryptpad: Zero Knowledge, Collaborative Real Time Editing</title>
|
||||
<meta content="text/html; charset=utf-8" http-equiv="content-type"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
|
||||
<link rel="stylesheet" type="text/css" href="/customize/main.css" />
|
||||
<link rel="stylesheet" href="/bower_components/components-font-awesome/css/font-awesome.min.css">
|
||||
<link rel="icon" type="image/png" href="/customize/main-favicon.png" id="favicon"/>
|
||||
<link rel="stylesheet" href="/bower_components/bootstrap/dist/css/bootstrap.min.css">
|
||||
<script data-bootload="main.js" data-main="/common/boot.js" src="/bower_components/requirejs/require.js"></script>
|
||||
<script async data-bootload="/customize/main2.js" data-main="/common/boot.js?ver=1.0" src="/bower_components/requirejs/require.js?ver=2.1.15"></script>
|
||||
</head>
|
||||
<body class="html">
|
||||
<div id="cryptpadTopBar">
|
||||
<span>
|
||||
<a class="gotoMain" href="/">
|
||||
<img src="/customize/cryptofist_mini.png" class="cryptpad-logo" alt="" /> CryptPad
|
||||
</a>
|
||||
</span>
|
||||
|
||||
<span id="user-menu" class="right dropdown-bar"></span>
|
||||
<span id="language-selector" class="right dropdown-bar"></span>
|
||||
<span class="right">
|
||||
<a href="/about.html" data-localization="about">About</a>
|
||||
</span>
|
||||
<span class="right">
|
||||
<a href="/privacy.html" data-localization="privacy">Privacy</a>
|
||||
</span>
|
||||
<span class="right">
|
||||
<a href="/terms.html" data-localization="terms">ToS</a>
|
||||
</span>
|
||||
<span class="right">
|
||||
<a href="/contact.html" data-localization="contact">Contact</a>
|
||||
</span>
|
||||
</div>
|
||||
<noscript>
|
||||
<div id="noscriptContainer">
|
||||
<div class="mainOverlay"></div>
|
||||
<div id="noscript">
|
||||
<p>
|
||||
<strong>OOPS</strong> In order to do encryption in your browser, Javascript is really <strong>really</strong> required.
|
||||
</p>
|
||||
<hr>
|
||||
<p>
|
||||
<strong>OUPS</strong> Afin de pouvoir réaliser le chiffrement dans votre navigateur, Javascript est <strong>vraiment</strong> nécessaire.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<p><strong>OOPS</strong> In order to do encryption in your browser, Javascript is really <strong>really</strong> required.</p>
|
||||
<p><strong>OUPS</strong> Afin de pouvoir réaliser le chiffrement dans votre navigateur, Javascript est <strong>vraiment</strong> nécessaire.</p>
|
||||
</noscript>
|
||||
|
||||
<div id="mainBlock" class="hidden">
|
||||
|
||||
<div id="main">
|
||||
<div class="mainOverlay"></div>
|
||||
<div id="align-container">
|
||||
<div id="main-container">
|
||||
<div id="data" class="hidden">
|
||||
<p class="left" data-localization="main_info"><!-- Zero Knowledge collaborative realtime editor. Protected from the NSA. --></p>
|
||||
</div>
|
||||
|
||||
<div id="userForm" class="form-group hidden">
|
||||
<input type="text" id="name" name="name" class="form-control" data-localization-placeholder="login_username" autofocus>
|
||||
<input type="password" id="password" name="password" class="form-control" data-localization-placeholder="login_password">
|
||||
<button class="btn btn-primary login first" data-localization="login_login"></button>
|
||||
<div class="extra">
|
||||
<p data-localization="login_notRegistered"></p>
|
||||
<button id="register" class="btn btn-success register first" data-localization="login_register"></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -1,83 +1,16 @@
|
|||
<!DOCTYPE html>
|
||||
<html class="cp">
|
||||
<!-- If this file is not called customize.dist/src/template.html, it is generated -->
|
||||
<head>
|
||||
<title data-localization="main_title">Cryptpad: Zero Knowledge, Collaborative Real Time Editing</title>
|
||||
<meta content="text/html; charset=utf-8" http-equiv="content-type"/>
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
||||
<title>Cryptpad: login</title>
|
||||
<link rel="stylesheet" href="/bower_components/components-font-awesome/css/font-awesome.min.css">
|
||||
<script data-bootload="main.js" data-main="/common/boot.js" src="/bower_components/requirejs/require.js"></script>
|
||||
<link rel="stylesheet" href="/customize/main.css" />
|
||||
<link rel="stylesheet" href="/bower_components/bootstrap/dist/css/bootstrap.min.css">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
|
||||
<link rel="icon" type="image/png" href="/customize/main-favicon.png" id="favicon"/>
|
||||
<script async data-bootload="/customize/main2.js" data-main="/common/boot.js?ver=1.0" src="/bower_components/requirejs/require.js?ver=2.1.15"></script>
|
||||
</head>
|
||||
<body class="html">
|
||||
<div id="cryptpadTopBar">
|
||||
<span>
|
||||
<a class="gotoMain" href="/">
|
||||
<img src="/customize/cryptofist_mini.png" class="cryptpad-logo" alt="" /> CryptPad
|
||||
</a>
|
||||
</span>
|
||||
|
||||
<span id="user-menu" class="right dropdown-bar"></span>
|
||||
<span id="language-selector" class="right dropdown-bar"></span>
|
||||
<span class="right">
|
||||
<a href="/about.html" data-localization="about">About</a>
|
||||
</span>
|
||||
<span class="right">
|
||||
<a href="/privacy.html" data-localization="privacy">Privacy</a>
|
||||
</span>
|
||||
<span class="right">
|
||||
<a href="/terms.html" data-localization="terms">ToS</a>
|
||||
</span>
|
||||
<span class="right">
|
||||
<a href="/contact.html" data-localization="contact">Contact</a>
|
||||
</span>
|
||||
</div>
|
||||
<noscript>
|
||||
<div id="noscriptContainer">
|
||||
<div class="mainOverlay"></div>
|
||||
<div id="noscript">
|
||||
<p>
|
||||
<strong>OOPS</strong> In order to do encryption in your browser, Javascript is really <strong>really</strong> required.
|
||||
</p>
|
||||
<hr>
|
||||
<p>
|
||||
<strong>OUPS</strong> Afin de pouvoir réaliser le chiffrement dans votre navigateur, Javascript est <strong>vraiment</strong> nécessaire.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<p><strong>OOPS</strong> In order to do encryption in your browser, Javascript is really <strong>really</strong> required.</p>
|
||||
<p><strong>OUPS</strong> Afin de pouvoir réaliser le chiffrement dans votre navigateur, Javascript est <strong>vraiment</strong> nécessaire.</p>
|
||||
</noscript>
|
||||
|
||||
<div id="mainBlock" class="hidden">
|
||||
|
||||
<div id="main">
|
||||
<div class="mainOverlay"></div>
|
||||
<div id="align-container">
|
||||
<div id="main-container">
|
||||
<div id="data" class="hidden">
|
||||
<h1 data-localization="register_header"></h1><br />
|
||||
<p class="left register-explanation" data-localization="register_explanation"><!-- Zero Knowledge collaborative realtime editor. Protected from the NSA. --></p>
|
||||
</div>
|
||||
|
||||
<div id="userForm" class="form-group hidden">
|
||||
<input class="form-control" id="username" type="text" autocomplete="off" autocorrect="off"
|
||||
autocapitalize="off" spellcheck="false" data-localization-placeholder="login_username" autofocus/>
|
||||
<input class="form-control" id="password" type="password" data-localization-placeholder="login_password"/>
|
||||
<input class="form-control" id="password-confirm" type="password" data-localization-placeholder="login_confirm"/>
|
||||
|
||||
|
||||
<!-- TODO translate labels -->
|
||||
<input id="import-recent" type="checkbox" checked />
|
||||
<label for="import-recent" data-localization="register_importRecent"></label><br />
|
||||
|
||||
<input id="accept-terms" type="checkbox" />
|
||||
<label for="accept-terms" data-localization="register_acceptTerms"></label><br />
|
||||
|
||||
<button id="register" class="btn btn-primary" data-localization="login_register"></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
Loading…
Reference in New Issue