Ghost/ghost/admin/templates/settings/general.hbs
Harry Wolff 00da1a43b7 Creates Ember Modal infastructure
resolves #2416

This is a pretty large commit but what it's adding are pretty fundamental to the admin app.

- Creates top level actions on the ApplicationRoute for opening and closing modals.  This allows sending the 'openModal' action from any template to open a modal.

- Every modal template lives in 'templates/modals/{{modalName}}'

- Each modal can have a backing controller of the same name that can provide additional control for that modal.  Those controllers reside in 'controllers/modals/{{modalName}}'

- Created the ModalDialog component which is where all the logic for the component resides.  It's not at 100% parity with the existing Ghost modal system but it has the foundation for further fleshing out.  It currently accepts parameters for styling how the modal should appear, which previously was defined in JS files in the Backbone admin.

- This creates the 'delete all posts', 'delete this post', 'markdown', and 'upload' modal.  Some are in more stages of completion than others, but I wanted to just get the foundation in place as fast as possible.

- This also creates the UploadModal component which is a subclass of the ModalDialog component.  The reason for this subclassing is that the UploadModal component directly accesses the DOM and when that occurs in Ember it should remain in a component definition.  It's ready for extending to reach parity.  Note: depending on needs the base ModalDialog class may need to be modified.
2014-04-06 12:45:19 -04:00

82 lines
3.6 KiB
Handlebars

<header>
<button class="button-back">Back</button>
<h2 class="title">General</h2>
<section class="page-actions">
<button class="button-save">Save</button>
</section>
</header>
<section class="content">
<form id="settings-general" novalidate="novalidate">
<fieldset>
<div class="form-group">
<label for="blog-title">Blog Title</label>
{{input id="blog-title" name="general[title]" type="text" value=title}}
<p>The name of your blog</p>
</div>
<div class="form-group description-container">
<label for="blog-description">Blog Description</label>
{{textarea id="blog-description" value=description}}
<p>
Describe what your blog is about
<span class="word-count">0</span>
</p>
</div>
</fieldset>
<div class="form-group">
<label for="blog-logo">Blog Logo</label>
{{#if logo}}
<a class="js-modal-logo" href="#"><img id="blog-logo" src="{{logo}}" alt="logo"></a>
{{else}}
<a class="button-add js-modal-logo" {{action 'openModal' 'upload'}}>Upload Image</a>
{{/if}}
<p>Display a sexy logo for your publication</p>
</div>
<div class="form-group">
<label for="blog-cover">Blog Cover</label>
{{#if cover}}
<a class="js-modal-cover" href="#"><img id="blog-cover" src="{{cover}}" alt="cover photo"></a>
{{else}}
<a class="button-add js-modal-cover" {{action 'openModal' 'upload'}}>Upload Image</a>
{{/if}}
<p>Display a cover image on your site</p>
</div>
<fieldset>
<div class="form-group">
<label for="email-address">Email Address</label>
{{input id="email-address" name="general[email-address]" type="email" value=email autocapitalize="off" autocorrect="off"}}
<p>Address to use for admin notifications</p>
</div>
<div class="form-group">
<label for="postsPerPage">Posts per page</label>
{{input id="postsPerPage" name="general[postsPerPage]" type="number" value=postsPerPage}}
<p>How many posts should be displayed on each page</p>
</div>
<div class="form-group">
<label for="permalinks">Dated Permalinks</label>
{{input id="permalinks" name="general[permalinks]" type="checkbox" value='permalink'}}
<label class="checkbox" for="permalinks"></label>
<p>Include the date in your post URLs</p>
</div>
<div class="form-group">
<label for="activeTheme">Theme</label>
<select id="activeTheme" name="general[activeTheme]">
{{#each availableThemes}}
<option value="{{name}}" {{#if active}}selected{{/if}}>{{#if package}}{{package.name}} - {{package.version}}{{else}}{{name}}{{/if}}</option>
{{#unless package}}<script>console.log('Hi! The theme named "{{name}}" does not have a package.json file or it\'s malformed. This will be required in the future. For more info, see http://docs.ghost.org/themes/.');</script>{{/unless}}
{{/each}}
</select>
<p>Select a theme for your blog</p>
</div>
</fieldset>
</form>
</section>