From efbf15d8444896d104c836650364a465cc951687 Mon Sep 17 00:00:00 2001 From: Luke Barratt <luke@barratt.me> Date: Fri, 25 Apr 2014 23:15:15 +0100 Subject: [PATCH] Improved styling for contests and referee admin pages Fixes deleting maps form contests --- app/assets/stylesheets/components/_forms.scss | 4 +- .../stylesheets/components/_tables.scss | 6 +- .../stylesheets/layout/_navigation.scss | 2 +- app/assets/stylesheets/pages/_contests.scss | 47 +++++ app/assets/stylesheets/pages/_matches.scss | 95 +++++++++ app/views/contests/show.html.erb | 42 ++-- app/views/issues/new.html.erb | 2 +- app/views/matches/_form.html.erb | 52 ++--- app/views/matches/_lineup.html.erb | 73 +++---- app/views/matches/edit.html.erb | 7 +- app/views/matches/new.html.erb | 6 +- app/views/matches/ref.html.erb | 190 +++++++++--------- config/routes.rb | 8 +- 13 files changed, 341 insertions(+), 193 deletions(-) diff --git a/app/assets/stylesheets/components/_forms.scss b/app/assets/stylesheets/components/_forms.scss index 176ce8d..cab3868 100644 --- a/app/assets/stylesheets/components/_forms.scss +++ b/app/assets/stylesheets/components/_forms.scss @@ -3,6 +3,7 @@ */ form { + .inline { float: left; display: inline-block; @@ -48,6 +49,7 @@ form { display: inline-block; margin-right: em(10); float: left; + max-width: 100%; select { @include appearance(none); @@ -65,6 +67,7 @@ form { margin: 0; padding: $select-padding em(50) $select-padding $input-padding; font-size: $input-font-size; + max-width: 100%; option { font-size: $input-font-size; @@ -143,7 +146,6 @@ form { } > label.checkbox { - display: none; position: relative; width: em(40); height: em(40); diff --git a/app/assets/stylesheets/components/_tables.scss b/app/assets/stylesheets/components/_tables.scss index 3cb4dc8..3d2e0f0 100644 --- a/app/assets/stylesheets/components/_tables.scss +++ b/app/assets/stylesheets/components/_tables.scss @@ -12,13 +12,13 @@ table { th { border-bottom: 1px solid darken($base-border-color, 15%); font-weight: bold; - padding: ($base-line-height / 2) 0; + padding: 0.5em 0; text-align: left; } td { border-bottom: 1px solid $base-border-color; - padding: ($base-line-height / 2) 0; + padding: 0.5em 0; } tr, td, th { @@ -41,4 +41,4 @@ table.striped > tbody { > tr:nth-child(2n) td { background-color: transparentize($light-blue, 0.9); } -} \ No newline at end of file +} diff --git a/app/assets/stylesheets/layout/_navigation.scss b/app/assets/stylesheets/layout/_navigation.scss index f6db7c3..d2be986 100644 --- a/app/assets/stylesheets/layout/_navigation.scss +++ b/app/assets/stylesheets/layout/_navigation.scss @@ -27,7 +27,7 @@ ul.navigation { > li { float: left; width: (100%/7); - border-right: em(1) solid transparent; + border-right: 0.1em solid transparent; .count { float: right; diff --git a/app/assets/stylesheets/pages/_contests.scss b/app/assets/stylesheets/pages/_contests.scss index 25cb5c5..4731663 100644 --- a/app/assets/stylesheets/pages/_contests.scss +++ b/app/assets/stylesheets/pages/_contests.scss @@ -144,3 +144,50 @@ table.brackets { width: em(150); } } + +/* + Contest Page +*/ + +#contest { + + table.weeks { + + .week { + width: 50%; + } + + .date { + width: 30%; + } + + .score { + width: 10%; + text-align: right; + } + } + + table.matches { + + .team { + width: 50%; + } + + .date { + width: 50%; + text-align: right; + } + } + + table.predictions { + + .user { + width: 50%; + } + + .result { + width: 50%; + text-align: right; + } + } +} \ No newline at end of file diff --git a/app/assets/stylesheets/pages/_matches.scss b/app/assets/stylesheets/pages/_matches.scss index 5fe69e8..a0c483c 100644 --- a/app/assets/stylesheets/pages/_matches.scss +++ b/app/assets/stylesheets/pages/_matches.scss @@ -141,10 +141,47 @@ div#match { @include span-columns(12); margin: em(20) 0 em(40); + h3 { + text-align: center; + margin-bottom: 1em; + } + i { color: $gold; } + .team-1, + .team-2 { + position: relative; + + .player { + @include span-columns(12); + line-height: em(40); + margin-bottom: em(10); + } + + .players { + position: relative; + } + + .controls { + top: 0; + position: absolute; + z-index: 100; + + input { + margin: 0; + } + } + + form { + + label.checkbox { + padding: 0; + } + } + } + .team-1 { @include span-columns(6); text-align: right; @@ -152,16 +189,64 @@ div#match { .flag { margin: 0 0 0 em(10); } + + .controls { + left: 0; + } + + form { + + label.checkbox { + float: right; + margin-left: 1em; + } + } } .team-2 { @include span-columns(6); @include omega; + + .controls { + right: 0; + } + + form { + + label.checkbox { + float: left; + margin-right: 1em; + } + } } &.shift .team-2 { @include shift(6); } + + .mercenaries { + @include span-columns(12); + + input { + margin: 0; + } + } + } + + .scoring { + @include span-columns(12); + border-top: em(3) solid $light-gray; + + h3 { + margin-bottom: 1em; + } + + .scores input { + width: auto; + margin-left: 0; + text-align: center; + width: em(40); + } } .predictions { @@ -209,6 +294,16 @@ div#match { margin: em(20) 0; padding-top: em(20); border-top: em(3) solid $light-gray; + + textarea { + margin: em(20) 0; + width: 100%; + height: em(600); + } + + .mceLayout { + margin: em(20) 0; + } } } diff --git a/app/views/contests/show.html.erb b/app/views/contests/show.html.erb index 12007f5..dac3088 100644 --- a/app/views/contests/show.html.erb +++ b/app/views/contests/show.html.erb @@ -51,15 +51,15 @@ </h3> <% if @contest.weeks.count > 0 %> - <table class="data"> + <table class="striped weeks"> <% @contest.weeks.ordered.each do |week| %> <% next if week.matches.realfinished.size == 0 %> <tr> - <th><%= week.name %></th> - <th>Date</th> - <th>Score</th> + <th class="week"><%= week.name %></th> + <th class="date">Date</th> + <th class="score">Score</th> <% if @contest.contest_type == Contest::TYPE_LADDER %> - <th>Points</th> + <th class="points">Points</th> <% end %> </tr> <% week.matches.realfinished.ordered.reverse_each do |match| %> @@ -72,14 +72,14 @@ <td> <%= shorttime match.match_time %> </td> - <td> + <td class="score"> <%= link_to match, :class => "bold #{match.score_color}" do %> <b><%= h match.score1 %> - <%= h match.score2 %></b> <% end %> </td> <% if @contest.contest_type == Contest::TYPE_LADDER %> - <td> + <td class="points"> <%= match.points1 %> / <%= match.points2 %> </td> <% end %> @@ -88,13 +88,13 @@ <% end %> </table> <% else %> - <table class="data"> + <table class="striped teams"> <tr> - <th>Teams</th> - <th>Date</th> - <th>Score</th> + <th class="team">Teams</th> + <th class="date">Date</th> + <th class="score">Score</th> <% if @contest.contest_type == Contest::TYPE_LADDER %> - <th>Points</th> + <th class="points">Points</th> <% end %> </tr> @@ -129,10 +129,10 @@ Matches to be played </h3> - <table class="data"> + <table class="striped matches"> <tr> - <th>Teams</th> - <th>Date</th> + <th class="team">Teams</th> + <th class="date">Date</th> </tr> <% @contest.matches.unfinished.ordered.reverse_each do |match| %> @@ -142,7 +142,7 @@ vs <%= namelink match.contester2.team if match.contester2 %> </td> - <td> + <td class="date"> <%= link_to shorttime(match.match_time), match %> </td> </tr> @@ -152,22 +152,22 @@ </div> <div class="tab" id="predictions"> - <table class="data"> + <table class="striped predictions"> <tr> - <th>User</th> - <th>Result</th> + <th class="user">User</th> + <th class="result">Result</th> </tr> <% @contest.preds_with_score.each do |prediction| %> <tr> <td><%= namelink prediction.user %></td> - <td><%= prediction.correct %> / <%= prediction.total %> correct (<%= prediction.score.to_f.round(2) %>%)</td> + <td class="result"><%= prediction.correct %> / <%= prediction.total %> correct (<%= prediction.score.to_f.round(2) %>%)</td> </tr> <% end %> </table> </div> <div class="tab" id="maps"> - <ul> + <ul class="disc"> <% @contest.maps.each do |map| %> <li><%= map %></li> <% end %> diff --git a/app/views/issues/new.html.erb b/app/views/issues/new.html.erb index cd76392..92fc96f 100644 --- a/app/views/issues/new.html.erb +++ b/app/views/issues/new.html.erb @@ -1,4 +1,4 @@ -<h1><%= cuser ? "New Issue" : "Contact" %></h1> +<h1 class="title"><%= cuser ? "New Issue" : "Contact" %></h1> <p>Please do not forget to include contact details, such as an email address or a Steam account in the case that you do not have an ENSL account.</p> diff --git a/app/views/matches/_form.html.erb b/app/views/matches/_form.html.erb index f8e989e..fdf0c37 100644 --- a/app/views/matches/_form.html.erb +++ b/app/views/matches/_form.html.erb @@ -1,38 +1,38 @@ <div class="wide box"> - <%= form_for @match do |f| %> + <%= form_for @match, html: { class: 'square' } do |f| %> <%= f.error_messages %> <%= f.hidden_field :contest_id %> - <p> - <%= f.label :contester1_id, "Team #1" %><br /> + <div class="fields horizontal"> + <%= f.label :contester1_id, "Team #1" %> <%= f.select :contester1_id, @match.contest.contesters.active.collect{|c| ["#{c.team.name}", c.id]} %> - </p> - <p> - <%= f.label :contester2_id, "Team #2" %><br /> + </div> + <div class="fields horizontal"> + <%= f.label :contester2_id, "Team #2" %> <%= f.select :contester2_id, @match.contest.contesters.active.collect{|c| ["#{c.team.name}", c.id]} %> - </p> - <p> - <%= f.label :map1_id, "Team 1's map" %><br /> + </div> + <div class="fields horizontal"> + <%= f.label :map1_id, "Map #1" %> <%= f.select :map1_id, @match.contest.maps.basic.collect{|m| [m.name, m.id]} %> - </p> - <p> - <%= f.label :map2_id, "Team 2's map" %><br /> + </div> + <div class="fields horizontal"> + <%= f.label :map2_id, "Map #2" %> <%= f.select :map2_id, @match.contest.maps.basic.collect{|m| [m.name, m.id]} %> - </p> - <p> - <%= f.label :match_time %><br /> - <%= f.datetime_select :match_time %> - </p> - <p> - <%= f.label :referee_id %><br /> + </div> + <div class="fields horizontal"> + <%= f.label :match_time %> + <%= f.datetime_select :match_time, datetime_separator: '', time_separator: '' %> + </div> + <div class="fields horizontal"> + <%= f.label :referee_id %> <%= f.select :referee_id, Group.find(Group::REFEREES).users.collect{|u| [u, u.id]}, {:include_blank => true} %> - </p> - <p> - <%= f.label :week_id %><br /> + </div> + <div class="fields horizontal"> + <%= f.label :week_id %> <%= f.select :week_id, @match.contest.weeks.ordered.collect{|w| [w, w.id]}, {:include_blank => true} %> - </p> - <p> - <%= f.submit 'Save' %> - </p> + </div> + <div class="controls"> + <%= f.submit 'Save Match' %> + </div> <% end %> </div> diff --git a/app/views/matches/_lineup.html.erb b/app/views/matches/_lineup.html.erb index c967938..0f9ba3a 100644 --- a/app/views/matches/_lineup.html.erb +++ b/app/views/matches/_lineup.html.erb @@ -1,46 +1,49 @@ -<h4> - <%= namelink contester.team %> -</h4> +<div class="players"> + <% contester.lineup.each do |teamer| %> + <div class="player fields"> + <% if matcher = @match.matchers.first(conditions: { user_id: teamer.user_id }) %> + <%= hidden_field_tag "match[matchers_attributes][#{@n}][id]", matcher.id %> + <% end %> -<div class="left"><h5>Team members</h5> -<% contester.lineup.each do |teamer| %> - <p> - <% if matcher = @match.matchers.first(:conditions => {:user_id => teamer.user_id}) %> - <%= hidden_field_tag "match[matchers_attributes][#{@n}][id]", matcher.id %> - <% end %> - <%= hidden_field_tag "match[matchers_attributes][#{@n}][user_id]", teamer.user_id %> - <%= hidden_field_tag "match[matchers_attributes][#{@n}][contester_id]", contester.id %> - <%= hidden_field_tag "match[matchers_attributes][#{@n}][match_id]", @match.id %> - <%= hidden_field_tag "match[matchers_attributes][#{@n}][merc]", false %> - <%= check_box_tag "match[matchers_attributes][#{@n}][_destroy]", "keep", @match.users.exists?(teamer.user) %> - <%= teamer.user %> - </p> - <% @n = @n + 1; end %> -</div> -<div class ="center"> - <% if contester.team.logo %> - <%= image_tag contester.team.logo.url%> + <%= hidden_field_tag "match[matchers_attributes][#{@n}][user_id]", teamer.user_id %> + <%= hidden_field_tag "match[matchers_attributes][#{@n}][contester_id]", contester.id %> + <%= hidden_field_tag "match[matchers_attributes][#{@n}][match_id]", @match.id %> + <%= hidden_field_tag "match[matchers_attributes][#{@n}][merc]", false %> + <%= check_box_tag "match[matchers_attributes][#{@n}][_destroy]", "keep", @match.users.exists?(teamer.user), { id: "player_#{@n}" } %> + + <%= label_tag "player_#{@n}", '', class: 'checkbox' %> + + <span><%= teamer.user %></span> + </div> + + <% @n = @n + 1 %> <% end %> </div> -<div class="right"><h5>Mercenaries</h5> + +<div class="mercenaries"> <% @match.matchers.mercs.of_contester(contester).each do |matcher| %> - <p> + <div class="player fields"> <%= hidden_field_tag "match[matchers_attributes][#{@n}][id]", matcher.id %> <%= hidden_field_tag "match[matchers_attributes][#{@n}][user_id]", matcher.user_id %> <%= hidden_field_tag "match[matchers_attributes][#{@n}][contester_id]", contester.id %> <%= hidden_field_tag "match[matchers_attributes][#{@n}][match_id]", @match.id %> <%= hidden_field_tag "match[matchers_attributes][#{@n}][merc]", true %> - <%= check_box_tag "match[matchers_attributes][#{@n}][_destroy]", "keep", true %> - <%= matcher.user %> - </p> - <% @n = @n + 1; end %> + <%= check_box_tag "match[matchers_attributes][#{@n}][_destroy]", "keep", true, { id: "player_#{@n}" } %> - <p> - <%= hidden_field_tag "match[matchers_attributes][#{@n}][contester_id]", contester.id %> - <%= hidden_field_tag "match[matchers_attributes][#{@n}][match_id]", @match.id %> - <%= hidden_field_tag "match[matchers_attributes][#{@n}][merc]", true %> - <%= hidden_field_tag "match[matchers_attributes][#{@n}][_destroy]", "keep" %> - <%= link_to_function 'Merc', "findUser('match[matchers_attributes][#{@n}][merc][user_id]')" %>: - <%= text_field_tag "match[matchers_attributes][#{@n}][user_id]", '', :size => 5 %> - </p> + <%= label_tag "player_#{@n}", '', class: 'checkbox' %> + + <span><%= matcher.user %></span> + </div> + + <% @n = @n + 1 %> + <% end %> + + <div class="fields"> + <%= hidden_field_tag "match[matchers_attributes][#{@n}][contester_id]", contester.id %> + <%= hidden_field_tag "match[matchers_attributes][#{@n}][match_id]", @match.id %> + <%= hidden_field_tag "match[matchers_attributes][#{@n}][merc]", true %> + <%= hidden_field_tag "match[matchers_attributes][#{@n}][_destroy]", "keep" %> + + <%= text_field_tag "match[matchers_attributes][#{@n}][user_id]", '', placeholder: 'Mercenary' %> </div> +</div> diff --git a/app/views/matches/edit.html.erb b/app/views/matches/edit.html.erb index 43ec487..df21c86 100644 --- a/app/views/matches/edit.html.erb +++ b/app/views/matches/edit.html.erb @@ -1,6 +1,3 @@ -<h1>Editing match</h1> +<h1>Editing Match</h1> -<%= render :partial => "form" %> - -<%= link_to 'Show', @match %> | -<%= link_to 'Back', edit_contest_path(@match.contest) %> \ No newline at end of file +<%= render partial: 'form' %> diff --git a/app/views/matches/new.html.erb b/app/views/matches/new.html.erb index 349d78b..0c2fcf6 100644 --- a/app/views/matches/new.html.erb +++ b/app/views/matches/new.html.erb @@ -1,5 +1,3 @@ -<h1>New match</h1> +<h1>New Match</h1> -<%= render :partial => "form" %> - -<%= link_to 'Back', matches_path %> \ No newline at end of file +<%= render partial: 'form' %> diff --git a/app/views/matches/ref.html.erb b/app/views/matches/ref.html.erb index ae8c26e..5e8a0aa 100644 --- a/app/views/matches/ref.html.erb +++ b/app/views/matches/ref.html.erb @@ -1,98 +1,104 @@ -<h2> - <%= namelink @match.contester1.team %> vs <%= namelink @match.contester2.team %> -</h2> +<div id="match"> + <h1 class="fancy title"> + <span>Referee Admin</span> + </h1> -<%= render :partial => "javascripts/mce_full" %> + <div class="contesters"> + <h1 class="team-1"><%= namelink @match.contester1.team if @match.contester1 %></h1> + <div class="versus"> + <span class="vs">VS</span> + </div> + <h1 class="team-2"><%= namelink @match.contester2.team if @match.contester2 %></h1> + </div> -<div class="wide box"> - <h2> - Lineup - </h2> + <%= render partial: 'javascripts/mce_full' %> - <div class="box center"> + <div class="lineups"> + <h3>Lineups</h3> + + <div class="team-1"> + <%= form_for @match do |f| %> + <%= f.error_messages %> + + <div class="controls"> + <%= f.submit 'Save Lineup' %> + </div> + + <% [@match.contester1].each do |contester| %> + <%= render partial: "lineup", locals: { contester: contester } %> + <% end %> + <% end %> + </div> + + <div class="team-2"> + <%= form_for @match do |f| %> + <%= f.error_messages %> + + <div class="controls"> + <%= f.submit 'Save Lineup' %> + </div> + + <% [@match.contester2].each do |contester| %> + <%= render partial: "lineup", locals: { contester: contester } %> + <% end %> + <% end %> + </div> + </div> + + <div class="scoring"> + <%= form_for @match, html: { class: 'square' } do |f| %> + <%= f.error_messages %> + + <h3>Scoring</h3> + + <div class="fields horizontal"> + <%= f.label :server_id %> + <%= f.select :server_id, Server.active.collect { |d| ["#{d.name}", d.id] }, { include_blank: true } %> + </div> + + <div class="fields horizontal"> + <%= f.label :forfeit %> + <%= f.check_box :forfeit %> + <%= f.label :forfeit, class: 'checkbox' %> + </div> + + <div class="fields horizontal"> + <%= f.label "Scores" %> + <div class="inputs scores"> + <%= f.text_field :score1, size: 1 %> + <%= f.text_field :score2, size: 2 %> + </div> + </div> + + <div class="fields horizontal"> + <%= f.label :demo %> + <div class="inputs"> + <%= f.select :demo_id, DataFile.ordered.collect { |d| ["#{d.name}", d.id] }, { include_blank: true } %> + </div> + </div> + + <div class="fields horizontal"> + <%= f.label 'Player of the match' %> + <%= f.text_field :motm_name, { value: User.get(@match.motm_id) } %> + </div> + + <div class="controls"> + <%= f.submit 'Save Scores' %> + </div> + <% end %> + </div> + + <div class="report"> <%= form_for @match do |f| %> - <%= f.error_messages %> + <%= f.error_messages %> - <% [@match.contester1].each do |contester| %> - <%= render :partial => "lineup", :locals => {:contester => contester} %> + <h3>Match Report</h3> + + <%= f.text_area :report %> + + <div class="controls"> + <%= f.submit 'Save Report' %> + </div> <% end %> - <p class="clear"> - <%= f.submit "Save" %> - </p> - <% end %> -</div> -<div class="box center"> - <%= form_for @match do |f| %> - <%= f.error_messages %> - - <% [@match.contester2].each do |contester| %> - <%= render :partial => "lineup", :locals => {:contester => contester} %> - <% end %> - <p class="clear"> - <%= f.submit "Save" %> - </p> - <% end %> -</div> - - <p class="clear"></p> -</div> - -<div class="wide box"> - <%= form_for @match do |f| %> - <%= f.error_messages %> - - <h3> - Scoring and options - </h3> - - <p> - <%= f.label :server_id %> - <%= f.select :server_id, Server.hlds.active.collect{|d| ["#{d.name}", d.id]}, {:include_blank => true} %> - </p> - - <p> - <%= f.label :forfeit %> - <%= f.check_box :forfeit %> - </p> - - <p> - Score: - <%= f.text_field :score1, :size => 1 %> - <%= f.text_field :score2, :size => 2 %> - </p> - - <p> - <%= f.label :demo %>: - <%= f.select :demo_id, DataFile.ordered.collect{|d| ["#{d.name}", d.id]}, {:include_blank => true} %> - </p> - - <p> - <%= link_to_function 'Man of the match', "findUser('motm')" %>: - <%= f.text_field :motm_name, {:value => User.get(@match.motm_id)} %> - </p> - - <p> - <%= f.submit "Save" %> - </p> - <% end %> -</div> - -<div class="wide box"> - <%= form_for @match do |f| %> - <%= f.error_messages %> - - <h3> - Report - </h3> - - <p> - <%= f.text_area :report, :rows => 20, :cols => 60 %> - </p> - - <p> - <%= f.submit "Save" %> - </p> - <% end %> -</div> - -<%= link_to "Back", @match %> + </div> +</div> \ No newline at end of file diff --git a/config/routes.rb b/config/routes.rb index b7e843d..9f94d0a 100644 --- a/config/routes.rb +++ b/config/routes.rb @@ -5,6 +5,10 @@ Ensl::Application.routes.draw do resources :versions end + match 'contests/del_map' + match 'contests/scores' + match 'contests/historical', to: "contests#historical" + resources :contests do get 'current', on: :collection end @@ -71,16 +75,12 @@ Ensl::Application.routes.draw do match 'news/admin', to: "articles#admin" match 'articles/cleanup' - match 'contests/historical', to: "contests#historical" - match 'data_files/admin' match 'data_files/addFile' match 'data_files/delFile' match 'data_files/trash' match 'contesters/recalc' - match 'contests/scores' - match 'contests/del_map' match 'directories', to: "directories#show", id: 1