From 4fd8a4fe9b23b57ac53835e47b7b5c538fd2d98d Mon Sep 17 00:00:00 2001 From: AurelioAHeckert Date: Mon, 26 May 2008 11:58:44 +0000 Subject: [PATCH] ActionItem404: a little better on the profile editor and a new helper to create radio groups on labeled forms. --- app/helpers/application_helper.rb | 46 +++++++++++++++++++++++++++++++++++++++++++++- app/views/profile_editor/_person.rhtml | 5 ++--- app/views/profile_editor/edit.rhtml | 10 ++++++---- app/views/shared/_change_image.rhtml | 5 +---- app/views/shared/_show_thumbnail.rhtml | 4 ++-- public/designs/icons/default/folder-open.gif | Bin 0 -> 245 bytes public/designs/icons/default/style.css | 2 +- public/designs/themes/zen3/stylesheets/controller_profile_editor.css | 28 ++++++++++++++++++++++++++++ public/stylesheets/forms.css | 28 ++++++++++++++++++++++++++++ 9 files changed, 113 insertions(+), 15 deletions(-) create mode 100644 public/designs/icons/default/folder-open.gif create mode 100644 public/designs/themes/zen3/stylesheets/controller_profile_editor.css diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb index f622cf1..bf955cb 100644 --- a/app/helpers/application_helper.rb +++ b/app/helpers/application_helper.rb @@ -209,6 +209,47 @@ module ApplicationHelper END_SRC class_eval src, __FILE__, __LINE__ end + + # Create a formatable radio collection + # Tha values parameter is a array of [value, label] arrays like this: + # [ ['en',_('English')], ['pt',_('Portuguese')], ['es',_('Spanish')] ] + # The option :size will set how many radios will be showed in each line + # Example: use :size => 3 as option if you want 3 radios by line + def radio_group( object_name, method, values, options = {} ) + line_size = options[:size] || 0 + line_item = 0 + html = "\n" + values.each { |val, h_val| + id = object_name.to_s() +'_'+ method.to_s() +'_'+ val.to_s() + # Não está apresentando o sexo selecionado ao revisitar + # http://localhost:3000/myprofile/manuel/profile_editor/edit :-( + html += self.class.content_tag( 'span', + @template.radio_button( object_name, method, val, + :id => id, :object => @object ) + + self.class.content_tag( 'label', h_val, :for => id ), + :class => 'lineitem' + (line_item+=1).to_s() ) +"\n" + if line_item == line_size + line_item = 0 + html += "
\n" + end + } + html += "
\n" if line_size == 0 || ( values.size % line_size ) > 0 + column = object.class.columns_hash[method.to_s] + text = + ( column ? + column.human_name : + _(method.to_s.humanize) + ) + label_html = self.class.content_tag 'label', text, + :class => 'formlabel' + control_html = self.class.content_tag 'div', html, + :class => 'formfield type-radio '+ + 'fieldgroup linesize'+line_size.to_s() + + self.class.content_tag 'div', label_html + control_html, + :class => 'formfieldline' + end + end def category_color @@ -568,7 +609,10 @@ module ApplicationHelper # end def file_field_or_thumbnail(label, image, i) - display_form_field( label, (render :partial => (image && image.valid? ? 'shared/show_thumbnail' : 'shared/change_image'), :locals => { :i => i, :image => image }) ) + display_form_field label, ( + render :partial => (image && image.valid? ? 'shared/show_thumbnail' : 'shared/change_image'), + :locals => { :i => i, :image => image } + ) end end diff --git a/app/views/profile_editor/_person.rhtml b/app/views/profile_editor/_person.rhtml index 9640f8c..0f29d56 100644 --- a/app/views/profile_editor/_person.rhtml +++ b/app/views/profile_editor/_person.rhtml @@ -1,9 +1,8 @@ <%= f.text_field(:name) %> <%= f.text_field(:contact_information) %> <%= f.text_field(:contact_phone) %> - <%= _('Sex: ') %> - <%= display_form_field(_('Male'), radio_button(:profile, :sex, 'male')) %> - <%= display_form_field(_('Female'), radio_button(:profile, :sex, 'female')) %> + <%# use :size => 3 if you want 3 radios by line %> + <%= f.radio_group :profile, :sex, [ ['male',_('Male')], ['female',_('Female')] ] %> <%= f.text_field(:birth_date) %> <%= f.text_field(:address) %> <%= f.text_field(:city) %> diff --git a/app/views/profile_editor/edit.rhtml b/app/views/profile_editor/edit.rhtml index 3a6a938..f7f9d1c 100644 --- a/app/views/profile_editor/edit.rhtml +++ b/app/views/profile_editor/edit.rhtml @@ -5,10 +5,12 @@ <% labelled_form_for :profile_data, @profile, :html => { :multipart => true } do |f| %> <%= render :partial => partial_for_class(@profile.class), :locals => { :f => f } %> -

<%= _('Change picture') %>

- <% f.fields_for :image_builder, @profile.image do |i| %> - <%= file_field_or_thumbnail(_('Image:'), @profile.image, i) %> - <% end %> +
+

<%= _('Change picture') %>

+ <% f.fields_for :image_builder, @profile.image do |i| %> + <%= file_field_or_thumbnail(_('Image:'), @profile.image, i) %> + <% end %> +

<%= _('Privacy options') %>

diff --git a/app/views/shared/_change_image.rhtml b/app/views/shared/_change_image.rhtml index 7387eb6..3298b12 100644 --- a/app/views/shared/_change_image.rhtml +++ b/app/views/shared/_change_image.rhtml @@ -1,8 +1,5 @@ <%= i.file_field( :uploaded_data, { :onchange => 'updateImg(this.value)' } ) %> - -
- - <%= link_to_function(_('Cancel'), nil, :id => 'cancel-change-image-link', :style => 'display: none') do |page| + <%= link_to_function(_('Cancel'), nil, :id => 'cancel-change-image-link', :class => 'button icon-cancel with-text', :style => 'display: none') do |page| page['change-image-link'].show page['change-image'].replace_html '' end %> diff --git a/app/views/shared/_show_thumbnail.rhtml b/app/views/shared/_show_thumbnail.rhtml index 8b09730..ac5b6b1 100644 --- a/app/views/shared/_show_thumbnail.rhtml +++ b/app/views/shared/_show_thumbnail.rhtml @@ -2,10 +2,10 @@
- <%= link_to_function(_('Change image'), nil, :id => 'change-image-link') do |page| + <%= link_to_function(_('Change image'), nil, :id => 'change-image-link', :class => 'button icon-open with-text') do |page| page['change-image'].replace_html :partial => 'shared/change_image', :locals => { :i => i, :image => image } page['change-image-link'].hide page['cancel-change-image-link'].show end %> -

+

diff --git a/public/designs/icons/default/folder-open.gif b/public/designs/icons/default/folder-open.gif new file mode 100644 index 0000000..ee46e10 Binary files /dev/null and b/public/designs/icons/default/folder-open.gif differ diff --git a/public/designs/icons/default/style.css b/public/designs/icons/default/style.css index 999548c..5e5e5a4 100644 --- a/public/designs/icons/default/style.css +++ b/public/designs/icons/default/style.css @@ -2,7 +2,7 @@ .icon-home { background-image: url(gnome-home.png) } .icon-new { background-image: url(gtk-new.png) } .icon-close { background-image: url(cancel-HC.gif) } -.icon-open { background-image: url(gtk-open.png) } +.icon-open { background-image: url(folder-open.gif) } .icon-cms { background-image: url(abiword_48.png) } .icon-save { background-image: url(save-HC.gif) } .icon-up { background-image: url(go-up-HC.gif) } diff --git a/public/designs/themes/zen3/stylesheets/controller_profile_editor.css b/public/designs/themes/zen3/stylesheets/controller_profile_editor.css new file mode 100644 index 0000000..10db960 --- /dev/null +++ b/public/designs/themes/zen3/stylesheets/controller_profile_editor.css @@ -0,0 +1,28 @@ + +.categorie_box { + -moz-border-radius: 4px; + border: 1px solid #F57900; + margin-bottom: 2px; + padding: 2px 0px; +} + +#content .categorie_box h5 { + margin: 0px; + padding: 0px; + line-height: 22px; +} + +#content ul.categories { + padding: 5px 4px 3px 4px; +} + +ul.categories li { + -moz-border-radius: 9px; + border-bottom: 1px solid #FFF; +} + +ul.categories li.cat_checked { + background: #F57900; + border-bottom: 1px solid #CE5C00; +} + diff --git a/public/stylesheets/forms.css b/public/stylesheets/forms.css index 9eceb7d..1c896d5 100644 --- a/public/stylesheets/forms.css +++ b/public/stylesheets/forms.css @@ -43,3 +43,31 @@ text-align: center; } +.fieldgroup span { + display: block; + float: left; +} +.fieldgroup br { + clear: left; +} + +.linesize0 span { padding-right: 15px } +.linesize1 span { width: 99% } +.linesize2 span { width: 49% } +.linesize3 span { width: 33% } + +.type-img input { + float: left; + margin-right: 10px; +} +.type-img br { + clear: left; +} + +#profile_change_picture label { + display: none; +} +#profile_change_picture img { + margin-left: 10px; +} + -- libgit2 0.21.2