I have integrated the phraseapp(https://phraseapp.com) to my project, I am currently having a popup which opens when a website is opened,shows radio buttons for each language. When the user clicks on any radio button, I want to translate the project to the user selected language and the popup content too.
I am currently using rails-4.0.8, gem 'phrase'
Here is the code what I am trying to acheive, can any one please help me.
<script type="text/javascript">
$("input[name=language]:radio").change(function () {
/* here I want to set the phraseapp locale to the user selected language in the popup
and translate the whole website */
});
</script>
Any help would be greatly appreciated.
I'm assuming that you want to store the locale files with your Rails app.
Run phrase pull under your Rails app folder to get the locale files.
Set the config.i18n.load_path in application.rb, for example: config.i18n.load_path += Dir[Rails.root.join('phrase', 'locales', '*.{yml}').to_s] (change yml to the format you're using).
Disable PhraseApp (so that it uses the pulled local locale files) in phrase.rb : config.enabled = false.
Depends on your i18n configuration (see Rails Internationalization (I18n) API, implement the logic in your JavaScript function (maybe redirecting to a new url with a locale paramater).
Related
I have a Rails 3.0.9 app, and I am using the i18n module for internationalization. I am adding all my mobile views inside a folder called mobile_views, which I am adding to the view search path for any request in which a mobile user agent is detected. I want to be able to use the same 'lazy' shortcuts I use in my regular views to access translations, ie t('.title') in app/mobile_views/users/index.html.erb should refer to this title entry in my en.yml file:
en:
users:
index:
title: "A title"
just like it would if it were in app/views/users/index.html.erb
I want both the files in views and in mobile_views to be able to access the same i18n translations using the same shortcuts. In other words, I want the two view folders to map to the same shortcuts without having two different trees in the translation file (ie one for views and the other for mobile views)
How do I configure i18n to do this?
turns out that this happens automatically.
Once I use
prepend_view_path Rails.root + 'app' + 'mobile_views'
to add my mobile_views directory to the view search path, i18n automatically gives files in that folder the same scopes they have if they were in the regular views folder. So both directories can map to the same translation tree in the en.yml file.
I'm trying to allow the user to customize my application using YML files.
When the user updates certain things the CSS needs to be updated as well.
I'd like to solve this problem using dynamic CSS instead. The way I was planning on doing this is to have a settings SCSS file which the other css files import and use.
Here is what I have so far:
settings.scss.erb:
$width: <%= Rails.application.config.width %>px;
main.css.scss:
//= require settings
#import "settings";
#main {
width: $width;
}
But I get this error:
Invalid CSS after "$width: ": expected expression (e.g. 1px, bold), was "<%= Rails.appli..."`
So It seems that the settings are not being passed through the erb parser before being handed off to the SCSS parser, is there any way to solve this.
I'd rather not put everything in .erb files since my text editor doesn't support (syntax highlighting and commands) when having scss in erb files
Side stepping the problem where ERB is not being parsed, you are not going to be able to customize the CSS dynamically (I think the main file may require an erb extension). The asset pipeline is designed to serve assets in a way that tells browsers that the are static and are not going to change.
Assuming the erb parsing was working, the width would be rendered during the precompile phase, or on the first request. If you are using Sprockets far-future headers are set to tell the remote clients to cache the content for 1 year. And Sprockets only picks up changes if the timestamp of the file changes, so would never get any new values.
You could force Sprockets to dynamically serve every request, and to not send any headers, but it is not really designed for this and there are significant performance risks in doing so.
I noticed that some jquery effects requires that scripts are loaded in proper order.. in my case it is working if they are loaded like this:
jquery 1.4.4
jquery-ui-1.8.16.custom.min.js
autocomplete-rails.js
jquery.cycle.all.js
....
if they load in different way then some of my animation or jquery feature is not working. So how do I specify in rails wich script to load first?
Right now I did it in a primitive way by adding 1 2 3 numbers in front of names of every script I have in order that I need resulting in:
1jquery 1.4.4
2jquery-ui-1.8.16.custom.min.js
3autocomplete-rails.js
4jquery.cycle.all.js
It's primitive but it's working. Is there another way of doing it?
Rails 3
For Rails 3.0:
javascript_include_tag takes an array of sources, and includes them in the order that you define. You can omit :defaults, or define it in your application.rb file with config.action_view.javascript_expansions[:defaults] = %w(foo.js bar.js). :all includes all the javascripts in your /javascripts/ folder.
Therefore, it's best to have jQuery at the beginning, since most or all of your javascript files will use jQuery.
More documentation: http://apidock.com/rails/ActionView/Helpers/AssetTagHelper/JavascriptTagHelpers/javascript_include_tag
I really like rails_admin, but my clients don't like CKEditor. Is this really the only option for WYSIWYG on this gem? Is there any way to use tinyMCE with rails_admin?
after struggling to get CKEditor working properly in RailsAdmin (on Rails 3.1), I used tinymce:
It works well and is done in minutes:
in your gemfile add:
gem 'tinymce-rails'
plus you inlcude a line in rails_admin.js.erb:
require_asset 'tinymce-jquery'
you may need to copy the whole file (rails_admin.js.erb) from the gem to /assets/javascripts/rails_admin/
before you do this.
finally, you will also need to add some jquery to the view files
app/views/rails_admin/main/edit.html.haml and app/views/rails_admin/main/new.html.haml
:javascript
jQuery(function() {
jQuery('textarea').tinymce({
theme: 'advanced'
});
});
This will add the Wysiwyg to all text area fields.
WYSIWYG editors typically just overlay an HTML text area element with JavaScript functionality. So any editor should work in theory. You could replace the references in the code to tinyMCE, make sure you have all the files properly installed and then set tinyMCE to use the ID of the text area control.
It should not make a difference to the back-end programming which client side interface is used to create HTML in the text area.
Great andistuder,
I propose a modified version of your solution.
Copy the rails_admin.js.erb from the gem to the /assets/javascripts/rails_admin/ in your project path.
Add the following line:
...
require_asset 'tinymce-jquery'
%>
jQuery(function() {
jQuery('textarea').tinymce({
theme: 'advanced'
});
});
And all will works like a charm!
I achieved this in a slightly different way, which worked for:
rails_admin (0.8.1)
tinymce-rails (4.4.1)
Implementation:
Gemfile
gem 'tinymce-rails'
app/assets/javascripts/rails_admin/custom/ui.js
//= require tinymce-jquery
var admin = {
initTinyMce: function() { tinyMCE.init({ selector: "textarea[name$='_html]'" }) }
}
$(function() {
admin.initTinyMce();
$(document).on('rails_admin.dom_ready', function() {
admin.initTinyMce();
});
});
Explanation
https://github.com/sferik/rails_admin/wiki/Theming-and-customization
Suggests the ui.js location
Suggests to use rails_admin.dom_ready
https://github.com/spohlenz/tinymce-rails
//= require tinymce-jquery: no ruby interpolation required and I like using manifest files
Custom:
I needed to run the initialization twice, all seems good so far
The selector textarea[name$='_html]' will convert all text areas where the field ends in _html, that's what I store, that's how I name my fields
Fairly new to Rails. I am implementing a wholesale homepage redesign on a Rails site. For the time being, we will push the redesigned home page but leave the rest of the site as is. Later, we will port the rest of the site to the new design.
I would like to create a "branch" of the CSS inside the current project that is loaded only by the home page. We use SASS to generate the CSS. The file layout:
/public/stylesheets: #Generated CSS for rest of site
/public/stylesheets/sass: #SASS source files for rest of site
/public/stylesheets/v3: #Desired location for CSS for home page
/public/stylesheets/v3/sass: #SASS source files for new-style home page
The controller for / calls render :layout => 'v3', and this layout contains:
!= include_stylesheets :common_v3, :media => "all"
Here's the relevant section from assets.yml:
stylesheets:
common:
- public/stylesheets/reset.css
- public/stylesheets/*.css
common_v3:
- public/stylesheets/v3/reset.css
- public/stylesheets/v3/*.css
Could someone help me figure out how to make SASS generate the new CSS files? If I put a new file in /public/stylesheets/sass, the corresponding CSS file is created, but the v3 dir is ignored.
I tried the following in environment.rb, but it's not working.
Sass::Plugin.options[:template_location] = %W( #{RAILS_ROOT}/public/stylesheets/sass #{RAILS_ROOT}/public/stylesheets/v3/sass )
Using Rails 2.3.8 with Haml 2.2.2.
First, upgrade Haml/Sass to the latest version (3.0.24).
Now you can use the Sass::Plugin.add_template_location method to tell Sass where your templates are. For example:
Sass::Plugin.add_template_location("#{RAILS_ROOT}/public/stylesheets/v3/sass",
"#{RAILS_ROOT}/public/stylesheets/v3")