Search for blood

Gemfile

@@ -19,6 +19,7 @@ gem 'geocoder'
 gem 'jquery-turbolinks'
 gem 'simple_form'
 gem 'meta-tags'
+gem 'will_paginate', '~> 3.0.5'
 
 group :production do
   gem 'rails_12factor'
@@ -34,4 +35,3 @@ group :development, :test do
   gem 'faker'
   gem 'railroady'
 end
-

Gemfile.lock

@@ -180,6 +180,7 @@ GEM
       binding_of_caller (>= 0.7.2)
       railties (>= 4.0)
       sprockets-rails (>= 2.0, < 4.0)
+    will_paginate (3.0.7)
 
 PLATFORMS
   ruby
@@ -210,3 +211,4 @@ DEPENDENCIES
   turbolinks
   uglifier (>= 1.3.0)
   web-console (~> 2.0)
+  will_paginate (~> 3.0.5)

app/assets/javascripts/home.js

@@ -15,3 +15,15 @@
 //= require jquery_ujs
 //= require vendor/smooth-scroll.js
 //= require vendor/share.min.js
+
+$(function() {
+  $("#donors .pagination a").bind("click", function() {
+    $.getScript(this.href);
+    return false;
+  });
+
+  $("#donor_search").keyup(function() {
+    $.get($("#donor_search").attr("action"), $("#donor_search").serialize(), null, "script");
+    return false;
+  });
+});

app/assets/stylesheets/home.css.erb

@@ -1,6 +1,7 @@
 /*
  *= require_self
  *= require vendor/share.css
+ *= require vendor/skeleton.css
  */
 
 html, body{
@@ -125,3 +126,93 @@ p{
 .share-buttons {
   width: 60%; margin: 0 auto;
 }
+
+
+.search-results {
+  padding-top: 20px;
+  height: 100%;
+  min-height: 600px;
+  background-color: #f7f7f7;
+}
+
+.search-results .donor {
+  padding-left: 30px;
+  text-align: left;
+  color: white !important;
+  border-bottom: 1px solid #dbdbdb;
+  padding: 10px 30px;
+}
+
+.search-results .donor h1 {
+  padding: 0px;
+  color: #eb5d49;
+  font-size: 30px;
+  margin-bottom: 0px;
+}
+
+.search-results .donor p {
+  font-size: 16px;
+  padding: 0px;
+  margin: 0px;
+
+  color: #333333
+}
+
+.search-from {
+  padding-top: 80px;
+  text-align: center;
+  margin-bottom: -15px;
+}
+
+.search-from select {
+  margin: 0px;
+  padding: 7px 10px;
+  vertical-align: middle;
+  font-size: 25px;
+  height: 50px;
+  width: 225px;
+}
+
+.search-from .btn {
+  padding: 0px 10px;
+  text-decoration: none;
+  background-color:#8A0707;
+  color: white;
+  text-transform: uppercase;
+  height: 50px;
+  font-size: 15px;
+  width: 225px;
+}
+
+div.inline {
+  display: inline-block;
+}
+
+.search-paginate {
+  padding: 15px;
+}
+.pagination a, .pagination span, .pagination em {
+  padding: 0.2em 0.5em;
+  display: block;
+  float: left;
+  margin-right: 1px;
+}
+
+.pagination .disabled {
+  color: #999999;
+  border: 1px solid #dddddd;
+}
+
+.pagination .current {
+  font-style: normal;
+  font-weight: bold;
+  background: #2e6ab1;
+  color: white;
+  border: 1px solid #2e6ab1;
+}
+
+.pagination a {
+  text-decoration: none;
+  color: #105cb6;
+  border: 1px solid #9aafe5;
+}

app/controllers/home_controller.rb

@@ -1,4 +1,12 @@
 class HomeController < ApplicationController
+  ITEMS_PER_PAGE = 20
+
   def index
+
+  end
+
+  def search
+    flash[:warning] = "You must specify some search criteria." if !params.has_key?(:bloodtype)
+    @donors = Donor.search(params[:bloodtype]).order("created_at ASC").paginate(:page => params[:page], :per_page => ITEMS_PER_PAGE)
   end
 end

app/models/donor.rb

@@ -57,4 +57,13 @@ def nepal_cellphone
   def convert_km_to_mile
     self.commute_radius = self.commute_radius.to_f * 0.621371
   end
+
+  def self.search(search)
+    if search
+      self.where(blood_type: search)
+    else
+      self.all
+    end
+  end
+
 end

app/views/home/_donors.html.erb

@@ -0,0 +1,13 @@
+<% @donors.each do |donor| %>
+  <div class="donor">
+    <h1><%= donor.full_name %></h1>
+    <p><strong> Blood Type:</strong> <%= donor.blood_type.titleize %></p>
+    <p><strong>Radius(KM):</strong> <%= donor.commute_radius %></p>
+    <p><strong>Address:</strong> <%= donor.address %></p>
+    <p><strong>Email:</strong> <%= donor.email %></p>
+    <p><strong> Cell Phone:</strong> <%= donor.cell_phone %></p>
+  </div>
+<% end %>
+<div class="search-paginate">
+  <%= will_paginate @donors, class: "pagination" %>
+</div>

app/views/home/search.html.erb

@@ -0,0 +1,25 @@
+<!-- Header -->
+<header>
+  <a href="/" id="logo">Blood f<img class="middle" src="/blood.png">r Nepal</a>
+</header>
+
+
+<%= form_tag("/search", :method => "get", class: 'search-from') do %>
+	<div class="col-lg-12">
+    <div class="field form-group inline">
+		    <%= select_tag :bloodtype, options_for_select(Donor.blood_type.values), class: 'select form-control'%>
+    </div>
+    <div class="field form-group inline">
+      <%= submit_tag "Search for Donors", :name => nil, class: "btn btn-default btn-lg btn-block" %>
+    </div>
+	</div>
+<% end %>
+<br>
+
+<div id="donors" class="row search-results">
+  <% if @donors.count == 0 %>
+    <p>No Donors Found.</p>
+  <% else %>
+    <%= render 'donors' %>
+  <% end %>
+</div>

app/views/home/search.js.erb

@@ -0,0 +1 @@
+$("#donors").html("<%= escape_javascript(render("donors")) %>");

config/routes.rb

@@ -4,5 +4,6 @@
   resources :hospital, only: [:index, :new, :create, :show, :update]
   get 'hospital/:id/blood-status', to: 'hospital#edit', as: :hospital_blood_status
 
+  get '/search', to: 'home#search'
   match '/admin' => DelayedJobWeb, :anchor => false, via: [:get, :post]
 end