There are HTML-file that contains JavaScript code. This JavaScript code loads an image and positioning it in a certain place. If failed, a message displays.
I need to include this file in template Slim.
I can include one Slim template to another by the following:
=render 'some/path/some_pattern'
How to include HTML- file to my template Slim?
The best way to add some javascript to your slim file is either by including the javascript file using
= javascript_include_tag 'name of the file'
or by directly adding the javascript code to your slim file, using
javascript:
code line 1
code line 2
...
Related
Why naming convention of views files in rails are considered as action.html.erb only ( instead of action.erb.html ) ?
What will happen if we write views files as action.erb.html ?
What will happen if we write views files as action.erb.html?
The first thing that will happen is that the Ruby syntax highlighting in your editor will stop working as the file extension is now .html instead of .erb. On almost every file system in use the file extension is the rightmost part of the file name.
The second thing that will happen is that Rails will no longer be able to lookup the template and even if it could it would no longer process it through ERB as it no longer has the .erb file extension.
.html is just a segment of the file name that lets the rails template resolver distinguish between templates for different formats when looking up a template for a given request format. Its not really technically part of the extension. For example:
show.html # just HTML - no processing
show.html.erb # a HTML ERB template
show.html.slim # a HTML Slim template
show.html.haml # a HTML Haml template
show.xml.erb # a XML ERB template
show.xml.slim # a XML Slim template
show.xml.haml # a XML Haml template
show.json.erb # a JSON ERB template
show.json.jbuilder # a JSON jBuilder template
TRDL; changing the file extension is a dumb idea. Especially when you consider that Rails actually supports multiple template engines such as jbuilder, Slim and Haml in addition to ERB.
I'm currently trying Rails 6.0.0.rc1 which seems to have moved the default javascript folder from app/assets/javascript to app/javascript. The application.js file is now located in app/javascript/packs. Now, I want to add a couple of js files, but for some reason they don't get imported and I can't find any documentation on how this can be done in Rails 6. I tried a couple of things:
Create a new folder custom_js under app/javascript/packs, putting all my js files there and then add a require "custom_js" to application.js.
Copy all my js files under app/javascript/channels (which should be included by default, since application.js has require("channels")).
Adding require_tree . to application.js, which was the previous approach.
How can I load my own js files inside a Rails 6 application?
Get better-organized code and avoid multiple javascript_pack_tags in your application.html.erb file with this approach:
Add your custom example.js javascript file to app/javascript/packs.
Add require("packs/example") to your application.js file.
I would have liked to add a comment to Asim Hashmi's correct answer. But I don't have enough reputation, so I'll add my suggestion as an answer instead.
It isn't necessary to include the ".js" extension inside of the require.
You need to do the following steps to add custom javascript file to rails 6 (webpacker)
1.Create your custom file named custom.js in app/javascript/packs directory.
For testing purpose, write any console.log in it.
// app/javascript/packs/custom.js
console.log("custom js file loaded")
2. Go to your application.html.erb and add the following line at the end of your <head></head>
<%= javascript_pack_tag 'custom', 'data-turbolinks-track': 'reload' %>
3. Now execute rake assets:precompile
This will pack your javascript code (including our custom file we just added)
Now reload your page and you should see the message
custom js file loaded
In your browser console.
My custom js has functions which will be called by embedded javascript of serveral html pages. Following snippet works in Rails6, compiled by webpacker:
put custom js file in folder app/javascript/packs e.g. app/javascript/packs/my_functions.js
say_hello = function(a_text){
console.log("HELLO "+ a_text);
}
add javascript_pack_tag in html file, e.g. index.html.erb .
<%= javascript_pack_tag 'my_functions' %>
<!-- html here -->
<script>
$(document).ready(function(){
say_hello('ABer')
});
</script>
Note : This line is inside html body, not in head
<script src="/packs/js/my_functions-1db66368ebbd2fe31abd.js"></script>
This is what I'm currently using:
haml :login_signup, :layout => :'main'
From the login_signup haml file, I would like to pass the name of the JS file to be parsed inside the :main haml file.
Reason? layout main.haml contains jquery reference. Rest of the haml files use different JS scripts that require jquery to be sourced first.
What you describe sounds like content_for.
Here is how this works add something like this to your main (source):
= yield(:somejs)
And then fill it from the login_signup view:
- content_for(:somejs) do
= javascript_include_tag :foo
Since you tagged also Sinatra there is a plugin for that functionality: https://github.com/foca/sinatra-content-for
I've an app which works fine in development and on my current production server.
I want to move it to FREE heroku (basic config: 1 dyno, 1 worker).
Unfortunately, the pdf generation (using PdfKit) is ok BUT without the pictures defined in my CSS.
I've followed a lot of tips including:
http://blog.mattgornick.com/using-pdfkit-on-heroku
http://jguimont.com/post/2627758108/pdfkit-and-its-middleware-on-heroku
http://code-fu.pl/blog/2011/05/17/pdfkit-heroku
Thoughts?
Found a workaround but I am still eager to know a better option:
I duplicated my view: one dedicated for html, another for pdf.
I removed all css using pics and put it in a separate file, included only in the view dedicated for html
finally, I inserted the css in the view dedicated to the pdf:
.foo { background-image:url(<%= Rails.root %>/public/images/bar.png) }
Very Ugly but works so please tell me if you've better
It's probably an issue with the way the url's are specified in the css. As I recall, they should be file system absolute paths. What does your css look like?
Here is how I answered my needs with:
Just one single view file
Just one css file
The trick was to pass the proper base_url to the css file dynamically, given I expected a pdf or html.
I decided to use LESS. Style compiles css in a different manner, given the base-url I provide in the DOM. This base-url is generated by a helper.
Here were my steps:
changed my style.css to style.less
Added to my view:
<%= stylesheet_link_tag "style.less", :rel => "stylesheet/less" %>
<script id="base_url" type="text/javascript" data="<%= assets_path %>"></script>
<%= javascript_include_tag "less.min.js" %>
In my helper:
def assets_path
if request.fullpath.include? ".pdf"
"#{Rails.root.join('public',"images","pictos")}"
else
"#{request.protocol}#{request.host_with_port}/images/pictos"
end
end
and in my style.less:
#base_url: `document.getElementById('base_url').getAttribute('data')`;
.foo { background-image:~"url(#{base_url}/bar.png)" }
How to display a HTML file from my system in iframe using rails?
I will explain my issue...
I have a view file that has an iframe which calls an action through <iframe src="controller/action?param=somevalue"></iframe> and the action renders a HTML file based on the params.
The HTML file called has reference to stylesheets and javascripts in the format <script type="text/javascript" src="../common/About.js"></script>
When viewed in browser the HTML file displays correctly with the styles and javascript but when viewed in the application the styling and scripts are not working from the external file. On viewing the source code for the external files i get "Unknown action" error.
What is that i am doing wrong in this?
(reacting to yr last comment): you need to specify css and js files in the iframed html page separately. html in an iframe is rendered completely independent from the surrounding page.
This is not a rails-related question imho.
I found the mistake I made. Its because of routes being not defined properly. When I give relative urls in the html file, the rails views assumes the full path to be some thing like src="controller/common/About.js". As there is no action defined by the name common I was getting the Unknown action error. I have redefined my routes and its working fine now.