incomplete_registration: New visualization to percentage of profile complete regeistration.

Signed-off-by: Fabio Teixeira <fabio1079@gmail.com> Signed-off-by: Parley Martins <parley@outlook.com>

incomplete_registration: New visualization to percentage of profile complete regeistration.
Signed-off-by: Fabio Teixeira <fabio1079@gmail.com> Signed-off-by: Parley Martins <parley@outlook.com>
Fabio Teixeira
1 parent b0727510
Showing 4 changed files with 40 additions and 47 deletions Show diff stats
lib/mpog_software_plugin.rb
public/mpog-incomplete-registration.js
public/style.css
views/incomplete_registration.html.erb
@@ -150,17 +150,14 @@ class MpogSoftwarePlugin &lt; Noosfero::Plugin
     person.has_permission_without_plugins?(permission, target)
   end
-
-  def body_middle
+  def incomplete_registration
     return if context.session[:user].nil? or context.session[:hide_incomplete_percentage] == true
     person = Person.where(:user_id=>context.session[:user]).first
     unless person.nil?
-      @profile_edit_link = link_to _("Complete your registration"), "/myprofile/#{person.identifier}/profile_editor/edit"
-      @profile_empty_fields =  profile_required_empty_list person
+      @profile_edit_link = link_to _("Complete your profile"), "/myprofile/#{person.identifier}/profile_editor/edit"
       @percentege = calc_percentage_registration(person)
-
       if @percentege >= 0 and @percentege <= 100
         expanded_template('incomplete_registration.html.erb')
       end
@@ -178,7 +175,7 @@ class MpogSoftwarePlugin &lt; Noosfero::Plugin
     required_list = profile_required_list
     empty_fields = profile_required_empty_list person
-    percentege = (empty_fields.count*100)/required_list.count
+    percentege = 100 - ((empty_fields.count*100)/required_list.count)
     person.percentage_incomplete = percentege
     person.save(validate: false)
     percentege
@@ -3,11 +3,25 @@ function hide_incomplete_percentage(evt) {
   jQuery.get("/plugin/mpog_software/hide_registration_incomplete_percentage", {hide:true}, function(response){
     if( response == true )
-      jQuery("#incomplete_registration").fadeOut();
+      jQuery("#complete_registration").fadeOut();
   });
 }
+function show_complete_progressbar() {
+  var percentage = jQuery("#complete_registration_message span").html();
+  var canvas_tag = document.getElementById("complete_registration_percentage");
+  var context = canvas_tag.getContext("2d");
+
+  percentage = canvas_tag.width*(percentage/100.0);
+
+  context.beginPath();
+  context.rect(0, 0, percentage, canvas_tag.height);
+  context.fillStyle = '#00FF00';
+  context.fill();
+}
 jQuery(document).ready(function(){
   jQuery(".hide-incomplete-percentage").click(hide_incomplete_percentage);
+
+  show_complete_progressbar();
 });
@@ -114,22 +114,23 @@
   width: 180px;
 }
-#incomplete_registration {
-  position: relative;
-  border: solid 2px #000;
+#complete_registration {
   padding: 5px;
+  width: 100%;
+  background-color: #fff;
 }
-#incomplete_percentage {
-  text-align: center;
-  margin-bottom: 15px;
-  font-size: 18px;
+#complete_registration a {
+  text-decoration: none;
 }
-#profile_empty_fields span {
-  margin-left: 15px;
+#complete_registration a:hover {
+  font-weight: bold;
 }
-#profile_links table tr td {
-  text-align: center;
-}
+#complete_registration_percentage {
+  width: 100%;
+  height: 20px;
+  background: #fff;
+  border: solid 1px #000;
+}
 \ No newline at end of file
-<div id='incomplete_registration'>
-  <div id="incomplete_percentage">
-    <%= _("Incomplete registration percentage")+":#{@percentege}%" %>
+<div id='complete_registration'>
+  <div id="complete_registration_message">
+    <div><%= _("Complete Profile")+": <span>#{@percentege}</span>%" %></div>
+    <canvas id="complete_registration_percentage" width="100%" height="20"></canvas>
+    <div>
+      <%= @profile_edit_link %> |
+      <%= link_to _("Hide"), "#", :class=>"hide-incomplete-percentage" %>
+    </div>
   </div>
-
-  <div id="profile_empty_fields">
-   <span><%= _("List with fields to be filled")+":" %></span>
-    <ul>
-      <% @profile_empty_fields.each do |field|%>
-      <li>
-        <%= field %>
-      </li>
-      <% end %>
-    </ul>
-  </div>
-
-  <div id="profile_links">
-    <table>
-      <tr>
-        <td>
-          <%= @profile_edit_link %>
-        </td>
-        <td>
-          <%= link_to _("Hide this message"), "#", :class=>"hide-incomplete-percentage" %></a>
-        </td>
-      </tr>
-    </table>
-  </div>
-</div>
+</div>
 \ No newline at end of file
	@@ -3,11 +3,25 @@ function hide_incomplete_percentage(evt) {		@@ -3,11 +3,25 @@ function hide_incomplete_percentage(evt) {
3		3
4	jQuery.get("/plugin/mpog_software/hide_registration_incomplete_percentage", {hide:true}, function(response){	4	jQuery.get("/plugin/mpog_software/hide_registration_incomplete_percentage", {hide:true}, function(response){
5	if( response == true )	5	if( response == true )
6	- jQuery("#incomplete_registration").fadeOut();	6	+ jQuery("#complete_registration").fadeOut();
7	});	7	});
8	}	8	}
9		9
		10	+function show_complete_progressbar() {
		11	+ var percentage = jQuery("#complete_registration_message span").html();
		12	+ var canvas_tag = document.getElementById("complete_registration_percentage");
		13	+ var context = canvas_tag.getContext("2d");
		14	+
		15	+ percentage = canvas_tag.width*(percentage/100.0);
		16	+
		17	+ context.beginPath();
		18	+ context.rect(0, 0, percentage, canvas_tag.height);
		19	+ context.fillStyle = '#00FF00';
		20	+ context.fill();
		21	+}
10		22
11	jQuery(document).ready(function(){	23	jQuery(document).ready(function(){
12	jQuery(".hide-incomplete-percentage").click(hide_incomplete_percentage);	24	jQuery(".hide-incomplete-percentage").click(hide_incomplete_percentage);
		25	+
		26	+ show_complete_progressbar();
13	});	27	});
1	-<div id='incomplete_registration'>
2	- <div id="incomplete_percentage">
3	- <%= _("Incomplete registration percentage")+":#{@percentege}%" %>	1	+<div id='complete_registration'>
		2	+ <div id="complete_registration_message">
		3	+ <div><%= _("Complete Profile")+": <span>#{@percentege}</span>%" %></div>
		4	+ <canvas id="complete_registration_percentage" width="100%" height="20"></canvas>
		5	+ <div>
		6	+ <%= @profile_edit_link %> \|
		7	+ <%= link_to _("Hide"), "#", :class=>"hide-incomplete-percentage" %>
		8	+ </div>
4	</div>	9	</div>
5	-
6	- <div id="profile_empty_fields">
7	- <span><%= _("List with fields to be filled")+":" %></span>
8	- <ul>
9	- <% @profile_empty_fields.each do \|field\|%>
10	- <li>
11	- <%= field %>
12	- </li>
13	- <% end %>
14	- </ul>
15	- </div>
16	-
17	- <div id="profile_links">
18	- <table>
19	- <tr>
20	- <td>
21	- <%= @profile_edit_link %>
22	- </td>
23	- <td>
24	- <%= link_to _("Hide this message"), "#", :class=>"hide-incomplete-percentage" %></a>
25	- </td>
26	- </tr>
27	- </table>
28	- </div>
29	-</div>	10	+</div>
30	\ No newline at end of file	11	\ No newline at end of file