I want to use different views for my platform on mobile devices depending on page orientation (portrait vs landscape).
Is there a way how this could work:
<div class="row item-list-video">
<% for program in #programs %>
<% if (stylesheet_link_tag "global", :media => "only screen and (max-width: 990px)") %>
<%= render partial: 'program_preview_landscape',locals: { program: program} %>
<% else %>
<%= render partial: 'program_preview',locals: { program: program} %>
<% end %>
<% end %>
</div>
I am not sure about how this part is working:
if (stylesheet_link_tag "global", :media => "only screen and (max-width: 990px)")
My thoughts were that stylesheet_link_tag is the file name of the .css where the media queries are defined. But what I get is:
Asset was not declared to be precompiled in production.
Add Rails.application.config.assets.precompile += %w( global.css ) to config/initializers/assets.rb and restart your server
The program_preview_landscape loads this code:
<div class="col-md-3 col-sm-6 col-xs-3 program-thumbnail-landscape">
<a href="/shows/<%= program.slug %>">
<img src="<%= program.thumbnail_uri %>">
</a>
</div>
While the program_preview loads this:
<div class="col-md-3 col-sm-6 col-xs-6 program-thumbnail">
<a href="/shows/<%= program.slug %>">
<img src="<%= program.thumbnail_uri %>">
</a>
</div>
You can't read the media query from an ERB, because the media width is only calculated in the browser after the HTML is delivered, and by then the ERB has already been rendered. The usual approach to this sort of thing is to have your ERB generate HTML with semantic markup — the same HTML for both desktop and mobile — and then use CSS media queries to apply different styles depending on the screen width.
Related
I only see an icon, and not the real image (also on the index page).
제목:<%= #food.title %> <br> <br>
<img src="<%= #food.image %>"><br> <br>
내용:<%= #food.content %> <br> <br>
<form action="/food/edit/<%= #food.id %>"> <input type="submit" value="수정"></form>
<form action="/food/destroy/<%= #food.id %>"> <input type="submit" value="삭제"></form>
I don't understand how an image can be saved in the database. I found a method that saves a url, but I upload the image file usually. I made an input tag that has the file type. How can I save the image? I have installed carrierwave.
What is #food.image? Is it a url, or the image itself? If it is a url, <img src="<%= #food.image %>"> should work. If it is the image itself, perhaps uploaded by carrierwave, you should use <%= image_tag(#food.image) %>.
I'm not sure what your Food model looks like, but try this (since you are using CarrierWave, add .url):
<img src="<%= #food.image.url %>"><br> <br>
or:
<%= image_tag #food.image.url %>
The icon you are seeing is the default icon shown by the browser if the image path is not found.
Reference: CarrierWave ActiveRecord
Not sure why this line is not working
CONTROLLER
#images = {
"Example1" => "ExampleA",
"Example2" => "ExampleB",
}
VIEW
<% #images.each do |image, caption| %>
<div class ="fill" style="background-image: url(<%= asset_path '#{image}.jpg' %>);">
<div class="caption">
<h2><%= "#{caption}" %></h2>
</div>
</div>
<% end %>
When I look at the output, somehow the HTML being rendered for the background image is:
<div class="fill" style="background-image: url(/#{image}.jpg);">
As general practice, my understanding is that the interpolation tags, either <% or <%=, should be as close to the Ruby code as possible (e.g, within HTML tags, or in the example of the background-image: url above)
Interpolation works with double quotes, not single quotes.
Change
style="background-image: url(<%= asset_path '#{image}.jpg' %>);"
To
style='background-image: url(<%= asset_path "#{image}.jpg" %>);'
or
style="background-image: url(<%= asset_path image %>.jpg);"
I am sorry for my bad english. I just try to description my question. :)
I have an application layout that have a yield for display post in body. I have another yield :footerpost3 for display title of recent post on the footer.
When I in localhost:3000, the yield :footerpost3 display a recent of title correctly. but when i am click a post link, which is the url is localhost:3000/posts/3, the yield :footerpost3 display nothing.
Here is my code:
app/views/layout/application.html.erb
<!-- begin footer comment widget -->
<div class="footer_list widget_recent_comments">
<div class="title"><h5>Artikel Terkini</h5></div>
<%= yield :footerpost3 %>
</div>
<!-- end footer comment widget -->
app/views/store/index.html.erb
<% content_for :footerpost3 do %>
<% #postsMain.each do |dopostAll| %>
<div class="entry">
<ul>
<li class="recentcomments"><%= link_to dopostAll.title, dopostAll %></li>
</ul>
</div>
<% end %>
<% end %>
i hope my question is easy to understand.. :)
Looks like your root url is stores#index .
You must be initializing #postsMain in the stores#index action and generating the content_for footerpost3 in stores/index.html.erb.
When you click on a post, you will be taken to posts#show page. So you have to initialize #postsMain even in posts#show action and generate the content for footerpost3 even in posts/show.html.erb
The answer is there in your question. You are defining the "content for" footerpost3 in that block, which exists in index.html.erb. When you're on /posts/3, index.html.erb is not rendered, but rather show.html.erb is.
To solve this, you'd need to add the content in the show.html.erb template as well.
You could solve this in multiple ways. Using nested layouts would be one. For example, you might create a posts layout at app/views/layout/posts.html.erb, like so:
<% content_for :footerpost3 do %>
<% #postsMain.each do |dopostAll| %>
<div class="entry">
<ul>
<li class="recentcomments"><%= link_to dopostAll.title, dopostAll %></li>
</ul>
</div>
<% end %>
<% end %>
<%= render :file => 'layouts/application' %>
In this way, all the views of your PostsController would use this layout, which simply adds your footer content, then renders the application_layout.
What I want to do is make it just output the view itself, and ignore what Rails would normally think is embedded Ruby within the HTML.
For example:
<div class="current">
<div class="question">
<h3 id="homework_name"><%= homework.name %><h3 id="due">Due <%= homework.due %></h3></h3>
<h2 class="title">The Question:</h2>
<p id="question_contents"class="contents"><%= current_question.contents</p>
</div>
<div class="answer">
<h2 class="title">Your Answer:</h2>
<textarea class="contents" id="student_answer"><%= current_question.answer %></textarea>
</div>
</div>
I want an ActionView Template Handler to ignore all mentions of:
<%= homework.name %>
<%= homework.due %>
<%= current_question.contents %>
<%= current_question.answer %>
More specifically, it should ignore any tags starting with <% and ending with %>
If you need more info check out http://pastie.org/private/epsxnapldho6co2y0indg
Here you go https://gist.github.com/1144297
And use .html.lifo extensions for your templates.
my autocomplete call is showing nothing right now, because the div that i am inserting the ul into has its style set to display:none. using firebug, i can see the results are returned in a proper unordered list tag and when i edit the html from the firebug console and remove the style="display:none;", i see the autocomplete results. i added css for the autocomplete tags that are generated but this is getting overwritten by prototype 1.6.1/scriptaculous 1.8.3. also, i'm using rails 1.2.2
here is the code from my view:
<script type="text/javascript">
new Ajax.Autocompleter("autocomplete", "autocomplete_choices", "/campaigns/title_list", {tokens: ',', paramName: 'title'});
</script>
<input type="text" id="autocomplete" name="autocomplete_parameter"/>
<div id="autocomplete_choices" class="autocomplete"></div>
and here my controller action and partial:
def title_list
camp_title = params[:title]
#titles = Campaign.find(:all, :conditions => ["title ilike ?", "%#{camp_title}%"], :select => :title).collect { |camp| camp.title }
render :partial => "title_list"
end
_title_list.rhtml
<ul>
<% #titles.each do |t| %>
<li> <%= t %> </li>
<% end %>
</ul>
here's what i seen in firebug:
<div style="display: none; position: absolute; left: 8px; top: 123px; width: 155px;" id="autocomplete_choices">
<ul>
<li class="selected"> DirecTV Defender (Best Deal Ever) </li>
<li class=""> Defender DirecTV </li><li class=""> DirecTV Defender - Collections </li>
<li class=""> Defender DirectTV (Gotham Direct) </li>
</ul>
</div>
any suggestions would be greatly appreciated.
-h
You need to go into the auto_complete helper (inside the vendor directory) and change the line items.uniq to items.uniq.join
The reason is a change in the to_s behavior of Arrays in Ruby 1.9. Worked fine for me like this.