Merge branch 'create_institution_bootstrap_modal' into 'master'

Create institution bootstrap modal Add modal to create institution in use report. See merge request !87

Merge branch 'create_institution_bootstrap_modal' into 'master'
Create institution bootstrap modal Add modal to create institution in use report. See merge request !87
Thiago Ribeiro
2 parents dbdf7b11 b7d62204
Showing 25 changed files with 1176 additions and 399 deletions Show diff stats
src/noosfero-spb/gov_user/controllers/gov_user_plugin_controller.rb
src/noosfero-spb/gov_user/features/rating_institution_registration.feature
src/noosfero-spb/gov_user/features/steps_definitions/gov_user_steps.rb
src/noosfero-spb/gov_user/features/steps_definitions/gov_user_steps_backup.rb
src/noosfero-spb/gov_user/features/steps_definitions/software_communities_steps.rb
src/noosfero-spb/gov_user/lib/ext/organization_rating.rb
src/noosfero-spb/gov_user/lib/gov_user_plugin.rb
src/noosfero-spb/gov_user/lib/institution_modal_helper.rb
src/noosfero-spb/gov_user/po/gov_user.pot
src/noosfero-spb/gov_user/po/pt/gov_user.po
src/noosfero-spb/gov_user/public/initializer.js
src/noosfero-spb/gov_user/public/lib/modal-observer.js
src/noosfero-spb/gov_user/public/style.css
src/noosfero-spb/gov_user/public/views/create-institution.js
src/noosfero-spb/gov_user/public/views/institution-modal.js
src/noosfero-spb/gov_user/views/gov_user_plugin/_institution.html.erb
src/noosfero-spb/gov_user/views/person_editor_extras.html.erb
src/noosfero-spb/gov_user/views/ratings_extra_field.html.erb
src/noosfero-spb/noosfero-spb-theme/css/modal.css
src/noosfero-spb/noosfero-spb-theme/css/spb-grid.css
@@ -117,7 +117,7 @@ class GovUserPluginController &lt; ApplicationController
     @juridical_nature = get_juridical_natures()
     state_list = get_state_list()
-    @state_options = state_list.zip(state_list).prepend([_('Select a state'), '-1'])
+    @state_options = state_list.zip(state_list)
   end
   def get_model_by_params_field
@@ -0,0 +1,78 @@
+Feature: Create institution on user report
+  As a user
+  I want to create a institution in use report of a software
+  to add institution in report.
+
+  Background:
+    Given "GovUserPlugin" plugin is enabled
+    And "SoftwareCommunitiesPlugin" plugin is enabled
+    And "OrganizationRatings" plugin is enabled
+    And I am logged in as mpog_admin
+    And I go to /admin/plugins
+    And I check "GovUserPlugin"
+    And I check "SoftwareCommunitiesPlugin"
+    And I check "Organization Ratings"
+    And I press "Save changes"
+    And the following softwares
+      | name      | public_software | finality      |
+      | Noosfero  | true            | some finality |
+
+  @selenium
+  Scenario: Test Additional JavaScript Fields
+    Given I go to /profile/noosfero/plugin/organization_ratings/new_rating
+    And I should not see "Number of Beneficiaries"
+    And I should not see "Saved resources"
+    And I should not see "Organization name or Enterprise name"
+    When I click on anything with selector "#comments-additional-information"
+    Then I should see "Number of Beneficiaries"
+    And I should see "Organization name or Enterprise name"
+    And I should see "Saved resources"
+
+  @selenium
+  Scenario: Show new institution fields when clicked in add new institution
+    Given I go to /profile/noosfero/plugin/organization_ratings/new_rating
+    And I click on anything with selector "#comments-additional-information"
+    And I fill in "input_institution" with "None institution"
+    And I sleep for 2 seconds
+    When I follow "Add"
+    Then I should see "New Institution"
+    And I should see "Public Institution"
+    And I should see "Private Institution"
+    And I should see "Corporate Name"
+    And I should see "Name"
+    And I should see "State"
+    And I should see "City"
+    And I should see "Country"
+    And I should see "CNPJ"
+    And I should see "Acronym"
+    And I choose "Public Institution"
+    And I should see "Governmental Sphere:"
+    And I should see "Governmental Power:"
+    And I should see "Juridical Nature:"
+
+  @selenium
+  Scenario: Create new institution with name changed in the modal
+    Given I go to /profile/noosfero/plugin/organization_ratings/new_rating
+    And I click on anything with selector "#comments-additional-information"
+    And I fill in "input_institution" with "None institution"
+    And I sleep for 2 seconds
+    When I click on anything with selector "#create_institution_link"
+    And I fill in "community_name" with "Noosfero Institution"
+    And I select "United States" from "#community_country"
+    And I follow "#save_institution_button"
+    Then I should see "Noosfero Institution"
+
+  @selenium
+  Scenario: Check new institution name in the modal
+    Given I go to /profile/noosfero/plugin/organization_ratings/new_rating
+    And I click on anything with selector "#comments-additional-information"
+    And I fill in "input_institution" with "None institution"
+    And I sleep for 2 seconds
+    When I click on anything with selector "#create_institution_link"
+    Then I should see "None Institution" within "community_name"
+
+
+
+
+
+
@@ -1,90 +0,0 @@
-Given /^Institutions has initial default values on database$/ do
-  GovernmentalPower.create(:name => "Executivo")
-  GovernmentalPower.create(:name => "Legislativo")
-  GovernmentalPower.create(:name => "Judiciario")
-
-  GovernmentalSphere.create(:name => "Federal")
-
-  JuridicalNature.create(:name => "Autarquia")
-  JuridicalNature.create(:name => "Administracao Direta")
-  JuridicalNature.create(:name => "Empresa Publica")
-  JuridicalNature.create(:name => "Fundacao")
-  JuridicalNature.create(:name => "Orgao Autonomo")
-  JuridicalNature.create(:name => "Sociedade")
-  JuridicalNature.create(:name => "Sociedade Civil")
-  JuridicalNature.create(:name => "Sociedade de Economia Mista")
-
-  national_region = NationalRegion.new
-  national_region.name = "Distrito Federal"
-  national_region.national_region_code = '35'
-  national_region.national_region_type_id = NationalRegionType::STATE
-  national_region.save
-end
-
-Given /^I type in "([^"]*)" in autocomplete list "([^"]*)" and I choose "([^"]*)"$/ do |typed, input_field_selector, should_select|
-# Wait the page javascript load
-sleep 1
-# Basicaly it, search for the input field, type something, wait for ajax end select an item
-page.driver.browser.execute_script %Q{
-  var search_query = "#{input_field_selector}.ui-autocomplete-input";
-  var input = jQuery(search_query).first();
-
-  input.trigger('click');
-  input.val('#{typed}');
-  input.trigger('keydown');
-
-  window.setTimeout(function(){
-    search_query = ".ui-menu-item a:contains('#{should_select}')";
-    var typed = jQuery(search_query).first();
-
-    typed.trigger('mouseenter').trigger('click');
-    console.log(jQuery('#license_info_id'));
-    }, 1000);
-  }
-  sleep 1
-end
-
-Given /^the following public institutions?$/ do |table|
-  # table is a Cucumber::Ast::Table
-  table.hashes.each do |item|
-    community = Community.new
-    community.name = item[:name]
-    community.country = item[:country]
-    community.state = item[:state]
-    community.city = item[:city]
-    community.save!
-
-    governmental_power = GovernmentalPower.where(:name => item[:governmental_power]).first
-    governmental_sphere = GovernmentalSphere.where(:name => item[:governmental_sphere]).first
-
-    juridical_nature = JuridicalNature.create(:name => item[:juridical_nature])
-
-    institution = PublicInstitution.new(:name => item[:name], :type => "PublicInstitution", :acronym => item[:acronym], :cnpj => item[:cnpj], :juridical_nature => juridical_nature, :governmental_power => governmental_power, :governmental_sphere => governmental_sphere)
-    institution.community = community
-    institution.corporate_name = item[:corporate_name]
-    institution.save!
-  end
-end
-
-Given /^I sleep for (\d+) seconds$/ do |time|
-  sleep time.to_i
-end
-
-Given /^I am logged in as mpog_admin$/ do
-  visit('/account/logout')
-
-  user = User.new(:login => 'admin_user', :password => '123456', :password_confirmation => '123456', :email => 'admin_user@example.com')
-  person = Person.new :name=>"Mpog Admin", :identifier=>"mpog-admin"
-  user.person = person
-  user.save!
-
-  user.activate
-  e = Environment.default
-  e.add_admin(user.person)
-
-  visit('/account/login')
-  fill_in("Username", :with => user.login)
-  fill_in("Password", :with => '123456')
-  click_button("Log in")
-end
-
@@ -0,0 +1,93 @@
+Given /^Institutions has initial default values on database$/ do
+  GovernmentalPower.create(:name => "Executivo")
+  GovernmentalPower.create(:name => "Legislativo")
+  GovernmentalPower.create(:name => "Judiciario")
+
+  GovernmentalSphere.create(:name => "Federal")
+
+  JuridicalNature.create(:name => "Autarquia")
+  JuridicalNature.create(:name => "Administracao Direta")
+  JuridicalNature.create(:name => "Empresa Publica")
+  JuridicalNature.create(:name => "Fundacao")
+  JuridicalNature.create(:name => "Orgao Autonomo")
+  JuridicalNature.create(:name => "Sociedade")
+  JuridicalNature.create(:name => "Sociedade Civil")
+  JuridicalNature.create(:name => "Sociedade de Economia Mista")
+
+  national_region = NationalRegion.new
+  national_region.name = "Distrito Federal"
+  national_region.national_region_code = '35'
+  national_region.national_region_type_id = NationalRegionType::STATE
+  national_region.save
+end
+
+Given /^I type in "([^"]*)" in autocomplete list "([^"]*)" and I choose "([^"]*)"$/ do |typed, input_field_selector, should_select|
+# Wait the page javascript load
+sleep 1
+# Basicaly it, search for the input field, type something, wait for ajax end select an item
+page.driver.browser.execute_script %Q{
+  var search_query = "#{input_field_selector}.ui-autocomplete-input";
+  var input = jQuery(search_query).first();
+
+  input.trigger('click');
+  input.val('#{typed}');
+  input.trigger('keydown');
+
+  window.setTimeout(function(){
+    search_query = ".ui-menu-item a:contains('#{should_select}')";
+    var typed = jQuery(search_query).first();
+
+    typed.trigger('mouseenter').trigger('click');
+    console.log(jQuery('#license_info_id'));
+    }, 1000);
+  }
+  sleep 1
+end
+
+Given /^the following public institutions?$/ do |table|
+  # table is a Cucumber::Ast::Table
+  table.hashes.each do |item|
+    community = Community.new
+    community.name = item[:name]
+    community.country = item[:country]
+    community.state = item[:state]
+    community.city = item[:city]
+    community.save!
+
+    governmental_power = GovernmentalPower.where(:name => item[:governmental_power]).first
+    governmental_sphere = GovernmentalSphere.where(:name => item[:governmental_sphere]).first
+
+    juridical_nature = JuridicalNature.create(:name => item[:juridical_nature])
+
+    institution = PublicInstitution.new(:name => item[:name], :type => "PublicInstitution", :acronym => item[:acronym], :cnpj => item[:cnpj], :juridical_nature => juridical_nature, :governmental_power => governmental_power, :governmental_sphere => governmental_sphere)
+    institution.community = community
+    institution.corporate_name = item[:corporate_name]
+    institution.save!
+  end
+end
+
+Given /^I sleep for (\d+) seconds$/ do |time|
+  sleep time.to_i
+end
+
+Given /^I am logged in as mpog_admin$/ do
+  visit('/account/logout')
+
+  user = User.new(:login => 'admin_user', :password => '123456', :password_confirmation => '123456', :email => 'admin_user@example.com')
+  person = Person.new :name=>"Mpog Admin", :identifier=>"mpog-admin"
+  user.person = person
+  user.save!
+
+  user.activate
+  e = Environment.default
+  e.add_admin(user.person)
+
+  visit('/account/login')
+  fill_in("Username", :with => user.login)
+  fill_in("Password", :with => '123456')
+  click_button("Log in")
+end
+
+Given /^I click on anything with selector "([^"]*)"$/ do |selector|
+  evaluate_script "jQuery('#{selector}').trigger('click') && true"
+end
@@ -0,0 +1 @@
+../../../software_communities/features/step_definitions/software_communities_steps.rb
 \ No newline at end of file
@@ -13,7 +13,8 @@ OrganizationRating.class_eval do
   def verify_institution
     if self.institution != nil
       institution = Institution.find_by_id self.institution.id
-      self.errors.add :institution, _("not found") unless institution
+      self.errors.add :institution, _("institution not found") unless institution
+      return !!institution
     end
   end
@@ -150,12 +150,14 @@ class GovUserPlugin &lt; Noosfero::Plugin
     lib/noosfero-root.js
     lib/select-element.js
     lib/select-field-choices.js
+    lib/modal-observer.js
     views/complete-registration.js
     views/control-panel.js
     views/create-institution.js
     views/new-community.js
     views/user-edit-profile.js
     views/gov-user-comments-extra-fields.js
+    views/institution-modal.js
     initializer.js
     app.js
     )
@@ -0,0 +1,74 @@
+class InstitutionModalHelper
+  extend(
+    ActionView::Helpers::FormOptionsHelper, # content_tag
+    ActionView::Helpers::FormTagHelper, # button_tag
+    ActionView::Helpers::UrlHelper, # link_to
+    ActionView::Context # content_tag do end
+  )
+
+  def self.modal_button link_text=_("Create new institution"), display="block"
+    # HTML Sample in: http://getbootstrap.com/javascript/#modals-examples
+    content_tag :div, :id=>"institution_modal_container", :style=>"display: #{display}" do
+      link = link_to(
+        link_text,
+        "javascript: void(0)",
+        {:class=>"button with-text", :data=>{:toggle=>"modal", :target=>"#institution_modal"}, :id=>"create_institution_link"}
+      )
+
+      link.concat modal
+    end
+  end
+
+  private
+
+  def self.modal
+    options = {
+      :id=>"institution_modal",
+      :role=>"dialog",
+      :class=>"modal fade"
+    }
+
+    content_tag :div, options do
+      modal_dialog
+    end
+  end
+
+  def self.modal_dialog
+    content_tag :div, :class=>"modal-dialog", :role=>"document" do
+      modal_content
+    end
+  end
+
+  def self.modal_content
+    content_tag :div, :class=>"modal-content" do
+      #modal_header.concat(modal_body.concat(modal_footer))
+      modal_header.concat(modal_body)
+    end
+  end
+
+  def self.modal_header
+    content_tag :div, :class=>"modal-header" do
+      button = button_tag :type=>"button", :data=>{:dismiss=>"modal"}, :class=>"close" do
+        content_tag :span, "&times;"
+      end
+
+      h4 = content_tag :h4, _("New Institution"), :class=>"modal-title"
+
+      button.concat h4
+    end
+  end
+
+  def self.modal_body
+    content_tag :div, "", :id=>"institution_modal_body", :class=>"modal-body"
+  end
+
+  #def self.modal_footer
+  #  content_tag :div, {:class=>"modal-footer"} do
+  #    close = button_tag _("Close"), :type=>"button", :class=>"button with-text"
+  #    save = button_tag _("Save changes"), :type=>"button", :class=>"button with-text"
+  #
+  #    close.concat save
+  #  end
+  #end
+end
+
@@ -6,8 +6,8 @@
 #, fuzzy
 msgid ""
 msgstr ""
-"Project-Id-Version: 1.3.1+spb2\n"
-"POT-Creation-Date: 2015-10-16 19:14-0000\n"
+"Project-Id-Version: 1.3.1-42-ga3cd3c2\n"
+"POT-Creation-Date: 2015-12-03 19:28-0000\n"
 "PO-Revision-Date: 2015-09-01 20:59-0000\n"
 "Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
 "Language-Team: LANGUAGE <LL@li.org>\n"
@@ -23,55 +23,48 @@ msgid &quot;Name Should begin with a capital letter and no special characters&quot;
 msgstr ""
 #: plugins/gov_user/controllers/gov_user_plugin_myprofile_controller.rb:28
-#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:168
+#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:181
 msgid "Could not find Governmental Power or Governmental Sphere"
 msgstr ""
-#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:18
-#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:43
+#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:137
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:80
 msgid "Select a Governmental Sphere"
 msgstr ""
-#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:19
-#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:44
+#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:142
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:87
 msgid "Select a Governmental Power"
 msgstr ""
-#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:20
-#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:45
+#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:147
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:93
 msgid "Select a Juridical Nature"
 msgstr ""
-#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:21
-#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:46
-msgid "Select a state"
-msgstr ""
-
-#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:214
+#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:227
 msgid "Institution successful created!"
 msgstr ""
-#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:219
+#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:232
 msgid "Institution could not be created!"
 msgstr ""
-#: plugins/gov_user/lib/gov_user_plugin.rb:17
+#: plugins/gov_user/lib/gov_user_plugin.rb:21
 msgid "Add features related to Brazilian government."
 msgstr ""
-#: plugins/gov_user/lib/gov_user_plugin.rb:132
-#: plugins/gov_user/lib/gov_user_plugin.rb:163
+#: plugins/gov_user/lib/gov_user_plugin.rb:136
+#: plugins/gov_user/lib/gov_user_plugin.rb:169
 msgid "Create Institution"
 msgstr ""
-#: plugins/gov_user/lib/gov_user_plugin.rb:289
+#: plugins/gov_user/lib/gov_user_plugin.rb:295
 msgid "Institution Info"
 msgstr ""
-#: plugins/gov_user/lib/gov_user_plugin.rb:314
+#: plugins/gov_user/lib/gov_user_plugin.rb:320
+#: plugins/gov_user/views/organization_ratings_extra_fields_show_institution.html.erb:4
 msgid "Institution"
 msgstr ""
@@ -106,7 +99,15 @@ msgid &quot;Institution Catalog&quot;
 msgstr ""
 #: plugins/gov_user/lib/ext/organization_rating.rb:16
-msgid "not found"
+msgid "institution not found"
+msgstr ""
+
+#: plugins/gov_user/lib/institution_modal_helper.rb:9
+msgid "Create new institution"
+msgstr ""
+
+#: plugins/gov_user/lib/institution_modal_helper.rb:55
+msgid "New Institution"
 msgstr ""
 #: plugins/gov_user/lib/institutions_block.rb:4
@@ -143,97 +144,94 @@ msgid &quot;&quot;
 msgstr ""
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:11
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:11
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:18
 msgid "\"Can`t create new Institution: #{flash[:errors].length} errors\""
 msgstr ""
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:28
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:37
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:51
 msgid "Public Institution"
 msgstr ""
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:33
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:33
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:44
 msgid "Private Institution"
 msgstr ""
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:40
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:44
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:67
 msgid "Institution name already exists"
 msgstr ""
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:44
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:48
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:62
 msgid "Corporate Name"
 msgstr ""
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:49
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:53
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:79
 msgid "Country"
 msgstr ""
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:53
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:57
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:88
 msgid "State"
 msgstr ""
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:63
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:66
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:108
 msgid "CNPJ"
 msgstr ""
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:70
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:72
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:72
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:74
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:115
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:117
 msgid "Acronym"
 msgstr ""
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:71
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:73
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:71
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:116
 msgid "Fantasy name"
 msgstr ""
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:79
 #: plugins/gov_user/views/profile/_institution_tab.html.erb:17
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:81
 msgid "Governmental Sphere:"
 msgstr ""
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:86
 #: plugins/gov_user/views/profile/_institution_tab.html.erb:16
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:88
 msgid "Governmental Power:"
 msgstr ""
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:92
 #: plugins/gov_user/views/profile/_institution_tab.html.erb:18
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:94
 msgid "Juridical Nature:"
 msgstr ""
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:99
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:101
 msgid "SISP?"
 msgstr ""
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:101
 #: plugins/gov_user/views/profile/_institution_tab.html.erb:19
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:104
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:165
 msgid "Yes"
 msgstr ""
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:103
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:106
 #: plugins/gov_user/views/profile/_institution_tab.html.erb:19
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:106
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:108
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:170
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:174
 msgid "No"
 msgstr ""
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:111
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:114
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:118
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:184
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:187
 msgid "Save"
 msgstr ""
@@ -281,57 +279,80 @@ msgstr &quot;&quot;
 msgid "Organization name or Enterprise name"
 msgstr ""
-#: plugins/gov_user/views/ratings_extra_field.html.erb:6
-#: plugins/gov_user/views/person_editor_extras.html.erb:21
-msgid "No institution found"
+#: plugins/gov_user/views/ratings_extra_field.html.erb:7
+msgid "No organization or company found"
 msgstr ""
-#: plugins/gov_user/views/person_editor_extras.html.erb:2
-msgid "Secondary e-mail"
+#: plugins/gov_user/views/ratings_extra_field.html.erb:8
+msgid "Add"
 msgstr ""
-#: plugins/gov_user/views/person_editor_extras.html.erb:22
-msgid "Add new institution"
+#: plugins/gov_user/views/person_editor_extras.html.erb:2
+msgid "Secondary e-mail"
 msgstr ""
-#: plugins/gov_user/views/person_editor_extras.html.erb:23
-msgid "Create new institution"
+#: plugins/gov_user/views/person_editor_extras.html.erb:21
+msgid "No institution found"
 msgstr ""
-#: plugins/gov_user/views/person_editor_extras.html.erb:39
+#: plugins/gov_user/views/person_editor_extras.html.erb:38
 msgid "Should begin with a capital letter and no special characters"
 msgstr ""
-#: plugins/gov_user/views/person_editor_extras.html.erb:40
+#: plugins/gov_user/views/person_editor_extras.html.erb:39
 msgid "Email should have the following format: name@host.br"
 msgstr ""
-#: plugins/gov_user/views/person_editor_extras.html.erb:41
+#: plugins/gov_user/views/person_editor_extras.html.erb:40
 msgid "Site should have a valid format: http://name.hosts"
 msgstr ""
-#: plugins/gov_user/views/person_editor_extras.html.erb:42
+#: plugins/gov_user/views/person_editor_extras.html.erb:41
 msgid "If you work in a public agency use your government e-Mail"
 msgstr ""
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:1
-msgid "New Institution"
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:11
+msgid "The highlighted fields are mandatory"
 msgstr ""
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:16
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:23
 msgid "\"<b>#{key_name.capitalize}</b> #{value.join()}\""
 msgstr ""
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:115
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:119
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:83
+msgid "Select a country"
+msgstr ""
+
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:97
+msgid "City"
+msgstr ""
+
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:125
+msgid "Governmental Sphere"
+msgstr ""
+
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:136
+msgid "Governmental Power"
+msgstr ""
+
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:147
+msgid "Juridical Nature"
+msgstr ""
+
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:157
+msgid "SISP ?"
+msgstr ""
+
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:185
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:188
 msgid "Cancel"
 msgstr ""
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:121
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:189
 msgid "Could not send the form data to the server"
 msgstr ""
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:128
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:197
 msgid "Creating institution"
 msgstr ""
@@ -5,8 +5,8 @@
 #
 msgid ""
 msgstr ""
-"Project-Id-Version: 1.3.1+spb2\n"
-"POT-Creation-Date: 2015-10-16 19:14-0000\n"
+"Project-Id-Version: 1.3.1-42-ga3cd3c2\n"
+"POT-Creation-Date: 2015-12-03 19:28-0000\n"
 "PO-Revision-Date: 2015-09-01 19:55-0000\n"
 "Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
 "Language-Team: LANGUAGE <LL@li.org>\n"
@@ -23,55 +23,48 @@ msgstr &quot;&quot;
 "Nome deve iniciar com letrar maiúscula e não deve conter carateres especiais"
 #: plugins/gov_user/controllers/gov_user_plugin_myprofile_controller.rb:28
-#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:168
+#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:181
 msgid "Could not find Governmental Power or Governmental Sphere"
 msgstr "Não foi possível encontrar o Poder ou Esfera Governamental"
-#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:18
-#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:43
+#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:137
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:80
 msgid "Select a Governmental Sphere"
 msgstr "Selecione uma Esfera Governamental"
-#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:19
-#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:44
+#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:142
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:87
 msgid "Select a Governmental Power"
 msgstr "Selecione um Poder Governamental"
-#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:20
-#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:45
+#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:147
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:93
 msgid "Select a Juridical Nature"
 msgstr "Seleciona uma Natureza Jurídica"
-#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:21
-#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:46
-msgid "Select a state"
-msgstr "Selecione um Estado"
-
-#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:214
+#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:227
 msgid "Institution successful created!"
 msgstr "Instituição criada com sucesso!"
-#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:219
+#: plugins/gov_user/controllers/gov_user_plugin_controller.rb:232
 msgid "Institution could not be created!"
 msgstr "Instituição não pode ser criada!"
-#: plugins/gov_user/lib/gov_user_plugin.rb:17
+#: plugins/gov_user/lib/gov_user_plugin.rb:21
 msgid "Add features related to Brazilian government."
 msgstr "Adicionar funcionlidade relacionada com o governo brasileiro."
-#: plugins/gov_user/lib/gov_user_plugin.rb:132
-#: plugins/gov_user/lib/gov_user_plugin.rb:163
+#: plugins/gov_user/lib/gov_user_plugin.rb:136
+#: plugins/gov_user/lib/gov_user_plugin.rb:169
 msgid "Create Institution"
 msgstr "Criar Instituição"
-#: plugins/gov_user/lib/gov_user_plugin.rb:289
+#: plugins/gov_user/lib/gov_user_plugin.rb:295
 msgid "Institution Info"
 msgstr "Informações da Instituição"
-#: plugins/gov_user/lib/gov_user_plugin.rb:314
+#: plugins/gov_user/lib/gov_user_plugin.rb:320
+#: plugins/gov_user/views/organization_ratings_extra_fields_show_institution.html.erb:4
 msgid "Institution"
 msgstr "Instituição"
@@ -106,8 +99,16 @@ msgid &quot;Institution Catalog&quot;
 msgstr "Catálogo de Instituições"
 #: plugins/gov_user/lib/ext/organization_rating.rb:16
-msgid "not found"
-msgstr "não encontrada"
+msgid "institution not found"
+msgstr "Nenhuma instituição encontrada"
+
+#: plugins/gov_user/lib/institution_modal_helper.rb:9
+msgid "Create new institution"
+msgstr "Criar nova instituição"
+
+#: plugins/gov_user/lib/institution_modal_helper.rb:55
+msgid "New Institution"
+msgstr "Nova Instituição"
 #: plugins/gov_user/lib/institutions_block.rb:4
 #: plugins/gov_user/views/person_editor_extras.html.erb:11
@@ -147,98 +148,95 @@ msgstr &quot;&quot;
 "critérios."
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:11
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:11
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:18
 msgid "\"Can`t create new Institution: #{flash[:errors].length} errors\""
 msgstr ""
 "\"Não foi possível criar nova Instituição: #{flash[:errors].length} erros\""
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:28
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:37
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:51
 msgid "Public Institution"
 msgstr "Instituição Pública"
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:33
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:33
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:44
 msgid "Private Institution"
 msgstr "Instituição Privada"
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:40
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:44
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:67
 msgid "Institution name already exists"
 msgstr "Nome de Instituição já existe"
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:44
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:48
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:62
 msgid "Corporate Name"
-msgstr "Nome da Coorporação"
+msgstr "Razão social"
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:49
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:53
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:79
 msgid "Country"
 msgstr "País"
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:53
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:57
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:88
 msgid "State"
 msgstr "Estado"
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:63
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:66
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:108
 msgid "CNPJ"
 msgstr "CNPJ"
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:70
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:72
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:72
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:74
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:115
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:117
 msgid "Acronym"
 msgstr "Sigla"
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:71
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:73
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:71
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:116
 msgid "Fantasy name"
 msgstr "Nome Fantasia"
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:79
 #: plugins/gov_user/views/profile/_institution_tab.html.erb:17
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:81
 msgid "Governmental Sphere:"
 msgstr "Esfera Governamental:"
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:86
 #: plugins/gov_user/views/profile/_institution_tab.html.erb:16
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:88
 msgid "Governmental Power:"
 msgstr "Poder Governamental:"
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:92
 #: plugins/gov_user/views/profile/_institution_tab.html.erb:18
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:94
 msgid "Juridical Nature:"
 msgstr "Natureza Jurídica:"
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:99
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:101
 msgid "SISP?"
 msgstr "SISP?"
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:101
 #: plugins/gov_user/views/profile/_institution_tab.html.erb:19
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:104
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:165
 msgid "Yes"
 msgstr "Sim"
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:103
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:106
 #: plugins/gov_user/views/profile/_institution_tab.html.erb:19
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:106
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:108
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:170
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:174
 msgid "No"
 msgstr "Não"
 #: plugins/gov_user/views/gov_user_plugin_myprofile/edit_institution.html.erb:111
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:114
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:118
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:184
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:187
 msgid "Save"
 msgstr "Salvar"
@@ -286,57 +284,84 @@ msgstr &quot;SISP:&quot;
 msgid "Organization name or Enterprise name"
 msgstr "Nome da organização ou empresa"
-#: plugins/gov_user/views/ratings_extra_field.html.erb:6
-#: plugins/gov_user/views/person_editor_extras.html.erb:21
-msgid "No institution found"
-msgstr "Nenhuma instituição encontrada"
+#: plugins/gov_user/views/ratings_extra_field.html.erb:7
+msgid "No organization or company found"
+msgstr "Nenhuma organização ou companhia encontrados"
+
+#: plugins/gov_user/views/ratings_extra_field.html.erb:8
+msgid "Add"
+msgstr "Adicionar"
 #: plugins/gov_user/views/person_editor_extras.html.erb:2
 msgid "Secondary e-mail"
 msgstr "Email secundário"
-#: plugins/gov_user/views/person_editor_extras.html.erb:22
-msgid "Add new institution"
-msgstr "Adicionar nova instituição"
-
-#: plugins/gov_user/views/person_editor_extras.html.erb:23
-msgid "Create new institution"
-msgstr "Criar nova instituição"
+#: plugins/gov_user/views/person_editor_extras.html.erb:21
+msgid "No institution found"
+msgstr "Nenhuma instituição encontrada"
-#: plugins/gov_user/views/person_editor_extras.html.erb:39
+#: plugins/gov_user/views/person_editor_extras.html.erb:38
 msgid "Should begin with a capital letter and no special characters"
 msgstr "Deve começar com letra maíscula e não conter caracteres especiais"
-#: plugins/gov_user/views/person_editor_extras.html.erb:40
+#: plugins/gov_user/views/person_editor_extras.html.erb:39
 msgid "Email should have the following format: name@host.br"
 msgstr "Email deve ter o seguinte formato: name@host.br"
-#: plugins/gov_user/views/person_editor_extras.html.erb:41
+#: plugins/gov_user/views/person_editor_extras.html.erb:40
 msgid "Site should have a valid format: http://name.hosts"
 msgstr "Site deve ter um formato válido: http://name.hosts"
-#: plugins/gov_user/views/person_editor_extras.html.erb:42
+#: plugins/gov_user/views/person_editor_extras.html.erb:41
 msgid "If you work in a public agency use your government e-Mail"
 msgstr "Se você trabalha em uma agência pública use seu email governamental"
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:1
-msgid "New Institution"
-msgstr "Nova Instituição"
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:11
+msgid "The highlighted fields are mandatory"
+msgstr "Todos os campos com (*) são obrigatórios"
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:16
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:23
 msgid "\"<b>#{key_name.capitalize}</b> #{value.join()}\""
 msgstr "\"<b>#{key_name.capitalize}</b> #{value.join()}\""
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:115
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:119
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:83
+#, fuzzy
+msgid "Select a country"
+msgstr "Selecione um Estado"
+
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:97
+msgid "City"
+msgstr "Cidade"
+
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:125
+#, fuzzy
+msgid "Governmental Sphere"
+msgstr "Esfera Governamental:"
+
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:136
+#, fuzzy
+msgid "Governmental Power"
+msgstr "Poder Governamental:"
+
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:147
+#, fuzzy
+msgid "Juridical Nature"
+msgstr "Natureza Jurídica:"
+
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:157
+msgid "SISP ?"
+msgstr "SISP ?"
+
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:185
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:188
 msgid "Cancel"
 msgstr "Cancelar"
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:121
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:189
 msgid "Could not send the form data to the server"
 msgstr "Não foi possível enviar os dados do formulário para o servidor"
-#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:128
+#: plugins/gov_user/views/gov_user_plugin/_institution.html.erb:197
 msgid "Creating institution"
 msgstr "Criar instituição"
@@ -356,8 +381,14 @@ msgstr &quot;Complete seu perfil&quot;
 msgid "Hide"
 msgstr "Ocultar"
-#~ msgid "All fields with (*) are mandatory"
-#~ msgstr "Todos os campos com (*) são obrigatórios"
+#~ msgid "Name"
+#~ msgstr "Nome"
+
+#~ msgid "not found"
+#~ msgstr "não encontrada"
+
+#~ msgid "Add new institution"
+#~ msgstr "Adicionar nova instituição"
 #~ msgid "A plugin that does this and that."
 #~ msgstr "Um plugin que faz isso e aquilo"
@@ -9,7 +9,8 @@
     'CompleteRegistration',
     'UserEditProfile',
     'NewCommunity',
-    'GovUserCommentsExtraFields'
+    'GovUserCommentsExtraFields',
+    'InstitutionModal'
   ];
@@ -0,0 +1,36 @@
+/* globals modulejs */
+
+// Works on: IE 11, Edge 12+, Firefox 40+, Chrome 43+, Opera 32+, Safari 32+
+modulejs.define("ModalObserver", function() {
+  "use strict";
+
+  function ModalObserver(target, callback) {
+    this.action_callback = callback;
+    this.observer = new MutationObserver(this.mutationVerifier.bind(this));
+
+    this.observer.observe(target, {attributes: true});
+  }
+
+
+  ModalObserver.prototype.mutationVerifier = function(mutations) {
+    var callback = this.action_callback;
+    var observer = this.observer;
+
+    mutations.forEach(function(mutation) {
+      if (mutation.attributeName === "style" &&
+          mutation.target.style.display === "none")
+      {
+        callback();
+        // stop the observer, once its action is done
+        observer.disconnect();
+      }
+    });
+  };
+
+
+  return {
+    init: function(target, callback) {
+      new ModalObserver(target, callback);
+    }
+  };
+});
@@ -24,3 +24,12 @@
   border-color: #FF0000;
   box-shadow: 0 0 10px #FF0000;
 }
+
+#institution_empty_ajax_message {
+  margin-top: 10px;
+  margin-left: 0px !important;
+}
+
+#create_institution_link {
+  margin-left: 8px;
+}
@@ -4,8 +4,6 @@ modulejs.define(&#39;CreateInstitution&#39;, [&#39;jquery&#39;, &#39;NoosferoRoot&#39;, &#39;SelectElement&#39;]
   'use strict';
   var AJAX_URL = {
-    create_institution_modal:
-      NoosferoRoot.urlWithSubDirectory("/plugin/gov_user/create_institution"),
     new_institution:
       NoosferoRoot.urlWithSubDirectory("/plugin/gov_user/new_institution"),
     institution_already_exists:
@@ -16,30 +14,11 @@ modulejs.define(&#39;CreateInstitution&#39;, [&#39;jquery&#39;, &#39;NoosferoRoot&#39;, &#39;SelectElement&#39;]
       NoosferoRoot.urlWithSubDirectory("/account/search_cities")
   };
-
-  function open_create_institution_modal(evt) {
-    evt.preventDefault();
-
-    $.get(AJAX_URL.create_institution_modal, function(response){
-      $("#institution_dialog").html(response);
-
-      set_form_count_custom_data();
-      set_events();
-
-      $("#institution_dialog").dialog({
-        modal: true,
-        width: 500,
-        height: 530,
-        position: 'center',
-        close: function() {
-          $("#institution_dialog").html("");
-          $('#institution_empty_ajax_message').switchClass("show-field", "hide-field");
-        }
-      });
-    });
+  function set_institution_field_name(name) {
+    $("#input_institution").attr("value", name);
+    $("#input_institution").autocomplete("search");
   }
-
   function show_public_institutions_fields() {
     $(".public-institutions-fields").show();
   }
@@ -92,13 +71,28 @@ modulejs.define(&#39;CreateInstitution&#39;, [&#39;jquery&#39;, &#39;NoosferoRoot&#39;, &#39;SelectElement&#39;]
       var institution_name  = response.institution_data.name;
       var institution_id = response.institution_data.id;
-      $("#institution_dialog").html("<div class='errorExplanation'><h2>"+response.message+"</h2></div>");
-      $("#create_institution_errors").switchClass("show-field", "hide-field");
+      // Tell the user it was created
+      window.display_notice(response.message);
+
+      set_institution_field_name($("#community_name").val());
+      //settup_created_institution();
+
+      // Close modal
+      //$(".modal-header .close").trigger("click");
+      // Clear modal fields
+      $("#institution_modal_body").html(window.sessionStorage.getItem("InstitutionModalBody"));
+
+      // Reset modal events
+      init_module();
+
+
+      // If the page has a user institution list, update it without repeating the institution
       $(".institution_container").append(get_clone_institution_data(institution_id));
       add_selected_institution_to_list(institution_id, institution_name);
-
       $(".remove-institution").click(remove_institution);
+      //$('#institution_dialog').dialog('close');
+      $('#institution_modal').modal('toggle');
     } else {
       var errors = create_error_list(response);
       $("#create_institution_errors").switchClass("hide-field", "show-field").html("<h2>"+response.message+"</h2>"+errors);
@@ -172,7 +166,7 @@ modulejs.define(&#39;CreateInstitution&#39;, [&#39;jquery&#39;, &#39;NoosferoRoot&#39;, &#39;SelectElement&#39;]
   function cancel_institution(evt){
     evt.preventDefault();
-    $('#institution_dialog').dialog('close');
+    $('#institution_modal').modal('toggle');
   }
@@ -196,6 +190,16 @@ modulejs.define(&#39;CreateInstitution&#39;, [&#39;jquery&#39;, &#39;NoosferoRoot&#39;, &#39;SelectElement&#39;]
     return user_institutions;
   }
+  function toggle_extra_fields_style_status(status) {
+      if(status) {
+        $('.extra-fields-container').css({ marginTop: "55px" });
+        $('.button-bar').css({ marginTop: "55px" });
+      } else {
+        $('.extra-fields-container').css({ marginTop: "0px" });
+        $('.button-bar').css({ marginTop: "20px" });
+      }
+  }
+
   function institution_autocomplete() {
     $("#input_institution").autocomplete({
@@ -209,8 +213,8 @@ modulejs.define(&#39;CreateInstitution&#39;, [&#39;jquery&#39;, &#39;NoosferoRoot&#39;, &#39;SelectElement&#39;]
             if( result.length === 0 ) {
               $('#institution_empty_ajax_message').switchClass("hide-field", "show-field");
-            } else {
-              $('#institution_empty_ajax_message').switchClass("show-field", "hide-field");
+              toggle_extra_fields_style_status(true);
+              $("#institution_modal").css({display: "none"});
             }
           },
           error: function(ajax, stat, errorThrown) {
@@ -222,17 +226,13 @@ modulejs.define(&#39;CreateInstitution&#39;, [&#39;jquery&#39;, &#39;NoosferoRoot&#39;, &#39;SelectElement&#39;]
       minLength: 2,
       select : function (event, selected) {
+        $('#institution_empty_ajax_message').switchClass("show-field", "hide-field");
+        //$("#create_institution_link").remove();
+        toggle_extra_fields_style_status(false);
         $("#institution_selected").val(selected.item.id).attr("data-name", selected.item.label);
-
-        // +("") -> 0; +("1") -> 1...
-        if (+($("#institution_selected").val()) !== 0) {
-          add_new_institution();
-        }
       }
     });
   }
-
-
   function add_selected_institution_to_list(id, name) {
     var selected_institution = "<li data-institution='"+id+"'>"+name;
         selected_institution += "<a href='#' class='button without-text icon-remove remove-institution'></a></li>";
@@ -240,28 +240,27 @@ modulejs.define(&#39;CreateInstitution&#39;, [&#39;jquery&#39;, &#39;NoosferoRoot&#39;, &#39;SelectElement&#39;]
     $(".institutions_added").append(selected_institution);
   }
-
-  function add_new_institution() {
+  function add_new_institution(evt) {
+    evt.preventDefault();
     var selected = $("#institution_selected");
-    var already_added_to_list = is_institution_already_added_to_list(selected.val());
+    var institution_already_added = $(".institutions_added li[data-institution='"+selected.val()+"']").length;
-    if(selected.val().length > 0 && !already_added_to_list) {
+    if(selected.val().length > 0 && institution_already_added === 0) {
       //field that send the institutions to the server
       $(".institution_container").append(get_clone_institution_data(selected.val()));
       // Visualy add the selected institution to the list
       add_selected_institution_to_list(selected.val(), selected.attr("data-name"));
+      // clean the institution flag
+      selected.val("").attr("data-name", "");
+      $("#input_institution").val("");
+
       $(".remove-institution").click(remove_institution);
     }
   }
-  function is_institution_already_added_to_list(institution_id) {
-    return $(".institutions_added li[data-institution='"+institution_id+"']").length !== 0;
-  }
-
-
   function remove_institution(evt) {
     evt.preventDefault();
     var code = $(this).parent().attr("data-institution");
@@ -279,15 +278,19 @@ modulejs.define(&#39;CreateInstitution&#39;, [&#39;jquery&#39;, &#39;NoosferoRoot&#39;, &#39;SelectElement&#39;]
   function show_hide_cnpj_city(country) {
-    var cnpj = $("#institutions_cnpj").parent().parent();
-    var city = $("#community_city").parent().parent();
-    var state = $("#community_state").parent().parent();
+    var cnpj = $("#institutions_cnpj").parent();
+    var city = $("#community_city").parent();
+    var state = $("#community_state").parent();
     var inst_type = $("input[name='institutions[type]']:checked").val();
+
     institution_type_actions(inst_type);
-    if( country === "-1" ) $("#community_country").val("BR");
+    if ( country === "-1" ) {
+      $("#community_country").val("BR");
+      country = "BR";
+    }
-    if( country !== "BR" ) {
+    if ( country !== "BR" ) {
       cnpj.hide();
       city.hide();
       state.hide();
@@ -364,18 +367,24 @@ modulejs.define(&#39;CreateInstitution&#39;, [&#39;jquery&#39;, &#39;NoosferoRoot&#39;, &#39;SelectElement&#39;]
     }
   }
-  function set_events() {
-    $("#create_institution_link").click(open_create_institution_modal);
+  function set_institution_name_into_modal() {
+    $("#community_name").val($("#input_institution").val());
+  }
+
+
+  function set_events() {
     $("input[name='institutions[type]']").click(function(){
       institution_type_actions(this.value);
-    });
+    }).trigger("click");
     $('#save_institution_button').click(save_institution);
     $('#cancel_institution_button').click(cancel_institution);
     $("#community_name").keyup(institution_already_exists);
+    $("#add_new_institution").click(add_new_institution);
+
     $(".remove-institution").click(remove_institution);
     $("#community_country").change(function(){
@@ -390,19 +399,22 @@ modulejs.define(&#39;CreateInstitution&#39;, [&#39;jquery&#39;, &#39;NoosferoRoot&#39;, &#39;SelectElement&#39;]
     $('#community_country').change(function(){
       autoCompleteCity();
     });
+
+    $("#create_institution_link").click(set_institution_name_into_modal);
   }
+  function init_module() {
+    set_form_count_custom_data();
+    set_events();
+  }
+
   return {
     isCurrentPage: function() {
       return $("#institution_form").length === 1;
     },
-
-    init: function() {
-      set_form_count_custom_data();
-      set_events();
-    },
+    init: init_module,
     institution_autocomplete: function(){
       institution_autocomplete();
@@ -0,0 +1,54 @@
+/* globals modulejs */
+
+modulejs.define('InstitutionModal',
+    ['jquery', 'NoosferoRoot', 'CreateInstitution', 'ModalObserver'],
+    function($, NoosferoRoot, CreateInstitution, ModalObserver)
+{
+  'use strict';
+
+  var AJAX_URL = {
+    create_institution_modal:
+      NoosferoRoot.urlWithSubDirectory("/plugin/gov_user/create_institution"),
+  };
+
+  // When the modal is closed, put the community name into the autocomplete
+  function observer_action() {
+    var community_name = $("#community_name").val();
+    $("#input_institution").attr("value", community_name).autocomplete("search");
+
+    // Clear error messages
+    $("#create_institution_errors").html("");
+  }
+
+  // Observe when modal is closed
+  function observe_modal() {
+    var institution_modal = document.querySelector("#institution_modal");
+    ModalObserver.init(institution_modal, observer_action);
+  }
+
+
+  function prepare_institution_modal() {
+    $.get(AJAX_URL.create_institution_modal, function(response){
+      window.sessionStorage.setItem("InstitutionModalBody", response);
+      $("#institution_modal_body").html(response);
+
+      // Set all events on modal
+      CreateInstitution.init();
+    });
+
+    $("#create_institution_link").click(observe_modal);
+  }
+
+
+  return {
+    isCurrentPage: function() {
+      return $("#institution_modal_container").length === 1;
+    },
+
+
+    init: function() {
+      prepare_institution_modal();
+    },
+  };
+});
+
-<h1><%= _('New Institution') %></h1>
+<div class="form-description">
+  <div class="spb-row no-margin-top">
+    <% if environment.enabled?('admin_must_approve_new_communities') %>
+      <div class='spb-col spb-col-12 explanation'>
+        <%= _("Note that the creation of communities in this environment is restricted. Your request to create this new community will be sent to %{environment} administrators and will be approved or rejected according to their methods and criteria.") % { :environment => environment.name }%>
+      </div>
+    <% end %>
+  </div>
-<% if environment.enabled?('admin_must_approve_new_communities') %>
-  <div class='explanation'>
-    <%= _("Note that the creation of communities in this environment is restricted. Your request to create this new community will be sent to %{environment} administrators and will be approved or rejected according to their methods and criteria.") % { :environment => environment.name }%>
+  <div class="spb-row spb-col spb-col-12 required-field">
+    <%= _("The highlighted fields are mandatory") %>
   </div>
-<%end %>
-
-<% unless flash[:errors].nil? %>
-<div class="errorExplanation" id="errorExplanation">
-  <h2> <%= _("Can`t create new Institution: #{flash[:errors].length} errors") %> </h2>
-  <ul>
-  <% flash[:errors].each do |key, value| %>
-    <% key_name = key.to_s.gsub("_", " ") %>
-    <% if value.length > 0 %>
-      <li> <%= _("<b>#{key_name.capitalize}</b> #{value.join()}") %> </li>
+</div>
+
+<div class="spb-row spb-col spb-col-12">
+  <% unless flash[:errors].nil? %>
+  <div class="errorExplanation" id="errorExplanation">
+    <h2> <%= _("Can`t create new Institution: #{flash[:errors].length} errors") %> </h2>
+    <ul>
+    <% flash[:errors].each do |key, value| %>
+      <% key_name = key.to_s.gsub("_", " ") %>
+      <% if value.length > 0 %>
+        <li> <%= _("<b>#{key_name.capitalize}</b> #{value.join()}") %> </li>
+      <% end %>
     <% end %>
+    </ul>
+  </div>
   <% end %>
-  </ul>
 </div>
-<% end %>
-<div id = 'create_institution_errors' class='errorExplanation hide-field'></div>
-
-<div>
-  <%= labelled_form_for :community, :url => {:action=>"new_institution"}, :html => { :multipart => true, :id=>"institution_form" } do |f| %>
-    <%= required_fields_message %>
-    <%= hidden_field_tag "edit_institution_page", false %>
-    <%= fields_for :institutions do |inst| %>
-      <span class=''>
-          <div class='formfield type-radio'>
-            <label>
-              <%= _("Private Institution") %>
-              <%= radio_button_tag("institutions[type]" ,"PrivateInstitution", true)%>
-            </label>
-
-            <label> <%= _("Public Institution") %>
-              <%= radio_button_tag("institutions[type]", "PublicInstitution") %>
-            </label>
-          </div>
-        </span>
+<div class="spb-row">
+  <div id='create_institution_errors' class='spb-col spb-col-12 errorExplanation hide-field'></div>
+</div>
-      <%= required f.text_field(:name, :class => flash[:error_community_name], :value => params[:community][:name]) %>
-      <%= content_tag :span, _("Institution name already exists"), :id=>"already_exists_text", :class=>"errorExplanation hide-field" %>
-      <span class='optional-field'>
-        <div class="formfield type-text">
-          <%= inst.label "corporate_name", _("Corporate Name"), :class=>"formlabel" %>
-          <%= inst.text_field(:corporate_name, :value => params[:institutions][:corporate_name], :size => 55) %>
-        </div>
-      </span>
+<%= form_for :community, :url => {:action=>"new_institution"}, :html => { :multipart => true, :id=>"institution_form" } do |f| %>
-      <%= required select_country(_('Country'), 'community', 'country', {:class => "type-select #{flash[:error_community_country]}", :id => "community_country"}) %>
+  <%= hidden_field_tag "edit_institution_page", false %>
+  <%= fields_for :institutions do |inst| %>
+    <div class="spb-row no-margin-top">
+      <div class='spb-col spb-col-3'>
+        <label class="formlabel">
+          <%= radio_button_tag("institutions[type]" ,"PrivateInstitution", true)%>
+          <%= _("Private Institution") %>
+        </label>
+      </div>
-      <span class='required-field'>
-        <div class="formfield">
-          <label for="community_state" class="formlabel"><%= _("State") %></label>
-          <%= f.select(:state, @state_options, {:selected => params[:community][:state]}, {:class => flash[:error_community_state]}) %>
-        </div>
-      </span>
+      <div class="spb-col spb-col-3">
+        <label class="formlabel">
+          <%= radio_button_tag("institutions[type]", "PublicInstitution") %>
+          <%= _("Public Institution") %>
+        </label>
+      </div>
-      <%= required f.text_field(:city, :class => flash[:error_community_city], :value => params[:community][:city]) %>
+      <div class="spb-col spb-col-3"></div>
+      <div class="spb-col spb-col-3"></div>
+    </div>
+    <div class="spb-row">
+      <div class="spb-col spb-col-5">
+        <label for="community_name" class="formlabel">
+          <%= _("Corporate Name") %><!-- razão social -->
+          <span class="required-field">(*)</span>
+        </label>
-      <div class="formfield type-text">
+        <%= f.text_field(:name, :class => flash[:error_community_name], :value => params[:community][:name]) %>
+        <%= content_tag :span, _("Institution name already exists"), :id=>"already_exists_text", :class=>"errorExplanation hide-field" %>
+      </div>
+
+      <div class="spb-col spb-col-6">
+        <%= inst.label "corporate_name", _("Fantasy name"), :class=>"formlabel" %><!-- Nome fantasia -->
+        <%= inst.text_field(:corporate_name, :value => params[:institutions][:corporate_name], :size => 55) %>
+      </div>
+    </div>
+
+    <div class="spb-row">
+      <div class="spb-col spb-col-5">
+        <label for="community_country" class="formlabel">
+          <%= _("Country") %>
+          <span class="required-field">(*)</span>
+        </label>
+
+        <%= select("community", "country", [[_('Select a country'), nil]] + country_helper.countries, {:class => "type-select #{flash[:error_community_country]}"}) %>
+      </div>
+
+      <div class="spb-col spb-col-2">
+        <label for="community_state" class="formlabel">
+          <%= _("State") %>
+          <span class="required-field">(*)</span>
+        </label>
+
+        <%= f.select(:state, @state_options, {:selected => params[:community][:state]}, {:class => flash[:error_community_state]}) %>
+      </div>
+
+      <div class="spb-col spb-col-5">
+        <label class="formlabel" for="community_city">
+          <%= _("City") %>
+          <span class="required-field">(*)</span>
+        </label>
+
+        <%= f.text_field(:city, :class => flash[:error_community_city], :value => params[:community][:city]) %>
+      </div>
+    </div>
+
+
+    <div class="spb-row">
+      <div class="spb-col spb-col-12">
         <%= inst.label("cnpj" ,_("CNPJ"), :class=>"formlabel") %>
-        <%= required inst.text_field(:cnpj, :placeholder=>"99.999.999/9999-99", :class=>"intitution_cnpj_field", :value => params[:institutions][:cnpj]) %>
+        <%= inst.text_field(:cnpj, :placeholder=>"99.999.999/9999-99", :class=>"intitution_cnpj_field", :value => params[:institutions][:cnpj]) %>
+      </div>
+    </div>
+
+    <div class="spb-row">
+      <div class="spb-col spb-col-12">
+        <%= hidden_field_tag "acronym_translate", _("Acronym") %>
+        <%= hidden_field_tag "fantasy_name_translate", _("Fantasy name") %>
+        <%= inst.label("acronym" ,_("Acronym"), :class=>"formlabel") %>
+        <%= inst.text_field(:acronym, :value => params[:institutions][:acronym]) %>
       </div>
+    </div>
-      <span class='optional-field'>
-        <div class="formfield type-text">
-          <%= hidden_field_tag "acronym_translate", _("Acronym") %>
-          <%= hidden_field_tag "fantasy_name_translate", _("Fantasy name") %>
-          <%= inst.label("acronym" ,_("Acronym"), :class=>"formlabel") %>
-          <%= inst.text_field(:acronym, :value => params[:institutions][:acronym]) %>
-        </div>
-      </span>
+    <div class="spb-row public-institutions-fields">
+      <div class="spb-col spb-col-6">
+        <label class="formlabel" for="institutions_governmental_sphere_id">
+          <%= _("Governmental Sphere") %>
+          <span class="required-field">(*)</span>
+        </label>
-      <span class='required-field public-institutions-fields'>
-        <div class="formfield type-text">
-          <%= inst.label("governmental_sphere_id" ,_("Governmental Sphere:"), :class=>"formlabel") %>
-          <%= inst.select(:governmental_sphere, @governmental_sphere, :selected=>params[:institutions][:governmental_sphere], :class => flash[:error_institution_governmental_sphere])%>
-        </div>
-      </span>
+        <%= inst.select(:governmental_sphere, @governmental_sphere, :selected=>params[:institutions][:governmental_sphere], :class => flash[:error_institution_governmental_sphere])%>
+      </div>
+    </div>
-      <span class='required-field public-institutions-fields'>
-        <div class="formfield type-text">
-          <%= inst.label("governmental_power_id" ,_("Governmental Power:"), :class=>"formlabel") %>
-          <%= inst.select(:governmental_power, @governmental_power, :selected=>params[:institutions][:governmental_sphere], :class => flash[:error_institution_governmental_power])%>
-        </div>
-      </span>
-      <span class='required-field public-institutions-fields'>
-        <div class="formfield type-text">
-          <%= inst.label("juridical_nature_id" ,_("Juridical Nature:"), :class=>"formlabel") %>
-          <%= inst.select(:juridical_nature, @juridical_nature, :selected=>params[:institutions][:juridical_nature], :class => flash[:error_institution_juridical_nature])%>
-        </div>
-      </span>
+    <div class="spb-row public-institutions-fields">
+      <div class="spb-col spb-col-6">
+        <label class="formlabel" for="institutions_governmental_power_id">
+          <%= _("Governmental Power") %>
+          <span class="required-field">(*)</span>
+        </label>
+
+        <%= inst.select(:governmental_power, @governmental_power, :selected=>params[:institutions][:governmental_sphere], :class => flash[:error_institution_governmental_power])%>
+      </div>
+    </div>
+
+    <div class="spb-row public-institutions-fields">
+      <div class="spb-col spb-col-6">
+        <label class="formlabel" for="institutions_juridical_nature_id">
+          <%= _("Juridical Nature") %>
+          <span class="required-field">(*)</span>
+        </label>
+
+        <%= inst.select(:juridical_nature, @juridical_nature, :selected=>params[:institutions][:juridical_nature], :class => flash[:error_institution_juridical_nature])%>
+      </div>
+    </div>
+
+    <div class="spb-row public-institutions-fields">
+      <div class="spb-col spb-col-12">
+        <%= _("SISP ?") %>
+      </div>
-      <span class='required-field public-institutions-fields'>
-        <div class="formfield type-text">
-          <%= _("SISP?") %>
+      <div class="spc-col spb-col-12 sisp-fields">
+        <div class="spb-col spb-col-3">
           <% if @show_sisp_field %>
+          <div class="spb-col spb-col-5">
             <%= inst.radio_button(:sisp, true, :class => "#{flash[:error_institution_sisp]}" ) %>
             <%= inst.label :sisp ,_("Yes"), :value => true %>
+          </div>
+
+          <div class="spb-col spb-col-6">
             <%= inst.radio_button(:sisp, false, :checked=>"checked", :class => "#{flash[:error_institution_sisp]}") %>
             <%= inst.label :sisp ,_("No"), :value => false %>
+          </div>
           <% else %>
-            <%= inst.label("sisp", _("No")) %>
+            <div class="spb-col spb-col-6">
+              <%= inst.label("sisp", _("No")) %>
+            </div>
           <% end %>
-          </div>
-      </span>
-
-      <% if @url_token == "create_institution_admin" %>
-        <%= submit_button :save, _('Save') %>
-        <%= button(:cancel, _("Cancel"), {:controller => "admin_panel", :action => 'index'}) %>
-      <%else%>
-        <div>
-         <%= link_to(_('Save'), '#', :id=>'save_institution_button', :class=>'button with-text icon-add') %>
-         <%= link_to(_('Cancel'), '#', :id=>"cancel_institution_button", :class=>'button with-text icon-cancel') %>
         </div>
-        <%= hidden_field_tag :institution_error_message, _("Could not send the form data to the server") %>
-      <%end%>
-
-    <% end %>
+      </div>
+    </div>
+
+    <div class="spb-row modal-form-actions">
+      <div class="spb-col spb-col-6">
+        <% if @url_token == "create_institution_admin" %>
+          <%= submit_button :save, _('Save') %>
+          <%= button(:cancel, _("Cancel"), {:controller => "admin_panel", :action => 'index'}) %>
+        <% else %>
+           <%= link_to(_('Save'), '#', :id=>'save_institution_button', :class=>'button with-text icon-add') %>
+           <%= link_to(_('Cancel'), '#', :id=>"cancel_institution_button", :class=>'button with-text icon-cancel') %>
+           <%= hidden_field_tag :institution_error_message, _("Could not send the form data to the server") %>
+        <% end %>
+      </div>
+    </div>
   <% end %>
+<% end %>
 </div>
 <%= hidden_field_tag :loading_message, _("Creating institution") %>
@@ -19,8 +19,8 @@
   </div>
   <%= content_tag(:div, _("No institution found"), :id=>"institution_empty_ajax_message", :class=>"errorExplanation hide-field") %>
-    <%= link_to(_("Create new institution"), "#", :id=>"create_institution_link", :class=>'button with-text icon-add') %>
-  <%= content_tag(:div, "", :id=>"institution_dialog") %>
+
+  <%= InstitutionModalHelper.modal_button %>
   <%= hidden_field_tag("user[institution_ids][]", "", :class => 'user_institutions') %>
   <%= hidden_field_tag("institution_selected", "") %>
@@ -3,8 +3,11 @@
   <span class="star-tooltip" title="Órgão ou Empresa que você representa e utiliza o software"></span>
   <input type="text" id="input_institution">
-  <%= content_tag(:div, _("No institution found"),
-                  :id=>"institution_empty_ajax_message",
-                  :class=>"errorExplanation hide-field") %>
+  <div id="institution_empty_ajax_message" class="errorExplanation hide-field rating-create-institution-container">
+    <span class="institution-not-found"><%= _("No organization or company found") %></span>
+    <%= InstitutionModalHelper.modal_button(_("Add"), "none") %>
+  </div>
+
   <%= hidden_field_tag "organization_rating[institution_id]", "", id: "institution_selected" %>
 </div>
+
@@ -0,0 +1,257 @@
+/* Bootstrap modal default css */
+.modal {
+  position: fixed;
+  top: 0px;
+  right: 0px;
+  bottom: 0px;
+  left: 0px;
+  z-index: 1050;
+  display: none;
+  overflow: hidden;
+  outline: 0px none;
+  background-color: rgba(0, 0, 0, 0.5);
+  height: 100%;
+}
+
+.modal-open .modal {
+  overflow-x: hidden;
+  overflow-y: auto;
+}
+
+.fade {
+  opacity: 0;
+  transition: opacity 0.15s linear 0s;
+}
+
+.fade.in {
+  opacity: 1;
+}
+
+.modal-dialog {
+  width: 45%;
+  margin: 15px auto;
+  position: relative;
+}
+
+.modal.in .modal-dialog {
+  transform: translate(0px, 0px);
+}
+
+.modal.fade .modal-dialog {
+  transition: transform 0.3s ease-out 0s;
+}
+
+.modal-content {
+  box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.5);
+}
+
+.modal-content {
+  position: relative;
+  background-color: #FFF;
+  background-clip: padding-box;
+  border: 1px solid rgba(0, 0, 0, 0.2);
+  border-radius: 6px;
+  outline: 0px none;
+  box-shadow: 0px 3px 9px rgba(0, 0, 0, 0.5);
+}
+
+.modal-header {
+  min-height: 16.43px;
+  padding: 15px;
+  border-bottom: 1px solid #E5E5E5;
+}
+
+.modal-header .close {
+  margin-top: -2px;
+}
+
+.modal-header button.close {
+  padding: 0px;
+  cursor: pointer;
+  background: transparent none repeat scroll 0px 0px;
+  border: 0px none;
+}
+
+.modal-header .close {
+  float: right;
+  font-size: 21px;
+  font-weight: 700;
+  line-height: 1;
+  color: #000;
+  text-shadow: 0px 1px 0px #FFF;
+  opacity: 0.2;
+}
+
+.modal-title {
+  margin: 0px !important;
+  line-height: 1.42857 !important;
+}
+
+.modal-body {
+  position: relative;
+  padding: 15px;
+}
+
+.modal-footer {
+  padding: 15px;
+  text-align: right;
+  border-top: 1px solid #E5E5E5;
+}
+
+
+/* Bootstrap modal override */
+.modal-title {
+  font-family: 'open_sansregular', Arial, Helvetica, sans-serif;
+}
+
+.modal-header h4 {
+  color: #333 !important;
+  font-size: 17px !important;
+}
+
+.modal-body {
+  overflow: hidden;
+}
+
+/* Bootstrap modal form fields */
+.modal,
+.modal input,
+.modal select,
+.modal .formlabel {
+  font-family: 'open_sansregular', Arial, Helvetica, sans-serif;
+  color: #333;
+  font-style: normal;
+}
+
+.modal label {
+  margin-left: 4px;
+}
+
+.modal .sisp-fields label {
+  margin-left: 0px;
+}
+
+.modal h2 {
+  margin-top: 0px !important;
+}
+
+.modal .form-description {
+  border-bottom: 1px solid #E5E5E5;
+  padding-bottom: 15px;
+  overflow: hidden;
+}
+
+.modal .formfieldline {
+  padding: 0px;
+  margin: 0px;
+}
+
+.modal input[type="text"],
+.modal select {
+  padding: 10px;
+  border-radius: 5px;
+  border: solid 1px #ccc;
+  background-color: #fff;
+}
+
+.modal input[type="radio"] {
+  vertical-align: middle;
+}
+
+.modal .explanation {
+  color: #3F60C6;
+  font-size: 12px;
+}
+
+.modal .required-field, .modal .errorExplanation {
+  color: #EA1C00;
+  font-size:12px;
+}
+
+.modal .spb-row {
+  margin-top: 15px;
+}
+
+.no-margin-top {
+  margin-top: 0px !important;
+}
+
+.modal .modal-margin-right {
+  margin-right: 4%;
+}
+
+.modal .modal-margin-left {
+  margin-left: 4%;
+}
+
+.modal #community_name {
+  width: 200px;
+}
+
+.modal #institutions_corporate_name {
+  width: 285px;
+}
+
+.modal #community_country {
+  width: 220px;
+}
+
+.modal #community_state {
+  width: 80px;
+}
+
+.modal #community_city {
+  width: 190px;
+  margin-top: 2px;
+}
+
+.modal #institutions_cnpj,
+.modal #institutions_acronym {
+  width: 530px;
+}
+
+.modal a.button.with-text.icon-add,
+.modal a.button.with-text.icon-cancel {
+  line-height: 25px !important;
+  padding: 5px 15px !important;
+  font-size: 12px !important;
+}
+
+.modal a.button.with-text.icon-add {
+  background-color: #3E67B1 !important;
+  color: #fff !important;
+}
+
+.modal .public-institutions-fields {
+  display: none;
+}
+
+.modal .modal-form-actions {
+  margin-top: 20px;
+}
+
+/* New rating page */
+.rating-create-institution-container {
+  overflow: hidden;
+}
+
+.rating-create-institution-container > .institution-not-found {
+  line-height: 30px;
+}
+
+.rating-create-institution-container .institution-not-found {
+  position: relative;
+  float: left;
+}
+
+.rating-create-institution-container  #institution_modal_container {
+  position: relative;
+  float: left;
+}
+
+.rating-create-institution-container  #create_institution_link {
+  background-color: #3E67B1 !important;
+  color: #FFF !important;
+  text-transform: none !important;
+}
+
@@ -0,0 +1,76 @@
+.spb-row,
+.spb-col {
+  box-sizing: border-box;
+}
+
+.spb-row:before,
+.spb-row:after {
+  content: "";
+  display: table;
+}
+
+.spb-row:after {
+  clear: both;
+}
+
+.spb-col {
+  position: relative;
+  float: left;
+}
+
+.spb-col {
+  margin-right: 1.6%;
+}
+.spb-col:last-child {
+  margin-right: 0%;
+}
+
+
+.spb-col-1 {
+  width: 6.86666666667%;
+}
+
+.spb-col-2 {
+  width: 15.3333333333%;
+}
+
+.spb-col-3 {
+  width: 23.8%;
+}
+
+.spb-col-4 {
+  width: 32.2666666667%;
+}
+
+.spb-col-5 {
+  width: 40.7333333333%;
+}
+
+.spb-col-6 {
+  width: 49.2%;
+}
+
+.spb-col-7 {
+  width: 57.6666666667%;
+}
+
+.spb-col-8 {
+  width: 66.1333333333%;
+}
+
+.spb-col-9 {
+  width: 74.6%;
+}
+
+.spb-col-10 {
+  width: 83.0666666667%;
+}
+
+.spb-col-11 {
+  width: 91.5333333333%;
+}
+
+.spb-col-12 {
+  width: 100%;
+}
+
@@ -239,7 +239,7 @@
 #content .star-rate-form .star-comment-container .comments-software-extra-fields {
   height: 0;
-  overflow: hidden;
+  overflow: initial;
 }
 #content .star-rate-form .star-comment-container .comments-software-extra-fields #input_institution_comments {
@@ -248,11 +248,11 @@
   height: 50px;
 }
-#content .star-rate-form .star-comment-container .comments-software-extra-fields #input_institution_comments label {
+#content .star-rate-form .star-comment-container .comments-software-extra-fields #input_institution_comments > label {
   font-size: 12px;
 }
-#content .star-rate-form .star-comment-container .comments-software-extra-fields #input_institution_comments input {
+#content .star-rate-form .star-comment-container .comments-software-extra-fields #input_institution_comments > input {
   display: block;
   height: 19px;
   width: 335px;
@@ -9,6 +9,7 @@
 /*** SPB Theme section styles ***/
 @import url(css/overwriting-base-theme.css);
+@import url(css/spb-grid.css);
 @import url(css/header.css);
 @import url(css/footer.css);
 @import url(css/left-bar.css);
@@ -26,6 +27,7 @@
 @import url(css/tooltip.css);
 @import url(css/popover.css);
 @import url(css/notifications.css);
+@import url(css/modal.css);
 @font-face{
   font-weight: normal;
@@ -18,6 +18,28 @@ Given /^SoftwareInfo has initial default values on database$/ do
   OperatingSystemName.create(:name=>"CentOS")
 end
+Given /^Institutions has initial default values on database$/ do
+  GovernmentalPower.create(:name => "Executivo")
+  GovernmentalPower.create(:name => "Legislativo")
+  GovernmentalPower.create(:name => "Judiciario")
+
+  GovernmentalSphere.create(:name => "Federal")
+
+  JuridicalNature.create(:name => "Autarquia")
+  JuridicalNature.create(:name => "Administracao Direta")
+  JuridicalNature.create(:name => "Empresa Publica")
+  JuridicalNature.create(:name => "Fundacao")
+  JuridicalNature.create(:name => "Orgao Autonomo")
+  JuridicalNature.create(:name => "Sociedade")
+  JuridicalNature.create(:name => "Sociedade Civil")
+  JuridicalNature.create(:name => "Sociedade de Economia Mista")
+
+  national_region = NationalRegion.new
+  national_region.name = "Distrito Federal"
+  national_region.national_region_code = '35'
+  national_region.national_region_type_id = NationalRegionType::STATE
+  national_region.save
+end
 Given /^I type in "([^"]*)" in autocomplete list "([^"]*)" and I choose "([^"]*)"$/ do |typed, input_field_selector, should_select|
   # Wait the page javascript load
@@ -42,6 +64,27 @@ Given /^I type in &quot;([^&quot;]*)&quot; in autocomplete list &quot;([^&quot;]*)&quot; and I choose &quot;([^&quot;]*)
   sleep 1
 end
+Given /^the following public institutions?$/ do |table|
+  # table is a Cucumber::Ast::Table
+  table.hashes.each do |item|
+    community = Community.new
+    community.name = item[:name]
+    community.country = item[:country]
+    community.state = item[:state]
+    community.city = item[:city]
+    community.save!
+
+    governmental_power = GovernmentalPower.where(:name => item[:governmental_power]).first
+    governmental_sphere = GovernmentalSphere.where(:name => item[:governmental_sphere]).first
+
+    juridical_nature = JuridicalNature.create(:name => item[:juridical_nature])
+
+    institution = PublicInstitution.new(:name => item[:name], :type => "PublicInstitution", :acronym => item[:acronym], :cnpj => item[:cnpj], :juridical_nature => juridical_nature, :governmental_power => governmental_power, :governmental_sphere => governmental_sphere)
+    institution.community = community
+    institution.corporate_name = item[:corporate_name]
+    institution.save!
+  end
+end
 Given /^the following software language$/ do |table|
   table.hashes.each do |item|
@@ -110,6 +110,10 @@
   cursor: pointer;
 }
+.extra-fields-container {
+  overflow: auto;
+}
+
 .catalog_rating_block {
   margin-top: 5px;
 }
@@ -7,17 +7,17 @@
 </div>
 <div class="comments-software-extra-fields">
-  <div class="comments-software-people-benefited">
-    <%= label_tag "comments_people_benefited", _("Number of Beneficiaries")%>
-    <span class="star-tooltip" title="Quantidade de pessoas beneficiadas com a utilização do software"></span>
-    <%= text_field_tag "people_benefited_tmp", "" %>
-    <%= hidden_field_tag "organization_rating[people_benefited]", "" %>
-  </div>
+  <div class="extra-fields-container">
+    <div class="comments-software-people-benefited">
+      <%= label_tag "comments_people_benefited", _("Number of Beneficiaries")%>
+      <span class="star-tooltip" title="Estimativa do número de pessoas beneficiadas com a utilização do software"></span>
+      <%= text_field_tag "organization_rating[people_benefited]", "" %>
+    </div>
-  <div class="comments-software-saved-values">
-    <%= label_tag "comments_saved_value", _("Saved Resources")%>
-    <span class="star-tooltip" title="Valores em “Real” economizados com a utilização do software"></span>
-    <%= text_field_tag "saved_value_tmp", "", :placeholder=>"R$" %>
-    <%= hidden_field_tag "organization_rating[saved_value]","" %>
+    <div class="comments-software-saved-values">
+      <%= label_tag "comments_saved_value", _("Saved resources")%>
+      <span class="star-tooltip" title='Estimativa dos valores em "Real" economizados com a utilização do software'></span>
+      <%= text_field_tag "organization_rating[saved_value]", "", :placeholder=>"R$"%>
+    </div>
   </div>
 </div>
	@@ -117,7 +117,7 @@ class GovUserPluginController < ApplicationController		@@ -117,7 +117,7 @@ class GovUserPluginController < ApplicationController
117	@juridical_nature = get_juridical_natures()	117	@juridical_nature = get_juridical_natures()
118		118
119	state_list = get_state_list()	119	state_list = get_state_list()
120	- @state_options = state_list.zip(state_list).prepend([_('Select a state'), '-1'])	120	+ @state_options = state_list.zip(state_list)
121	end	121	end
122		122
123	def get_model_by_params_field	123	def get_model_by_params_field
@@ -0,0 +1,78 @@		@@ -0,0 +1,78 @@
	1	+Feature: Create institution on user report
	2	+ As a user
	3	+ I want to create a institution in use report of a software
	4	+ to add institution in report.
	5	+
	6	+ Background:
	7	+ Given "GovUserPlugin" plugin is enabled
	8	+ And "SoftwareCommunitiesPlugin" plugin is enabled
	9	+ And "OrganizationRatings" plugin is enabled
	10	+ And I am logged in as mpog_admin
	11	+ And I go to /admin/plugins
	12	+ And I check "GovUserPlugin"
	13	+ And I check "SoftwareCommunitiesPlugin"
	14	+ And I check "Organization Ratings"
	15	+ And I press "Save changes"
	16	+ And the following softwares
	17	+ \| name \| public_software \| finality \|
	18	+ \| Noosfero \| true \| some finality \|
	19	+
	20	+ @selenium
	21	+ Scenario: Test Additional JavaScript Fields
	22	+ Given I go to /profile/noosfero/plugin/organization_ratings/new_rating
	23	+ And I should not see "Number of Beneficiaries"
	24	+ And I should not see "Saved resources"
	25	+ And I should not see "Organization name or Enterprise name"
	26	+ When I click on anything with selector "#comments-additional-information"
	27	+ Then I should see "Number of Beneficiaries"
	28	+ And I should see "Organization name or Enterprise name"
	29	+ And I should see "Saved resources"
	30	+
	31	+ @selenium
	32	+ Scenario: Show new institution fields when clicked in add new institution
	33	+ Given I go to /profile/noosfero/plugin/organization_ratings/new_rating
	34	+ And I click on anything with selector "#comments-additional-information"
	35	+ And I fill in "input_institution" with "None institution"
	36	+ And I sleep for 2 seconds
	37	+ When I follow "Add"
	38	+ Then I should see "New Institution"
	39	+ And I should see "Public Institution"
	40	+ And I should see "Private Institution"
	41	+ And I should see "Corporate Name"
	42	+ And I should see "Name"
	43	+ And I should see "State"
	44	+ And I should see "City"
	45	+ And I should see "Country"
	46	+ And I should see "CNPJ"
	47	+ And I should see "Acronym"
	48	+ And I choose "Public Institution"
	49	+ And I should see "Governmental Sphere:"
	50	+ And I should see "Governmental Power:"
	51	+ And I should see "Juridical Nature:"
	52	+
	53	+ @selenium
	54	+ Scenario: Create new institution with name changed in the modal
	55	+ Given I go to /profile/noosfero/plugin/organization_ratings/new_rating
	56	+ And I click on anything with selector "#comments-additional-information"
	57	+ And I fill in "input_institution" with "None institution"
	58	+ And I sleep for 2 seconds
	59	+ When I click on anything with selector "#create_institution_link"
	60	+ And I fill in "community_name" with "Noosfero Institution"
	61	+ And I select "United States" from "#community_country"
	62	+ And I follow "#save_institution_button"
	63	+ Then I should see "Noosfero Institution"
	64	+
	65	+ @selenium
	66	+ Scenario: Check new institution name in the modal
	67	+ Given I go to /profile/noosfero/plugin/organization_ratings/new_rating
	68	+ And I click on anything with selector "#comments-additional-information"
	69	+ And I fill in "input_institution" with "None institution"
	70	+ And I sleep for 2 seconds
	71	+ When I click on anything with selector "#create_institution_link"
	72	+ Then I should see "None Institution" within "community_name"
	73	+
	74	+
	75	+
	76	+
	77	+
	78	+
	@@ -1,90 +0,0 @@	@@ -1,90 +0,0 @@
1	-Given /^Institutions has initial default values on database$/ do
2	- GovernmentalPower.create(:name => "Executivo")
3	- GovernmentalPower.create(:name => "Legislativo")
4	- GovernmentalPower.create(:name => "Judiciario")
5	-
6	- GovernmentalSphere.create(:name => "Federal")
7	-
8	- JuridicalNature.create(:name => "Autarquia")
9	- JuridicalNature.create(:name => "Administracao Direta")
10	- JuridicalNature.create(:name => "Empresa Publica")
11	- JuridicalNature.create(:name => "Fundacao")
12	- JuridicalNature.create(:name => "Orgao Autonomo")
13	- JuridicalNature.create(:name => "Sociedade")
14	- JuridicalNature.create(:name => "Sociedade Civil")
15	- JuridicalNature.create(:name => "Sociedade de Economia Mista")
16	-
17	- national_region = NationalRegion.new
18	- national_region.name = "Distrito Federal"
19	- national_region.national_region_code = '35'
20	- national_region.national_region_type_id = NationalRegionType::STATE
21	- national_region.save
22	-end
23	-
24	-Given /^I type in "([^"])" in autocomplete list "([^"])" and I choose "([^"]*)"$/ do \|typed, input_field_selector, should_select\|
25	-# Wait the page javascript load
26	-sleep 1
27	-# Basicaly it, search for the input field, type something, wait for ajax end select an item
28	-page.driver.browser.execute_script %Q{
29	- var search_query = "#{input_field_selector}.ui-autocomplete-input";
30	- var input = jQuery(search_query).first();
31	-
32	- input.trigger('click');
33	- input.val('#{typed}');
34	- input.trigger('keydown');
35	-
36	- window.setTimeout(function(){
37	- search_query = ".ui-menu-item a:contains('#{should_select}')";
38	- var typed = jQuery(search_query).first();
39	-
40	- typed.trigger('mouseenter').trigger('click');
41	- console.log(jQuery('#license_info_id'));
42	- }, 1000);
43	- }
44	- sleep 1
45	-end
46	-
47	-Given /^the following public institutions?$/ do \|table\|
48	- # table is a Cucumber::Ast::Table
49	- table.hashes.each do \|item\|
50	- community = Community.new
51	- community.name = item[:name]
52	- community.country = item[:country]
53	- community.state = item[:state]
54	- community.city = item[:city]
55	- community.save!
56	-
57	- governmental_power = GovernmentalPower.where(:name => item[:governmental_power]).first
58	- governmental_sphere = GovernmentalSphere.where(:name => item[:governmental_sphere]).first
59	-
60	- juridical_nature = JuridicalNature.create(:name => item[:juridical_nature])
61	-
62	- institution = PublicInstitution.new(:name => item[:name], :type => "PublicInstitution", :acronym => item[:acronym], :cnpj => item[:cnpj], :juridical_nature => juridical_nature, :governmental_power => governmental_power, :governmental_sphere => governmental_sphere)
63	- institution.community = community
64	- institution.corporate_name = item[:corporate_name]
65	- institution.save!
66	- end
67	-end
68	-
69	-Given /^I sleep for (\d+) seconds$/ do \|time\|
70	- sleep time.to_i
71	-end
72	-
73	-Given /^I am logged in as mpog_admin$/ do
74	- visit('/account/logout')
75	-
76	- user = User.new(:login => 'admin_user', :password => '123456', :password_confirmation => '123456', :email => 'admin_user@example.com')
77	- person = Person.new :name=>"Mpog Admin", :identifier=>"mpog-admin"
78	- user.person = person
79	- user.save!
80	-
81	- user.activate
82	- e = Environment.default
83	- e.add_admin(user.person)
84	-
85	- visit('/account/login')
86	- fill_in("Username", :with => user.login)
87	- fill_in("Password", :with => '123456')
88	- click_button("Log in")
89	-end
90	-
@@ -0,0 +1,93 @@		@@ -0,0 +1,93 @@
	1	+Given /^Institutions has initial default values on database$/ do
	2	+ GovernmentalPower.create(:name => "Executivo")
	3	+ GovernmentalPower.create(:name => "Legislativo")
	4	+ GovernmentalPower.create(:name => "Judiciario")
	5	+
	6	+ GovernmentalSphere.create(:name => "Federal")
	7	+
	8	+ JuridicalNature.create(:name => "Autarquia")
	9	+ JuridicalNature.create(:name => "Administracao Direta")
	10	+ JuridicalNature.create(:name => "Empresa Publica")
	11	+ JuridicalNature.create(:name => "Fundacao")
	12	+ JuridicalNature.create(:name => "Orgao Autonomo")
	13	+ JuridicalNature.create(:name => "Sociedade")
	14	+ JuridicalNature.create(:name => "Sociedade Civil")
	15	+ JuridicalNature.create(:name => "Sociedade de Economia Mista")
	16	+
	17	+ national_region = NationalRegion.new
	18	+ national_region.name = "Distrito Federal"
	19	+ national_region.national_region_code = '35'
	20	+ national_region.national_region_type_id = NationalRegionType::STATE
	21	+ national_region.save
	22	+end
	23	+
	24	+Given /^I type in "([^"])" in autocomplete list "([^"])" and I choose "([^"]*)"$/ do \|typed, input_field_selector, should_select\|
	25	+# Wait the page javascript load
	26	+sleep 1
	27	+# Basicaly it, search for the input field, type something, wait for ajax end select an item
	28	+page.driver.browser.execute_script %Q{
	29	+ var search_query = "#{input_field_selector}.ui-autocomplete-input";
	30	+ var input = jQuery(search_query).first();
	31	+
	32	+ input.trigger('click');
	33	+ input.val('#{typed}');
	34	+ input.trigger('keydown');
	35	+
	36	+ window.setTimeout(function(){
	37	+ search_query = ".ui-menu-item a:contains('#{should_select}')";
	38	+ var typed = jQuery(search_query).first();
	39	+
	40	+ typed.trigger('mouseenter').trigger('click');
	41	+ console.log(jQuery('#license_info_id'));
	42	+ }, 1000);
	43	+ }
	44	+ sleep 1
	45	+end
	46	+
	47	+Given /^the following public institutions?$/ do \|table\|
	48	+ # table is a Cucumber::Ast::Table
	49	+ table.hashes.each do \|item\|
	50	+ community = Community.new
	51	+ community.name = item[:name]
	52	+ community.country = item[:country]
	53	+ community.state = item[:state]
	54	+ community.city = item[:city]
	55	+ community.save!
	56	+
	57	+ governmental_power = GovernmentalPower.where(:name => item[:governmental_power]).first
	58	+ governmental_sphere = GovernmentalSphere.where(:name => item[:governmental_sphere]).first
	59	+
	60	+ juridical_nature = JuridicalNature.create(:name => item[:juridical_nature])
	61	+
	62	+ institution = PublicInstitution.new(:name => item[:name], :type => "PublicInstitution", :acronym => item[:acronym], :cnpj => item[:cnpj], :juridical_nature => juridical_nature, :governmental_power => governmental_power, :governmental_sphere => governmental_sphere)
	63	+ institution.community = community
	64	+ institution.corporate_name = item[:corporate_name]
	65	+ institution.save!
	66	+ end
	67	+end
	68	+
	69	+Given /^I sleep for (\d+) seconds$/ do \|time\|
	70	+ sleep time.to_i
	71	+end
	72	+
	73	+Given /^I am logged in as mpog_admin$/ do
	74	+ visit('/account/logout')
	75	+
	76	+ user = User.new(:login => 'admin_user', :password => '123456', :password_confirmation => '123456', :email => 'admin_user@example.com')
	77	+ person = Person.new :name=>"Mpog Admin", :identifier=>"mpog-admin"
	78	+ user.person = person
	79	+ user.save!
	80	+
	81	+ user.activate
	82	+ e = Environment.default
	83	+ e.add_admin(user.person)
	84	+
	85	+ visit('/account/login')
	86	+ fill_in("Username", :with => user.login)
	87	+ fill_in("Password", :with => '123456')
	88	+ click_button("Log in")
	89	+end
	90	+
	91	+Given /^I click on anything with selector "([^"]*)"$/ do \|selector\|
	92	+ evaluate_script "jQuery('#{selector}').trigger('click') && true"
	93	+end
	@@ -0,0 +1 @@		@@ -0,0 +1 @@
		1	+../../../software_communities/features/step_definitions/software_communities_steps.rb
0	\ No newline at end of file	2	\ No newline at end of file
@@ -0,0 +1,74 @@		@@ -0,0 +1,74 @@
	1	+class InstitutionModalHelper
	2	+ extend(
	3	+ ActionView::Helpers::FormOptionsHelper, # content_tag
	4	+ ActionView::Helpers::FormTagHelper, # button_tag
	5	+ ActionView::Helpers::UrlHelper, # link_to
	6	+ ActionView::Context # content_tag do end
	7	+ )
	8	+
	9	+ def self.modal_button link_text=_("Create new institution"), display="block"
	10	+ # HTML Sample in: http://getbootstrap.com/javascript/#modals-examples
	11	+ content_tag :div, :id=>"institution_modal_container", :style=>"display: #{display}" do
	12	+ link = link_to(
	13	+ link_text,
	14	+ "javascript: void(0)",
	15	+ {:class=>"button with-text", :data=>{:toggle=>"modal", :target=>"#institution_modal"}, :id=>"create_institution_link"}
	16	+ )
	17	+
	18	+ link.concat modal
	19	+ end
	20	+ end
	21	+
	22	+ private
	23	+
	24	+ def self.modal
	25	+ options = {
	26	+ :id=>"institution_modal",
	27	+ :role=>"dialog",
	28	+ :class=>"modal fade"
	29	+ }
	30	+
	31	+ content_tag :div, options do
	32	+ modal_dialog
	33	+ end
	34	+ end
	35	+
	36	+ def self.modal_dialog
	37	+ content_tag :div, :class=>"modal-dialog", :role=>"document" do
	38	+ modal_content
	39	+ end
	40	+ end
	41	+
	42	+ def self.modal_content
	43	+ content_tag :div, :class=>"modal-content" do
	44	+ #modal_header.concat(modal_body.concat(modal_footer))
	45	+ modal_header.concat(modal_body)
	46	+ end
	47	+ end
	48	+
	49	+ def self.modal_header
	50	+ content_tag :div, :class=>"modal-header" do
	51	+ button = button_tag :type=>"button", :data=>{:dismiss=>"modal"}, :class=>"close" do
	52	+ content_tag :span, "×"
	53	+ end
	54	+
	55	+ h4 = content_tag :h4, _("New Institution"), :class=>"modal-title"
	56	+
	57	+ button.concat h4
	58	+ end
	59	+ end
	60	+
	61	+ def self.modal_body
	62	+ content_tag :div, "", :id=>"institution_modal_body", :class=>"modal-body"
	63	+ end
	64	+
	65	+ #def self.modal_footer
	66	+ # content_tag :div, {:class=>"modal-footer"} do
	67	+ # close = button_tag _("Close"), :type=>"button", :class=>"button with-text"
	68	+ # save = button_tag _("Save changes"), :type=>"button", :class=>"button with-text"
	69	+ #
	70	+ # close.concat save
	71	+ # end
	72	+ #end
	73	+end
	74	+
	@@ -9,7 +9,8 @@		@@ -9,7 +9,8 @@
9	'CompleteRegistration',	9	'CompleteRegistration',
10	'UserEditProfile',	10	'UserEditProfile',
11	'NewCommunity',	11	'NewCommunity',
12	- 'GovUserCommentsExtraFields'	12	+ 'GovUserCommentsExtraFields',
		13	+ 'InstitutionModal'
13	];	14	];
14		15
15		16
@@ -0,0 +1,36 @@		@@ -0,0 +1,36 @@
	1	+/* globals modulejs */
	2	+
	3	+// Works on: IE 11, Edge 12+, Firefox 40+, Chrome 43+, Opera 32+, Safari 32+
	4	+modulejs.define("ModalObserver", function() {
	5	+ "use strict";
	6	+
	7	+ function ModalObserver(target, callback) {
	8	+ this.action_callback = callback;
	9	+ this.observer = new MutationObserver(this.mutationVerifier.bind(this));
	10	+
	11	+ this.observer.observe(target, {attributes: true});
	12	+ }
	13	+
	14	+
	15	+ ModalObserver.prototype.mutationVerifier = function(mutations) {
	16	+ var callback = this.action_callback;
	17	+ var observer = this.observer;
	18	+
	19	+ mutations.forEach(function(mutation) {
	20	+ if (mutation.attributeName === "style" &&
	21	+ mutation.target.style.display === "none")
	22	+ {
	23	+ callback();
	24	+ // stop the observer, once its action is done
	25	+ observer.disconnect();
	26	+ }
	27	+ });
	28	+ };
	29	+
	30	+
	31	+ return {
	32	+ init: function(target, callback) {
	33	+ new ModalObserver(target, callback);
	34	+ }
	35	+ };
	36	+});
	@@ -24,3 +24,12 @@		@@ -24,3 +24,12 @@
24	border-color: #FF0000;	24	border-color: #FF0000;
25	box-shadow: 0 0 10px #FF0000;	25	box-shadow: 0 0 10px #FF0000;
26	}	26	}
		27	+
		28	+#institution_empty_ajax_message {
		29	+ margin-top: 10px;
		30	+ margin-left: 0px !important;
		31	+}
		32	+
		33	+#create_institution_link {
		34	+ margin-left: 8px;
		35	+}
@@ -0,0 +1,54 @@		@@ -0,0 +1,54 @@
	1	+/* globals modulejs */
	2	+
	3	+modulejs.define('InstitutionModal',
	4	+ ['jquery', 'NoosferoRoot', 'CreateInstitution', 'ModalObserver'],
	5	+ function($, NoosferoRoot, CreateInstitution, ModalObserver)
	6	+{
	7	+ 'use strict';
	8	+
	9	+ var AJAX_URL = {
	10	+ create_institution_modal:
	11	+ NoosferoRoot.urlWithSubDirectory("/plugin/gov_user/create_institution"),
	12	+ };
	13	+
	14	+ // When the modal is closed, put the community name into the autocomplete
	15	+ function observer_action() {
	16	+ var community_name = $("#community_name").val();
	17	+ $("#input_institution").attr("value", community_name).autocomplete("search");
	18	+
	19	+ // Clear error messages
	20	+ $("#create_institution_errors").html("");
	21	+ }
	22	+
	23	+ // Observe when modal is closed
	24	+ function observe_modal() {
	25	+ var institution_modal = document.querySelector("#institution_modal");
	26	+ ModalObserver.init(institution_modal, observer_action);
	27	+ }
	28	+
	29	+
	30	+ function prepare_institution_modal() {
	31	+ $.get(AJAX_URL.create_institution_modal, function(response){
	32	+ window.sessionStorage.setItem("InstitutionModalBody", response);
	33	+ $("#institution_modal_body").html(response);
	34	+
	35	+ // Set all events on modal
	36	+ CreateInstitution.init();
	37	+ });
	38	+
	39	+ $("#create_institution_link").click(observe_modal);
	40	+ }
	41	+
	42	+
	43	+ return {
	44	+ isCurrentPage: function() {
	45	+ return $("#institution_modal_container").length === 1;
	46	+ },
	47	+
	48	+
	49	+ init: function() {
	50	+ prepare_institution_modal();
	51	+ },
	52	+ };
	53	+});
	54	+