diff options
Diffstat (limited to 'src')
| -rw-r--r-- | src/guff/models/tab.cr | 82 | ||||
| -rw-r--r-- | src/guff/views/ecrs/test/auth.ecr | 235 | ||||
| -rw-r--r-- | src/guff/views/html/test/auth.cr | 20 |
3 files changed, 287 insertions, 50 deletions
diff --git a/src/guff/models/tab.cr b/src/guff/models/tab.cr index 8d6428b..3649cdd 100644 --- a/src/guff/models/tab.cr +++ b/src/guff/models/tab.cr @@ -40,39 +40,63 @@ class Guff::TabModel < Guff::Model "text": "Configure site settings.", }] - TABS = [{ - "id": "home", - "css": "active", - "icon": "fa-home", - "name": "Home", - "text": "View home tab.", - }, { - "id": "posts", - "icon": "fa-cubes", - "name": "Posts", - "text": "Manage blog, pages, and projects.", - }, { - "id": "files", - "icon": "fa-files-o", - "name": "Files", - "text": "Manage files.", - }, { - "id": "users", - "icon": "fa-users", - "name": "Users", - "text": "Manage users and permissions.", - }, { - "id": "settings", - "icon": "fa-cog", - "name": "Settings", - "text": "Configure site settings.", - }] + TABS = { + admin: [{ + "id": "home", + "css": "active", + "icon": "fa-home", + "name": "Home", + "text": "View home tab.", + }, { + "id": "posts", + "icon": "fa-cubes", + "name": "Posts", + "text": "Manage blog, pages, and projects.", + }, { + "id": "files", + "icon": "fa-files-o", + "name": "Files", + "text": "Manage files.", + }, { + "id": "users", + "icon": "fa-users", + "name": "Users", + "text": "Manage users and permissions.", + }, { + "id": "settings", + "icon": "fa-cog", + "name": "Settings", + "text": "Configure site settings.", + }], + + post_new: [{ + "id": "type", + "icon": "", + "name": "Choose Post Type", + "text": "", + }, { + "id": "blog", + "icon": "", + "name": "Create Blog Post", + "text": "", + }, { + "id": "page", + "icon": "", + "name": "Create Page", + "text": "", + }, { + "id": "project", + "icon": "", + "name": "Create Project", + "text": "", + }], + } def initialize(models : Models) super(models, SQL) end - def get_tabs - TABS + def get_tabs(id : Symbol) + TABS[id] end end diff --git a/src/guff/views/ecrs/test/auth.ecr b/src/guff/views/ecrs/test/auth.ecr index ca4146c..6999737 100644 --- a/src/guff/views/ecrs/test/auth.ecr +++ b/src/guff/views/ecrs/test/auth.ecr @@ -18,11 +18,11 @@ <div class='container'> <div class='col-md-12'> <ul class='nav nav-tabs nav-justified' role='tablist'><%= - get_tabs + get_tabs(:admin, "admin") %></ul><!-- nav-tabs --> <div class='tab-content'> - <div id='tab-pane-home' class='tab-pane active' role='tabpanel'> + <div id='admin-tab-pane-home' class='tab-pane active' role='tabpanel'> <div class='panel panel-default'> <div class='panel-heading'> <div class='btn-toolbar'> @@ -32,7 +32,7 @@ class='btn btn-primary' title='Create new post.' data-toggle='modal' - data-target='#user-add-dialog' + data-target='#post-new-dialog' > <i class='fa fa-plus-circle'></i> New Post @@ -47,9 +47,9 @@ </p> </div><!-- panel-body --> </div><!-- panel --> - </div><!-- #tab-home --> + </div><!-- #admin-tab-pane-home --> - <div id='tab-pane-posts' class='tab-pane' role='tabpanel'> + <div id='admin-tab-pane-posts' class='tab-pane' role='tabpanel'> <div class='panel panel-default'> <div class='panel-heading'> <div class='btn-toolbar'> @@ -59,7 +59,7 @@ class='btn btn-primary' title='Create new post.' data-toggle='modal' - data-target='#user-add-dialog' + data-target='#post-new-dialog' > <i class='fa fa-plus-circle'></i> New Post @@ -99,9 +99,9 @@ </p> </div><!-- panel-body --> </div><!-- panel --> - </div><!-- #tab-pane-blog --> + </div><!-- #admin-tab-pane-posts --> - <div id='tab-pane-files' class='tab-pane' role='tabpanel'> + <div id='admin-tab-pane-files' class='tab-pane' role='tabpanel'> <div class='panel panel-default'> <div class='panel-body'> <p> @@ -109,9 +109,9 @@ </p> </div><!-- panel-body --> </div><!-- panel --> - </div><!-- #tab-pane-files --> + </div><!-- #admin-tab-pane-files --> - <div id='tab-pane-users' class='tab-pane' role='tabpanel'> + <div id='admin-tab-pane-users' class='tab-pane' role='tabpanel'> <div class='panel panel-default'> <div class='panel-heading'> <div class='btn-toolbar'> @@ -207,9 +207,9 @@ </span><!-- list-group-item --> </div><!-- list-group --> </div><!-- panel --> - </div><!-- #tab-pane-users --> + </div><!-- #admin-tab-pane-users --> - <div id='tab-pane-settings' class='tab-pane' role='tabpanel'> + <div id='admin-tab-pane-settings' class='tab-pane' role='tabpanel'> <div class='panel panel-default'> <div class='panel-body'> <p> @@ -217,7 +217,7 @@ </p> </div><!-- panel-body --> </div><!-- panel --> - </div><!-- #tab-pane-settings --> + </div><!-- #admin-tab-pane-settings --> </div><!-- tab-content --> </div><!-- col-md-10 --> </div><!-- container --> @@ -500,3 +500,212 @@ </div><!-- modal-content --> </div><!-- modal-dialog --> </div><!-- modal --> + +<div id='post-new-dialog' class='modal fade' role='dialog'> + <div class='modal-dialog modal-lg' role='document'> + <div class='modal-content'> + <div class='modal-header'> + <button + type='button' + class='close' + data-dismiss='modal' + aria-label='Close' + > + <span aria-hidden='true'> + × + </span> + </button><!-- close --> + + <h4 class='modal-title'> + <i class='fa fa-plus-circle'></i> + New Post + </h4><!-- modal-title --> + </div><!-- modal-header --> + + <div class='modal-body'> + <ul class='hidden nav nav-pills nav-justified'><%= + get_tabs(:post_new, "post-new") + %></ul><!-- nav --> + + <div class='tab-content'> + <div + id='post-new-tab-pane-type' + class='tab-pane' + role='tabpanel' + > + <p> + Choose the type of post to create using the radio buttons + below, then click the "Next" button. + </p> + + <div class='radio'> + <label> + <input + type='radio' + name='post-new-type' + id='post-new-type-blog' + value='blog' + checked='checked' + title='Create new blog post.' + aria-describedby='post-new-type-help-blog' + /> + Blog Post + </label> + + <span id='post-new-type-help-blog' class='help-block'> + Some description about creating a new blog post. + </span><!-- help-block --> + </div><!-- radio --> + + <div class='radio'> + <label> + <input + type='radio' + name='post-new-type' + id='post-new-type-page' + value='page' + title='Create new page.' + aria-describedby='post-new-type-help-page' + /> + Page + </label> + + <span id='post-new-type-help-page' class='help-block'> + Some description about creating a new page. + </span><!-- help-block --> + </div><!-- radio --> + + <div class='radio'> + <label> + <input + type='radio' + name='post-new-type' + id='post-new-type-project' + value='project' + title='Create new project.' + aria-describedby='post-new-type-help-project' + /> + Project + </label> + + <span id='post-new-type-help-project' class='help-block'> + Some description about creating a new project. + </span><!-- help-block --> + </div><!-- radio --> + </div><!-- #post-new-tab-pane-type --> + + <div + id='post-new-tab-pane-blog' + class='tab-pane' + role='tabpanel' + > + <div class='form-group'> + <label for='post-new-blog-name'> + Title + </label> + + <input + type='text' + id='post-new-blog-name' + class='form-control' + title='Enter title for blog post.' + placeholder='Blog Post Title' + /> + </div><!-- form-group --> + + <div class='form-group'> + <label for='post-new-blog-slug'> + Slug + </label> + + <input + type='text' + id='post-new-blog-slug' + class='form-control' + title='Enter slug for blog post.' + placeholder='blog-post-slug' + /> + </div><!-- form-group --> + + <div class='form-group'> + <label for='post-new-blog-body'> + Body + </label> + + <textarea + id='post-new-blog-body' + class='form-control' + rows='10' + ></textarea> + </div><!-- form-group --> + </div><!-- #post-new-tab-pane-blog --> + + <div + id='post-new-tab-pane-page' + class='tab-pane' + role='tabpanel' + > + <p> + TODO: create page + </p> + </div><!-- #post-new-tab-pane-page --> + + <div + id='post-new-tab-pane-project' + class='tab-pane' + role='tabpanel' + > + <p> + TODO: create project + </p> + </div><!-- #post-new-tab-pane-project --> + </div><!-- tab-content --> + </div><!-- modal-body --> + + <div class='modal-footer'> + <button + class='btn btn-default pull-left' + data-dismiss='modal' + title='Close dialog.' + > + × Close + </button> + + <button + id='post-new-back' + class='btn btn-default' + title='Go to previous step.' + > + <i class='fa fa-chevron-left'></i> + Back + </button> + + <button + id='post-new-next' + class='btn btn-primary' + title='Go to next step.' + > + <i class='fa fa-chevron-right'></i> + Next + </button> + + <button + id='post-new-confirm' + class='btn btn-primary' + title='Create post.' + > + <span class='hidden loading'> + <i class='fa fa-spinner fa-spin'></i> + Please Wait... + </span> + + <span class='loading'> + <i class='fa fa-plus-circle'></i> + Create + <span class='name'>Type</span> + </span> + </button> + </div><!-- modal-footer --> + </div><!-- modal-content --> + </div><!-- modal-dialog --> +</div><!-- modal --> diff --git a/src/guff/views/html/test/auth.cr b/src/guff/views/html/test/auth.cr index 0e3d02f..386b6b4 100644 --- a/src/guff/views/html/test/auth.cr +++ b/src/guff/views/html/test/auth.cr @@ -4,9 +4,12 @@ require "../page" class Guff::TestAuthHTMLView TITLE = "Guff Auth Test" FEATURES = %w{bootstrap font-awesome guff/util} + # /guff-stuff/tinymce-4.3.7/tinymce.min.js SCRIPTS = %w{ + /guff-stuff/ckeditor-4.5.8/ckeditor.js /guff-stuff/js/search-field.js /guff-stuff/test/tab-users.js + /guff-stuff/test/tab-posts.js } TEMPLATES = TemplateCache.new({ @@ -23,10 +26,10 @@ class Guff::TestAuthHTMLView tab: " <li role='presentation' class='%{css}'> <a - id='tab-%{id}' - href='#tab-pane-%{id}' + id='%{prefix}-tab-%{id}' + href='#%{prefix}-tab-pane-%{id}' title='%{text}' - aria-controls='tab-pane-%{id}' + aria-controls='%{prefix}-tab-pane-%{id}' role='tab' data-toggle='tab' > @@ -68,12 +71,13 @@ class Guff::TestAuthHTMLView }.join end - def get_tabs - @models.tab.get_tabs.map { |row| + def get_tabs(id : Symbol, prefix : String) + @models.tab.get_tabs(id).map { |row| TEMPLATES[:tab].run(row.merge({ - "css": row["css"]? || "", - "name": h(row["name"]), - "text": h(row["text"]), + "prefix": prefix, + "css": row["css"]? || "", + "name": h(row["name"]), + "text": h(row["text"]), })) }.join end |