Friday, March 28, 2014

Sort Issue Solved

The content_tag is not working because it adds a begin and end tag <div> </div>
http://apidock.com/rails/ActionView/Helpers/TagHelper/content_tag

app/helpers/application_helper.rb 
changed the name of the is_sorted? method to sort_active?

scope - within the context of this thing (limited vision) (This is not JQuery)

all enumerable objects respond to each

each wants an array

Method any? http://apidock.com/ruby/Enumerable/any%3F
any?() public
Passes each element of the collection to the given block. The method returns true if the block ever returns a value other than false or nil. If the block is not given, Ruby adds an implicit block of {|obj| obj} (that is any? will return true if at least one of the collection members is not false or nil.
%w{ant bear cat}.any? {|word| word.length >= 3}   #=> true
%w{ant bear cat}.any? {|word| word.length >= 4}   #=> true
[ nil, true, 99 ].any?                            #=> true
if params[:scopes] array (what is this calling?)
  params is a query string  in a url or any data passed through the url- gets turned into a hash in ruby named params  (url decoder)

Find list-group-item in bootstrap
http://getbootstrap.com/components/#list-group Contextual classes
Use contextual classes to style list items, default or linked. Also includes .active state.
We used the class list-group-item-success and it is already styled!


app/helpers/application_helper.rb
  def will_collapse?
    unless params[:scopes]
      " collapse"
    end
  end

  def sort_active?(current_scope)
    if params[:scopes] && params[:scopes].any? { |scope| scope == current_scope }
      "list-group-item-success"
    end
  end

  if params[:scopes] &&  if it is nil or ...

app/views/crowdshops/_sidebar_sort.html.erb 
<ul class="list-group panel-collapse <%= will_collapse? %>">
  <li class="list-group-item <%= sort_active?("popular") %>">
    <%= link_to "Popular", crowdshop_path(crowdslug, scopes: ["popular"]) %>
  </li>
  <li class="list-group-item <%= sort_active?("recent") %>">
    <%= link_to "Recent", crowdshop_path(crowdslug, scopes: ["recent"]) %>
  </li>
  <%= render partial: "sidebar_tag", collection: current_crowdshop.tags.uniq %>
</ul>

commit message:
Highlight sort box in the sidebar to differentiate
Highlight sort box in the sidebar to differentiate the tag so that the user knows how the products are currently being sorted.

Creates two helper methods
  is_active?
    embeds code into the view which adds the class list-group-item-success
  will_collapse?
    makes sure the panel remains open (not collapsing) after sort

Uses the class list-group-item-success which changes the background-color of the sort parameter so the user can identify that the items have been sorted.

  modified:   app/helpers/application_helper.rb 
modified: app/views/crowdshops/_sidebar_sort.html.erb

Thursday, March 27, 2014

Scopes -Sort Issue

The issue I am working on (still)
When the user sorts for say the products, most recent or whatever;
there is no real indicator that you are on the sorted "page."

Questions:

1. Can this be handled in the css?

No, you need helper methods.

I had tried adding a bunch of changes in the CSS to little avail. I am not a css expert but I think I fiddled around with it enough that I am coming to the conclusion that this is NOT how to solve this issue.
I did learn about first-child and last-child
http://www.w3schools.com/cssref/tryit.asp?filename=trycss_sel_firstchild
p:first-childd
{
background-color:yellow;
}

2. Is it actually a new page when you sort?

No, it using same page template but it is passing a variable into the application to alter the view.

When you sort for the product the url changes
from: http://example-co.webrand.dev:3000/crowdshops
to:     http://example-co.webrand.dev:3000/crowdshops/a-simple-crowdshop?scopes%5B%5D=popular

In the Gemfile there is the gem "jquery-rails", "~> 3.0"
I am watching a RailsCast on Jquery to see if this gives me a clue.
 http://railscasts.com/episodes/136-jquery

https://github.com/rails/jquery-ujs
 Interesting, Andre Arco from the Bundler core team is a contributer of the write of this gem. :)

I had looked at this article yesterday but it doesn't really answer my questions and is so advanced I'm not really sure what he is saying through most of the article. http://robots.thoughtbot.com/a-tour-of-rails-jquery-ujs

I think it might be a change in the javascript but I can't find a good tutorial about jquery-rails to help me know what to do.

Ashok asked me: Is scopes an array? What does ?scopes%5B%5D=popular mean
We put it in a url decoder: http://meyerweb.com/eric/tools/dencoder/
It returned: Ashok asked me: ?scopes[]=popular
? Are you adding the claases for sorting from the template or via Javascipt. ?


app/assets/javascripts/crowdshop.js
$(document).ready(function() {
  $("#order_confirmation_modal").modal();
  $("#submission_confirmation_modal").modal();
  $('.collapse').on('show.bs.collapse', function () {
   $('.panel-title i').removeClass( "fa-chevron-down" ).addClass( "fa-chevron-up" );
  })
  $('.collapse').on('hide.bs.collapse', function () {
   $('.panel-title i').removeClass( "fa-chevron-up" ).addClass( "fa-chevron-down" );
  })
})

  def with_dynamic_scoping(scope)
    if params[:scopes]
      scope.oscoping(params[:scopes], params[:scope])
    else
      scope
    end
  end

params is the url parameter ?scopes[]=popular

Railscast 228

app/controllers/crowdshops_controller.rb

  def with_dynamic_scoping(scope)
    if params[:scopes]
      scope.oscoping(params[:scopes], params[:scope])
    else
      scope
    end
  end

GOES WITH:

app/models/design.rb

  def self.oscoping(functions, arguments = {})
    functions.inject(self) do |query, function|
      if arguments && arguments[function]
        query.send(function, *arguments[function])
      else
        query.send(function)
      end
    end
  end



inject maps a function to run across all the elements or a subset of elements in the array

in this case it takes the params array

http://stackoverflow.com/questions/710501/need-a-simple-explanation-of-the-inject-method

what is .send ??
http://ruby-doc.org/core-1.9.3/Object.html#method-i-send

oscoping object scope?

  def self.oscoping(functions, arguments = {})
    functions.inject(self) do |query, function|
      if arguments && arguments[function]
        query.send(function, *arguments[function])
      else
        query.send(function)
      end
    end
  end

def self.whatever
http://www.jimmycuadra.com/posts/self-in-ruby

In the context of a class, self refers to the current class, which is simply an instance of the class Class. Defining a method on self creates a class method.

main difference def self.method is that you have to behavior within the scope of the variable
while def method is global

grepped for with_dynamic_scoping

app/controllers/crowdshops_controller.rb


  def with_dynamic_scoping(scope)
    if params[:scopes]
      scope.oscoping(params[:scopes], params[:scope])
    else
      scope
    end
  end

 def show
    @_designs = with_dynamic_scoping(@_crowdshop.designs.approved).includes(:account)

  end

grepped for @_crowdshop

scope is an instance of the design varible
params[:scopes] is an array variable

def methods for what page we are on and what parameters we are passing

<%= debug(params[:scopes]) %>
<&= inspect ??? google

content_tag 
http://apidock.com/rails/ActionView/Helpers/TagHelper/content_tag

Wednesday, March 26, 2014

Scopes and Slugs

I am still working on the sort issue but I ran into the words scope and slug and I am trying to get a grip on what they are doing.

app/controllers/application_controller.rb
 def slug
    Apartment::Database.current
  end

  def crowdslug
    @_crowdshop.slug
  end
  helper_method :crowdslug

  def slugged?
    slug != "public"
  end

  def find_company
    @_company = Company.where(slug: slug).first
  end

db/schema.rb line: 115
  create_table "companies", force: true do |t|
    t.string   "slug"
    t.string   "name"
    t.integer  "account_id"
    t.datetime "created_at"
    t.datetime "updated_at"
    t.boolean  "enabled",    default: false
    t.string   "password",   default: "",    null: false
  end

  add_index "companies", ["account_id"], name: "index_companies_on_account_id", using: :btree
  add_index "companies", ["name"], name: "index_companies_on_name", using: :btree
  add_index "companies", ["slug"], name: "index_companies_on_slug", unique: true, using: :btree

config/initializers/apartment.rb
Apartment.configure do |config|
  config.excluded_models = [
    "Company",
    "Account",
    "Product",
    "Variation",
    "Tax",
    "CrowdshopsProduct",
    "PaperTrail::Version"
  ]

  config.use_schemas = true

  # config.default_schema = "excluded"

  # configure persistent schemas (E.g. hstore )
  # config.persistent_schemas = [ "public" ]

  # supply list of database names for migrations to run on
  config.tenant_names = -> { Company.pluck(:slug) }
end

Tuesday, March 25, 2014

The DOM

DOM
The Document Object Model (DOM) is an API for manipulating HTML and XML documents. It provides a structural representation of the document, enabling you to modify its content and visual presentation by using a scripting language such as JavaScript.
https://developer.mozilla.org/en-US/docs/DOM


The Document Object Model (DOM) is a cross-platform and language-independent convention for representing and interacting with objects in HTML, XHTML and XML documents.[1] Objects in the DOM tree may be addressed and manipulated by using methods on the objects. The public interface of a DOM is specified in its application programming interface (API). The history of the Document Object Model is intertwined with the history of the "browser wars" of the late 1990s between Netscape Navigator and Microsoft Internet Explorer, as well as with that of JavaScript and JScript, the first scripting languages to be widely implemented in the layout engines of web browsers.
http://en.wikipedia.org/wiki/Document_Object_Model

DOM elements
http://ejohn.org/blog/html-5-data-attributes/