infractores 1.0.0

data/Guardfile

@@ -0,0 +1,8 @@
+guard 'livereload' do
+  watch(%r{app/views/.+\.(erb|haml|slim)})
+  watch(%r{app/helpers/.+\.rb})
+  watch(%r{public/.+\.(css|js|html)})
+  watch(%r{config/locales/.+\.yml})
+  # Rails Assets Pipeline
+  watch(%r{(app|vendor)(/assets/\w+/(.+\.(scss|js|html))).*}) { |m| "/assets/#{m[3]}" }
+end

data/LICENSE

@@ -0,0 +1,21 @@
+The MIT License (MIT)
+
+Copyright (c) 2016 OmbuLabs
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

data/Procfile

@@ -0,0 +1,2 @@
+web: bundle exec thin start -p $PORT
+worker: bundle exec sidekiq -c 5 -v

data/README.md

@@ -0,0 +1,48 @@
+# Infractores
+
+Infractores is a tool that lets anyone with a Twitter account report a parking
+violation with a tweet.
+
+The violations are recorded and placed in a map along with evidence supporting
+the report.
+
+## Considerations
+
+The project uses a Twitter application to find the tweets that describe a
+violation. It also uses Amazon Web Services to store the evidence related to the
+violation.
+
+### Requirements
+
+* Postgres 9.4.1+
+* Redis 3.0.1+
+* Ruby 2.2.1
+
+## Setup
+
+### Setup your environment
+
+    cp .env.sample .env
+
+You **must enter** your AWS and Twitter credentials in this file.
+
+### Setup your database
+
+    rake db:create db:migrate
+
+### Get parking violations from Twitter
+
+    rake twitter:download_tweets
+
+This task will download all the mentions for the user associated with the
+Twitter credentials and its hashtag, for example: [#InfractoresBA](https://twitter.com/hashtag/infractoresba?f=tweets&src=hash)
+
+## Start
+
+    foreman start
+
+This will start the Rails server and a Sidekiq worker to process the tweets.
+
+## License
+
+See: [MIT License](LICENSE).

data/Rakefile

@@ -0,0 +1,6 @@
+# Add your own tasks in files placed in lib/tasks ending in .rake,
+# for example lib/tasks/capistrano.rake, and they will automatically be available to Rake.
+
+require File.expand_path('../config/application', __FILE__)
+
+Rails.application.load_tasks

data/app/assets/images/logo-infractores.svg

@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="218.25px" height="73.333px" viewBox="0 0 218.25 73.333" enable-background="new 0 0 218.25 73.333" xml:space="preserve">
+<text transform="matrix(0.9953 -0.0973 0.0973 0.9953 22.3145 53.2031)" fill="#F7685C" font-family="'Rubik-Medium'" font-size="26">InfractoresBA</text>
+<rect x="4.039" y="13.107" transform="matrix(0.9953 -0.0973 0.0973 0.9953 -3.0448 10.7845)" fill="none" stroke="#F7685C" stroke-width="3" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" width="210" height="47"/>
+<text transform="matrix(1 0 0 1 479.8232 -62.4219)" fill="#F7685C" font-family="'Rubik-Medium'" font-size="26">InfractoresBA</text>
+<rect x="462.75" y="-94" fill="none" stroke="#F7685C" stroke-width="3" stroke-miterlimit="10" width="210" height="47"/>
+</svg>

data/app/assets/javascripts/application.js

@@ -0,0 +1,18 @@
+// This is a manifest file that'll be compiled into application.js, which will include all the files
+// listed below.
+//
+// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
+// or any plugin's vendor/assets/javascripts directory can be referenced here using a relative path.
+//
+// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
+// compiled file.
+//
+// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details
+// about supported directives.
+//
+//= require jquery
+//= require jquery_ujs
+//= require twitter/bootstrap
+//= require jquery.fancybox.pack
+//= require jquery.fancybox-buttons
+//= require_tree .

data/app/assets/javascripts/bootstrap.js

@@ -0,0 +1,4 @@
+jQuery(function() {
+  $("a[rel~=popover], .has-popover").popover();
+  $("a[rel~=tooltip], .has-tooltip").tooltip();
+});

data/app/assets/javascripts/index.js

@@ -0,0 +1,82 @@
+$(document).ready(function(){
+  var redMarker = 'http://maps.gstatic.com/mapfiles/markers2/marker.png';
+  var blueMarker = 'http://maps.gstatic.com/mapfiles/markers2/boost-marker-mapview.png';
+  var allMarkers = [];
+
+  $(".fancybox").fancybox({
+    openEffect	: 'none',
+    closeEffect	: 'none'
+  });
+
+  $( "h4 a.see-map" ).click(function(evt) {
+    event.preventDefault();
+    var infractionId = $(this).data().infractionId;
+    $("#map_canvas_" + infractionId).toggle();
+    var initMap = "initialize_" + infractionId;
+    window[initMap]();
+  });
+
+  $( "#info, #close" ).click(function(event) {
+    event.preventDefault();
+    $("body").toggleClass("overflow");
+    $("#description").toggle();
+  });
+
+  function resetMapAndPaintMarker(myMarker) {
+    $.each(allMarkers, function(i, marker) {
+      marker.setIcon(redMarker)
+    });
+    myMarker.setIcon(blueMarker);
+  }
+
+  function scrollToInfraction(infractionDiv) {
+    $('html, body').animate({
+      scrollTop: $(infractionDiv).offset().top
+    }, 300);
+  };
+
+  function scrollToPermalinkInfraction() {
+    var infraction = window.location.hash;
+    if(infraction != "") {
+      infraction = infraction.replace("#", "#ver-");
+      $(infraction).click();
+    }
+  }
+
+  function initializeMainMap() {
+    var myLatLng = {lat: -34.592894, lng: -58.452826 };
+    var mapCanvas = document.getElementById('map_canvas_main');
+    var mapOptions = {
+      center: myLatLng,
+      zoom: 13,
+      mapTypeId: google.maps.MapTypeId.ROADMAP
+    }
+    var map = new google.maps.Map(mapCanvas, mapOptions);
+    $.each(infractionMarkers, function(i, markerData) {
+      var latitude = parseFloat(markerData[0]);
+      var longitude = parseFloat(markerData[1]);
+      var infractionDiv = "#infraccion-" + markerData[2];
+      var latLng = new google.maps.LatLng(latitude, longitude);
+      var marker = new google.maps.Marker({
+        map: map,
+        position: latLng,
+        icon: redMarker
+      });
+      allMarkers.push(marker);
+      google.maps.event.addListener(marker, 'click', function() {
+        scrollToInfraction(infractionDiv);
+        window.location = "/" + infractionDiv;
+        resetMapAndPaintMarker(marker);
+      });
+      $("#ver-infraccion-" + markerData[2]).click(function(evt) {
+        scrollToInfraction(infractionDiv);
+        map.panTo(latLng);
+        map.setZoom(18);
+        resetMapAndPaintMarker(marker);
+      });
+    });
+    scrollToPermalinkInfraction();
+  }
+  google.maps.event.addDomListener(window, 'load', initializeMainMap);
+
+});

data/app/assets/javascripts/twitter.js

@@ -0,0 +1,18 @@
+window.onload = (function(){
+
+  $('.tweet').each(function(index, value) {
+    var tweet = value;
+    var id = tweet.getAttribute("tweetID");
+
+    twttr.widgets.createTweet(
+      id, tweet,
+      {
+        conversation : 'none',    // or all
+        cards        : 'hidden',  // or visible
+        linkColor    : '#cc0000', // default is blue
+        theme        : 'light'    // or dark
+      }
+    )
+  });
+
+});

data/app/assets/stylesheets/1-utilities/_variables.scss

@@ -0,0 +1,12 @@
+/* Colors */
+
+$light_yellow: #F9F7EF;
+$yellow: #FCE67A;
+$blue: #253956;
+$light_blue: #C7E2E5;
+$dark_grey: #414141;
+$light_grey: #969696;
+$black: #1C1C1C;
+$white: #fff;
+$red: #F7685C;
+$light_red: #FFDCD9;

data/app/assets/stylesheets/2-quarks/_typography.scss

@@ -0,0 +1,32 @@
+/* Colors */
+
+@import "1-utilities/variables";
+
+body {
+  font-family: 'Rubik', 'Helvetica', 'Arial', sans-serif;
+  font-size: 12px;
+  line-height: 1.5;
+  margin-top: 0px;
+  color: $black;
+  background-color: $red;
+}
+h1{
+  font-size: 36px;
+}
+h2{
+  font-size: 24px;
+}
+h3{
+  font-size: 20px;
+}
+h4{
+  font-size: 14px;
+}
+a{
+  color: $red;
+  font-weight: 400;
+  &:hover{
+    color: $red;
+    text-decoration: underline;
+  }
+}

data/app/assets/stylesheets/3-atoms/_buttons.scss

@@ -0,0 +1,3 @@
+/* Colors */
+
+@import "1-utilities/variables";

data/app/assets/stylesheets/4-molecules/_footer.scss

@@ -0,0 +1,32 @@
+/* Colors */
+
+@import "1-utilities/variables";
+
+footer{
+  position: relative;
+  z-index: 1;
+  width: 50%;
+  max-width: 550px;
+  background-color: $yellow;
+  padding: 2em 1em;
+  text-align: center;
+  p.pull-right{
+    margin: 0;
+    float: none !important;
+    margin-bottom: 20px;
+    a{
+      background: $red;
+      padding: 10px;
+      color: $yellow;
+      -webkit-border-radius: 50px;
+      -moz-border-radius: 50px;
+      border-radius: 50px;
+    }
+  }
+}
+@media screen and (max-width: 768px){
+  footer{
+    max-width: none;
+    width: 100%;
+  }
+}

data/app/assets/stylesheets/4-molecules/_infraction-gallery.scss

@@ -0,0 +1,101 @@
+/* Infraction's slider */
+
+@import "1-utilities/variables";
+
+.gallery-container{
+  margin: 2%;
+  overflow: hidden;
+  h4{
+    margin-left: 2%;
+  }
+  .main-gallery-test{
+    margin-left: 2%;
+    a.fancybox{
+      cursor: pointer;
+      display: block !important;
+      position: relative;
+      position: relative;
+      float: left;
+      width: 32%;
+      margin: 0 1% 1% 0;
+      height: 100px;
+      overflow: hidden;
+      img{
+        width: 100%
+      }
+      &:before{
+        opacity: 0;
+        content: "\f00e";
+        font-family: 'FontAwesome';
+        position: absolute;
+        top: 43%;
+        left: 40%;
+        width: 30px;
+        background-color: #FCE67A;
+        -webkit-border-radius: 4px;
+        -moz-border-radius: 4px;
+        border-radius: 16px;
+        font-size: 16px;
+        text-align: center;
+        border: 3px solid #FCE67A;
+      }
+      &:hover{
+        &:before{
+          opacity: 1;
+        }
+      }
+    }
+  }
+}
+#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span{
+  background: image-url("gallery-buttons.png");
+}
+#fancybox-loading{
+  background-position: 0 -130px;
+}
+.fancybox-prev span, .fancybox-next span{
+  height: 44px;
+  width: 44px;
+}
+.fancybox-next span{
+  background-position: 0 -45px;
+}
+.fancybox-prev span{
+  background-position: 0 -88px;
+}
+.fancybox-close{
+  height: 44px;
+  width: 44px;
+  top: 0;
+  right: 0;
+}
+.fancybox-skin{
+  background: $yellow;
+}
+.fancybox-nav span{
+  visibility: visible;
+}
+.fancybox-inner:before{
+  content: "";
+  position: absolute;
+  background: image-url("logo-infractores.svg");
+  background-size: 100%;
+  width: 130px;
+  height: 43px;
+  background-repeat: no-repeat;
+  bottom: 0;
+  right: 0;
+  margin: 10px;
+}
+
+@media screen and (max-width: 500px){
+  .gallery-container{
+    .main-gallery-test{
+      margin-left: 2%;
+      a.fancybox{
+        width: 49%;
+        height: 80px;
+      }
+    }
+  }
+}

data/app/assets/stylesheets/4-molecules/_navbar.scss

@@ -0,0 +1,71 @@
+/* Colors */
+
+@import "1-utilities/variables";
+
+.navbar-inverse{
+  background: $blue;
+  border-radius: 0;
+  position: fixed;
+  z-index: 100;
+  top: 0;
+  //-webkit-box-shadow: rgba(0,0,0,0.3) 0 2px 3px;
+  //-moz-box-shadow: rgba(0,0,0,0.3) 0 2px 3px;
+  //box-shadow: rgba(0,0,0,0.3) 0 2px 3px;
+  padding: 1em 1em 0 1em;
+  border: 0;
+  max-width: 550px;
+  width: 50%;
+  .navbar-inner{
+    width: 90%;
+    margin: auto;
+    min-height: 40px;
+  }
+  .brand{
+    color: $red;
+    font-size: 18px;
+    margin: 0;
+    background-color: $red;
+    float: left;
+    padding: 5px 10px;
+    a{
+      color: $blue;
+      &:hover{
+        text-decoration: none;
+      }
+    }
+  }
+  #info{
+    line-height: 32px;
+    float: right;
+    font-size: 14px;
+    color: $white;
+    &:hover{
+      color: $red;
+      text-decoration: none;
+    }
+  }
+}
+#description{
+  display: none;
+  background-color: $light_yellow;
+  padding: 5%;
+  color: $blue;
+  line-height: 24px;
+  font-size: 14px;
+  position: fixed;
+  z-index: 2;
+  top: 52px;
+  height: 100%;
+  width: 50%;
+  max-width: 550px;
+}
+
+@media screen and (max-width:768px){
+  .navbar-inverse, #description{
+    width: 100%;
+    max-width: none;
+    &#description{
+      padding: 7%;
+    }
+  }
+}