mirror of
https://github.com/TryGhost/Ghost.git
synced 2024-12-14 09:52:09 +03:00
44f2cb0153
Closes #581. * Basically adds the client side of node validator, that we're already using * Validator is plonked onto `Ghost.Validator` * Usage is identical as to https://github.com/chriso/node-validator * Has sanitizing values et al * `Ghost.Validator.error` is redefined, it populates Ghost.Validator._errors (Array) * `Ghost.Validator.handleErrors` is supposed to print out the multiple error messages, if there are multiple (this is broken due to how notifications are presented `.html` instead of `.append`), and also apply class to element * The ajax calls are wrapped in an if to prevent network traffic if something's not right on client side * Added validation to general settings and user settings screens. * On validation error, optionally adds `.input-error` to whatever element you reference, see below (if `el` exists on the error object). This is the only place where usage is different to the original implementation. Redeclared `error()` function in `init.js` * Usage: `Ghost.Validate.check(valueToCheck, {message: "the error message", el: $('#the element')}).isEmail()` * The element above will receive the `.input-error` class. `isEmail()` is one of the stuff you can check against.
79 lines
3.3 KiB
Handlebars
79 lines
3.3 KiB
Handlebars
<header>
|
|
<h2 class="title">Your Profile</h2>
|
|
<section class="page-actions">
|
|
<button class="button-save">Save</button>
|
|
</section>
|
|
</header>
|
|
<section class="content no-padding">
|
|
<header class="user-profile-header">
|
|
<figure class="cover-image">
|
|
<img id="user-cover-picture" src="{{#if cover_picture}}{{cover_picture}}{{else}}/shared/img/default-user-cover-picture.jpg{{/if}}" title="{{full_name}} Cover Image"/>
|
|
<button class="button-change-cover js-modal-cover-picture">Change Cover</button>
|
|
</figure>
|
|
</header>
|
|
<form class="user-details-container" novalidate="novalidate">
|
|
<fieldset class="user-details-top">
|
|
<figure class="user-avatar-image">
|
|
<img id="user-profile-picture" src="{{#if profile_picture}}{{profile_picture}}{{else}}/shared/img/default-user-profile-picture.jpg{{/if}}" title="{{full_name}}"/>
|
|
<button class="button-change-avatar js-modal-profile-picture">Edit Picture</button>
|
|
</figure>
|
|
<label>
|
|
<input type="url" value="{{full_name}}" id="user-name" placeholder="Joe Bloggs" autocapitalize="off" autocorrect="off">
|
|
<p>Use your real name so people can recognise you.</p>
|
|
</label>
|
|
</fieldset>
|
|
<fieldset class="user-details-bottom">
|
|
<div class="form-group">
|
|
<label><strong>Email</strong></label>
|
|
<input type="email" value="{{email_address}}" id="user-email" placeholder="Email Address" autocapitalize="off" autocorrect="off">
|
|
<p>Email will not be publicly displayed. <a class="highlight" href="#" >Learn more</a>.</p>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label><strong>Location</strong></label>
|
|
<input type="text" value="{{location}}" id="user-location">
|
|
<p>Where in the world do you live?</p>
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label><strong>Website</strong></label>
|
|
<input type="text" value="{{url}}" id="user-website">
|
|
<p>Have a website or blog other than this one? Link it.</p>
|
|
</div>
|
|
|
|
<div class="form-group bio-container">
|
|
<label><strong>Bio</strong></label>
|
|
<textarea id="user-bio">{{bio}}</textarea>
|
|
<p class="bio-desc">Write about you, in <strong>200</strong> characters or less.</p>
|
|
<span class="word-count">97</span>
|
|
</div>
|
|
|
|
<hr>
|
|
|
|
</fieldset>
|
|
|
|
<fieldset class="user-details-bottom">
|
|
|
|
<div class="form-group">
|
|
<label><strong>Old Password</strong></label>
|
|
<input type="password" id="user-password-old">
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label><strong>New Password</strong></label>
|
|
<input type="password" id="user-password-new">
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label><strong>Verify Password</strong></label>
|
|
<input type="password" id="user-new-password-verification">
|
|
</div>
|
|
<div class="form-group">
|
|
<button class="button-delete button-change-password">Change Password</button>
|
|
</div>
|
|
|
|
</fieldset>
|
|
|
|
</form>
|
|
</section>
|