refactor site dialogs and add site editing

5 files changed, 135 insertions, 69 deletions

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>