diff --git a/.gitignore b/.gitignore new file mode 100644 index 000000000..67b37ec2d --- /dev/null +++ b/.gitignore @@ -0,0 +1,24 @@ +# See https://help.github.com/articles/ignoring-files for more about ignoring files. +# +# If you find yourself ignoring temporary files generated by your text editor +# or operating system, you probably want to add a global ignore instead: +# git config --global core.excludesfile '~/.gitignore_global' + +# Ignore bundler config. +/.bundle + +# Ignore the default SQLite database. +/db/*.sqlite3 +/db/*.sqlite3-journal + +# Ignore all logfiles and tempfiles. +/log/* +!/log/.keep +/tmp + +.env +.DS_Store +/*.DS_Store + + +test/cassettes diff --git a/Gemfile b/Gemfile new file mode 100644 index 000000000..0744e282e --- /dev/null +++ b/Gemfile @@ -0,0 +1,69 @@ +source 'https://rubygems.org' + +gem 'foundation-rails' +gem 'jquery-turbolinks' +gem "awesome_print" +# Bundle edge Rails instead: gem 'rails', github: 'rails/rails' +gem 'rails', '4.2.7' +# Use sqlite3 as the database for Active Record +# Use SCSS for stylesheets +gem 'sass-rails', '~> 5.0' +# Use Uglifier as compressor for JavaScript assets +gem 'uglifier', '>= 1.3.0' +# Use CoffeeScript for .coffee assets and views +gem 'coffee-rails', '~> 4.1.0' +# See https://github.com/rails/execjs#readme for more supported runtimes +# gem 'therubyracer', platforms: :ruby + +# Use jquery as the JavaScript library +gem 'jquery-rails' +# Turbolinks makes following links in your web application faster. Read more: https://github.com/rails/turbolinks +gem 'turbolinks' +# Build JSON APIs with ease. Read more: https://github.com/rails/jbuilder +gem 'jbuilder', '~> 2.0' +# bundle exec rake doc:rails generates the API under doc/api. +gem 'sdoc', '~> 0.4.0', group: :doc + +# API GEMS +gem 'httparty' + +# Use ActiveModel has_secure_password +# gem 'bcrypt', '~> 3.1.7' + +# Use Unicorn as the app server +# gem 'unicorn' + +# Use Capistrano for deployment +# gem 'capistrano-rails', group: :development +group :production do + gem 'pg' + gem 'rails_12factor' +end + + +group :development, :test do + # Call 'byebug' anywhere in the code to stop execution and get a debugger console + gem 'byebug' + gem 'dotenv-rails' + gem 'better_errors' + gem 'pry' + gem 'sqlite3' + + # API testing + gem 'minitest-vcr' + gem 'webmock' +end + +group :development do + # Access an IRB console on exception pages or by using <%= console %> in views + gem 'web-console', '~> 2.0' + + # Spring speeds up development by keeping your application running in the background. Read more: https://github.com/rails/spring + gem 'spring' + +end + + +group :test do + gem 'minitest-reporters' +end diff --git a/Gemfile.lock b/Gemfile.lock new file mode 100644 index 000000000..9d41c02a7 --- /dev/null +++ b/Gemfile.lock @@ -0,0 +1,237 @@ +GEM + remote: https://rubygems.org/ + specs: + actionmailer (4.2.7) + actionpack (= 4.2.7) + actionview (= 4.2.7) + activejob (= 4.2.7) + mail (~> 2.5, >= 2.5.4) + rails-dom-testing (~> 1.0, >= 1.0.5) + actionpack (4.2.7) + actionview (= 4.2.7) + activesupport (= 4.2.7) + rack (~> 1.6) + rack-test (~> 0.6.2) + rails-dom-testing (~> 1.0, >= 1.0.5) + rails-html-sanitizer (~> 1.0, >= 1.0.2) + actionview (4.2.7) + activesupport (= 4.2.7) + builder (~> 3.1) + erubis (~> 2.7.0) + rails-dom-testing (~> 1.0, >= 1.0.5) + rails-html-sanitizer (~> 1.0, >= 1.0.2) + activejob (4.2.7) + activesupport (= 4.2.7) + globalid (>= 0.3.0) + activemodel (4.2.7) + activesupport (= 4.2.7) + builder (~> 3.1) + activerecord (4.2.7) + activemodel (= 4.2.7) + activesupport (= 4.2.7) + arel (~> 6.0) + activesupport (4.2.7) + i18n (~> 0.7) + json (~> 1.7, >= 1.7.7) + minitest (~> 5.1) + thread_safe (~> 0.3, >= 0.3.4) + tzinfo (~> 1.1) + addressable (2.4.0) + ansi (1.5.0) + arel (6.0.3) + awesome_print (1.7.0) + babel-source (5.8.35) + babel-transpiler (0.7.0) + babel-source (>= 4.0, < 6) + execjs (~> 2.0) + better_errors (2.1.1) + coderay (>= 1.0.0) + erubis (>= 2.6.6) + rack (>= 0.9.0) + binding_of_caller (0.7.2) + debug_inspector (>= 0.0.1) + builder (3.2.2) + byebug (9.0.6) + coderay (1.1.1) + coffee-rails (4.1.1) + coffee-script (>= 2.2.0) + railties (>= 4.0.0, < 5.1.x) + coffee-script (2.4.1) + coffee-script-source + execjs + coffee-script-source (1.10.0) + concurrent-ruby (1.0.2) + crack (0.4.3) + safe_yaml (~> 1.0.0) + debug_inspector (0.0.2) + dotenv (2.1.1) + dotenv-rails (2.1.1) + dotenv (= 2.1.1) + railties (>= 4.0, < 5.1) + erubis (2.7.0) + execjs (2.7.0) + foundation-rails (6.2.4.0) + railties (>= 3.1.0) + sass (>= 3.3.0, < 3.5) + sprockets-es6 (>= 0.9.0) + globalid (0.3.7) + activesupport (>= 4.1.0) + hashdiff (0.3.0) + httparty (0.14.0) + multi_xml (>= 0.5.2) + i18n (0.7.0) + jbuilder (2.6.0) + activesupport (>= 3.0.0, < 5.1) + multi_json (~> 1.2) + jquery-rails (4.2.1) + rails-dom-testing (>= 1, < 3) + railties (>= 4.2.0) + thor (>= 0.14, < 2.0) + jquery-turbolinks (2.1.0) + railties (>= 3.1.0) + turbolinks + json (1.8.3) + loofah (2.0.3) + nokogiri (>= 1.5.9) + mail (2.6.4) + mime-types (>= 1.16, < 4) + method_source (0.8.2) + mime-types (3.1) + mime-types-data (~> 3.2015) + mime-types-data (3.2016.0521) + mini_portile2 (2.1.0) + minispec-metadata (2.0.0) + minitest + minitest (5.9.1) + minitest-reporters (1.1.12) + ansi + builder + minitest (>= 5.0) + ruby-progressbar + minitest-vcr (1.4.0) + minispec-metadata (~> 2.0) + minitest (>= 4.7.5) + vcr (>= 2.9) + multi_json (1.12.1) + multi_xml (0.5.5) + nokogiri (1.6.8.1) + mini_portile2 (~> 2.1.0) + pg (0.19.0) + pry (0.10.4) + coderay (~> 1.1.0) + method_source (~> 0.8.1) + slop (~> 3.4) + rack (1.6.4) + rack-test (0.6.3) + rack (>= 1.0) + rails (4.2.7) + actionmailer (= 4.2.7) + actionpack (= 4.2.7) + actionview (= 4.2.7) + activejob (= 4.2.7) + activemodel (= 4.2.7) + activerecord (= 4.2.7) + activesupport (= 4.2.7) + bundler (>= 1.3.0, < 2.0) + railties (= 4.2.7) + sprockets-rails + rails-deprecated_sanitizer (1.0.3) + activesupport (>= 4.2.0.alpha) + rails-dom-testing (1.0.7) + activesupport (>= 4.2.0.beta, < 5.0) + nokogiri (~> 1.6.0) + rails-deprecated_sanitizer (>= 1.0.1) + rails-html-sanitizer (1.0.3) + loofah (~> 2.0) + rails_12factor (0.0.3) + rails_serve_static_assets + rails_stdout_logging + rails_serve_static_assets (0.0.5) + rails_stdout_logging (0.0.5) + railties (4.2.7) + actionpack (= 4.2.7) + activesupport (= 4.2.7) + rake (>= 0.8.7) + thor (>= 0.18.1, < 2.0) + rake (11.3.0) + rdoc (4.2.2) + json (~> 1.4) + ruby-progressbar (1.8.1) + safe_yaml (1.0.4) + sass (3.4.22) + sass-rails (5.0.6) + railties (>= 4.0.0, < 6) + sass (~> 3.1) + sprockets (>= 2.8, < 4.0) + sprockets-rails (>= 2.0, < 4.0) + tilt (>= 1.1, < 3) + sdoc (0.4.2) + json (~> 1.7, >= 1.7.7) + rdoc (~> 4.0) + slop (3.6.0) + spring (2.0.0) + activesupport (>= 4.2) + sprockets (3.7.0) + concurrent-ruby (~> 1.0) + rack (> 1, < 3) + sprockets-es6 (0.9.2) + babel-source (>= 5.8.11) + babel-transpiler + sprockets (>= 3.0.0) + sprockets-rails (3.2.0) + actionpack (>= 4.0) + activesupport (>= 4.0) + sprockets (>= 3.0.0) + sqlite3 (1.3.12) + thor (0.19.1) + thread_safe (0.3.5) + tilt (2.0.5) + turbolinks (5.0.1) + turbolinks-source (~> 5) + turbolinks-source (5.0.0) + tzinfo (1.2.2) + thread_safe (~> 0.1) + uglifier (3.0.3) + execjs (>= 0.3.0, < 3) + vcr (3.0.3) + web-console (2.3.0) + activemodel (>= 4.0) + binding_of_caller (>= 0.7.2) + railties (>= 4.0) + sprockets-rails (>= 2.0, < 4.0) + webmock (2.1.0) + addressable (>= 2.3.6) + crack (>= 0.3.2) + hashdiff + +PLATFORMS + ruby + +DEPENDENCIES + awesome_print + better_errors + byebug + coffee-rails (~> 4.1.0) + dotenv-rails + foundation-rails + httparty + jbuilder (~> 2.0) + jquery-rails + jquery-turbolinks + minitest-reporters + minitest-vcr + pg + pry + rails (= 4.2.7) + rails_12factor + sass-rails (~> 5.0) + sdoc (~> 0.4.0) + spring + sqlite3 + turbolinks + uglifier (>= 1.3.0) + web-console (~> 2.0) + webmock + +BUNDLED WITH + 1.13.1 diff --git a/README.md b/README.md index 3666ab78e..c18c642f1 100644 --- a/README.md +++ b/README.md @@ -1,5 +1,20 @@ # Recipe API Consumer +### Reflection: +What do you understand better after doing this project? + +* I understand API's (both what they are and how they work) much better. I also understand how to make a site responsive using foundation much better and what to test for (although I still want to add some more assertions to my test). In addition, while I didn't include it in the final product (because the API didn't allow filtering based all health categories - I believe that was a premium package thing) I added in the functionality which helped me get experience with searching and filtering logic. + +What do you want more practice with? + +* I want more practice with testing (I feel like I can do it but it's not as thourough or as fast a process as I'd like it to be). I also woud love to have a better understanding of how the structure of a rails project is set up. I have a good grasp of the MVC framework and the helpers that go along with them, but don't have a complete understanding of how the lib folder fits in and what to put in there. + +What is someting you saw done differently? + +* Using URI.escape to get the right format for a uri (I used gsub instead which seems more makeshift). + + + ## Learning Goals: - Configure an API for consumption - Create authenticated API requests using HTTParty @@ -66,3 +81,4 @@ Once you've explored the API docs, this project: - High Protien - Etc + diff --git a/README.rdoc b/README.rdoc new file mode 100644 index 000000000..dd4e97e22 --- /dev/null +++ b/README.rdoc @@ -0,0 +1,28 @@ +== README + +This README would normally document whatever steps are necessary to get the +application up and running. + +Things you may want to cover: + +* Ruby version + +* System dependencies + +* Configuration + +* Database creation + +* Database initialization + +* How to run the test suite + +* Services (job queues, cache servers, search engines, etc.) + +* Deployment instructions + +* ... + + +Please feel free to use a different markup language if you do not plan to run +rake doc:app. diff --git a/Rakefile b/Rakefile new file mode 100644 index 000000000..ba6b733dd --- /dev/null +++ b/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 diff --git a/app/assets/images/.keep b/app/assets/images/.keep new file mode 100644 index 000000000..e69de29bb diff --git a/app/assets/images/edamam-logo.png b/app/assets/images/edamam-logo.png new file mode 100644 index 000000000..19ab019c5 Binary files /dev/null and b/app/assets/images/edamam-logo.png differ diff --git a/app/assets/images/pasta.jpg b/app/assets/images/pasta.jpg new file mode 100644 index 000000000..5de44a675 Binary files /dev/null and b/app/assets/images/pasta.jpg differ diff --git a/app/assets/images/peppers.jpeg b/app/assets/images/peppers.jpeg new file mode 100644 index 000000000..b444002a0 Binary files /dev/null and b/app/assets/images/peppers.jpeg differ diff --git a/app/assets/images/pineapples.jpeg b/app/assets/images/pineapples.jpeg new file mode 100644 index 000000000..97b56a45f Binary files /dev/null and b/app/assets/images/pineapples.jpeg differ diff --git a/app/assets/images/pizza.jpg b/app/assets/images/pizza.jpg new file mode 100644 index 000000000..ff572f5a5 Binary files /dev/null and b/app/assets/images/pizza.jpg differ diff --git a/app/assets/images/salmon.jpg b/app/assets/images/salmon.jpg new file mode 100644 index 000000000..ea9ac9d63 Binary files /dev/null and b/app/assets/images/salmon.jpg differ diff --git a/app/assets/images/veggies.jpeg b/app/assets/images/veggies.jpeg new file mode 100644 index 000000000..6da0cf96c Binary files /dev/null and b/app/assets/images/veggies.jpeg differ diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js new file mode 100644 index 000000000..92a9acf14 --- /dev/null +++ b/app/assets/javascripts/application.js @@ -0,0 +1,19 @@ +// 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 foundation +//= require turbolinks +//= require_tree . + +$(function(){ $(document).foundation(); }); diff --git a/app/assets/javascripts/recipes.coffee b/app/assets/javascripts/recipes.coffee new file mode 100644 index 000000000..24f83d18b --- /dev/null +++ b/app/assets/javascripts/recipes.coffee @@ -0,0 +1,3 @@ +# Place all the behaviors and hooks related to the matching controller here. +# All this logic will automatically be available in application.js. +# You can use CoffeeScript in this file: http://coffeescript.org/ diff --git a/app/assets/stylesheets/_settings.scss b/app/assets/stylesheets/_settings.scss new file mode 100644 index 000000000..703053eb9 --- /dev/null +++ b/app/assets/stylesheets/_settings.scss @@ -0,0 +1,574 @@ +// Foundation for Sites Settings +// ----------------------------- +// +// Table of Contents: +// +// 1. Global +// 2. Breakpoints +// 3. The Grid +// 4. Base Typography +// 5. Typography Helpers +// 6. Abide +// 7. Accordion +// 8. Accordion Menu +// 9. Badge +// 10. Breadcrumbs +// 11. Button +// 12. Button Group +// 13. Callout +// 14. Close Button +// 15. Drilldown +// 16. Dropdown +// 17. Dropdown Menu +// 18. Flex Video +// 19. Forms +// 20. Label +// 21. Media Object +// 22. Menu +// 23. Meter +// 24. Off-canvas +// 25. Orbit +// 26. Pagination +// 27. Progress Bar +// 28. Reveal +// 29. Slider +// 30. Switch +// 31. Table +// 32. Tabs +// 33. Thumbnail +// 34. Title Bar +// 35. Tooltip +// 36. Top Bar + +@import 'util/util'; + +// 1. Global +// --------- + +$global-font-size: 100%; +$global-width: rem-calc(1200); +$global-lineheight: 1.5; +$foundation-palette: ( + primary: #2199e8, + secondary: #777, + success: #3adb76, + warning: #ffae00, + alert: #ec5840, +); +$light-gray: #e6e6e6; +$medium-gray: #cacaca; +$dark-gray: #8a8a8a; +$black: #0a0a0a; +$white: #fefefe; +$body-background: $white; +$body-font-color: $black; +$body-font-family: 'Helvetica Neue', Helvetica, Roboto, Arial, sans-serif; +$body-antialiased: true; +$global-margin: 1rem; +$global-padding: 1rem; +$global-weight-normal: normal; +$global-weight-bold: bold; +$global-radius: 0; +$global-text-direction: ltr; +$global-flexbox: false; +$print-transparent-backgrounds: true; + +@include add-foundation-colors; + +// 2. Breakpoints +// -------------- + +$breakpoints: ( + small: 0, + medium: 640px, + large: 1024px, + xlarge: 1200px, + xxlarge: 1440px, +); +$breakpoint-classes: (small medium large); + +// 3. The Grid +// ----------- + +$grid-row-width: $global-width; +$grid-column-count: 12; +$grid-column-gutter: ( + small: 20px, + medium: 30px, +); +$grid-column-align-edge: true; +$block-grid-max: 8; + +// 4. Base Typography +// ------------------ + +$header-font-family: $body-font-family; +$header-font-weight: $global-weight-normal; +$header-font-style: normal; +$font-family-monospace: Consolas, 'Liberation Mono', Courier, monospace; +$header-sizes: ( + small: ( + 'h1': 24, + 'h2': 20, + 'h3': 19, + 'h4': 18, + 'h5': 17, + 'h6': 16, + ), + medium: ( + 'h1': 48, + 'h2': 40, + 'h3': 31, + 'h4': 25, + 'h5': 20, + 'h6': 16, + ), +); +$header-color: inherit; +$header-lineheight: 1.4; +$header-margin-bottom: 0.5rem; +$header-text-rendering: optimizeLegibility; +$small-font-size: 80%; +$header-small-font-color: $medium-gray; +$paragraph-lineheight: 1.6; +$paragraph-margin-bottom: 1rem; +$paragraph-text-rendering: optimizeLegibility; +$code-color: $black; +$code-font-family: $font-family-monospace; +$code-font-weight: $global-weight-normal; +$code-background: $light-gray; +$code-border: 1px solid $medium-gray; +$code-padding: rem-calc(2 5 1); +$anchor-color: $primary-color; +$anchor-color-hover: scale-color($anchor-color, $lightness: -14%); +$anchor-text-decoration: none; +$anchor-text-decoration-hover: none; +$hr-width: $global-width; +$hr-border: 1px solid $medium-gray; +$hr-margin: rem-calc(20) auto; +$list-lineheight: $paragraph-lineheight; +$list-margin-bottom: $paragraph-margin-bottom; +$list-style-type: disc; +$list-style-position: outside; +$list-side-margin: 1.25rem; +$list-nested-side-margin: 1.25rem; +$defnlist-margin-bottom: 1rem; +$defnlist-term-weight: $global-weight-bold; +$defnlist-term-margin-bottom: 0.3rem; +$blockquote-color: $dark-gray; +$blockquote-padding: rem-calc(9 20 0 19); +$blockquote-border: 1px solid $medium-gray; +$cite-font-size: rem-calc(13); +$cite-color: $dark-gray; +$keystroke-font: $font-family-monospace; +$keystroke-color: $black; +$keystroke-background: $light-gray; +$keystroke-padding: rem-calc(2 4 0); +$keystroke-radius: $global-radius; +$abbr-underline: 1px dotted $black; + +// 5. Typography Helpers +// --------------------- + +$lead-font-size: $global-font-size * 1.25; +$lead-lineheight: 1.6; +$subheader-lineheight: 1.4; +$subheader-color: $dark-gray; +$subheader-font-weight: $global-weight-normal; +$subheader-margin-top: 0.2rem; +$subheader-margin-bottom: 0.5rem; +$stat-font-size: 2.5rem; + +// 6. Abide +// -------- + +$abide-inputs: true; +$abide-labels: true; +$input-background-invalid: map-get($foundation-palette, alert); +$form-label-color-invalid: map-get($foundation-palette, alert); +$input-error-color: map-get($foundation-palette, alert); +$input-error-font-size: rem-calc(12); +$input-error-font-weight: $global-weight-bold; + +// 7. Accordion +// ------------ + +$accordion-background: $white; +$accordion-plusminus: true; +$accordion-item-color: foreground($accordion-background, $primary-color); +$accordion-item-background-hover: $light-gray; +$accordion-item-padding: 1.25rem 1rem; +$accordion-content-background: $white; +$accordion-content-border: 1px solid $light-gray; +$accordion-content-color: foreground($accordion-content-background, $body-font-color); +$accordion-content-padding: 1rem; + +// 8. Accordion Menu +// ----------------- + +$accordionmenu-arrows: true; +$accordionmenu-arrow-color: $primary-color; + +// 9. Badge +// -------- + +$badge-background: $primary-color; +$badge-color: foreground($badge-background); +$badge-padding: 0.3em; +$badge-minwidth: 2.1em; +$badge-font-size: 0.6rem; + +// 10. Breadcrumbs +// --------------- + +$breadcrumbs-margin: 0 0 $global-margin 0; +$breadcrumbs-item-font-size: rem-calc(11); +$breadcrumbs-item-color: $primary-color; +$breadcrumbs-item-color-current: $black; +$breadcrumbs-item-color-disabled: $medium-gray; +$breadcrumbs-item-margin: 0.75rem; +$breadcrumbs-item-uppercase: true; +$breadcrumbs-item-slash: true; + +// 11. Button +// ---------- + +$button-padding: 0.85em 1em; +$button-margin: 0 0 $global-margin 0; +$button-fill: solid; +$button-background: $primary-color; +$button-background-hover: scale-color($button-background, $lightness: -15%); +$button-color: $white; +$button-color-alt: $black; +$button-radius: $global-radius; +$button-sizes: ( + tiny: 0.6rem, + small: 0.75rem, + default: 0.9rem, + large: 1.25rem, +); +$button-opacity-disabled: 0.25; +$button-background-hover-lightness: -20%; +$button-hollow-hover-lightness: -50%; + +// 12. Button Group +// ---------------- + +$buttongroup-margin: 1rem; +$buttongroup-spacing: 1px; +$buttongroup-child-selector: '.button'; +$buttongroup-expand-max: 6; + +// 13. Callout +// ----------- + +$callout-background: $white; +$callout-background-fade: 85%; +$callout-border: 1px solid rgba($black, 0.25); +$callout-margin: 0 0 1rem 0; +$callout-padding: 1rem; +$callout-font-color: $body-font-color; +$callout-font-color-alt: $body-background; +$callout-radius: $global-radius; +$callout-link-tint: 30%; + +// 14. Close Button +// ---------------- + +$closebutton-position: right top; +$closebutton-offset-horizontal: 1rem; +$closebutton-offset-vertical: 0.5rem; +$closebutton-size: 2em; +$closebutton-lineheight: 1; +$closebutton-color: $dark-gray; +$closebutton-color-hover: $black; + +// 15. Drilldown +// ------------- + +$drilldown-transition: transform 0.15s linear; +$drilldown-arrows: true; +$drilldown-arrow-color: $primary-color; +$drilldown-background: $white; + +// 16. Dropdown +// ------------ + +$dropdown-padding: 1rem; +$dropdown-border: 1px solid $medium-gray; +$dropdown-font-size: 1rem; +$dropdown-width: 300px; +$dropdown-radius: $global-radius; +$dropdown-sizes: ( + tiny: 100px, + small: 200px, + large: 400px, +); + +// 17. Dropdown Menu +// ----------------- + +$dropdownmenu-arrows: true; +$dropdownmenu-arrow-color: $anchor-color; +$dropdownmenu-min-width: 200px; +$dropdownmenu-background: $white; +$dropdownmenu-border: 1px solid $medium-gray; + +// 18. Flex Video +// -------------- + +$flexvideo-margin-bottom: rem-calc(16); +$flexvideo-ratio: 4 by 3; +$flexvideo-ratio-widescreen: 16 by 9; + +// 19. Forms +// --------- + +$fieldset-border: 1px solid $medium-gray; +$fieldset-padding: rem-calc(20); +$fieldset-margin: rem-calc(18 0); +$legend-padding: rem-calc(0 3); +$form-spacing: rem-calc(16); +$helptext-color: $black; +$helptext-font-size: rem-calc(13); +$helptext-font-style: italic; +$input-prefix-color: $black; +$input-prefix-background: $light-gray; +$input-prefix-border: 1px solid $medium-gray; +$input-prefix-padding: 1rem; +$form-label-color: $black; +$form-label-font-size: rem-calc(14); +$form-label-font-weight: $global-weight-normal; +$form-label-line-height: 1.8; +$select-background: $white; +$select-triangle-color: $dark-gray; +$select-radius: $global-radius; +$input-color: $black; +$input-placeholder-color: $medium-gray; +$input-font-family: inherit; +$input-font-size: rem-calc(16); +$input-background: $white; +$input-background-focus: $white; +$input-background-disabled: $light-gray; +$input-border: 1px solid $medium-gray; +$input-border-focus: 1px solid $dark-gray; +$input-shadow: inset 0 1px 2px rgba($black, 0.1); +$input-shadow-focus: 0 0 5px $medium-gray; +$input-cursor-disabled: not-allowed; +$input-transition: box-shadow 0.5s, border-color 0.25s ease-in-out; +$input-number-spinners: true; +$input-radius: $global-radius; +$button-radius: $global-radius; + +// 20. Label +// --------- + +$label-background: $primary-color; +$label-color: foreground($label-background); +$label-font-size: 0.8rem; +$label-padding: 0.33333rem 0.5rem; +$label-radius: $global-radius; + +// 21. Media Object +// ---------------- + +$mediaobject-margin-bottom: $global-margin; +$mediaobject-section-padding: $global-padding; +$mediaobject-image-width-stacked: 100%; + +// 22. Menu +// -------- + +$menu-margin: 0; +$menu-margin-nested: 1rem; +$menu-item-padding: 0.7rem 1rem; +$menu-item-color-active: $white; +$menu-item-background-active: map-get($foundation-palette, primary); +$menu-icon-spacing: 0.25rem; + +// 23. Meter +// --------- + +$meter-height: 1rem; +$meter-radius: $global-radius; +$meter-background: $medium-gray; +$meter-fill-good: $success-color; +$meter-fill-medium: $warning-color; +$meter-fill-bad: $alert-color; + +// 24. Off-canvas +// -------------- + +$offcanvas-size: 250px; +$offcanvas-background: $light-gray; +$offcanvas-zindex: -1; +$offcanvas-transition-length: 0.5s; +$offcanvas-transition-timing: ease; +$offcanvas-fixed-reveal: true; +$offcanvas-exit-background: rgba($white, 0.25); +$maincontent-class: 'off-canvas-content'; +$maincontent-shadow: 0 0 10px rgba($black, 0.5); + +// 25. Orbit +// --------- + +$orbit-bullet-background: $medium-gray; +$orbit-bullet-background-active: $dark-gray; +$orbit-bullet-diameter: 1.2rem; +$orbit-bullet-margin: 0.1rem; +$orbit-bullet-margin-top: 0.8rem; +$orbit-bullet-margin-bottom: 0.8rem; +$orbit-caption-background: rgba($black, 0.5); +$orbit-caption-padding: 1rem; +$orbit-control-background-hover: rgba($black, 0.5); +$orbit-control-padding: 1rem; +$orbit-control-zindex: 10; + +// 26. Pagination +// -------------- + +$pagination-font-size: rem-calc(14); +$pagination-margin-bottom: $global-margin; +$pagination-item-color: $black; +$pagination-item-padding: rem-calc(3 10); +$pagination-item-spacing: rem-calc(1); +$pagination-radius: $global-radius; +$pagination-item-background-hover: $light-gray; +$pagination-item-background-current: $primary-color; +$pagination-item-color-current: foreground($pagination-item-background-current); +$pagination-item-color-disabled: $medium-gray; +$pagination-ellipsis-color: $black; +$pagination-mobile-items: false; +$pagination-mobile-current-item: false; +$pagination-arrows: true; + +// 27. Progress Bar +// ---------------- + +$progress-height: 1rem; +$progress-background: $medium-gray; +$progress-margin-bottom: $global-margin; +$progress-meter-background: $primary-color; +$progress-radius: $global-radius; + +// 28. Reveal +// ---------- + +$reveal-background: $white; +$reveal-width: 600px; +$reveal-max-width: $global-width; +$reveal-padding: $global-padding; +$reveal-border: 1px solid $medium-gray; +$reveal-radius: $global-radius; +$reveal-zindex: 1005; +$reveal-overlay-background: rgba($black, 0.45); + +// 29. Slider +// ---------- + +$slider-width-vertical: 0.5rem; +$slider-transition: all 0.2s ease-in-out; +$slider-height: 0.5rem; +$slider-background: $light-gray; +$slider-fill-background: $medium-gray; +$slider-handle-height: 1.4rem; +$slider-handle-width: 1.4rem; +$slider-handle-background: $primary-color; +$slider-opacity-disabled: 0.25; +$slider-radius: $global-radius; + +// 30. Switch +// ---------- + +$switch-background: $medium-gray; +$switch-background-active: $primary-color; +$switch-height: 2rem; +$switch-height-tiny: 1.5rem; +$switch-height-small: 1.75rem; +$switch-height-large: 2.5rem; +$switch-radius: $global-radius; +$switch-margin: $global-margin; +$switch-paddle-background: $white; +$switch-paddle-offset: 0.25rem; +$switch-paddle-radius: $global-radius; +$switch-paddle-transition: all 0.25s ease-out; + +// 31. Table +// --------- + +$table-background: $white; +$table-color-scale: 5%; +$table-border: 1px solid smart-scale($table-background, $table-color-scale); +$table-padding: rem-calc(8 10 10); +$table-hover-scale: 2%; +$table-row-hover: darken($table-background, $table-hover-scale); +$table-row-stripe-hover: darken($table-background, $table-color-scale + $table-hover-scale); +$table-striped-background: smart-scale($table-background, $table-color-scale); +$table-stripe: even; +$table-head-background: smart-scale($table-background, $table-color-scale / 2); +$table-head-row-hover: darken($table-head-background, $table-hover-scale); +$table-foot-background: smart-scale($table-background, $table-color-scale); +$table-foot-row-hover: darken($table-foot-background, $table-hover-scale); +$table-head-font-color: $body-font-color; +$table-foot-font-color: $body-font-color; +$show-header-for-stacked: false; + +// 32. Tabs +// -------- + +$tab-margin: 0; +$tab-background: $white; +$tab-background-active: $light-gray; +$tab-item-font-size: rem-calc(12); +$tab-item-background-hover: $white; +$tab-item-padding: 1.25rem 1.5rem; +$tab-expand-max: 6; +$tab-content-background: $white; +$tab-content-border: $light-gray; +$tab-content-color: foreground($tab-background, $primary-color); +$tab-content-padding: 1rem; + +// 33. Thumbnail +// ------------- + +$thumbnail-border: solid 4px $white; +$thumbnail-margin-bottom: $global-margin; +$thumbnail-shadow: 0 0 0 1px rgba($black, 0.2); +$thumbnail-shadow-hover: 0 0 6px 1px rgba($primary-color, 0.5); +$thumbnail-transition: box-shadow 200ms ease-out; +$thumbnail-radius: $global-radius; + +// 34. Title Bar +// ------------- + +$titlebar-background: $black; +$titlebar-color: $white; +$titlebar-padding: 0.5rem; +$titlebar-text-font-weight: bold; +$titlebar-icon-color: $white; +$titlebar-icon-color-hover: $medium-gray; +$titlebar-icon-spacing: 0.25rem; + +// 35. Tooltip +// ----------- + +$has-tip-font-weight: $global-weight-bold; +$has-tip-border-bottom: dotted 1px $dark-gray; +$tooltip-background-color: $black; +$tooltip-color: $white; +$tooltip-padding: 0.75rem; +$tooltip-font-size: $small-font-size; +$tooltip-pip-width: 0.75rem; +$tooltip-pip-height: $tooltip-pip-width * 0.866; +$tooltip-radius: $global-radius; + +// 36. Top Bar +// ----------- + +$topbar-padding: 0.5rem; +$topbar-background: $light-gray; +$topbar-submenu-background: $topbar-background; +$topbar-title-spacing: 1rem; +$topbar-input-width: 200px; +$topbar-unstack-breakpoint: medium; + diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css new file mode 100644 index 000000000..12f483c47 --- /dev/null +++ b/app/assets/stylesheets/application.css @@ -0,0 +1,392 @@ +/* + * This is a manifest file that'll be compiled into application.css, which will include all the files + * listed below. + * + * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets, + * or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path. + * + * You're free to add application-wide styles to this file and they'll appear at the bottom of the + * compiled file so the styles you add here take precedence over styles defined in any styles + * defined in the other CSS/SCSS files in this directory. It is generally better to create a new + * file per style scope. + * + *= require_tree . + *= require_self +require foundation_and_overrides + */ + +.this-i-dont-want { + width: 100%; + background-color: rgba(255, 255, 255, 0.6); +} + +.this-i-dont-want h1.main-title, .this-i-dont-want nav { + display: inline-block; +} + +.this-i-dont-want h1.main-title { + font-size: 4rem; + color: black; + font-family: 'Kaushan Script', Helvetica, sans-serif; + margin-left: 8%; + letter-spacing: 4px; + padding-bottom: 0.5%; + display: inline; +} + + +.this-i-dont-want nav { + font-size: 1.5rem; + color: black; + font-family: 'Open Sans Condensed', Helvetica, sans-serif; + margin-left: 45%; + padding-top: 2%; +} + +.this-i-dont-want nav ul li a { + color: black; + font-weight: 500; + letter-spacing: 2px; +} +.this-i-dont-want nav ul li a:hover { font-weight: 600; color: black;} + +.no-on-index { + opacity: 0; +} + +article.this-i-want { + /*background-image: url('pineapples.jpeg');*/ + background: url('salmon.jpg') no-repeat center center fixed; + -webkit-background-size: cover; + -moz-background-size: cover; + -o-background-size: cover; + background-size: cover; + font-family: 'Open Sans Condensed', sans-serif; + margin: 0; +} + +main { + height: 100%; + margin-bottom: 10%; +} + +main.home { + margin-bottom: 0; +} + + +.search-section { + text-align: center; + margin: 6% auto 25% auto; + padding: 2%; + background-color: rgba(255, 255, 255, 0.85); + width: 60%; +} +.search-button { + font-weight: 500; + font-size: 1rem; + letter-spacing: 2px; +} + +article.search-section h3.help-with, h2.welcome-message { + font-family: 'Kaushan Script', Helvetica, sans-serif; + letter-spacing: 3px; + padding-bottom: 2%; +} +h2.welcome-message { + letter-spacing: 5px; + text-transform: uppercase; +} + +.recipe-section { + background-color: rgba(255, 255, 255, 0.8); + margin: 1% 0; + padding: 0 1%; + text-align: center; +} + +.recipe-section a { + color: black; + letter-spacing: 1px; + font-family: 'Open Sans Condensed', sans-serif; + font-size: 1.5rem; +} + +.recipe-section a:hover { +text-decoration: underline; +} + +.page-numbers { + background-color: rgba(255, 255, 255, 0.8); + margin: auto; + width: auto; + text-align: center; + margin-top: 2%; +} + +.page-numbers li { + font-size: 1.5rem; + font-family: 'Open Sans Condensed', Helvetica, sans-serif; +} + +.page-numbers li:hover { + text-decoration: underline; + background-color: lightgray; + font-family: 'Open Sans Condensed', Helvetica, sans-serif; +} + +h3.search-term-styling { + font-family: 'Open Sans Condensed', Helvetica, sans-serif; + text-align: center; + margin: 2% auto; + border-bottom: 0.5px solid black; + padding-bottom: 1%; + letter-spacing: 3px; + width: 40%; +} + +h3.search-term-styling a { + color: black; +} +h3.search-term-styling a:hover { + color: black; + font-weight: 600; +} + +article.recipe-section { + position: relative; +} + +article div.recipe-title-background { + background: rgb(255, 255, 255); /* fallback color */ + background: rgba(255, 255, 255, 0.8) center center fixed; + position: absolute; + width: 80%; + height: 60%; + z-index: 5; + margin: 6% 6% 0 6%; + text-align: center; +} + +h4.recipe-title { + position: absolute; + top: 5%; + left: 0; + width: 90%; + color: black; + z-index: 3; +} +h4.recipe-title span { + /*letter-spacing: -1px;*/ + padding: 10px; +} + +.show-content { + margin-top: 4%; +} + +ul.no-decoration-list { + list-style-type: none; +} +ul.no-decoration-list li { + font-family: 'Open Sans Condensed', Helvetica, sans-serif; + font-size: 1.2rem; +} +.list-header { + font-family: 'Open Sans Condensed', Helvetica, sans-serif; + font-weight: bold; +} + + + + +footer { + background-color: rgba(255, 255, 255, 0.8); + display: block; + width: 100%; + margin-top: 5vh; + color: black; + vertical-align: middle; + font-weight: 200; + text-align: center; + position: fixed; + bottom: 0; + clear: both; +} + +footer p { + display: inline-block; + padding-top: 0.5%; + letter-spacing: 1px; +} + +footer p:first-of-type {margin-left: 2%; margin-right: 40%;} + + + + + +@media only screen and (max-width: 40em) { + + .this-i-dont-want h1.main-title { + font-size: 3rem; + margin-left: 5%; + letter-spacing: 2px; + } + + + .this-i-dont-want nav { + font-size: 1rem; + margin-left: 20%; + } + + + article.this-i-want { + height: 100%; + } + + + .search-section { + text-align: center; + margin: 6% auto 25% auto; + padding: 2%; + background-color: rgba(255, 255, 255, 0.85); + width: 80%; + } + + article.search-section h3.help-with, h2.welcome-message { + letter-spacing: 2px; + font-size: 1.2rem; + } + h2.welcome-message { + letter-spacing: 2px; + font-size: 1.5rem; + } + + h3.search-term-styling { + width: 80%; + margin-top: 8%; + margin-bottom: 5%; + font-size: 1.5rem; + } + + article div.recipe-title-background { + height: 70%; + } + + h4.recipe-title a { + font-size: 1.2rem; + } + + main { + height: 100%; + margin-bottom: 10%; + } + + + footer p { + display: inline-block; + padding-top: 0.2%; + font-size: 0.7rem; + } + + footer p img { + width: 40%; + } + + footer p:first-of-type { margin-right: 10%;} + + ul.pagination.page-numbers.page-numbers li { + font-size: 1rem; + display: inline-block; + } + + ul.pagination.page-numbers { + width: 100%; + } + +} + + + +@media only screen and (min-width: 40.063em) and (max-width: 64em) { + + .this-i-dont-want h1.main-title { + font-size: 3.4rem; + margin-left: 5%; + letter-spacing: 2px; + } + + + article.search-section h3.help-with, h2.welcome-message { + letter-spacing: 2px; + font-size: 1.6rem; + } + h2.welcome-message { + letter-spacing: 2px; + font-size: 2.2rem; + } + + + .this-i-dont-want nav { + font-size: 1.4rem; + margin-left: 30%; + } + + + article.this-i-want { + height: 100%; + } + + + .search-section { + text-align: center; + margin: 6% auto 25% auto; + padding: 2%; + background-color: rgba(255, 255, 255, 0.85); + width: 80%; + } + + + h3.search-term-styling { + width: 80%; + margin-top: 8%; + margin-bottom: 5%; + font-size: 1.8rem; + } + + article div.recipe-title-background { + height: 70%; + } + + h4.recipe-title a { + font-size: 1.4rem; + } + + main { + height: 100%; + margin-bottom: 10%; + } + + + footer p { + display: inline-block; + padding-top: 0.2%; + font-size: 0.9rem; + } + + footer p img { + width: 40%; + } + + footer p:first-of-type { margin-right: 10%;} + + ul.pagination.page-numbers.page-numbers li { + font-size: 1.2rem; + } + + ul.pagination.page-numbers { + width: 100%; + } + +} diff --git a/app/assets/stylesheets/foundation_and_overrides.scss b/app/assets/stylesheets/foundation_and_overrides.scss new file mode 100644 index 000000000..f60bbaf0f --- /dev/null +++ b/app/assets/stylesheets/foundation_and_overrides.scss @@ -0,0 +1,52 @@ +@charset 'utf-8'; + +@import 'settings'; +@import 'foundation'; + +// If you'd like to include motion-ui the foundation-rails gem comes prepackaged with it, uncomment the 3 @imports, if you are not using the gem you need to install the motion-ui sass package. +// +// @import 'motion-ui/motion-ui'; + +// We include everything by default. To slim your CSS, remove components you don't use. + +@include foundation-global-styles; +@include foundation-grid; +@include foundation-typography; +@include foundation-button; +@include foundation-forms; +@include foundation-visibility-classes; +@include foundation-float-classes; +@include foundation-accordion; +@include foundation-accordion-menu; +@include foundation-badge; +@include foundation-breadcrumbs; +@include foundation-button-group; +@include foundation-callout; +@include foundation-close-button; +@include foundation-drilldown-menu; +@include foundation-dropdown; +@include foundation-dropdown-menu; +@include foundation-flex-video; +@include foundation-label; +@include foundation-media-object; +@include foundation-menu; +@include foundation-menu-icon; +@include foundation-off-canvas; +@include foundation-orbit; +@include foundation-pagination; +@include foundation-progress-bar; +@include foundation-slider; +@include foundation-sticky; +@include foundation-reveal; +@include foundation-switch; +@include foundation-table; +@include foundation-tabs; +@include foundation-thumbnail; +@include foundation-title-bar; +@include foundation-tooltip; +@include foundation-top-bar; + +// If you'd like to include motion-ui the foundation-rails gem comes prepackaged with it, uncomment the 3 @imports, if you are not using the gem you need to install the motion-ui sass package. +// +// @include motion-ui-transitions; +// @include motion-ui-animations; diff --git a/app/assets/stylesheets/recipes.scss b/app/assets/stylesheets/recipes.scss new file mode 100644 index 000000000..1e10ffa50 --- /dev/null +++ b/app/assets/stylesheets/recipes.scss @@ -0,0 +1,3 @@ +// Place all the styles related to the recipes controller here. +// They will automatically be included in application.css. +// You can use Sass (SCSS) here: http://sass-lang.com/ diff --git a/app/controllers/application_controller.rb b/app/controllers/application_controller.rb new file mode 100644 index 000000000..d83690e1b --- /dev/null +++ b/app/controllers/application_controller.rb @@ -0,0 +1,5 @@ +class ApplicationController < ActionController::Base + # Prevent CSRF attacks by raising an exception. + # For APIs, you may want to use :null_session instead. + protect_from_forgery with: :exception +end diff --git a/app/controllers/concerns/.keep b/app/controllers/concerns/.keep new file mode 100644 index 000000000..e69de29bb diff --git a/app/controllers/recipes_controller.rb b/app/controllers/recipes_controller.rb new file mode 100644 index 000000000..17e6343dc --- /dev/null +++ b/app/controllers/recipes_controller.rb @@ -0,0 +1,38 @@ +require "#{Rails.root}/lib/edamam-wrapper.rb" +require "#{Rails.root}/lib/Recipe.rb" + +class RecipesController < ApplicationController + def index + @background_image = true + @all_health = ["vegan", "vegetarian", "paleo", "dairy-free", "gluten-free", "wheat-free", "fat-free", "low-sugar", "egg-free", "peanut-free", "tree-nut-free", "soy-free", "fish-free", "shellfish-free"] + end + + def search(page=0) + @background_image = false + @search_term = params[:search_term] + @filters = params["healthLabels"] + + page = params[:page] + + first_hit = "#{page}0".to_i + last_hit = "#{page.to_i + 1}0".to_i + + unless @search_term == nil + if @filters == nil + @data = EdamamWrapper.find_recipes(@search_term, first_hit, last_hit) + else + @data = EdamamWrapper.find_recipes(@search_term, first_hit, last_hit, @filters) + end + else + @data = nil + end + + end + + def show + @background_image = false + @params = params[:uri] + "." + params[:format].gsub(/#/,'%23') ### This may look unnecessary but trust me, it was + @recipe = Recipe.find(@params) + end + +end diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb new file mode 100644 index 000000000..de6be7945 --- /dev/null +++ b/app/helpers/application_helper.rb @@ -0,0 +1,2 @@ +module ApplicationHelper +end diff --git a/app/helpers/recipes_helper.rb b/app/helpers/recipes_helper.rb new file mode 100644 index 000000000..f526316e2 --- /dev/null +++ b/app/helpers/recipes_helper.rb @@ -0,0 +1,2 @@ +module RecipesHelper +end diff --git a/app/mailers/.keep b/app/mailers/.keep new file mode 100644 index 000000000..e69de29bb diff --git a/app/models/.keep b/app/models/.keep new file mode 100644 index 000000000..e69de29bb diff --git a/app/models/concerns/.keep b/app/models/concerns/.keep new file mode 100644 index 000000000..e69de29bb diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb new file mode 100644 index 000000000..94f764e44 --- /dev/null +++ b/app/views/layouts/application.html.erb @@ -0,0 +1,31 @@ + + +
+ + + +<%="Favorite" if @recipe.first[:bookmarked] == true %>
+ +<%= ingredient %>
You may have mistyped the address or the page may have moved.
+If you are the application owner check the logs for more information.
+Maybe you tried to change something you didn't have access to.
+If you are the application owner check the logs for more information.
+If you are the application owner check the logs for more information.
+