From 1fae810aceabe13f7ebe717588199b985b3a3e27 Mon Sep 17 00:00:00 2001 From: briley Date: Tue, 18 Jul 2017 12:19:47 -0700 Subject: [PATCH 1/8] started work on plan write redesign --- app/views/annotations/_show.html.erb | 10 + app/views/answers/_new_edit.html.erb | 190 ++++++------ app/views/guidance_groups/_show.html.erb | 8 + app/views/guidances/untitled.txt | 0 ....html.erb => _DELETE_answer_form.html.erb} | 0 .../{_note.html.erb => _DELETE_note.html.erb} | 0 app/views/phases/edit.html.erb | 274 +++++++++++++----- lib/assets/stylesheets/dmproadmap/forms.scss | 8 + 8 files changed, 325 insertions(+), 165 deletions(-) create mode 100644 app/views/annotations/_show.html.erb create mode 100644 app/views/guidance_groups/_show.html.erb create mode 100644 app/views/guidances/untitled.txt rename app/views/phases/{_answer_form.html.erb => _DELETE_answer_form.html.erb} (100%) rename app/views/phases/{_note.html.erb => _DELETE_note.html.erb} (100%) diff --git a/app/views/annotations/_show.html.erb b/app/views/annotations/_show.html.erb new file mode 100644 index 0000000000..0530e84e13 --- /dev/null +++ b/app/views/annotations/_show.html.erb @@ -0,0 +1,10 @@ + +<% if annotation.type == :example_answer %> +

<%= _('Example Answer') %>

+<% elsif annotation.type == :guidance %> +

<%= _('Guidance') %>

+<% else %> +

<%= _('Annotation') %>

+<% end %> + +

<%= raw annotation.text %>

diff --git a/app/views/answers/_new_edit.html.erb b/app/views/answers/_new_edit.html.erb index 2434033380..b2ef8b179e 100644 --- a/app/views/answers/_new_edit.html.erb +++ b/app/views/answers/_new_edit.html.erb @@ -2,100 +2,106 @@ This partial creates a form for each type of question. The local variables are: plan, answer, question, readonly --> <% q_format = question.question_format %> -<%= semantic_form_for answer, :url => {controller: :answers, action: :update }, html: {method: "put", class: "roadmap-form", 'data-autosave': question.id }, remote: true do |f| %> -
- <% if !readonly %> - <%= f.input :id, as: :hidden, input_html: { value: answer.id } %> - <%= f.input :plan_id, as: :hidden, input_html: { value: answer.plan_id } %> - <%= f.input :user_id, as: :hidden, input_html: { value: answer.user_id } %> - <%= f.input :question_id, as: :hidden, input_html: { value: answer.question_id } %> - <%= f.input :lock_version, as: :hidden, input_html: { value: answer.lock_version } %> - <% end %> +<%= form_for answer, url: {controller: :answers, action: :update}, html: {method: :put, class: "roadmap-form", 'data-autosave': question.id}, remote: true do |f| %> +
+ <% if !readonly %> + <%= f.hidden_field :id %> + <%= f.hidden_field :plan_id %> + <%= f.hidden_field :user_id %> + <%= f.hidden_field :question_id %> + <%= f.hidden_field :lock_version %> + <% end %> - -

- <%= raw question.text %> -

+
+ + <% if question.option_based? %> + <%= f.label raw(question.text), for: :question_option_ids, class: "no-colon" %> + <% else %> + <%= f.label raw(question.text), for: :text, class: "no-colon" %> + <% end %> + + + <% if !readonly && question.annotations.where(type: Annotation.types[:example_answer]).any? %> + <% annotation = question.annotations.where(type: Annotation.types[:example_answer]).order(:created_at).first %> + <% if annotation.text.present? %> +
+ + <%="#{annotation.org.abbreviation} "%> <%=_('Example of answer')%> + - - <% if !readonly && question.annotations.where(type: Annotation.types[:example_answer]).any? %> - <% annotation = question.annotations.where(type: Annotation.types[:example_answer]).order(:created_at).first %> - <% if annotation.text.present? %> -
- - <%="#{annotation.org.abbreviation} "%> <%=_('Example of answer')%> - +
+

<%= raw annotation.text %>

+
+
+ <% end %> + <% end %> -
-

- <%= raw annotation.text %> -

-
-
- <% end %> - <% end %> + <% if question.option_based? %> + <% options = question.question_options.by_number %> + <% if q_format.checkbox? %> +
    + <% options.each do |op| %> +
  1. + <%= f.check_box(:question_option_ids, { multiple: true, checked: answer.has_question_option(op.id), disabled: readonly }, op.id, nil) %> + <%= raw op.text %> +
    2. + <% end %> +
+ <% elsif q_format.radiobuttons? %> +
    + <% options.each do |op| %> +
  1. + <%= f.radio_button :question_option_ids, op.id, { checked: answer.has_question_option(op.id), id: "answer_option_ids_#{op.id}", disabled: readonly } %> + <%= raw op.text %> +
    2. + <% end %> +
+ <% elsif q_format.dropdown? || q_format.multiselectbox? %> + <% + options_html = "" + options.each do |op| + options_html += answer.has_question_option(op.id) ? + "" : + "" + end + %> + <%= select_tag('answer[question_option_ids]', raw(options_html), + {multiple: q_format.multiselectbox?, include_blank: q_format.dropdown?, disabled: readonly }) %> + <% end %> + + <% if question.option_comment_display == true %> + <%= label_tag('answer[text]', _('Comment')) %> + <% if readonly %> +

<%= raw(answer.text) %>

+ <% else %> + <%= text_area_tag('answer[text]', answer.text, id: "answer-text-#{question.id}") %> + <%= tinymce(selector: "#answer-text-#{question.id}", setup: "$.fn.tinymce_answer_events", content_css: asset_path('application.css')) %> + <% end %> + <%end%> - <% if question.option_based? %> - <% options = question.question_options.by_number %> - <% if q_format.checkbox? %> -
    - <% options.each do |op| %> -
  1. - <%= f.check_box(:question_option_ids, { multiple: true, checked: answer.has_question_option(op.id), disabled: readonly }, op.id, nil) %> - <%= raw op.text %> -
    2. - <% end %> -
- <% elsif q_format.radiobuttons? %> -
    - <% options.each do |op| %> -
  1. - <%= f.radio_button :question_option_ids, op.id, { checked: answer.has_question_option(op.id), id: "answer_option_ids_#{op.id}", disabled: readonly } %> - <%= raw op.text %> -
    2. - <% end %> -
- <% elsif q_format.dropdown? || q_format.multiselectbox? %> - <% - options_html = "" - options.each do |op| - options_html += answer.has_question_option(op.id) ? - "" : - "" - end - %> - <%= select_tag('answer[question_option_ids]', raw(options_html), - {multiple: q_format.multiselectbox?, include_blank: q_format.dropdown?, disabled: readonly }) %> - <% end %> - - <% if question.option_comment_display == true %> - <%= label_tag('answer[text]', _('Comment')) %> - <% if readonly %> -

<%= raw(answer.text) %>

- <% else %> - <%= text_area_tag('answer[text]', answer.text, id: "answer-text-#{question.id}") %> - <%= tinymce(selector: "#answer-text-#{question.id}", setup: "$.fn.tinymce_answer_events", content_css: asset_path('application.css')) %> - <% end %> - <%end%> - <% end %> - - <% if q_format.textfield? %> - <% if readonly %> -

<%= strip_tags(answer.text) %>

- <% else %> - <%= text_field_tag('answer[text]', strip_tags(answer.text)) %> - <% end %> - <% elsif q_format.textarea? %> - <% if readonly %> -

<%= raw(answer.text) %>

- <% else %> - <%= text_area_tag('answer[text]', answer.text, id: "answer-text-#{question.id}") %> - <%= tinymce(selector: "#answer-text-#{question.id}", setup: "$.fn.tinymce_answer_events", content_css: asset_path('application.css')) %> - <% end %> - <% end %> + + <% elsif q_format.textfield? %> + <% if readonly %> +

<%= strip_tags(answer.text) %>

+ <% else %> + <%= text_field_tag('answer[text]', strip_tags(answer.text)) %> + <% end %> + + <% elsif q_format.textarea? %> + <% if readonly %> +

<%= raw(answer.text) %>

+ <% else %> + <%= text_area_tag('answer[text]', answer.text, id: "answer-text-#{question.id}") %> + <%= tinymce(selector: "#answer-text-#{question.id}", setup: "$.fn.tinymce_answer_events", content_css: asset_path('application.css')) %> + <% end %> + <% end %> - <% if !readonly %> - - <% end %> -
- <% end %> \ No newline at end of file + + + <% if !readonly %> +
+ +
+ <% end %> +
+<% end %> \ No newline at end of file diff --git a/app/views/guidance_groups/_show.html.erb b/app/views/guidance_groups/_show.html.erb new file mode 100644 index 0000000000..060a8f3c0a --- /dev/null +++ b/app/views/guidance_groups/_show.html.erb @@ -0,0 +1,8 @@ +

+ <%= group[:org] %> guidance on <%= theme %> + +

+ +
+
<%= raw group[:text] %>
+
\ No newline at end of file diff --git a/app/views/guidances/untitled.txt b/app/views/guidances/untitled.txt new file mode 100644 index 0000000000..e69de29bb2 diff --git a/app/views/phases/_answer_form.html.erb b/app/views/phases/_DELETE_answer_form.html.erb similarity index 100% rename from app/views/phases/_answer_form.html.erb rename to app/views/phases/_DELETE_answer_form.html.erb diff --git a/app/views/phases/_note.html.erb b/app/views/phases/_DELETE_note.html.erb similarity index 100% rename from app/views/phases/_note.html.erb rename to app/views/phases/_DELETE_note.html.erb diff --git a/app/views/phases/edit.html.erb b/app/views/phases/edit.html.erb index 1652259a8d..a9e8349e60 100644 --- a/app/views/phases/edit.html.erb +++ b/app/views/phases/edit.html.erb @@ -39,85 +39,213 @@
-
- -
- <% i = 0 %> - <% @phase.sections.order(:number).each do |section| %> - - <% sectionid = section.id %> -

- <%= render :partial => "/sections/progress", locals: { section: section, plan: @plan } %> - -

-
- -

<%= raw section.description %>

- -
- - - - - - -
- <% section.questions.each do |question| %> - <% if question.id == session[:question_id_comments].to_i then id_css = "current_question" end %> -
- - <% guidances = @question_guidance[question.id] %> - - <%= render partial: 'answer_form', - locals: { - plan: @plan, - question: question, - question_guidances: guidances, - last_question_id: section.questions.last.id, - readonly: @readonly - } - %> +
+ +
+ <% i = 0 %> + <% @phase.sections.order(:number).each do |section| %> + <% sectionid = section.id %> + +

+ <%= render :partial => "/sections/progress", locals: { section: section, plan: @plan } %> + +

+ +
+ +

<%= raw section.description %>

+ + + + + +
+ <% section.questions.each do |question| %> + <% if question.id == session[:question_id_comments].to_i then id_css = "current_question" end %> +
+ + +
+ <% + # Load the answer or create a new one + answers = question.plan_answers(@plan.id) + if answers.present? + answer = answers.first + else + answer = Answer.new({plan_id: @plan.id, + question_id: question.id, + user_id: current_user.id }) + if question.default_value.present? + answer.text = question.default_value + end + end + %> +
+
" class="answer-locking">
+
"> + <%= render(partial: 'answers/new_edit', + locals: { question: question, answer: answer, readonly: @readonly }) %> +
+
" class="answer-status"> + <%= render(partial: 'answers/status', locals: { answer: answer }) %> +
+
+
+ + +
+
+ <% comments = answer.notes.all %> + <% active_tab = nil %> + <%= hidden_field_tag :question_id, question.id, class: "question_id" %> + + +
    + <% annotations = question.annotations.where(type: Annotation.types[:guidance]) %> + <% if annotations.present? || question_guidances.present? %> + <% active_tab = 'guidance_tab' %> + + <% else %> + <% active_tab = 'note_tab' %> + <% end %> + +
  • " role="tab" + aria-controls="comment-question-area-<%= question.id %>"> + <% if comments.length > 0 %> + <%= _('Notes') %> + <% else %> + <%= _('Share note') %> + <% end %> +
    • +
+ +
+
+ + +
+ + <% num_annotations = 0 %> + <% i = 0 %> + <% if annotations.present? %> + <% annotations.each do |annotation| %> + <%= render partial: 'annotations/show', locals: {annotation: annotation} %> + <% num_annotations += 1%> + <% i += 1 %> + <% end %> + <% end %> + + + <% guidances = @question_guidance[question.id] %> + <% guidance_accordion_id = num_annotations %> + <% guidances.each_pair do |theme, groups| %> + <% groups.each do |group| %> + <%= render partial: 'guidance_groups/show', + locals: {group: group, theme: theme, i: i, question: question, + guidance_accordion_id: guidance_accordion_id} %> + + <% guidance_accordion_id += 1 %> + <% i += 1 %> + <% end %> + <% end %> +
+ +
+ +
+ + + <% if answer.present? && answer.notes.any? %> + <% notes = answer.notes.all.to_a.sort! {|x,y| y.updated_at <=> x.updated_at } %> + <% questionid = question.id %> + <%= hidden_field_tag :question_id, questionid, class: "question_id" %> + + +
+ <%= link_to _('Add note'), "#question-form-#{questionid}", + class: "btn btn-primary add_comment_button", + onclick: "add_note_button(#{questionid})", + role: "button" %> +
+ +
+ + + <%= render partial: "/notes/list", + locals: {question_id: question.id, notes: notes, plan: @plan} %> + +
+ + + + <% else %> + <%= render partial: "/notes/add", + locals: {answer: answer, question: question, plan_id: @plan.id }%> + <% end%> +
+ +
+
+
+ +
- <% end %> -
-
- - - +
+ <%= _('Cancel')%> + <%= _('Discard')%> + <%= _('Save')%> +
+
- <% i += 1 %> -
+ <% i += 1 %> - <% end %> -
+ <% end %> +
diff --git a/lib/assets/stylesheets/dmproadmap/forms.scss b/lib/assets/stylesheets/dmproadmap/forms.scss index 00cf3103f1..28494f651a 100644 --- a/lib/assets/stylesheets/dmproadmap/forms.scss +++ b/lib/assets/stylesheets/dmproadmap/forms.scss @@ -701,6 +701,14 @@ td.plan-edit-actions { } } +/* Write plan */ +/* ------------------------------------------------ */ +#sections-accordion { + h2 { + font-size: 18px; + } +} + /* Org edit */ /* ------------------------------------------------ */ #edit_org_details { From b8c1b5cc3225ab964991e7f82e032c41991bd69f Mon Sep 17 00:00:00 2001 From: briley Date: Wed, 19 Jul 2017 08:26:24 -0700 Subject: [PATCH 2/8] separate write plan page logic into new partials DMPRoadmap/roadmap#494 --- app/views/phases/_answer_section.html.erb | 10 + app/views/phases/_guidance_section.html.erb | 106 ++++++++++ app/views/phases/edit.html.erb | 212 +++++--------------- lib/assets/javascripts/views/plans/edit.js | 35 +--- 4 files changed, 171 insertions(+), 192 deletions(-) create mode 100644 app/views/phases/_answer_section.html.erb create mode 100644 app/views/phases/_guidance_section.html.erb diff --git a/app/views/phases/_answer_section.html.erb b/app/views/phases/_answer_section.html.erb new file mode 100644 index 0000000000..ac63c247fc --- /dev/null +++ b/app/views/phases/_answer_section.html.erb @@ -0,0 +1,10 @@ +
+
" class="answer-locking">
+
"> + <%= render(partial: 'answers/new_edit', + locals: { question: question, answer: answer, readonly: @readonly }) %> +
+
" class="answer-status"> + <%= render(partial: 'answers/status', locals: { answer: answer }) %> +
+
\ No newline at end of file diff --git a/app/views/phases/_guidance_section.html.erb b/app/views/phases/_guidance_section.html.erb new file mode 100644 index 0000000000..32fd4c965c --- /dev/null +++ b/app/views/phases/_guidance_section.html.erb @@ -0,0 +1,106 @@ +
+ <% comments = answer.notes.all %> + <% active_tab = nil %> + <%= hidden_field_tag :question_id, question.id, class: "question_id" %> + + +
    + <% annotations = question.annotations.where(type: Annotation.types[:guidance]) %> + <% if annotations.present? || question_guidances.present? %> + <% active_tab = 'guidance_tab' %> + + <% else %> + <% active_tab = 'note_tab' %> + <% end %> + +
  • " role="tab" + aria-controls="comment-question-area-<%= question.id %>"> + <% if comments.length > 0 %> + <%= _('Notes') %> + <% else %> + <%= _('Share note') %> + <% end %> +
    • +
+ +
+
+ + +
+ + <% num_annotations = 0 %> + <% i = 0 %> + <% if annotations.present? %> + <% annotations.each do |annotation| %> + <%= render partial: 'annotations/show', locals: {annotation: annotation} %> + <% num_annotations += 1%> + <% i += 1 %> + <% end %> + <% end %> + + + <% guidances = @question_guidance[question.id] %> + <% guidance_accordion_id = num_annotations %> + <% guidances.each_pair do |theme, groups| %> + <% groups.each do |group| %> + <%= render partial: 'guidance_groups/show', + locals: {group: group, theme: theme, i: i, question: question, + guidance_accordion_id: guidance_accordion_id} %> + + <% guidance_accordion_id += 1 %> + <% i += 1 %> + <% end %> + <% end %> +
+ +
+ +
+ + + <% if answer.present? && answer.notes.any? %> + <% notes = answer.notes.all.to_a.sort! {|x,y| y.updated_at <=> x.updated_at } %> + <% questionid = question.id %> + <%= hidden_field_tag :question_id, questionid, class: "question_id" %> + + +
+ <%= link_to _('Add note'), "#question-form-#{questionid}", + class: "btn btn-primary add_comment_button", + onclick: "add_note_button(#{questionid})", + role: "button" %> +
+ +
+ + + <%= render partial: "/notes/list", + locals: {question_id: question.id, notes: notes, plan: @plan} %> + +
+ + + + <% else %> + <%= render partial: "/notes/add", + locals: {answer: answer, question: question, plan_id: @plan.id }%> + <% end%> +
+ +
+
\ No newline at end of file diff --git a/app/views/phases/edit.html.erb b/app/views/phases/edit.html.erb index a9e8349e60..ed748fea63 100644 --- a/app/views/phases/edit.html.erb +++ b/app/views/phases/edit.html.erb @@ -52,7 +52,7 @@ -
+

<%= raw section.description %>

@@ -69,178 +69,68 @@ <% if question.id == session[:question_id_comments].to_i then id_css = "current_question" end %>
+ <% + # Load the answer or create a new one + answers = question.plan_answers(@plan.id) + if answers.present? + answer = answers.first + else + answer = Answer.new({plan_id: @plan.id, + question_id: question.id, + user_id: current_user.id }) + if question.default_value.present? + answer.text = question.default_value + end + end + %> +
- <% - # Load the answer or create a new one - answers = question.plan_answers(@plan.id) - if answers.present? - answer = answers.first - else - answer = Answer.new({plan_id: @plan.id, - question_id: question.id, - user_id: current_user.id }) - if question.default_value.present? - answer.text = question.default_value - end - end - %> -
-
" class="answer-locking">
-
"> - <%= render(partial: 'answers/new_edit', - locals: { question: question, answer: answer, readonly: @readonly }) %> -
-
" class="answer-status"> - <%= render(partial: 'answers/status', locals: { answer: answer }) %> -
-
+ <%= render partial: 'answer_section', + locals: {plan: @plan, question: question, answer: answer, readonly: @readonly}%> +
+
-
- <% comments = answer.notes.all %> - <% active_tab = nil %> - <%= hidden_field_tag :question_id, question.id, class: "question_id" %> - - -
    - <% annotations = question.annotations.where(type: Annotation.types[:guidance]) %> - <% if annotations.present? || question_guidances.present? %> - <% active_tab = 'guidance_tab' %> - - <% else %> - <% active_tab = 'note_tab' %> - <% end %> - -
  • " role="tab" - aria-controls="comment-question-area-<%= question.id %>"> - <% if comments.length > 0 %> - <%= _('Notes') %> - <% else %> - <%= _('Share note') %> - <% end %> -
    • -
- -
-
- - -
- - <% num_annotations = 0 %> - <% i = 0 %> - <% if annotations.present? %> - <% annotations.each do |annotation| %> - <%= render partial: 'annotations/show', locals: {annotation: annotation} %> - <% num_annotations += 1%> - <% i += 1 %> - <% end %> - <% end %> - - - <% guidances = @question_guidance[question.id] %> - <% guidance_accordion_id = num_annotations %> - <% guidances.each_pair do |theme, groups| %> - <% groups.each do |group| %> - <%= render partial: 'guidance_groups/show', - locals: {group: group, theme: theme, i: i, question: question, - guidance_accordion_id: guidance_accordion_id} %> - - <% guidance_accordion_id += 1 %> - <% i += 1 %> - <% end %> - <% end %> -
- -
- -
- - - <% if answer.present? && answer.notes.any? %> - <% notes = answer.notes.all.to_a.sort! {|x,y| y.updated_at <=> x.updated_at } %> - <% questionid = question.id %> - <%= hidden_field_tag :question_id, questionid, class: "question_id" %> - - -
- <%= link_to _('Add note'), "#question-form-#{questionid}", - class: "btn btn-primary add_comment_button", - onclick: "add_note_button(#{questionid})", - role: "button" %> -
- -
- - - <%= render partial: "/notes/list", - locals: {question_id: question.id, notes: notes, plan: @plan} %> - -
- - - - <% else %> - <%= render partial: "/notes/add", - locals: {answer: answer, question: question, plan_id: @plan.id }%> - <% end%> -
- -
-
+ <%= render partial: 'guidance_section', + locals: {plan: @plan, question: question, answer: answer} %>
- -
-
- <% end %> +
+ <% end %>
-
- - - <% i += 1 %> diff --git a/lib/assets/javascripts/views/plans/edit.js b/lib/assets/javascripts/views/plans/edit.js index 322f903b8c..3061ab9087 100644 --- a/lib/assets/javascripts/views/plans/edit.js +++ b/lib/assets/javascripts/views/plans/edit.js @@ -1,34 +1,7 @@ $(document).ready(function(){ - $("#is_test").on('click, change', function(e){ - toggleVisibility(); - // If the test box is checked then update the visibility to 'is_test' - if($("#is_test").is(':checked')){ - $('#plan_visibility').val('is_test'); - }else{ - $('#plan_visibility').val(''); - } + $(".accordion-section").accordion({ + active: false, + collapsible: true, + heightStyle: "content" }); - - $("input[name='vis']").on('change', function(e){ - $('#plan_visibility').val($("input[name='vis']:checked").attr('id')); - }); - - toggleVisibility(); - - function toggleVisibility(){ - var test = $("#is_test").is(':checked'); - // If the test checkbox is true then disable the visibility dropdown - $("input[name='vis']").attr('aria-disabled', test).attr('disabled', test); - } - - /*---------------- - TODO: See if this is still necessary after redesign of Edit Plan page - Listener for click on buttons containing show-edit-toggle class - ------------------*/ - $(".show-edit-toggle").click(function (e) { - e.preventDefault(); - $(".edit-plan-details").toggle(); - $(".show-plan-details").toggle(); - }); - }); \ No newline at end of file From 6a1e258c15bf60255c4e408b29e2dd3436b8d821 Mon Sep 17 00:00:00 2001 From: briley Date: Wed, 19 Jul 2017 14:52:30 -0700 Subject: [PATCH 3/8] initial redesign of write plan page DMPRoadmap/roadmap#494 --- app/views/annotations/_show.html.erb | 19 +- app/views/answers/_new_edit.html.erb | 189 +++++++++--------- app/views/guidance_groups/_show.html.erb | 8 +- app/views/phases/_answer_section.html.erb | 10 - app/views/phases/_guidance_section.html.erb | 8 +- app/views/phases/edit.html.erb | 33 +-- app/views/plans/_progress.html.erb | 6 +- app/views/sections/_progress.html.erb | 24 +-- .../javascripts/dmproadmap/accordions.js | 21 +- lib/assets/javascripts/views/plans/edit.js | 6 +- .../stylesheets/dmproadmap/accordions.scss | 25 ++- lib/assets/stylesheets/dmproadmap/base.scss | 9 - lib/assets/stylesheets/dmproadmap/forms.scss | 96 +++++++++ 13 files changed, 287 insertions(+), 167 deletions(-) delete mode 100644 app/views/phases/_answer_section.html.erb diff --git a/app/views/annotations/_show.html.erb b/app/views/annotations/_show.html.erb index 0530e84e13..5cc67bbe36 100644 --- a/app/views/annotations/_show.html.erb +++ b/app/views/annotations/_show.html.erb @@ -1,10 +1,13 @@ -<% if annotation.type == :example_answer %> -

<%= _('Example Answer') %>

-<% elsif annotation.type == :guidance %> -

<%= _('Guidance') %>

-<% else %> -

<%= _('Annotation') %>

-<% end %> +

+ <% if annotation.type == :example_answer %> + <%= _('Example Answer') %> + <% elsif annotation.type == :guidance %> + <%= _('Guidance') %> + <% else %> + <%= plan.template.org.abbreviation %> + <% end %> + +

-

<%= raw annotation.text %>

+
<%= raw annotation.text %>
diff --git a/app/views/answers/_new_edit.html.erb b/app/views/answers/_new_edit.html.erb index b2ef8b179e..9fec1088a3 100644 --- a/app/views/answers/_new_edit.html.erb +++ b/app/views/answers/_new_edit.html.erb @@ -3,105 +3,108 @@ --> <% q_format = question.question_format %> <%= form_for answer, url: {controller: :answers, action: :update}, html: {method: :put, class: "roadmap-form", 'data-autosave': question.id}, remote: true do |f| %> -
- <% if !readonly %> - <%= f.hidden_field :id %> - <%= f.hidden_field :plan_id %> - <%= f.hidden_field :user_id %> - <%= f.hidden_field :question_id %> - <%= f.hidden_field :lock_version %> - <% end %> +
+ <% if !readonly %> + <%= f.hidden_field :id %> + <%= f.hidden_field :plan_id %> + <%= f.hidden_field :user_id %> + <%= f.hidden_field :question_id %> + <%= f.hidden_field :lock_version %> + <% end %> -
- - <% if question.option_based? %> - <%= f.label raw(question.text), for: :question_option_ids, class: "no-colon" %> - <% else %> - <%= f.label raw(question.text), for: :text, class: "no-colon" %> - <% end %> +
+ + <% if question.option_based? %> + <%= f.label raw(question.text), for: :question_option_ids, class: "no-colon" %> + <% else %> + <%= f.label raw(question.text), for: :text, class: "no-colon" %> + <% end %> - - <% if !readonly && question.annotations.where(type: Annotation.types[:example_answer]).any? %> - <% annotation = question.annotations.where(type: Annotation.types[:example_answer]).order(:created_at).first %> - <% if annotation.text.present? %> -
- - <%="#{annotation.org.abbreviation} "%> <%=_('Example of answer')%> - + + <% if !readonly && question.annotations.where(type: Annotation.types[:example_answer]).any? %> + <% annotation = question.annotations.where(type: Annotation.types[:example_answer]).order(:created_at).first %> + <% if annotation.text.present? %> +
+ + <%="#{annotation.org.abbreviation} "%> <%=_('Example of answer')%> + -
-

<%= raw annotation.text %>

-
-
- <% end %> - <% end %> +
+

<%= raw annotation.text %>

+
+
+ <% end %> + <% end %> - <% if question.option_based? %> - <% options = question.question_options.by_number %> - <% if q_format.checkbox? %> -
    - <% options.each do |op| %> -
  1. - <%= f.check_box(:question_option_ids, { multiple: true, checked: answer.has_question_option(op.id), disabled: readonly }, op.id, nil) %> - <%= raw op.text %> -
    2. - <% end %> -
- <% elsif q_format.radiobuttons? %> -
    - <% options.each do |op| %> -
  1. - <%= f.radio_button :question_option_ids, op.id, { checked: answer.has_question_option(op.id), id: "answer_option_ids_#{op.id}", disabled: readonly } %> - <%= raw op.text %> -
    2. - <% end %> -
- <% elsif q_format.dropdown? || q_format.multiselectbox? %> - <% - options_html = "" - options.each do |op| - options_html += answer.has_question_option(op.id) ? - "" : - "" - end - %> - <%= select_tag('answer[question_option_ids]', raw(options_html), - {multiple: q_format.multiselectbox?, include_blank: q_format.dropdown?, disabled: readonly }) %> - <% end %> - - <% if question.option_comment_display == true %> - <%= label_tag('answer[text]', _('Comment')) %> - <% if readonly %> -

<%= raw(answer.text) %>

- <% else %> - <%= text_area_tag('answer[text]', answer.text, id: "answer-text-#{question.id}") %> - <%= tinymce(selector: "#answer-text-#{question.id}", setup: "$.fn.tinymce_answer_events", content_css: asset_path('application.css')) %> - <% end %> - <%end%> + <% if question.option_based? %> + <% options = question.question_options.by_number %> + <% if q_format.checkbox? %> +
    + <% options.each do |op| %> +
  1. + <%= f.check_box(:question_option_ids, { multiple: true, checked: answer.has_question_option(op.id), disabled: readonly }, op.id, nil) %> + <%= raw op.text %> +
    2. + <% end %> +
+ <% elsif q_format.radiobuttons? %> +
    + <% options.each do |op| %> +
  1. + <%= f.radio_button :question_option_ids, op.id, { checked: answer.has_question_option(op.id), id: "answer_option_ids_#{op.id}", disabled: readonly } %> + <%= raw op.text %> +
    2. + <% end %> +
+ <% elsif q_format.dropdown? || q_format.multiselectbox? %> + <% + options_html = "" + options.each do |op| + options_html += answer.has_question_option(op.id) ? + "" : + "" + end + %> + <%= select_tag('answer[question_option_ids]', raw(options_html), + {multiple: q_format.multiselectbox?, include_blank: q_format.dropdown?, disabled: readonly }) %> + <% end %> + + <% if question.option_comment_display == true %> + <%= label_tag('answer[text]', _('Comment')) %> + <% if readonly %> +

<%= raw(answer.text) %>

+ <% else %> + <%= text_area_tag('answer[text]', answer.text, id: "answer-text-#{question.id}") %> + <%= tinymce(selector: "#answer-text-#{question.id}", setup: "$.fn.tinymce_answer_events", content_css: asset_path('application.css')) %> + <% end %> + <%end%> - <% elsif q_format.textfield? %> - <% if readonly %> -

<%= strip_tags(answer.text) %>

- <% else %> - <%= text_field_tag('answer[text]', strip_tags(answer.text)) %> - <% end %> - - <% elsif q_format.textarea? %> - <% if readonly %> -

<%= raw(answer.text) %>

- <% else %> - <%= text_area_tag('answer[text]', answer.text, id: "answer-text-#{question.id}") %> - <%= tinymce(selector: "#answer-text-#{question.id}", setup: "$.fn.tinymce_answer_events", content_css: asset_path('application.css')) %> - <% end %> - <% end %> + <% elsif q_format.textfield? %> + <% if readonly %> +

<%= strip_tags(answer.text) %>

+ <% else %> + <%= text_field_tag('answer[text]', strip_tags(answer.text)) %> + <% end %> + + <% elsif q_format.textarea? %> + <% if readonly %> +

<%= raw(answer.text) %>

+ <% else %> + <%= text_area_tag('answer[text]', answer.text, id: "answer-text-#{question.id}") %> + <%= tinymce(selector: "#answer-text-#{question.id}", setup: "$.fn.tinymce_answer_events", content_css: asset_path('application.css')) %> + <% end %> + <% end %> -
+
- <% if !readonly %> -
- -
- <% end %> -
+
+ <% if !readonly %> + + <% end %> +
" class="answer-status inline left-indent"> + <%= render(partial: 'answers/status', locals: { answer: answer }) %> +
+
+
<% end %> \ No newline at end of file diff --git a/app/views/guidance_groups/_show.html.erb b/app/views/guidance_groups/_show.html.erb index 060a8f3c0a..263fdd02fc 100644 --- a/app/views/guidance_groups/_show.html.erb +++ b/app/views/guidance_groups/_show.html.erb @@ -1,8 +1,8 @@ -

+

<%= group[:org] %> guidance on <%= theme %> - +

-
-
<%= raw group[:text] %>
+
+ <%= raw group[:text] %>
\ No newline at end of file diff --git a/app/views/phases/_answer_section.html.erb b/app/views/phases/_answer_section.html.erb deleted file mode 100644 index ac63c247fc..0000000000 --- a/app/views/phases/_answer_section.html.erb +++ /dev/null @@ -1,10 +0,0 @@ -
-
" class="answer-locking">
-
"> - <%= render(partial: 'answers/new_edit', - locals: { question: question, answer: answer, readonly: @readonly }) %> -
-
" class="answer-status"> - <%= render(partial: 'answers/status', locals: { answer: answer }) %> -
-
\ No newline at end of file diff --git a/app/views/phases/_guidance_section.html.erb b/app/views/phases/_guidance_section.html.erb index 32fd4c965c..b4fb5ff409 100644 --- a/app/views/phases/_guidance_section.html.erb +++ b/app/views/phases/_guidance_section.html.erb @@ -35,6 +35,12 @@ class="tab-panel<%= active_tab == 'guidance_tab' ? ' active' : '' %>" aria-hidden="false" aria-labelledby="guidance_tab"> +
+ expand all + | + collapse all +
+
@@ -42,7 +48,7 @@ <% i = 0 %> <% if annotations.present? %> <% annotations.each do |annotation| %> - <%= render partial: 'annotations/show', locals: {annotation: annotation} %> + <%= render partial: 'annotations/show', locals: {plan: plan, annotation: annotation} %> <% num_annotations += 1%> <% i += 1 %> <% end %> diff --git a/app/views/phases/edit.html.erb b/app/views/phases/edit.html.erb index ed748fea63..23b89d7818 100644 --- a/app/views/phases/edit.html.erb +++ b/app/views/phases/edit.html.erb @@ -10,11 +10,6 @@

<%= @plan.title %>

- -
- <%= render :partial => "/plans/progress", locals: { plan: @plan } %> -
-
@@ -42,14 +37,23 @@
+
+
+ expand all + | + collapse all +
+
+ <%= render :partial => "/plans/progress", locals: { plan: @plan } %> +
+
+
- <% i = 0 %> <% @phase.sections.order(:number).each do |section| %> <% sectionid = section.id %>

<%= render :partial => "/sections/progress", locals: { section: section, plan: @plan } %> -

@@ -86,16 +90,21 @@
- <%= render partial: 'answer_section', - locals: {plan: @plan, question: question, answer: answer, readonly: @readonly}%> - +
+
" class="answer-locking">
+
"> + <%= render(partial: 'answers/new_edit', + locals: { question: question, answer: answer, readonly: @readonly }) %> +
+
<%= render partial: 'guidance_section', - locals: {plan: @plan, question: question, answer: answer} %> + locals: {plan: @plan, question: question, answer: answer, + question_guidances: @question_guidances} %>
<% end %> @@ -132,8 +141,6 @@
- <% i += 1 %> - <% end %>
diff --git a/app/views/plans/_progress.html.erb b/app/views/plans/_progress.html.erb index 256c00e52b..1c17688da0 100644 --- a/app/views/plans/_progress.html.erb +++ b/app/views/plans/_progress.html.erb @@ -3,7 +3,7 @@ nquestions = plan.num_questions() %> <% answered = %(#{nanswers}/#{nquestions})%> -
- <%= answered -%> <%= _('questions answered')%> - +
+ <%= answered -%> <%= _(' answered')%> +
diff --git a/app/views/sections/_progress.html.erb b/app/views/sections/_progress.html.erb index 7617deff62..3dee0385e3 100644 --- a/app/views/sections/_progress.html.erb +++ b/app/views/sections/_progress.html.erb @@ -1,14 +1,10 @@ - - <% num_section_questions = section.questions.size() %> - <% num_section_answers = section.num_answered_questions(plan.id) %> - <% question_word = "questions" %> - <% if num_section_questions == 1 then %> - <% question_word = "question" %> - <% end %> - <% section_status = "#{num_section_questions} #{question_word}, #{num_section_answers} answered" %> - <%= section.title %> - <% if num_section_questions.to_i > num_section_answers.to_i then %> - (<%= section_status %>) - <% else %> - (<%= section_status %>) - <% end %> \ No newline at end of file + +<% num_section_questions = section.questions.size() %> +<% num_section_answers = section.num_answered_questions(plan.id) %> + +<%= section.title %> + + + <%= num_section_answers %>/<%= num_section_questions %> + + \ No newline at end of file diff --git a/lib/assets/javascripts/dmproadmap/accordions.js b/lib/assets/javascripts/dmproadmap/accordions.js index 3689bbd66f..77c209e282 100644 --- a/lib/assets/javascripts/dmproadmap/accordions.js +++ b/lib/assets/javascripts/dmproadmap/accordions.js @@ -1,6 +1,11 @@ $(document).ready(function(){ - $(".accordion").accordion({heightStyle: "content"}); + $(".accordion").accordion({ + active: false, + collapsible: true, + heightStyle: "content" + }); + /* swap out the plus/minus icons */ $(".accordion h2, .accordion h3").click(function(e){ $.each($(this).parent().children("h2"), function(idx, section){ if($(section).hasClass("ui-accordion-header-active")){ @@ -10,4 +15,18 @@ $(document).ready(function(){ } }); }); + + /* expand/collapse all controls */ + $("a.expand-accordions").click(function(e){ + e.preventDefault(); + var accordion = $(this).attr('href'); + $(accordion).children(".accordion-section").css('display', 'block'); + $(accordion).children("h2, h3").children("span.fa").removeClass("fa-plus").addClass("fa-minus"); + }); + $("a.collapse-accordions").click(function(e){ + e.preventDefault(); + var accordion = $(this).attr('href'); + $(accordion).children(".accordion-section").css('display', 'none'); + $(accordion).children("h2, h3").children("span.fa").removeClass("fa-minus").addClass("fa-plus"); + }); }); \ No newline at end of file diff --git a/lib/assets/javascripts/views/plans/edit.js b/lib/assets/javascripts/views/plans/edit.js index 3061ab9087..9d89af4c06 100644 --- a/lib/assets/javascripts/views/plans/edit.js +++ b/lib/assets/javascripts/views/plans/edit.js @@ -1,7 +1,3 @@ $(document).ready(function(){ - $(".accordion-section").accordion({ - active: false, - collapsible: true, - heightStyle: "content" - }); + }); \ No newline at end of file diff --git a/lib/assets/stylesheets/dmproadmap/accordions.scss b/lib/assets/stylesheets/dmproadmap/accordions.scss index eff63d19e8..d5ba50bd97 100644 --- a/lib/assets/stylesheets/dmproadmap/accordions.scss +++ b/lib/assets/stylesheets/dmproadmap/accordions.scss @@ -3,14 +3,13 @@ width: 100%; h2, h3, - h2.ui-accordion-header, h3.ui-accordion-header { + h2.ui-accordion-header, h3.ui-accordion-header { position: relative; - color: $white; + color: $primary-color; font-size: 24px; - background-color: $primary-color; + background-color: $white; padding: 6px 0 10px 10px; border: none; - border-radius: 3px; .ui-accordion-header-active, .ui-accordion-header-collapsed { @@ -20,14 +19,28 @@ .fa { position: absolute; font-size: 18px; - color: $white; - right: 15px; + color: $primary-color; + left: 5px; top: 10px; } } + h2.ui-accordion-header:after, h3.ui-accordion-header:after { + width: 55%; + content: ""; + display: block; + margin-left: 22px; + margin-top: 5px; + border-bottom: 1px solid $primary-color; + } div.accordion-section { position: relative; background-color: white; } + +} +.expand-collapse-all { + .muted { + margin: 0 8px; + } } \ No newline at end of file diff --git a/lib/assets/stylesheets/dmproadmap/base.scss b/lib/assets/stylesheets/dmproadmap/base.scss index 0b3f654a4c..a4400d8ab7 100644 --- a/lib/assets/stylesheets/dmproadmap/base.scss +++ b/lib/assets/stylesheets/dmproadmap/base.scss @@ -187,15 +187,6 @@ a.link-as-button:hover, a.link-as-button:focus { border-radius: 5px; } -.progress { - position: absolute; - top: $header-height; - right: 0; - margin-top: 25px; - width: 350px; - z-index: 2; -} - /* Basic page layout */ /* =================================================================================== */ div.roadmap { diff --git a/lib/assets/stylesheets/dmproadmap/forms.scss b/lib/assets/stylesheets/dmproadmap/forms.scss index 28494f651a..fce47fc3c7 100644 --- a/lib/assets/stylesheets/dmproadmap/forms.scss +++ b/lib/assets/stylesheets/dmproadmap/forms.scss @@ -703,9 +703,105 @@ td.plan-edit-actions { /* Write plan */ /* ------------------------------------------------ */ +#sections-accordion-controls { + width: 55%; + margin: 15px 0 15px 45px; + + a { + text-decoration: none; + } + .expand-collapse-all, .progress { + width: 45%; + } + .progress { + position: relative; + width: 52%; + + .bar-container { + position: relative; + top: 0; + margin: 0 -10px 0 auto; + padding: 5px; + border-radius: 5px; + width: 200px; + + .bar { + position: relative; + left: 0; + + .bar-fill { + height: 100%; + width: 100%; + background-color: $light-grey; + } + } + } + } +} #sections-accordion { + /* Section title / progress */ h2 { font-size: 18px; + + .section-status { + position: absolute; + top: 5px; + left: 0; + width: 55%; + text-align: right; + font-size: 16px; + + .fa { + font-size: 14px; + position: absolute; + top: 3px; + right: -19px; + } + .fa-check-circle { + color: $notice-background; + } + } + } + + /* Example Answers */ + div.suggested-answer-div { + width: 80%; + margin-top: 20px; + margin-left: 15px; + border: 0.5px solid $light-grey; + border-radius: 3px; + padding: 5px 15px; + + .suggested-answer-intro { + position: relative; + top: -17px; + left: 10px; + font-weight: bold; + background-color: $white; + padding: 0 10px; + } + .suggested-answer-border { + margin-top: -20px; + } + } + + .form-input { + margin-top: -10px; + + ol, ul { + list-style: none; + } + } + + div.mce-tinymce { + width: 84%; + } + + .guidance_tab h3 { + font-size: 16px; + .fa { + font-size: 14px; + } } } From 1b50ad745c140bae1575555a200837aa5c4c402f Mon Sep 17 00:00:00 2001 From: briley Date: Thu, 20 Jul 2017 09:22:56 -0700 Subject: [PATCH 4/8] added shib eds files for stage server --- app/views/phases/edit.html.erb | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/app/views/phases/edit.html.erb b/app/views/phases/edit.html.erb index 23b89d7818..39c9db9b67 100644 --- a/app/views/phases/edit.html.erb +++ b/app/views/phases/edit.html.erb @@ -20,7 +20,9 @@ <% @plan.template.phases.each do |phase| %> <% end %> From 188514395602c673adc15cc6078caf0bd28d35c8 Mon Sep 17 00:00:00 2001 From: briley Date: Thu, 20 Jul 2017 09:54:47 -0700 Subject: [PATCH 5/8] fixed alignment of page title/descriptions. Also fixed some styling issues with contact us and org details pages DMPRoadmap/roadmap#424 --- app/views/contact_us/contacts/new.html.erb | 9 ++++----- app/views/devise/passwords/new.html.erb | 2 +- app/views/guidances/admin_index.html.erb | 2 +- app/views/orgs/admin_edit.html.erb | 6 +++--- app/views/plans/index.html.erb | 2 +- app/views/plans/new.html.erb | 2 +- app/views/templates/admin_index.html.erb | 4 ++-- app/views/templates/admin_template_history.html.erb | 2 +- app/views/users/admin_index.html.erb | 2 +- lib/assets/stylesheets/dmproadmap/base.scss | 3 ++- lib/assets/stylesheets/dmproadmap/forms.scss | 1 + 11 files changed, 18 insertions(+), 17 deletions(-) diff --git a/app/views/contact_us/contacts/new.html.erb b/app/views/contact_us/contacts/new.html.erb index 7476dc43ab..141a4c5cce 100644 --- a/app/views/contact_us/contacts/new.html.erb +++ b/app/views/contact_us/contacts/new.html.erb @@ -3,13 +3,13 @@

<%= _("Contact Us") %>

-

+

<%= raw _('%{application_name} is provided by the %{organisation_name}.
You can find out more about us on our website. If you would like to contact us about %{application_name}, please fill out the form below.') % {organisation_name: Rails.configuration.branding[:organisation][:name], organisation_url: Rails.configuration.branding[:organisation][:url], application_name: Rails.configuration.branding[:application][:name]} %>

-
+
<%= form_for @contact, url: contacts_path, html: {class: "roadmap-form"} do |f| %> @@ -36,7 +36,7 @@
<%= f.label(:message, _('Message'), class: "align-top required") %> - <%= f.text_area(:message, class: "left-indent required input-large", rows: 10) %> + <%= f.text_area(:message, class: "required input-large", rows: 10, style: "height: 160px;") %>
<% if !user_signed_in? then %>
@@ -53,8 +53,7 @@ locals: {id: 'create_contact_submit', val: 'Submit', disabled_initially: true, - tooltip: _('Fill in the required fields'), - classes: 'left-indent'} %> + tooltip: _('Fill in the required fields')} %>
diff --git a/app/views/devise/passwords/new.html.erb b/app/views/devise/passwords/new.html.erb index 6be60ae8ef..0927721be4 100644 --- a/app/views/devise/passwords/new.html.erb +++ b/app/views/devise/passwords/new.html.erb @@ -6,7 +6,7 @@

<%= _('Forgot your password?') %>

-

<%= _('Please enter your email below and we will send you instructions on how to reset your password.') %>

+

<%= _('Please enter your email below and we will send you instructions on how to reset your password.') %>

<%= form_for resource, as: 'user', url: user_password_path, html: {class: "password-reset roadmap-form", method: :post} do |f| %> diff --git a/app/views/guidances/admin_index.html.erb b/app/views/guidances/admin_index.html.erb index 1d4dc8006c..71b40823ef 100644 --- a/app/views/guidances/admin_index.html.erb +++ b/app/views/guidances/admin_index.html.erb @@ -4,7 +4,7 @@ <%= _('Guidance') %> -

+

<%= _("First create a guidance group. This could be institution wide or a subset e.g. a particular College / School, Institute or department. When you create guidance you'll be asked to assign it to a guidance group.") %>

diff --git a/app/views/orgs/admin_edit.html.erb b/app/views/orgs/admin_edit.html.erb index 76d93fe583..770578b9ea 100644 --- a/app/views/orgs/admin_edit.html.erb +++ b/app/views/orgs/admin_edit.html.erb @@ -21,7 +21,7 @@