diff options
| -rw-r--r-- | data/assets/js/admin/dialogs/site-add.js | 93 | ||||
| -rw-r--r-- | data/assets/js/admin/dialogs/site-edit.js | 18 | ||||
| -rw-r--r-- | data/assets/js/admin/dialogs/site.js | 94 | ||||
| -rw-r--r-- | data/assets/js/admin/tabs/sites.js | 10 | ||||
| -rw-r--r-- | src/guff/views/dialogs/admin/site-add.cr | 33 | ||||
| -rw-r--r-- | src/guff/views/dialogs/admin/site-edit.cr | 14 | ||||
| -rw-r--r-- | src/guff/views/dialogs/admin/site.cr | 37 | ||||
| -rw-r--r-- | src/guff/views/pages/admin.cr | 29 | ||||
| -rw-r--r-- | src/views/dialogs/admin/site.ecr (renamed from src/views/dialogs/admin/site-add.ecr) | 91 |
9 files changed, 266 insertions, 153 deletions
diff --git a/data/assets/js/admin/dialogs/site-add.js b/data/assets/js/admin/dialogs/site-add.js index bf95b8e..2d96c9f 100644 --- a/data/assets/js/admin/dialogs/site-add.js +++ b/data/assets/js/admin/dialogs/site-add.js @@ -1,85 +1,20 @@ jQuery(function($) { "use strict"; - var p = '#site-add-'; - - var FIELDS = { - text: ['name', 'slug', 'body', 'lang', 'theme_id'], - list: ['domains', 'styles', 'scripts'], - } - - var DEFAULTS = { - lang: DATA.default_lang, - theme_id: DATA.default_theme_id, - }; - - $(p + 'dialog').on('show.bs.modal', function() { - $.each(FIELDS.text, function(_, id) { - $(p + id).val(DEFAULTS[id] || ''); + // cache fields + var FIELDS = DATA.site_dialogs.fields; + + $('#site-add-dialog').on('show.bs.modal', function() { + $(this).trigger({ + type: 'guff.loaded', + + site_data: FIELDS.text.reduce(function(r, id) { + r[id] = FIELDS.defaults[id] || ''; + return r; + }, FIELDS.list.reduce(function(r, id) { + r[id] = []; + return r; + }, {})), }); - - // clear list textareas - $.each(FIELDS.list, function(_, id) { - $(p + id).val(''); - }); - }); - - $(p + 'dialog').on('shown.bs.modal', function() { - // show content tab - $(p + 'tab-content').click(); - - // focus name field - $(p + 'name').focus(); - }); - - $(p + 'dialog input[type="text"]').keydown(function(ev) { - if (ev.which == 13) { - setTimeout(function() { - $(p + 'confirm').click(); - }, 10); - - // stop event - return false; - } - }); - - $(p + 'name').keydown(function(ev) { - var me = $(this); - - setTimeout(function() { - $(p + 'slug').val(slugify(me.val())); - }, 10); - }); - - $(p + 'confirm').click(function() { - var me = $(this); - - if (me.hasClass('disabled')) - return false; - - // toggle loading - me.toggleClass('disabled').find('.loading').toggleClass('hidden'); - - send('site/add', FIELDS.text.reduce(function(r, id) { - r[id] = $(p + id).val(); - return r; - }, FIELDS.list.reduce(function(r, id) { - r[id] = listify(p + id); - return r; - }, { - // hard-code this for now - is_full_feed: 't', - }))).always(function() { - // toggle loading - me.toggleClass('disabled').find('.loading').toggleClass('hidden'); - }).fail(function(r) { - gripe(r, 'add site'); - }).done(function(r) { - $('#sites-reload').click(); - $(p + 'dialog').modal('hide'); - }); - - // stop event - return false; }); }); diff --git a/data/assets/js/admin/dialogs/site-edit.js b/data/assets/js/admin/dialogs/site-edit.js new file mode 100644 index 0000000..5a35073 --- /dev/null +++ b/data/assets/js/admin/dialogs/site-edit.js @@ -0,0 +1,18 @@ +jQuery(function($) { + "use strict"; + + $('#site-edit-dialog').on('show.bs.modal', function() { + var me = $(this); + + send('site/get', { + site_id: me.data('site_id'), + }).fail(function(r) { + gripe(r, 'get site'); + }).done(function(r) { + me.trigger({ + type: 'guff.loaded', + site_data: r, + }); + }); + }); +}); diff --git a/data/assets/js/admin/dialogs/site.js b/data/assets/js/admin/dialogs/site.js new file mode 100644 index 0000000..e35d389 --- /dev/null +++ b/data/assets/js/admin/dialogs/site.js @@ -0,0 +1,94 @@ +jQuery(function($) { + "use strict"; + + // cache dialogs + var DIALOGS = DATA.site_dialogs; + + $.each(DIALOGS.paths, function(dialog_id, save_path) { + var p = '#site-' + dialog_id + '-'; + + $(p + 'dialog').on('show.bs.modal', function() { + var me = $(this); + + // show spinner + me.find('.modal-body').addClass('hidden'); + me.find('.modal-body.loading').removeClass('hidden'); + }).on('guff.loaded', function(ev) { + // populate text fields + $.each(DIALOGS.fields.text, function(_, id) { + $(p + id).val(ev.site_data[id]); + }); + + // populate textareas + $.each(DIALOGS.fields.list, function(_, id) { + $(p + id).val(ev.site_data[id].join("\n")); + }); + + // hide spinner, show body + $(this).find('.modal-body').toggleClass('hidden'); + }).on('shown.bs.modal', function() { + // show content tab + $(p + 'tab-content').click(); + + // focus name field + $(p + 'name').focus(); + }); + + $(p + 'dialog input[type="text"]').keydown(function(ev) { + if (ev.which == 13) { + setTimeout(function() { + $(p + 'confirm').click(); + }, 10); + + // stop event + return false; + } + }); + + $(p + 'name').keydown(function(ev) { + var me = $(this); + + setTimeout(function() { + $(p + 'slug').val(slugify(me.val())); + }, 10); + }); + + $(p + 'confirm').click(function() { + var me = $(this); + + if (me.hasClass('disabled')) + return false; + + // toggle loading + me.toggleClass('disabled').find('.loading').toggleClass('hidden'); + + // build args + var args = DIALOGS.fields.text.reduce(function(r, id) { + r[id] = $(p + id).val(); + return r; + }, DIALOGS.fields.list.reduce(function(r, id) { + r[id] = listify(p + id); + return r; + }, { + site_id: $(p + 'dialog').data('site_id'), + + // hard-code this for now + is_full_feed: 't', + })); + + // send request + send(save_path, args).always(function() { + // toggle loading + me.toggleClass('disabled').find('.loading').toggleClass('hidden'); + }).fail(function(r) { + gripe(r, dialog_id + ' site'); + }).done(function(r) { + $('#sites-reload').click(); + $(p + 'dialog').modal('hide'); + }); + + // stop event + return false; + }); + }); +}); diff --git a/data/assets/js/admin/tabs/sites.js b/data/assets/js/admin/tabs/sites.js index 8644705..1ed7b48 100644 --- a/data/assets/js/admin/tabs/sites.js +++ b/data/assets/js/admin/tabs/sites.js @@ -81,11 +81,12 @@ jQuery(function($) { })); }).done(function(r) { list.html($.map(r, function(row) { - var active = (row.is_active == '1'); + var is_default = !!+row.is_default; return TEMPLATES.run('site', $.extend({}, row, { q: [row.site_id, row.slug, row.name, row.body].join(' ').toLowerCase(), - badge_css: +row.is_default ? '' : 'hidden', + badge_css: is_default ? '' : 'hidden', + css: is_default ? 'list-group-item-warning' : '', })); }).join('')); @@ -108,9 +109,8 @@ jQuery(function($) { $('#sites .active').removeClass('active'); $(this).addClass('active'); - // TODO - // $('#site-edit-dialog').data('site_id', site_id).modal('show'); - alert('TODO: edit site ' + site_id); + // show dialog + $('#site-edit-dialog').data('site_id', site_id).modal('show'); // stop event return false; diff --git a/src/guff/views/dialogs/admin/site-add.cr b/src/guff/views/dialogs/admin/site-add.cr index c124457..50e051d 100644 --- a/src/guff/views/dialogs/admin/site-add.cr +++ b/src/guff/views/dialogs/admin/site-add.cr @@ -1,29 +1,14 @@ require "./site" class Guff::Views::Dialogs::Admin::SiteAdd < Guff::Views::Dialogs::Admin::Site - TABS = [{ - :id => "content", - :css => "active", - :icon => "fa-pencil", - :name => "Content", - :text => "View content tab.", - }, { - :id => "theme", - :css => "", - :icon => "fa-eye", - :name => "Theme", - :text => "View theme tab.", - }, { - :id => "other", - :css => "", - :icon => "fa-ellipsis-h", - :name => "Other", - :text => "View other tab.", - }] - - private def tabs - super("site-add", TABS) + def initialize(context : Context) + super( + context: context, + id: "site-add", + name: "New Site", + save_icon: "fa-plus-circle", + save_text: "Create site.", + save_name: "Create Site", + ) end - - ECR.def_to_s("src/views/dialogs/admin/site-add.ecr") end diff --git a/src/guff/views/dialogs/admin/site-edit.cr b/src/guff/views/dialogs/admin/site-edit.cr new file mode 100644 index 0000000..89dae69 --- /dev/null +++ b/src/guff/views/dialogs/admin/site-edit.cr @@ -0,0 +1,14 @@ +require "./site" + +class Guff::Views::Dialogs::Admin::SiteEdit < Guff::Views::Dialogs::Admin::Site + def initialize(context : Context) + super( + context: context, + id: "site-edit", + name: "Edit Site", + save_icon: "fa-save", + save_text: "Save changes.", + save_name: "Save Changes", + ) + end +end diff --git a/src/guff/views/dialogs/admin/site.cr b/src/guff/views/dialogs/admin/site.cr index c03cd0a..b916fd7 100644 --- a/src/guff/views/dialogs/admin/site.cr +++ b/src/guff/views/dialogs/admin/site.cr @@ -1,9 +1,44 @@ class Guff::Views::Dialogs::Admin::Site < Guff::Views::HTMLView + TABS = [{ + :id => "content", + :css => "active", + :icon => "fa-pencil", + :name => "Content", + :text => "View content tab.", + }, { + :id => "theme", + :css => "", + :icon => "fa-eye", + :name => "Theme", + :text => "View theme tab.", + }, { + :id => "other", + :css => "", + :icon => "fa-ellipsis-h", + :name => "Other", + :text => "View other tab.", + }] + OPTION_TEMPLATES = { y: "<option value='%s' data-slug='%s' selected='selected'>%s</option>", n: "<option value='%s' data-slug='%s'>%s</option>", } + def initialize( + context : Context, + @id : String, + @name : String, + @save_name : String, + @save_icon : String, + @save_text : String, + ) + super(context) + end + + protected def tabs + super(@id, TABS) + end + private def theme_options @context.models.theme.all.map { |row| { @@ -18,4 +53,6 @@ class Guff::Views::Dialogs::Admin::Site < Guff::Views::HTMLView OPTION_TEMPLATES[tmpl_id] % %i{id slug name}.map { |k| row[k] } }.join("") end + + ECR.def_to_s("src/views/dialogs/admin/site.ecr") end diff --git a/src/guff/views/pages/admin.cr b/src/guff/views/pages/admin.cr index 1c5f795..5ed95db 100644 --- a/src/guff/views/pages/admin.cr +++ b/src/guff/views/pages/admin.cr @@ -28,7 +28,9 @@ class Guff::Views::Pages::Admin < Guff::Views::HTMLView assets/js/admin/tabs/themes.js assets/js/admin/dialogs/user-add.js assets/js/admin/dialogs/user-edit.js + assets/js/admin/dialogs/site.js assets/js/admin/dialogs/site-add.js + assets/js/admin/dialogs/site-edit.js assets/js/admin/dialogs/post-edit.js assets/js/admin/dialogs/blog-edit.js assets/js/admin/dialogs/page-edit.js @@ -97,6 +99,7 @@ class Guff::Views::Pages::Admin < Guff::Views::HTMLView io << Dialogs::Admin::UserAdd.new(@context) io << Dialogs::Admin::UserEdit.new(@context) io << Dialogs::Admin::SiteAdd.new(@context) + io << Dialogs::Admin::SiteEdit.new(@context) io << Dialogs::Admin::BlogEdit.new(@context) io << Dialogs::Admin::PageEdit.new(@context) io << Dialogs::Admin::ProjectEdit.new(@context) @@ -104,12 +107,34 @@ class Guff::Views::Pages::Admin < Guff::Views::HTMLView end private def page_data + default_lang = "en-US" + default_theme_id = @context.models.theme.get_default_id + { post_types: POST_TYPES, sites: @context.models.site.get_sites, + + # TODO: refactor to defaults default_site_id: @context.models.site.get_default_id, - default_lang: "en-US", - default_theme_id: @context.models.theme.get_default_id, + default_lang: default_lang, + default_theme_id: default_theme_id, + + site_dialogs: { + paths: { + add: "site/add", + edit: "site/set", + }, + + fields: { + text: %w{name slug body lang theme_id}, + list: %w{domains styles scripts}, + + defaults: { + lang: default_lang, + theme_id: default_theme_id, + }, + }, + }, }.to_json end diff --git a/src/views/dialogs/admin/site-add.ecr b/src/views/dialogs/admin/site.ecr index 0f99364..fa5d7d7 100644 --- a/src/views/dialogs/admin/site-add.ecr +++ b/src/views/dialogs/admin/site.ecr @@ -1,4 +1,4 @@ -<div id='site-add-dialog' class='modal fade' role='dialog'> +<div id='<%= @id %>-dialog' class='modal fade' role='dialog'> <div class='modal-dialog modal-lg' role='document'> <div class='modal-content'> <div class='modal-header'> @@ -15,11 +15,16 @@ <h4 class='modal-title'> <i class='fa fa-plus-circle'></i> - New Site + <%= h(@name) %> </h4><!-- modal-title --> </div><!-- modal-header --> - <div class='modal-body'> + <div class='modal-body loading'> + <i class='fa fa-spinner fa-spin'></i> + Loading... + </div><!-- modal-body --> + + <div class='modal-body loading-done'> <div class='row'> <div class='col-md-3'> <ul class='nav nav-pills nav-stacked' role='tablist'><%= @@ -30,27 +35,27 @@ <div class='col-md-9'> <div class='tab-content'> <div - id='site-add-pane-content' + id='<%= @id %>-pane-content' class='tab-pane active' role='tabpanel' > <div class='row'> <div class='col-md-6'> <div class='form-group'> - <label for='site-add-name'> + <label for='<%= @id %>-name'> Name </label> <input type='text' - id='site-add-name' + id='<%= @id %>-name' class='form-control' title='Enter site name.' placeholder='Some Site' - aria-describedby='site-add-name-help' + aria-describedby='<%= @id %>-name-help' /> - <p id='site-add-name-help' class='help-block'> + <p id='<%= @id %>-name-help' class='help-block'> Site name. </p> </div><!-- form-group --> @@ -58,21 +63,21 @@ <div class='col-md-6'> <div class='form-group'> - <label for='site-add-slug'> + <label for='<%= @id %>-slug'> Slug </label> <input type='text' - id='site-add-slug' + id='<%= @id %>-slug' class='form-control' title='Enter site slug (lowercase).' readonly='readonly' placeholder='some-site' - aria-describedby='site-add-slug-help' + aria-describedby='<%= @id %>-slug-help' /> - <p id='site-add-slug-help' class='help-block'> + <p id='<%= @id %>-slug-help' class='help-block'> Name of files directory on server. </p> </div><!-- form-group --> @@ -80,71 +85,71 @@ </div><!-- row --> <div class='form-group'> - <label for='site-add-body'> + <label for='<%= @id %>-body'> Description </label> <textarea - id='site-add-body' + id='<%= @id %>-body' class='form-control' title='Enter site description.' placeholder='A brief site description' - aria-describedby='site-add-body-help' + aria-describedby='<%= @id %>-body-help' /></textarea> - <p id='site-add-body-help' class='help-block'> + <p id='<%= @id %>-body-help' class='help-block'> Brief description of site. </p> </div><!-- form-group --> <div class='form-group'> - <label for='site-add-domains'> + <label for='<%= @id %>-domains'> Domains </label> <textarea - id='site-add-domains' + id='<%= @id %>-domains' class='form-control' title='Newline-delimited list of site domains.' placeholder='some.example.com' - aria-describedby='site-add-domains-help' + aria-describedby='<%= @id %>-domains-help' /></textarea> - <p id='site-add-domains-help' class='help-block'> + <p id='<%= @id %>-domains-help' class='help-block'> Newline-deilmited list of site domains. </p> </div><!-- form-group --> </div><!-- tab-pane --> <div - id='site-add-pane-domains' + id='<%= @id %>-pane-domains' class='tab-pane' role='tabpanel' > </div><!-- tab-pane --> <div - id='site-add-pane-theme' + id='<%= @id %>-pane-theme' class='tab-pane' role='tabpanel' > <div class='row'> <div class='col-md-12'> <div class='form-group'> - <label for='site-add-theme_id'> + <label for='<%= @id %>-theme_id'> Theme </label> <select - id='site-add-theme_id' + id='<%= @id %>-theme_id' class='form-control' title='Choose site theme.' - aria-describedby='site-add-theme-help' + aria-describedby='<%= @id %>-theme-help' ><%= theme_options %></select> - <p id='site-add-theme-help' class='help-block'> + <p id='<%= @id %>-theme-help' class='help-block'> Site theme. </p> </div><!-- form-group --> @@ -154,18 +159,18 @@ <div class='row'> <div class='col-md-6'> <div class='form-group'> - <label for='site-add-styles'> + <label for='<%= @id %>-styles'> Styles </label> <textarea - id='site-add-styles' + id='<%= @id %>-styles' class='form-control asset-list' title='Newline-delimited site styles.' - aria-describedby='site-add-styles-help' + aria-describedby='<%= @id %>-styles-help' ></textarea> - <p id='site-add-styles-help' class='help-block'> + <p id='<%= @id %>-styles-help' class='help-block'> Newline-delimited site styles. </p> </div><!-- form-group --> @@ -173,18 +178,18 @@ <div class='col-md-6'> <div class='form-group'> - <label for='site-add-scripts'> + <label for='<%= @id %>-scripts'> Scripts </label> <textarea - id='site-add-scripts' + id='<%= @id %>-scripts' class='form-control asset-list' title='Newline-delimited site scripts.' - aria-describedby='site-add-scripts-help' + aria-describedby='<%= @id %>-scripts-help' ></textarea> - <p id='site-add-scripts-help' class='help-block'> + <p id='<%= @id %>-scripts-help' class='help-block'> Newline-delimited site scripts. </p> </div><!-- form-group --> @@ -193,26 +198,26 @@ </div><!-- tab-pane --> <div - id='site-add-pane-other' + id='<%= @id %>-pane-other' class='tab-pane' role='tabpanel' > <div class='row'> <div class='col-md-12'> <div class='form-group'> - <label for='site-add-lang'> + <label for='<%= @id %>-lang'> Language </label> <input type='text' - id='site-add-lang' + id='<%= @id %>-lang' class='form-control' title='Enter site IETF language tag (BCP 47).' - aria-describedby='site-add-lang-help' + aria-describedby='<%= @id %>-lang-help' /> - <p id='site-add-lang-help' class='help-block'> + <p id='<%= @id %>-lang-help' class='help-block'> <a href='https://en.wikipedia.org/wiki/IETF_language_tag' title='View IETF language tag information.' @@ -231,9 +236,9 @@ <div class='modal-footer'> <button - id='site-add-confirm' + id='<%= @id %>-confirm' class='btn btn-primary' - title='Create site.' + title='<%= h(@save_text) %>' > <span class='hidden loading'> <i class='fa fa-spinner fa-spin'></i> @@ -241,8 +246,8 @@ </span> <span class='loading'> - <i class='fa fa-plus-circle'></i> - Create Site + <i class='fa <%= h(@save_icon) %>'></i> + <%= h(@save_name) %> </span> </button> |