lentil 0.2.3 → 0.3.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: ac9052aa763faa97b327c18dcf1a9611beb260fa
-  data.tar.gz: 83bdf4d62ff9ddb8538ac7c00c72f719ca6dc4bf
+  metadata.gz: cc790c8e8d8fe34956d0258fa3e26d349676a692
+  data.tar.gz: f071d713ce237797067c234ef47d2a22d5e06364
 SHA512:
-  metadata.gz: 22c34020deafcd91b5d568f7d2496a679f89d5f5eb4aeeadc6d55105c006bd3f5a91492e5e155ecb3effc61507e02614210c0cb725114a5456fb66cdd322d42b
-  data.tar.gz: 5ce6b0ca1879316543a5cc0e0735a569a90ed666d6cdbee4bfe3f02f9e7bc66dfe15b43feccc1f7c0e1cfdfa206cbd7c419f4809f15b5d3ed1369b6f819a6f2e
+  metadata.gz: fb64e39f915689b55216b0a2bcf8fd451558d6a272acc6af24c3a3436ed226b28babd28650139d97797a6e54cbd1453b7249dabc24e26dc833b77ea2e19c6c0d
+  data.tar.gz: 025923fe1ae7b2e97b65efcb8d10f6c82a0f8932d32e747451eedcbd520296980b9961ce0a0503186c40bf8eefba536da892c0a366ad54e6719b4a1093ac5376

data/app/assets/stylesheets/lentil/breakpoint/sass/_framework.scss

@@ -1,6 +1 @@
-@import 'compass';
-@import 'framework/mixins';
-@import 'framework/normalize';
-@import 'framework/print';
-@import 'framework/grid-helpers';
-@import 'framework/grid-core';
+@import 'framework/breakpoint';

data/app/assets/stylesheets/lentil/breakpoint/sass/framework/_breakpoint.scss

@@ -0,0 +1,20 @@
+// Grid Variables
+// ==========================================================================
+
+$grid-column: 60px !default;
+$grid-gutter: 20px !default;
+$base-font-size: 16px !default;
+$grid-direction: left !default;
+
+// generate visual grid overlay on class .grid-overlay
+$grid-overlay: false !default;
+
+// fallback breakpoint (column count for < IE9)
+$ie-support: false !default;
+
+// label for your mobile first breakpoint
+$first-breakpoint: "small" !default;
+
+@import 'utils';
+@import 'core';
+@import 'grid';

data/app/assets/stylesheets/lentil/breakpoint/sass/framework/_core.scss

@@ -0,0 +1,163 @@
+$current-bp: 0;
+$counter: 0;
+
+// push small breakpoint label into list
+$first-breakpoint: append($first-breakpoint, ());
+
+// Javascript hook for current breakpoint label
+@media (min-width: 0) {
+    body::before { content: breakpoint-list(nth($first-breakpoint, 1), $first-breakpoint, $counter); height: 0; display:block; overflow:hidden;  }
+}
+@if ($ie-support) { .lt-ie9 head { font-family: breakpoint-list(nth($first-breakpoint, 1), $first-breakpoint, $counter); } }
+
+
+// Breakpoint mixin
+// =============================================================================
+
+@mixin breakpoint($min: false, $max: false, $label: false, $orientation: false, $wrapper: true, $resolution: false) {
+
+    // set warnings if arguments are invalid
+    @if ($min == false and $max == false and $label == false and $orientation == false and $wrapper == true and $resolution == false) {
+        @warn "breakpoint requires you to pass some kind of argument. It can't read your mind. :)";
+    }
+    @if ($min == 0 and $max == false and $label == false and $orientation == false and $wrapper == true and $resolution == false) {
+        @warn "If you pass zero as a minimum you need to specify a max column value.";
+    }
+
+    // create MQ labels
+    @if ($label) {
+
+        // normalize quotes
+        $label: quote(unquote($label));
+
+        $counter: $counter + 1 !global;
+
+        // push label to label list names = push(names, myname)
+        $first-breakpoint: append($first-breakpoint, $label, comma);
+
+    }
+
+    // set current breakpoint for fluid function
+    $current-bp: $min !global;
+
+    // min width mq
+    @if ($min and $max == false) {
+        @if ($min > 0) {
+            // create min width mq
+            // can we remove duplication of code here?
+            @if ($orientation) {
+                @media ( min-width: (fixed($min) + em($grid-gutter)) * ($base-font-size / 16px) ) and ( orientation: $orientation ) {
+                    @include breakpoint-extras($min, $wrapper, $grid-overlay) { @content };
+                }
+            } @else {
+                @media ( min-width: (fixed($min) + em($grid-gutter)) * ($base-font-size / 16px) ) {
+
+                    // label current breakpoint
+                    @if($label) { body::before { content: breakpoint-list($label, $first-breakpoint, $counter); } }
+
+                    @include breakpoint-extras($min, $wrapper, $grid-overlay) { @content };
+                }
+            }
+            // ie fallback
+            @if ($ie-support and $min <= $ie-support and $orientation == false) {
+                .lt-ie9 {
+                    @include breakpoint-extras($min, $wrapper, $grid-overlay: false) { @content };
+
+                    // label current breakpoint
+                    @if($label) { & head { font-family: breakpoint-list($label, $first-breakpoint, $counter); } }
+
+
+                }
+            }
+        }
+    }
+
+    // max width mq
+    @if ($max) {
+        // create max only mq
+        @if ($min == 0 or $min == false) {
+            @if ($orientation) {
+                @media ( max-width: fixed($max) + em($grid-gutter) * ($base-font-size / 16px) ) and ( orientation: $orientation ) { @content }
+            } @else {
+                @media ( max-width: fixed($max) + em($grid-gutter) * ($base-font-size / 16px) ) { @content }
+            }
+        // create min and max mq
+        } @else {
+            @if ($orientation) {
+                @media ( min-width: fixed($min) + em($grid-gutter) * ($base-font-size / 16px) ) and ( max-width: fixed($max) + em($grid-gutter) ) and ( orientation: $orientation ) { @content }
+            } @else {
+                @media ( min-width: fixed($min) + em($grid-gutter) * ($base-font-size / 16px) ) and ( max-width: fixed($max) + em($grid-gutter) ) { @content }
+            }
+        }
+    }
+
+    // orientation only mq
+    @if ($min == false and $max == false) {
+        @if ($orientation) {
+            @media ( orientation: $orientation ) { @content }
+        }
+    }
+
+    // pixel ratio mq
+    @if ($resolution) {
+        // warn if invalid value
+        @if ($resolution != 'high' and $resolution != 'low') {
+            @warn "$resolution only supports values of 'high' or 'low'";
+        }
+        @if ($resolution == 'high') {
+            @media (-webkit-min-device-pixel-ratio: 1.5), (min-resolution: 144dpi) { @content }
+        }
+        @if ($resolution == 'low') {
+            @media (-webkit-max-device-pixel-ratio: 1.5), (max-resolution: 144dpi) { @content }
+        }
+        // ie fallback
+        @if ($ie-support and $resolution == 'low') {
+            .lt-ie9 { @content }
+        }
+    }
+}
+
+// private mixin for generating extras in a min width mq
+@mixin breakpoint-extras($min, $wrapper, $grid-overlay) {
+
+    @if($grid-overlay) { @include grid-overlay($min); }
+
+    // proper sizing of wrapper
+    @if($wrapper) { .wrapper { width: fixed($min) - em($grid-gutter); } }
+
+    @content
+
+}
+
+// Grid overlay
+// =============================================================================
+
+@mixin grid-overlay($col: false) {
+    .grid-overlay {
+        position: fixed; top: 0; bottom: 0; pointer-events: none; z-index: 10000;
+
+        $overlay-color: transparentize(red, .9);
+        background: -webkit-linear-gradient(left, transparent $grid-gutter, $overlay-color $grid-gutter, $overlay-color $grid-gutter + $grid-column);
+        background: -moz-linear-gradient(left, transparent $grid-gutter, $overlay-color $grid-gutter, $overlay-color $grid-gutter + $grid-column);
+        background: -o-linear-gradient(left, transparent $grid-gutter, $overlay-color $grid-gutter, $overlay-color $grid-gutter + $grid-column);
+        background: linear-gradient(left, transparent $grid-gutter, $overlay-color $grid-gutter, $overlay-color $grid-gutter + $grid-column);
+
+        @if ($col) {
+            left: 50%;
+            width: fixed($col) + em($grid-gutter);
+            margin-left: fixed($col) / -2 - (em($grid-gutter)/2);
+            -webkit-background-size: $grid-gutter + $grid-column;
+            -moz-background-size: $grid-gutter + $grid-column;
+            -o-background-size: $grid-gutter + $grid-column;
+            background-size: $grid-gutter + $grid-column;
+        } @else {
+            left: 0;
+            right: $grid-gutter;
+            -webkit-background-size: 25%;
+            -moz-background-size: 25%;
+            -o-background-size: 25%;
+            background-size: 25%;
+        }
+    }
+}
+@if($grid-overlay) { @include grid-overlay; }

data/app/assets/stylesheets/lentil/breakpoint/sass/framework/{_grid-core.scss → _grid.scss}

@@ -1,25 +1,23 @@
-/* Grid based on https://github.com/necolas/griddle by Nicolas Gallagher (@necolas) */
-
-// Grid Core
-// =============================================================================
+/*! Grid based on https://github.com/necolas/griddle by Nicolas Gallagher (@necolas) */
 
 // establish base font size in config so that media queries can be resized if the base context chagnes
-body { font-size: $base-font-size; }
+body { font-size: em($base-font-size, 16px); }
 
 // wrapper defaults to 100% fluid with side gutters
 // when triggering a breakpoint wrapper becomes fixed width and centered
 .wrapper {
-	margin-left: em($grid-gutter);
-	margin-right: em($grid-gutter);
+    margin-left: auto;
+    margin-right: auto;
+    padding-left: em($grid-gutter);
+    padding-right: em($grid-gutter);
 }
 
 // for responsive images
-img { max-width: 100%; margin-bottom:5px;}
+img { max-width: 100%; }
 .no-js .responsive-image { display: none; }
 
 // Grid container
-// Must only contain `.grid` or `.grid-cell` components as children.
-
+// Must only contain `.grid` or `.grid__cell` components as children.
 .grid {
     display: block;
     padding: 0;
@@ -29,16 +27,19 @@ img { max-width: 100%; margin-bottom:5px;}
     // Remove inter-unit whitespace for all non-monospace font-families
     // If you're using a monospace base font, you will need to set the `grid`
     // font-family to `sans-serif` and then redeclare the monospace font on
-    // the `grid-cell` objects.
+    // the `grid__cell` objects.
     letter-spacing: -0.31em;
-    word-spacing: -0.43em;
     // Protect against WebKit bug with optimizelegibility
     text-rendering: optimizespeed;
 }
 
+.opera:-o-prefocus,
+.grid {
+    word-spacing: -0.43em;
+}
+
 // Child `grid` object adjustments
 // Used for more complex fixed-fluid hybrid grids
-
 .grid > .grid {
     overflow: hidden;
     margin-right: 0;
@@ -48,17 +49,28 @@ img { max-width: 100%; margin-bottom:5px;}
 
 // Grid units
 // No explicit width by default
-
-.grid-cell {
+.grid__cell {
     width: 100%;
-    @include inline-block;
-    @include border-box;
-    margin: 5px 0 0 0;
+
+    display: -moz-inline-stack;
+    display: inline-block;
+    *vertical-align: auto;
+    zoom: 1;
+    *display: inline;
+
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+
+    margin: 0;
     padding: 0 0.5 * em($grid-gutter);
+
     /* controls vertical positioning of units */
     vertical-align: top;
+
     /* keeps unit content correctly aligned */
     text-align: $grid-direction;
+
     /* reset text defaults */
     letter-spacing: normal;
     word-spacing: normal;
@@ -66,18 +78,12 @@ img { max-width: 100%; margin-bottom:5px;}
 }
 
 // Modifier: horizontally center all grid units
-// Allows for automatic unit centering irrespective of the number of
-// units in the grid.
-
-.grid-center {
+.grid--center {
     text-align: center;
 }
 
 // Modifier: horizontally center one unit
-// Set a specific unit to be horizontally centered. Doesn't affect
-// any other units. Can still contain a child `grid` object.
-
-.grid-cell-center {
+.grid__cell--center {
     display: block;
     margin: 0 auto;
 }

data/app/assets/stylesheets/lentil/breakpoint/sass/framework/_utils.scss

@@ -0,0 +1,17 @@
+// converting px to em
+@function em($px, $base: $base-font-size) { @return ($px / $base) * 1em; }
+
+// creates percentage width
+@function fluid($col, $avail: $current-bp) { @return (100% / $avail) * $col }
+
+// creates em width
+// pass false as a second argument to remove the built in gutter (for creating height measurements)
+@function fixed($col, $gutter: true) {
+    @if ($gutter) { @return $col * ( em($grid-column + $grid-gutter) ) }
+    @else { @return $col * ( em($grid-column + $grid-gutter) ) - em($grid-gutter) }
+}
+
+// create json formatted string of breakpoint info
+@function breakpoint-list($label, $first-breakpoint, $counter) {
+    @return '{ "current" : "#{$label}", "all" : [#{$first-breakpoint}], "position" : #{$counter} }';
+}

data/app/assets/stylesheets/lentil/images.css.scss

@@ -2,5 +2,5 @@
 // They will automatically be included in application.css.
 // You can use Sass (SCSS) here: http://sass-lang.com/
 
-@import "breakpoint/sass/style.scss";
+@import "breakpoint/sass/style";
 @import "animatedimages/css/style.css";

data/app/controllers/lentil/photographers_controller.rb

@@ -1,7 +1,7 @@
 module Lentil
   class PhotographersController < Lentil::ApplicationController
     def index
-      @photographers = User.joins(:images).where("state = 1").group(:id).order(:user_name)
+      @photographers = User.joins(:images).where("state = 1").group('lentil_users.id').order(:user_name)
       @title = "Photographers"
     end
 

data/app/models/lentil/tag.rb

@@ -20,4 +20,9 @@ class Lentil::Tag < ActiveRecord::Base
   validates_presence_of :name
 
   scope :harvestable, where(:lentil_tagsets => {:harvest => true}).includes(:tagsets)
+  
+  #Stripping tags on write
+  def name=(new_name)
+    write_attribute(:name, new_name.sub(/^#/, ''))
+  end
 end

data/app/views/lentil/images/_image_tiles.erb

@@ -1,6 +1,6 @@
     <div class="images">
       <% @images.each do |image| %>
-        <div id="image_<%= image.id %>" class="grid-cell image-tile">
+        <div id="image_<%= image.id %>" class="grid__cell image-tile">
           <%= link_to url_for(image), 'data-fancybox-href' => image.jpeg, 'data-fancybox-group' => "image-tile-gallery",  :class => :fancybox  do %>
             <%= image_tag(image.jpeg, :class => "instagram-img " + image.id.to_s, :alt => image.description, :data => {:battles_count => image.battles_count, :win_pct => image.win_pct, :popularity => image.popular_score, :staff_like => image.staff_like, :like_votes_count => image.like_votes_count}) %>
           <% end %>

data/app/views/lentil/images/animate.html.erb

@@ -4,14 +4,14 @@
 </script>
 <div class="wrapper">
   <div class="grid">
-    <div id="ri-grid" class="ri-grid ri-grid-size-2 grid-cell animated-images staff-picks-animated" style="padding:0; margin:0;">
+    <div id="ri-grid" class="ri-grid ri-grid-size-2 grid__cell animated-images staff-picks-animated" style="padding:0; margin:0;">
       <ul>
       <% @images.each do |image| %>
         <li class="image-animate-tile"><a href="#"><%= image_tag(image.jpeg, :class => "instagram-img") %></a></li>
       <% end -%>
       </ul>
     </div>
-    <div class="grid-cell animated-images-branding">
+    <div class="grid__cell animated-images-branding">
       <h1 class="name"><%= application_name %></h1>
       <h1 class="url"><%= link_to main_app.root_url, main_app.root_url %></h2>
     </div>

data/app/views/lentil/images/index.html.erb

@@ -7,7 +7,7 @@
 <%= render :partial => "/layouts/lentil/top_navigation" %>
 <section class="wrapper">
   <div class="grid">
-    <div class="grid-cell header">
+    <div class="grid__cell header">
       <h1><%= link_to application_name, main_app.root_path %></h1>
       <ul class="header_nav">
         <li><%= nav_link t('lentil.nav.battle'), :thisorthat_battle %></li>

data/app/views/lentil/images/show.html.erb

@@ -15,10 +15,10 @@
 <% end -%>
 <%= render :partial => "/layouts/lentil/top_navigation" %>
 <div class="wrapper">
-    <div class="grid-cell side-filler"></div>
-    <div id="image_<%= @image.id %>" class="image-show grid-cell solo-image">
+    <div class="grid__cell side-filler"></div>
+    <div id="image_<%= @image.id %>" class="image-show grid__cell solo-image">
         <a href="<%= @image.url %>"><%= image_tag(@image.jpeg, :class => "instagram-img") %></a>
         <%= render "/layouts/lentil/image_popup", :image => @image  %>
     </div>
-    <div class="grid-cell side-filler"></div>
+    <div class="grid__cell side-filler"></div>
 </div>

data/app/views/lentil/pages/about.html.erb

@@ -2,7 +2,7 @@
 <%= render :partial => "/layouts/lentil/top_navigation" %>
 <section id="about" class="wrapper">
     <div class="grid">
-        <div class="well contribute grid-cell">
+        <div class="well contribute grid__cell">
         Create the file app/views/lentil/pages/about.html.erb and fill it with whatever you want.
         </div>
     </div>

data/app/views/lentil/photographers/index.html.erb

@@ -2,7 +2,7 @@
 <%= render :partial => "/layouts/lentil/top_navigation" %>
 <section class="wrapper">
   <div class="grid">
-    <div class="grid-cell well">
+    <div class="grid__cell well">
         <ul>
             <% @photographers.each do |photographer| %>
             <li><%= link_to photographer.user_name, photographer_path(photographer.id) %></li>

data/app/views/lentil/photographers/show.html.erb

@@ -2,7 +2,7 @@
 <%= render :partial => "/layouts/lentil/top_navigation" %>
 <section class="wrapper">
   <div class="grid">
-    <div class="grid-cell well photographer-info">
+    <div class="grid__cell well photographer-info">
       <h1><%= @photographer.user_name %> (<%= t 'lentil.photographer.photo', :count => @images.total_entries %>)</h1>
       <%# FIXME: Is there a better way to be recording the photographer URL? %>
       <h2><%= link_to t('lentil.photographer.service_link', username: @photographer.user_name , service: @photographer.service.name), @photographer.service.url + "/" + @photographer.user_name %></h2>

data/app/views/lentil/thisorthat/_battle_form.html.erb

@@ -1,7 +1,7 @@
 <div class="grid battle-inner">
   <%= semantic_form_for :battle, :remote => true, :url => thisorthat_result_path do |form| %>
     <% @images.each do |image| %>
-      <div class="battle-image-wrap grid-cell">
+      <div class="battle-image-wrap grid__cell">
         <%= semantic_fields_for "image[#{image.id}]", image do |f| %>
           <div id="image_<%= image.id %>" class="battle-image-tile">
             <a href="<%= url_for(image) %>" data-fancybox-href= "<%= image.jpeg %>" class="fancybox"><%= image_tag(image.jpeg, :class => "battle-img", :data => {:battles_count => image.battles_count, :win_pct => image.win_pct, :popularity => image.popular_score, :staff_like => image.staff_like, :like_votes_count => image.like_votes_count}) %>
@@ -21,7 +21,7 @@
     <% end -%>
   <% end -%>
   <% @prev_images.each do |image| %>
-      <div class="battle-image-wrap grid-cell" style="background:#e6e6e6">
+      <div class="battle-image-wrap grid__cell" style="background:#e6e6e6">
           <div id="image_<%= image.id %>" class="battle-image-tile">
             <a href="<%= url_for(image) %>" data-fancybox-href= "<%= image.jpeg %>" class="fancybox"><%= image_tag(image.jpeg, :class => "battle-img", :data => {:battles_count => image.battles_count, :win_pct => image.win_pct, :popularity => image.popular_score, :staff_like => image.staff_like, :like_votes_count => image.like_votes_count}) %>
               <div class="battle-image-desc trunc-small"><div class="battle-image-inner-desc"><%= truncate(image.description, :length => 35) %></div></div>