From 118b83c42077cadd002d9a1a5dd80254d5c25a7a Mon Sep 17 00:00:00 2001 From: ansuz Date: Thu, 22 Jun 2017 10:04:46 +0200 Subject: [PATCH] make register and login user clientside templates --- .jshintignore | 1 + customize.dist/main2.js | 13 +++-- customize.dist/pages.js | 124 +++++++++++++++++++++++++++++++--------- package.json | 2 +- www/login/index.html | 70 ++--------------------- www/register/index.html | 81 +++----------------------- 6 files changed, 120 insertions(+), 171 deletions(-) diff --git a/.jshintignore b/.jshintignore index 919395546..c2037807f 100644 --- a/.jshintignore +++ b/.jshintignore @@ -13,3 +13,4 @@ www/common/media-tag.js www/scratch www/common/toolbar.js +www/common/hyperscript.js diff --git a/customize.dist/main2.js b/customize.dist/main2.js index 46ffc37dd..9bd6e6ec7 100644 --- a/customize.dist/main2.js +++ b/customize.dist/main2.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 () {}); }); } -})}); +}); +}); diff --git a/customize.dist/pages.js b/customize.dist/pages.js index d663a2712..445a3822a 100644 --- a/customize.dist/pages.js +++ b/customize.dist/pages.js @@ -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; }); diff --git a/package.json b/package.json index f1a15acb8..aa6aad896 100644 --- a/package.json +++ b/package.json @@ -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;" } } diff --git a/www/login/index.html b/www/login/index.html index 3e4e7a21e..57579ec9d 100644 --- a/www/login/index.html +++ b/www/login/index.html @@ -1,76 +1,16 @@ + - Cryptpad: Log in + Cryptpad: Zero Knowledge, Collaborative Real Time Editing - - - - + -
- - - CryptPad - - - - - - - About - - - Privacy - - - ToS - - - Contact - -
- - - - diff --git a/www/register/index.html b/www/register/index.html index dd9765423..57579ec9d 100644 --- a/www/register/index.html +++ b/www/register/index.html @@ -1,83 +1,16 @@ + + Cryptpad: Zero Knowledge, Collaborative Real Time Editing - - Cryptpad: login - - - - + + + -
- - - CryptPad - - - - - - - About - - - Privacy - - - ToS - - - Contact - -
- - - -