From 159acac9b671539e279cbb2d4347a22e9683b626 Mon Sep 17 00:00:00 2001
From: Reinier Balt <lrbalt@gmail.com>
Date: Mon, 26 Aug 2013 12:08:33 +0200
Subject: [PATCH] add forms for new todo and multiple todos to modal

AJAX is not enabled yet
---
 app/assets/stylesheets/tracks.css.scss        |  7 ++
 app/helpers/todos_helper.rb                   |  7 ++
 app/views/shared/_add_new_action.html.erb     | 31 ++++---
 app/views/todos/_new_multi_todo_form.html.erb | 48 +++++-----
 app/views/todos/_new_todo_form.html.erb       | 87 +++++++++----------
 5 files changed, 93 insertions(+), 87 deletions(-)

diff --git a/app/assets/stylesheets/tracks.css.scss b/app/assets/stylesheets/tracks.css.scss
index 5bbf0883..877c5412 100644
--- a/app/assets/stylesheets/tracks.css.scss
+++ b/app/assets/stylesheets/tracks.css.scss
@@ -200,6 +200,13 @@ div.paginate_header {
 	text-align: center;
 }
 
+/* Todo form */
+form#todo-form-new-action {
+	.control-group {
+		margin-bottom: 10px;
+	}
+}
+
 /* Generic */
 
 div.hide_me {
diff --git a/app/helpers/todos_helper.rb b/app/helpers/todos_helper.rb
index 91e702c7..e6e44aac 100644
--- a/app/helpers/todos_helper.rb
+++ b/app/helpers/todos_helper.rb
@@ -123,6 +123,13 @@ module TodosHelper
       }
   end
 
+  def todo_form_control_group (label_for, label)
+    content_tag(:div, class: "control-group") do
+      content_tag(:label, class: "control-label", for: label_for){label} +
+      content_tag(:div, class:"controls") { yield }
+    end
+  end
+
   # === helpers for rendering a todo
 
   def todo_notes(todo)
diff --git a/app/views/shared/_add_new_action.html.erb b/app/views/shared/_add_new_action.html.erb
index 456593fb..ff17ab26 100644
--- a/app/views/shared/_add_new_action.html.erb
+++ b/app/views/shared/_add_new_action.html.erb
@@ -1,17 +1,22 @@
 <div id="tracks-add-action-dialog" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
-	<div class="modal-header">
-		<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
-		<h3 id="myModalLabel">Add new action</h3>
-	</div>
-	<div class="modal-body">
+  <div class="modal-header">
+    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
+    <h3 id="myModalLabel">Add new action</h3>
+  </div>
+  <div class="modal-body">
     <ul class="nav nav-tabs">
-	    <li class="active"><a href="#one-action" data-toggle="tab">Action</a></li>
-	    <li><a href="#multi-action" data-toggle="tab">Multiple actions</a></li>
-	    <li><a href="#repeat-action" data-toggle="tab">Repeating actions</a></li>
+      <li class="active"><a href="#one-action" data-toggle="tab">Action</a></li>
+      <li><a href="#multi-action" data-toggle="tab">Multiple actions</a></li>
+      <li><a href="#repeat-action" data-toggle="tab">Repeating actions</a></li>
     </ul>
-	</div>
-	<div class="modal-footer">
-		<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
-		<button class="btn btn-primary">Save changes</button>
-	</div>
+  </div>
+  <div class="tab-content">
+    <div class="tab-pane active" id="one-action"><%= render partial: "todos/new_todo_form", :object => Todo.new %></div>
+    <div class="tab-pane" id="multi-action"><%= render partial: "todos/new_multi_todo_form", :object => Todo.new %></div>
+    <div class="tab-pane" id="repeat-action"><p>WIP:repeating actions</p></div>
+  </div>
+  <div class="modal-footer">
+    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
+    <button class="btn btn-primary">Save changes</button>
+  </div>
 </div>
\ No newline at end of file
diff --git a/app/views/todos/_new_multi_todo_form.html.erb b/app/views/todos/_new_multi_todo_form.html.erb
index 1330999a..5924f46d 100644
--- a/app/views/todos/_new_multi_todo_form.html.erb
+++ b/app/views/todos/_new_multi_todo_form.html.erb
@@ -1,9 +1,9 @@
 <%- todo = new_multi_todo_form -%>
-
-<div id="todo_multi_add" style="display:none">
-  <%= form_for(todo, :html=> { :id=>'todo-form-multi-new-action', :name=>'todo', :class => 'inline-form' }) do |t| %>
+<%= form_for(todo, :html=> { :id=>'todo-form-multi-new-action', :name=>'todo', :class => 'form-horizontal' }) do |t| %>
+  <fieldset>
     <input id="default_project_name_id" name="default_project_name" type="hidden" value="<%=h @initial_project_name-%>" />
     <input id="default_context_name_id" name="default_context_name" type="hidden" value="<%=h @initial_context_name-%>" />
+    <%= hidden_field_tag "initial_tag_list", @initial_tags %>
 
     <div id="multiple_error_status">
     <% if todo.errors.any? -%>
@@ -15,33 +15,25 @@
     <% end -%>
     </div>
 
-    <label for="todo_notes"><%= t('shared.multiple_next_actions') %></label>
-    <%= text_area_tag( "todo[multiple_todos]", "", :cols => 29, :rows => 6, :tabindex => next_tab_index) %>
+    <%= todo_form_control_group("todo_notes", t('shared.multiple_next_actions')) do -%>
+      <%= text_area_tag( "todo[multiple_todos]", "", :cols => 29, :rows => 6) %>
+    <% end -%>
 
-    <label for="todo_project_name"><%= t('shared.project_for_all_actions') %></label>
-    <input id="multi_todo_project_name" name="project_name" autocomplete="off" tabindex="<%= next_tab_index%>" size="30" type="text" value="<%=h @initial_project_name %>" />
-    <div class="page_name_auto_complete" id="project_list" style="display:none"></div>
+    <%= todo_form_control_group("todo_project_name", t('shared.project_for_all_actions')) do -%>
+      <input id="multi_todo_project_name" name="project_name" autocomplete="off" size="30" type="text" value="<%=h @initial_project_name %>" />
+    <% end -%>
 
-    <label for="todo_context_name"><%= t('shared.context_for_all_actions') %></label>
-    <input id="multi_todo_context_name" name="context_name" autocomplete="off" tabindex="<%= next_tab_index%>" size="30" type="text" value="<%=h @initial_context_name %>" />
-    <div class="page_name_auto_complete" id="context_list" style="display:none"></div>
+    <%= todo_form_control_group("todo_context_name", t('shared.context_for_all_actions')) do -%>
+      <input id="multi_todo_context_name" name="context_name" autocomplete="off" size="30" type="text" value="<%=h @initial_context_name %>" />
+    <% end -%>
 
-    <label for="tag_list"><%= t('shared.tags_for_all_actions') %></label>
-    <%= hidden_field_tag "initial_tag_list", @initial_tags%>
-    <%= text_field_tag "multi_tag_list", @initial_tags, :name=>:tag_list, :size => 30, :tabindex => next_tab_index %>
-    <%= content_tag("div", "", :id => "tag_list_auto_complete", :class => "auto_complete") %>
+    <%= todo_form_control_group("tag_list", t('shared.tags_for_all_actions')) do -%>
+      <%= text_field_tag "multi_tag_list", @initial_tags, :name=>:tag_list, :size => 30 %>
+    <% end -%>
 
-    <%= check_box_tag('todos_sequential', 'true', false, {:tabindex => next_tab_index}) %>
-    <label for="todos_sequential"><%= t('shared.make_actions_dependent') %></label>
+    <%= todo_form_control_group("todos_sequential", t('shared.make_actions_dependent')) do -%>
+      <%= check_box_tag('todos_sequential', 'true', false) %>
+    <% end -%>
 
-    <div class="submit_box">
-      <div class="widgets">
-        <button type="submit" class="positive" id="todo_multi_new_action_submit" tabindex="<%= next_tab_index%>">
-          <%=  image_tag("accept.png", :alt => "") %><%= t('shared.add_actions') %>
-        </button>
-      </div>
-    </div>
-
-  <% end -%>
-
-</div>
+  </fieldset>
+<% end -%>
\ No newline at end of file
diff --git a/app/views/todos/_new_todo_form.html.erb b/app/views/todos/_new_todo_form.html.erb
index bc616a86..102f7574 100644
--- a/app/views/todos/_new_todo_form.html.erb
+++ b/app/views/todos/_new_todo_form.html.erb
@@ -1,65 +1,60 @@
 <%- todo = new_todo_form -%>
-
-<div id="todo_new_action">
-  <%= form_for(todo, :html=> { :id=>'todo-form-new-action', :name=>'todo', :class => 'inline-form new_todo_form' }) do |t|%>
-    <input id="default_project_name_id" name="default_project_name" type="hidden" value="<%= h(@initial_project_name)-%>" />
-    <input id="default_context_name_id" name="default_context_name" type="hidden" value="<%= h(@initial_context_name)-%>" />
-    <input type="hidden" id="new_todo_starred" name="new_todo_starred" value="false" />
+<%= form_for(todo, :html=> { :id=>'todo-form-new-action', :name=>'todo', :class => 'form-horizontal' }) do |t|%>
+  <fieldset>
+    <input id="default_project_name_id" name="default_project_name" type="hidden" value="<%= h(@initial_project_name)-%>"/>
+    <input id="default_context_name_id" name="default_context_name" type="hidden" value="<%= h(@initial_context_name)-%>"/>
+    <input id="new_todo_starred"        name="new_todo_starred"     type="hidden" value="false"/>
+    <%= hidden_field_tag :_tag_name, @tag_name.underscore.gsub(/\s+/,'_') if source_view_is :tag -%>
+    <%= hidden_field_tag "initial_tag_list", @initial_tags%>
+    <%= source_view_tag( @source_view ) %>
 
     <div id="error_status">
       <%= get_list_of_error_messages_for(todo) %>
     </div>
 
-    <label for="todo_description" style="float:left"><%= Todo.human_attribute_name('description') %></label>
-    <a href="#" id="new_todo_starred_link" class="undecorated_link" ><%= image_tag("blank.png", :title =>t('todos.star_action'), :class => "todo_star", :style=> "float: right")%></a>
-    <%= t.text_field("description", "size" => 30, "tabindex" => next_tab_index, "maxlength" => 100, "autocomplete" => "off", :autofocus => 1) %>
+    <%= todo_form_control_group("todo_starred", "Starred") do -%>
+      <i class="icon-star-empty"></i>
+    <% end -%>
 
-    <label for="todo_notes"><%= Todo.human_attribute_name('notes') %></label>
-    <%= t.text_area("notes", "cols" => 29, "rows" => 6, "tabindex" => next_tab_index) %>
+    <%= todo_form_control_group("todo_description", Todo.human_attribute_name('description')) do -%>
+      <%= t.text_field("description", 
+            "size" => 30, "maxlength" => 100, "autocomplete" => "off", 
+            placeholder: "Description of action", :autofocus => 1) 
+        %>
+    <% end -%>
 
-    <label for="todo_project_name"><%= Todo.human_attribute_name('project') %></label>
-    <input id="todo_project_name" name="project_name" autocomplete="off" tabindex="<%= next_tab_index%>" size="30" type="text" value="<%= h(@initial_project_name) %>" />
-    <div class="page_name_auto_complete" id="project_list" style="display:none"></div>
+    <%= todo_form_control_group("todo_notes", Todo.human_attribute_name('notes')) do -%>
+      <%= t.text_area("notes", "cols" => 29, "rows" => 6) %>
+    <% end -%>
 
-    <label for="todo_context_name"><%= Todo.human_attribute_name('context') %></label>
-    <input id="todo_context_name" name="context_name" autocomplete="off" tabindex="<%= next_tab_index%>" size="30" type="text" value="<%= h(@initial_context_name) %>" />
+    <%= todo_form_control_group("todo_project_name", Todo.human_attribute_name('project')) do -%>
+      <input id="todo_project_name" name="project_name" autocomplete="off" size="30" type="text" value="<%= h(@initial_project_name) %>"/>
+    <% end -%>
 
-    <label for="tag_list"><%= Todo.human_attribute_name('tags') + ' (' + t('shared.separate_tags_with_commas') + ')' %></label>
-    <%= hidden_field_tag "initial_tag_list", @initial_tags%>
-    <%= text_field_tag "tag_list", @initial_tags, :size => 30, :tabindex => next_tab_index %>
-    <%= content_tag("div", "", :id => "tag_list_auto_complete", :class => "auto_complete") %>
+    <%= todo_form_control_group("todo_context_name", Todo.human_attribute_name('context')) do -%>
+      <input id="todo_context_name" name="context_name" autocomplete="off" size="30" type="text" value="<%= h(@initial_context_name) %>"/>
+    <% end -%>
 
-    <div class="due_input">
-      <label for="todo_due"><%= Todo.human_attribute_name('due') %></label>
-      <%= t.text_field("due", "size" => 12, "class" => "Date", "tabindex" => next_tab_index, "autocomplete" => "off") %>
-    </div>
+    <%= todo_form_control_group("tag_list", Todo.human_attribute_name('tags')) do -%>
+      <%= text_field_tag "tag_list", @initial_tags, :size => 30, placeholder: t('shared.separate_tags_with_commas') %>
+    <% end -%>
 
-    <div class="show_from_input">
-      <label for="todo_show_from"><%= Todo.human_attribute_name('show_from') %></label>
-      <%= t.text_field("show_from", "size" => 12, "class" => "Date", "tabindex" => next_tab_index, "autocomplete" => "off") %>
-    </div>
+    <%= todo_form_control_group("todo_due", Todo.human_attribute_name('due')) do -%>
+      <%= t.text_field("due", "size" => 12, "class" => "Date", "autocomplete" => "off") %>
+    <% end -%>
 
-    <div class="depends_on">
-      <label for="predecessor_ul"><%= Todo.human_attribute_name('predecessors')%></label>
+    <%= todo_form_control_group("todo_show_from", Todo.human_attribute_name('show_from')) do -%>
+      <%= t.text_field("show_from", "size" => 12, "class" => "Date", "autocomplete" => "off") %>
+    <% end -%>
+
+    <%= todo_form_control_group("predecessor_ul", Todo.human_attribute_name('predecessors')) do -%>
       <div class="selected_predecessors">
         <ul class="predecessor_list" id="predecessor_ul" style="display:none">
         </ul>
       </div>
       <label id="label_for_predecessor_input" for="predecessor_input" style="display:none"><%= t('todos.add_another_dependency')%></label>
-      <%= text_field_tag "predecessor_input", nil, :size => 30, :tabindex => next_tab_index %>
-      <%= hidden_field_tag "predecessor_list", ""%>
-    </div>
+      <%= text_field_tag "predecessor_input", nil, :size => 30%>
+    <% end -%>
 
-    <%= source_view_tag( @source_view ) %>
-    <%= hidden_field_tag :_tag_name, @tag_name.underscore.gsub(/\s+/,'_') if source_view_is :tag %>
-
-    <div class="submit_box">
-      <div class="widgets">
-        <button type="submit" class="positive" id="todo_new_action_submit" tabindex="<%= next_tab_index%>">
-          <%=  image_tag("accept.png", :alt => "") + t('shared.add_action') %>
-        </button>
-      </div>
-    </div>
-
-  <% end # form_for -%>
-</div>
+  </fieldset>
+<% end # form_for -%>
\ No newline at end of file