Home Explore Help
Register Sign In
avalanche
/
avalanche2
Watch 2
Star 0
Fork 0

Browse Source
Mission list page mission box layout

jamesperet 10 years ago
parent
6265b3ce33
commit
80414376e3
5 changed files with 123 additions and 65 deletions
Show Diff Stats
  1. 88 0
      app/assets/stylesheets/avalanche_theme.css.less
  2. 0 57
      app/assets/stylesheets/bootstrap_and_overrides.css.less
  3. 19 3
      app/helpers/missions_helper.rb
  4. 9 0
      app/models/mission.rb
  5. 7 5
      app/views/missions/index.html.erb

+ 88 - 0
app/assets/stylesheets/avalanche_theme.css.less
View File 

@@ -0,0 +1,88 @@
1 
+// Avalanche Theme
2 
+
3 
+.thumbnail {
4 
+	display: block;
5 
+	line-height: 20px;
6 
+	border: 2px solid #D4D4DE;
7 
+	border-radius: 4px;
8 
+	padding: 0px;
9 
+	-webkit-transition: all 0.2s ease-in-out;
10 
+	-moz-transition: all 0.2s ease-in-out;
11 
+	-o-transition: all 0.2s ease-in-out;
12 
+	transition: all 0.2s ease-in-out;
13 
+}
14 
+
15 
+.thumbnail h3 {
16 
+	font-family: Avenir-HeavyOblique;
17 
+	font-size: 24px;
18 
+	color: #000000;
19 
+	line-height: 33px;
20 
+	margin-bottom: 0px;
21 
+	line-height: 28px;
22 
+}
23 
+
24 
+.thumbnail h3 a {
25 
+	color: black;
26 
+}
27 
+
28 
+.thumbnail h3 a:hover {
29 
+	text-decoration: underline;
30 
+}
31 
+
32 
+.thumbnail p {
33 
+	font-family: Avenir-Medium;
34 
+	font-size: 16px;
35 
+	color: #000000;
36 
+	line-height: 22px;
37 
+}
38 
+
39 
+.thumbnail .thumbnail-content {
40 
+	padding: 4px;
41 
+}
42 
+
43 
+.thumbnail .mission-director-name {
44 
+	margin-bottom: 8px;
45 
+	/* James Peret: */
46 
+	font-family: Avenir-Medium;
47 
+	font-size: 14px;
48 
+	color: #000000;
49 
+	line-height: 22px;
50 
+}
51 
+
52 
+.thumbnail-mission-description { height: 110px;}
53 
+
54 
+.mission-status {
55 
+	padding-left: 6px;
56 
+	padding-right: 6px;
57 
+	font-family: Avenir-Oblique;
58 
+	font-size: 18px;
59 
+	color: #000000;
60 
+	line-height: 28px;
61 
+}
62 
+
63 
+.status-planning {
64 
+	background-color: #D4D4DE;
65 
+}
66 
+
67 
+.mission-counter {
68 
+	font-family: Avenir-Medium;
69 
+	font-size: 18px;
70 
+	color: #000000;
71 
+	line-height: 28px;
72 
+	padding: 0px;
73 
+}
74 
+
75 
+.mission-counter i {
76 
+	font-size: 28px;
77 
+}
78 
+
79 
+.mission-counter span {
80 
+	margin-bottom: 3px;
81 
+}
82 
+
83 
+.mission-counter.center_position {
84 
+	width: 30%;
85 
+	margin-left: auto;
86 
+	margin-right: auto;
87 
+	text-align: center;
88 
+}

+ 0 - 57
app/assets/stylesheets/bootstrap_and_overrides.css.less
View File 

@@ -84,61 +84,4 @@
84 84
85 85 
 .form-bordered {
86 86 
 	margin-bottom: 0px;
87 
-}
88 
-
89 
-
90 
-// Avalanche Theme
91 
-
92 
-.thumbnail {
93 
-	display: block;
94 
-	line-height: 20px;
95 
-	border: 2px solid #D4D4DE;
96 
-	border-radius: 4px;
97 
-	padding: 0px;
98 
-	-webkit-transition: all 0.2s ease-in-out;
99 
-	-moz-transition: all 0.2s ease-in-out;
100 
-	-o-transition: all 0.2s ease-in-out;
101 
-	transition: all 0.2s ease-in-out;
102 
-}
103 
-
104 
-.thumbnail h3 {
105 
-	font-family: Avenir-HeavyOblique;
106 
-	font-size: 24px;
107 
-	color: #000000;
108 
-	line-height: 33px;
109 
-	margin-bottom: 0px;
110 
-	line-height: 28px;
111 
-}
112 
-
113 
-.thumbnail p {
114 
-	font-family: Avenir-Medium;
115 
-	font-size: 16px;
116 
-	color: #000000;
117 
-	line-height: 22px;
118 
-}
119 
-
120 
-.thumbnail div {
121 
-	padding: 4px;
122 
-}
123 
-
124 
-.thumbnail .mission-director-name {
125 
-	margin-bottom: 8px;
126 
-	/* James Peret: */
127 
-	font-family: Avenir-Medium;
128 
-	font-size: 14px;
129 
-	color: #000000;
130 
-	line-height: 22px;
131 
-}
132 
-
133 
-.mission-status {
134 
-	padding-left: 6px;
135 
-	padding-right: 6px;
136 
-	font-family: Avenir-Oblique;
137 
-	font-size: 18px;
138 
-	color: #000000;
139 
-	line-height: 28px;
140 
-}
141 
-
142 
-.status-planning {
143 
-	background-color: #D4D4DE;
144 87 
 }

+ 19 - 3
app/helpers/missions_helper.rb
View File 

@@ -1,12 +1,28 @@
1 1 
 module MissionsHelper
2 
+
2 3 
   def status(status_code)
3 4 
     case status_code.to_i
4 5 
     when 1
5 
-      content_tag(:span, (t 'status.planning'), class: 'mission-status status-planning pull-right')
6 
+      content_tag(:div, (t 'status.planning'), class: 'mission-status status-planning pull-right')
6 7 
     when 2
7 
-      content_tag(:span, (t 'status.launched'), class: 'mission-status status-launched pull-right')
8 
+      content_tag(:div, (t 'status.launched'), class: 'mission-status status-launched pull-right')
8 9 
     else
9 
-      content_tag(:span, (t 'status.error'), class: 'mission-status status-error pull-right')
10 
+      content_tag(:div, (t 'status.error'), class: 'mission-status status-error pull-right')
10 11 
     end
11 12 
   end
13 
+
14 
+  def mission_agent_counter(mission)
15 
+    content_tag(:div, class: 'mission-counter pull-left') do
16 
+      #content_tag(:i, '', class: 'icon-agent')
17 
+      '<i class="icon-agent"></i><span>'.html_safe + mission.agent_position_count.to_s + '/' + mission.confirmed_agent_count.to_s + '</span>'.html_safe
18 
+    end
19 
+  end
20 
+
21 
+  def mission_steps_counter(mission)
22 
+    content_tag(:div, class: 'mission-counter center_position') do
23 
+      #content_tag(:i, '', class: 'icon-agent')
24 
+      '<i class="icon-task"></i><span>'.html_safe + mission.agent_position_count.to_s + '/' + mission.confirmed_agent_count.to_s + '</span>'.html_safe
25 
+    end
26 
+  end
27 
+
12 28 
 end

+ 9 - 0
app/models/mission.rb
View File 

@@ -3,4 +3,13 @@ class Mission < ActiveRecord::Base
3 3 
   has_many :mission_agents, :dependent => :destroy
4 4 
   has_many :agent_steps, :through => :mission_agents
5 5 
   accepts_nested_attributes_for :mission_agents, allow_destroy:true
6 
+
7 
+  def agent_position_count
8 
+    return self.mission_agents.count
9 
+  end
10 
+
11 
+  def confirmed_agent_count
12 
+    return self.mission_agents.count
13 
+  end
14 
+
6 15 
 end

+ 7 - 5
app/views/missions/index.html.erb
View File 

@@ -5,13 +5,15 @@
5 5 
 		<%= content_tag(:li, class: 'span4') do %>
6 6 
 			<% content_tag(:div, class: 'thumbnail') do %>
7 7 
 				<%= image_tag('http://placehold.it/400x300')%>
8 
-				<%= content_tag(:div) do%>
8 
+				<%= content_tag(:div, class: 'thumbnail-content') do%>
9 9 
 			          <%= content_tag(:h3, link_to(mission.title, mission)) %>
10 10 
 					<%= content_tag(:p, mission.owner.full_name, class: 'mission-director-name') %>
11 
-			          <%= content_tag(:p, mission.objective) %>
12 
-					<%= status(mission.status) %>
13 
-					<%= content_tag(:div, '', class: 'clearfix') %>
14 
-					<i class="icon-agent"></i>
11 
+			          <%= content_tag(:p, mission.objective, class: 'thumbnail-mission-description') %>
12 
+					<%= content_tag(:div) do %>
13 
+						<%= mission_agent_counter(mission) %>
14 
+						<%= status(mission.status) %>
15 
+						<%= mission_steps_counter(mission) %>
16 
+					<% end %>
15 17 
 				<% end %>
16 18 
 			<% end %>
17 19 
 		<% end %>