ruby on rails: ch10: different output in console/ch 11 -dfferent output - ruby-on-rails

I have different output for ch 11 Michael Harti tutorial.
Micro posts are located diagonally but not from top to button as shown on picture.
part of custom.css file as below from his tutorial:
What cause this not formatted output?
/* microposts
.microposts {
list-style: none;
padding: 0;
li {
padding: 10px 0;
border-top: 1px solid #e8e8e8;
}

On the same page in the tutorial, it says to create this method in the model...
private
def create_activation_digest
# Create the token and digest.
end
It sounds like you didn't do that... or maybe you mis-spelled the method name.

Related

Datatable (without pagination) > missing parameters in form submit

#3 EDIT => CAUSE FOUND!
So I found that what is causing the issue is Datatable. Even if I'm not using pagination, Datatable is limiting the number of rows the form can POST.
jQuery('#tblStats').DataTable( {
dom: 'ft',
ordering: false,
jQueryUI: true,
scrollY: "400px",
deferRender: true,
scroller: true,
scrollCollapse: true,
language: {
search: "<%= t('app.bouton.filter') %>",
infoEmpty: "<%= t('app.datetables.sZeroRecords') %>"
}
});
Any ideas on how to avoid that limit and continue using Datatable?
I've already tried this but still the same:
https://www.gyrocode.com/articles/jquery-datatables-how-to-submit-all-pages-form-data/
Thanks!
INITIAL MESSAGE
I'm having a hard time trying to figure out why I have some missing parameters when submitting a form.
Inside the form there is a table that is dynamically populated. 10 parameters are sent for each row. The submit works fine with small data but it seems to have a limit at 1898 parameters. Some times the parameters of the first 5 or 6 rows are missing and some times are the parameters of the last rows. This is totally random. But the limit seems to be always the same: no more than 1898 parameters are sent.
I get no error at all. The parameters are just not sent. This is happening in production server as well than in development server. The servers are different and the OS is different as well.
Rails version is 2.3.18. Ruby version is 1.8.7.
Does anyone have any idea of what's going on?
Thanks in advance for your help!
#1 EDIT
Following the advice of Oshanz I have found passenger's config file. In my case:
$>/home/alberto/.rvm/gems/ree-1.8.7-2012.02#dev/gems/passenger-4.0.37/resources/templates/standalone/config.erb
In the file there is a parameter "client_max_body_size" inside the http{}. It has a default value of 1048m. Even if this seems big enough I have changed it to 2048m.
Unfortunately this didn't work and the result is still the same.
#2 EDIT
So I'm still having the problem.
As I commented below I'm using a form_remote_tag with a dynamically populated table inside. This will submit using XMLHttpRequest in the background instead of the regular reloading POST arrangement.
This generates:
<form action="/wizi_comm/stats" method="post" onsubmit="Element.hide('err');Element.show('spinner');; new Ajax.Request('/wizi_comm/stats', {asynchronous:true, evalScripts:true, onComplete:function(request){Element.hide('spinner');Element.show('mainBd');}, parameters:Form.serialize(this)}); return false;">
I have also tested using form_tag and the result is the same. Some parameters are just not sent.
<form action="stats" method="post">
I have check passenger's config files with no luck. I do really need some ideas here:
Do you think this is due to a configuration somewhere?
Do you think I should change the way I'm submitting the form?
Thanks in advance for your help!
SOLUTION
I did some tests with Datatable's based solutions as rows().data(). I was still missing some rows. I was also getting some errors from the API.
At this point I think that other JS libraries on the project are interfering with jQuery. I will study this when I will have the time.
What I finally did is to remove Datatable's initialisation on the table and to use a pure CSS solution to do the scroll. If someone is interested, my solution is based on this:
Pure CSS solution scroll table
table.scroll {
width: 716px; /* 140px * 5 column + 16px scrollbar width */
border-spacing: 0;
border: 2px solid black;
}
table.scroll tbody,
table.scroll thead tr { display: block; }
table.scroll tbody {
height: 100px;
overflow-y: auto;
overflow-x: hidden;
}
table.scroll tbody td,
table.scroll thead th {
width: 140px;
border-right: 1px solid black;
}
table.scroll thead th:last-child {
width: 156px; /* 140px + 16px scrollbar width */
}
table.scroll thead tr th {
height: 30px;
line-height: 30px;
/*text-align: left;*/
}
table.scroll tbody { border-top: 2px solid black; }
table.scroll tbody td:last-child, thead th:last-child {
border-right: none !important;
}
Thanks again for your help !

"Download our App" notification on mobile devices

Can someone please enlighten me how those notifications work? I was searching some infos about it but no luck. Don't know if I name it right.
On some pages there is this popup to download site's mobile application. It contains X close button and Download App button. For iOS devices it always looks the same, so I figured it's not custom made. Does it come somehow from app store?
Here is the picture: http://oi60.tinypic.com/2dmhymc.jpg
This is called a "Smart App Banner" and can easily be added to your site using an extra meta tag:
<meta name="apple-itunes-app" content="app-id=myAppStoreID, affiliate-data=myAffiliateData, app-argument=myURL">
You can include three comma-separated parameters in the content attribute:
app-id Required
Your app's unique identifier. To find your app ID from the iTunes Link Maker, type the name of your app in the Search field, and select the appropriate country and media type. In the results, find your app and select iPhone App Link in the column on the right. Your app ID is the nine-digit number in between id and ?mt.
affiliate-data Optional
Your iTunes affiliate string, if you are an iTunes affiliate. If you are not, find out more about becoming an iTunes affiliate at http://www.apple.com/itunes/affiliates/.
app-argument Optional
A URL that provides context to your native app. If you include this, and the user has your app installed, she can jump from your website to the corresponding position in your iOS app. Typically, it is beneficial to retain navigational context because:
If the user is deep within the navigational hierarchy of your website, you can pass the document’s entire URL, and then parse it in your app to reroute her to the correct location in your app.
If the user performs a search on your website, you can pass the query string so that she can seamlessly continue the search in your app without having to retype her query.
If the user is in the midst of creating content, you can pass the session ID to download the web session state in your app so she can nondestructively resume her work.
You can generate the app-argument of each page dynamically with a server-side script. You can format it however you'd like, as long as it is a valid URL.
Note: You cannot display Smart App Banners inside of a frame. Banners won’t appear in the iOS Simulator.
Source and more info
Here is a styled dropdown banner that I designed that detects mobile platforms.
HTML
<div id="note">
<p>It is recommended that you use landscape mode for a better experience (Turn your phone sideways).</p>
<a id="close">[Dismiss]</a>
Javascript
if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|BB|PlayBook|IEMobile|Windows Phone|Kindle|Silk|Opera Mini/i.test(navigator.userAgent)) {
document.getElementById("note").style.visibility = "block";}
close = document.getElementById("close");
close.addEventListener('click', function() {
note = document.getElementById("note");
note.style.display = 'none';
}, false);
CSS
#note {
visibility: hidden;
font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
color: white;
position: absolute;
z-index: 101;
top: 0;
left: 0;
right: 0;
background: #000000;
text-align: center;
line-height: 2.5;
overflow: hidden;
-webkit-box-shadow: 0 0 5px black;
-moz-box-shadow: 0 0 5px black;
box-shadow: 0 0 5px black;}
#-webkit-keyframes slideDown {
0%, 100% { -webkit-transform: translateY(-50px); }
10%, 90% { -webkit-transform: translateY(0px); }}
#-moz-keyframes slideDown {
0%, 100% { -moz-transform: translateY(-50px); }
10%, 90% { -moz-transform: translateY(0px); }}
.cssanimations.csstransforms #note {
-webkit-transform: translateY(-50px);
-webkit-animation: slideDown 2.5s 1.0s 1 ease forwards;
-moz-transform: translateY(-50px);
-moz-animation: slideDown 2.5s 1.0s 1 ease forwards;}
.cssanimations.csstransforms #close {
display: none;}

Conditionally load Sass stylesheets with variable overrides

In our app, we have different clinics, and all patient pages are nested under a clinic, which has branding. We have 100+ clinics, so I'd rather not have something like = stylesheet_link_tag #{#clinic.name}_theme in my application.html.haml file, and have a theme file that's like
// clinic_a.css.sass
a
color: red
// clinic_b.css.sass
a
color: blue
I'd rather use color variables throughout all my Sass files, then define those variables in separate sheets that get called based on the clinic (found by the params, say). So:
// application.css.sass
a
color: $link_color
h1
color: $neutral_color
// clinic_a.css.sass
$link_color: #faa
$neutral_color: #ccc
// clinic_b.css.sass
$link_color: #96c7c7
$neutral_color: #bababa
The issue is, it seems like the variables have to come first in the asset pipeline, so they'd have to be declared before the other files in my application.css.sass file. But obviously, that file doesn't have access to params or anything.
How can I decide which variables file to load based on params, which will then get evaluated all over my application.css.sass file, and files included in that?
Edit
Just to be clear, this would have to work with Rails's asset pipeline.
I wouldn't load different stylesheets, I would use the #if function inside sass to conditionally assign variables:
EXAMPLE
p {
#if 1 + 1 == 2 { border: 1px solid; }
#if 5 < 3 { border: 2px dotted; }
#if null { border: 3px double; }
}

Asp.Net MVC 4 Generic Element

Sorry for the generic title, but i dont know how to call the element i want to create. Thats what i need... i tried to post image, but i dont get necessary privileges yet. So ill try to describe it.
Here on stackoverflow, on the question's page, after each title and summary there are some boxes displaying the tags from the questions.
I want the exactly same look, but instead of links, those boxes should act the same way as a Radio Button List. I can only choose one of then at a time and when pick one, the selected one ill get different style added to him. After submitting the form i should be able to recover de selected item in the controller.
I'm using Asp.Net MVC4 and the options that make the element will come from a controller.
Sorry for the question without code or something that i allready make. But i have this necessity and i dont even know if this sort of style or element have an specific name or keyword D.
Do you guys know from where to start with something (tutorials with similar final result ?) ?
Thanks for the help and sorry for the bad english.
Code After Looking at the proposed answers' link
CSS Code
input[type=radio] { display: none;}
.rbLista span { font-family: "Lucida Grande","Lucida Sans Unicode",Arial,Helvetica,Sans-serif;
font-size:12px; background: RGB(217,217,217); border: 1px solid RGB(217,217,217); }
.rbLista span:hover { border: 1px solid RGB(54,52,53); background: RGB(54,52,53); color: white; }
.rbLista input[type=radio]:checked + span { background: #D71712; color: #fff; border: 1px solid #D71712; }
.rbLista input[type=radio]:checked + span:hover { background: #D71712; }
and View Code
<section class="rbLista">
#foreach (var item in Model.ChamadoDetalhe.Transitos)
{
<label>
#Html.RadioButtonFor(x => x.NovoTransito.Transito, #item.Text, new { #id = item.Text, #text = item.Text })<span>#item.Text</span>
</label>
}
#Html.ValidationMessageFor(x => x.NovoTransito.Transito)
</section>
You could try something like this. Here's a working demo.

Using qTip2 with Ruby on Rails

I found this wonderfull tooltip called qTip2. Loving it so far but has gotten myself into a problem using it.
I was able to install and get qTip2 running with my Rails 3.1 setup. However I'm running into a problem when I'm using qTip2's ajax functionality.
qTip2 ajax request requires a link to the script to be executed before displaying it in the tooltip content div (which is automatically generated by qTip2). You can look at the code I'm referring to here.
http://www.craigsworks.com/projects/qtip2/demos/#ajax
The problem with it is that it does not really go well with RoR. An ajax request declared using RoR is more explicit, where I can explicitly tell rails which div id I would like to update.
Given the following circumstances I needed to do the following things:
the tooltip content must be dynamic
I needed to use the qTip2 ajax functionality so that I could create a custom layout for the tooltip content.
I did try the followings though:
Put the html snippet to be loaded to the content div in the public folder. The content loaded with the right format but I can't have dynamic content. html.erb files didn't seem to work in this folder. Is there any alternative to this folder that would work but with dynamic content?
Tried to use qTip2 ajax request with RoR but was not successful. What I did was I tried to explicitly define the ajax update id in the .js respond file (going through the controller and views etc.). But figuring out the exact id that was generated by qTip2 plugin was a little too overwhelming for me.
here is what I have
html
<a id="editor1" href="/deals_details.html.erb">
javascript
$(document).ready(function()
{
$('#editor1').each(function()
{
$(this).qtip(
{
content: {
text: '<img class="throbber" src="/assets/throbber.gif" alt="Loading..." />',
ajax: {
/*once: false*/
url: $(this).attr('href')
},
title: {
text: 'qTip2 Test',
button: true
}
},
position: {
at: 'center',
my: 'center',
viewport: $(window),
},
show: {
event: 'click',
solo: true
},
hide: 'unfocus',
style: {
classes: 'ui-tooltip-wiki ui-tooltip-light ui-tooltip-shadow'
}
})
})
// Make sure it doesn't follow the link when we click it
.click(function(event) { event.preventDefault(); });
});
CSS
.ui-tooltip-wiki{
max-width: 440px;
}
.ui-tooltip-wiki .ui-tooltip-content{
padding: 10px;
line-height: 12.5px;
}
.ui-tooltip-wiki h1{
margin: 0 0 7px;
font-size: 1.5em;
line-height: 1em;
}
.ui-tooltip-wiki img{ padding: 0 10px 0 0; }
.ui-tooltip-wiki p{ margin-bottom: 9px; }
.ui-tooltip-wiki .note{ margin-bottom: 0; font-style: italic; color: #888; }
Please help me!! :) Apology if this post looks stupid, this is my first question on stackoverflow.
I think you're making it too complicated. The qTip ajax functionality simply requests a URL, and the return value is HTML content within a div tag. If you look at the source of the demo you mentioned, you'll see a request for http://www.craigsworks.com/projects/qtip2/data/burrowingowl.php. If you look at what that produces, it is simply a div tag with some content (the style looks different because it is further transformed by the page's CSS).
So the question becomes: can you provide your dynamic content in a div in response to a URL in Rails? Of course! Perhaps you want to set up a SnippetController with a show action and then using pretty standard Rails conventions/routes your URL might be /snippet/show/[ID] and you simply have the view produce the required div content.

Resources