Keystone Greeter
A KeystoneJS signin / registration form (ReactJS)
Install
npm install keystone-greeter //or add to package.json"dependencies": "keystone-greeter": "~0.3.3"
The compiled client ReactJS file is located at:
node_modules/keystone_greeter/public/snowpi/js/lib/react/build/greeterjs
The client jsx is included at:
node_modules/keystone_greeter/public/snowpi/js/lib/react/jsx/greeterjs
Setup
var keystone = ;var greeter = ; // add the greeter in your routes filekeystone;
Configuration
Locales
The locales file will be created on first run. You can create additional locales without them being overwritten. Copy the en.json
file and replace the values.
node_modules/keystone_greeter/locales-- node_modules/keystone_greeter/locales/enjson
Debugging
greeter;
greeter.add
:
Most items need to be set before calling The User Model defaults to keystone.get('user model')
. Override with:
greeter
The greeter uri defaults to /greeter
and can be set 3 ways in overriding order:
keystone greeter //this overrides keystone.set //set the page on addgreeter //this overrides everything
The success redirect page is inherited from Keystone
//set the redirect keystone
Set the redirect timer for successful login or registration in milliseconds
greeter //default = 5000 (5 seconds)
Style Sheets
Control the stylesheets
greeter // include default cssgreeter // include /styles/site.min.cssgreeter // include custom css
The default is to include default greeter css first and /styles/site.min.css
second so that your css automatically overrides the greeter out of the box. Custom styles is false unless explicitly set.
Registration
User registration can be toggled before calling greeter.add
:
//these are the default valuesgreetergreeter
Default Fields
this.setField('login', 'text', 'A-username', {
label: Text('email'),
field: 'email',
regex: ["^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$", "gi"],
model: {
field: 'email',
unique: false
},
required: true
});
this.setField('login', 'password', 'B-password', {
label: Text('password'),
field: 'password',
regex: ["^(?=.*[0-9]+.*)(?=.*[a-zA-Z]+.*)[0-9a-zA-Z]{6,}$", "g"],
required: true
});
this.setField('register', 'text', 'A-username', {
label: Text('email'),
field: 'email',
regex: ["^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$", "gi"],
required: true,
model: {
field: 'email',
unique: true
},
});
this.setField('register', 'password', 'B-password', {
label: Text('password'),
field: 'password',
required: true,
regex: ["^(?=.*[0-9]+.*)(?=.*[a-zA-Z]+.*)[0-9a-zA-Z]{6,}$", "g"]
});
this.setField('register', 'password', 'C-confirm', {
label: Text('confirm'),
field: 'confirm',
required: true,
dependsOn: 'B-password'
});
this.setField('register', 'text','D-name', {
label: Text('name'),
'field': 'name',
modify: ['first','last'],
modifyParameter: ' ',
placeholder: 'first last'
});
Add or change fields
The order is determined by the third parameter.
The first signin form field is username. We will use this to check signins.
greeter; greeter;
It can accept a modify
Array to split a text field into an Object for registration:
this;
code
{ if!value return false; if!modifymodify return false; var save = {}; var modifiers = modifymodify; var modifyParameter = modifymodifyParameter || ' '; ifmodifiers instanceof Array && modifierslength > 1 var splitName = value; savemodifiers0 = splitName0; var cname; ifsplitNamelength > 2 forvar i=1;i<=splitNamelength;i++ cname+=' ' + splitNamei || ''; else cname = splitName1 || ''; savemodifiers1 = cname; else ifmodifiers instanceof Array savemodifiers0 = reqbodyname; else iftypeof modifiers === 'string' savemodifiers = reqbodyname; else save = reqbodyname; return save;}
Return Messages
Change the return message contents
greeter; greeter; greeter; greeter; greeter; greeter; greeter; greeter; greeter;
This will overwrite the built in i18n locales text. To continue using locales do something similiar:
var Text = i18n__;i18n;greeter;