用i18n-ized Rails 3.2 app中的timeago jQuery插件替换time_ago_in_words

Question

通过Rails Best Practices运行我完成的Rails Tutorial应用程序让我发出警告,不要使用该time_ago_in_words方法 "计算服务器端的时间太昂贵",因此他们提供了一些示例代码来更改您的实现以使用timeago jQuery插件.听起来它会做出有趣的改变,所以我试了一下.我使用的原始代码time_ago_in_words分为两个地方:

应用程序/视图/共享/ _feed_item.html.haml

# ...
%span.timestamp
  = t('.time_posted_ago', time: time_ago_in_words(feed_item.created_at) )

应用程序/视图/微柱/ _micropost.html.haml

# ...
%span.timestamp
  = t('.time_posted_ago', time: time_ago_in_words(micropost.created_at))

我使用HTML5 time标记将代码更改为使用timeago,如下所示:

应用程序/视图/共享/ _feed_item.html.haml

# ...
%time.timeago{ datetime: feed_item.created_at.getutc.iso8601 }
  = t('.time_posted_ago', time: feed_item.created_at.to_s)

应用程序/视图/微柱/ _micropost.html.haml

# ...
%time.timeago{ datetime: micropost.created_at.getutc.iso8601 }
  = t('.time_posted_ago', time: micropost.created_at.to_s)

我想,只留下我将timeago()方法添加到我的coffeescript文件中:

应用程序/资产/ JavaScript的/ application.js.coffee

$(document).ready ->
  $("time.timeago").timeago()

这不起作用,所以我尝试将语句移动到microposts.js.coffee和users.js.coffee,有和没有$(document).ready ->,仍然没有去.然后我想也许默认情况下不包括timeago所需的库jquery-rails,所以我添加了它们:

应用程序/资产/ JavaScript的/ application.js.coffee

//= require jquery
//= require jquery_ujs
//= require jquery.min
//= require jquery.timeago
//= require bootstrap
//= require_tree .

在这里添加jquery.min.js和jquery.timeago.js声明不起作用,我也假设我的语法已关闭,因为它们破坏了依赖于javascript的其他页面元素.

所以,据我所知,我认为我的haml文件中的实现代码是正确的,但我只是不知道:

1. 在哪个coffeescript文件中我应该$("time.timeago").timeago()拨打电话以及如果我所拥有的是不正确的
2. 是否timeago库都包含在轨道-的jQuery
3. 如果他们不是,如何正确包括他们

花了很多时间在这上面后,我最终尝试了rails-timeago gem,除了有一些好帮手之外,还确实有时间正确显示.但是,它似乎与t()上面的rails 方法实现不太匹配,以便只是在单词中获取时间然后将其插入到i18n字符串中.

那么,我怎样才能time_ago_in_words在使用i18n的Rails 3.2应用程序中获得使用timeago JQuery插件的预期效果？

Answer 1

我设法使用rails-timeago gem破解了一个解决方案.它不是最佳的,但它似乎获得了理想的timeago效果,这是相当不错的.我想知道如何使用timeago jQuery插件和%time.timeago标签在Rails中获得相同的效果.无论如何,希望这对某人感兴趣.

建立

的Gemfile

gem 'rails-timeago', '1.3.0'

配置/初始化/ timeago.rb

Rails::Timeago.default_options limit: proc { 20.days.ago }, nojs: true
Rails::Timeago.locales = [:en, :it, :ja]

创建app/assets/javascripts/locales目录以将自定义设置放入timeago i18n字符串.为了完整起见,我从jQuery-timeago Github存储库中获取了我想要的三个语言环境,并将它们放在目录下,但实际上只是更改了ja语言环境文件.

应用程序/资产/ JavaScript的/ application.js.coffee

# ...
//= require jquery
//= require jquery_ujs
//= require rails-timeago

应用程序/视图/布局/ application.html.haml

# ...
%head
  # ...
  = javascript_include_tag "application"
  = timeago_script_tag

履行

应用程序/视图/微柱/ _micropost.html.haml

# ...
%span.timestamp
  = t('.time_posted_prefix')
  %time<
    = timeago_tag(micropost.created_at)
    = t('.time_posted_suffix')

代码的应用程序/视图/共享/ _feed_item.html.haml是一样的:刚刚替补出来micropost的feed_item.

国际化

配置/语言环境/ en.yml

microposts:
  micropost:
    time_posted_prefix: Posted
    time_posted_suffix: ""

配置/语言环境/ it.yml

microposts:
  micropost:
    time_posted_prefix: Pubblicato
    time_posted_suffix: ""

配置/语言环境/ ja.yml

microposts:
  micropost:
    time_posted_prefix: ""
    time_posted_suffix: ???????

shared.feed_itemi18n文件中的字符串是相同的.

我找不到t()动态使用timeago_tag(例如t('.time_posted_ago', time: timeago_tag(micropost.created_at)))结果的方法,所以我把结果放在前缀和后缀之间.timeago提供与时间相关的前缀/后缀,但不提供与"发布"相关的前缀/后缀,因此上面添加了它们.
为了摆脱输出timeago_tag和time_posted_suffix(特别是日语)之间的空间,我将这两个标签包装在一个%time<带有a 的标签中,<以删除标签内的所有空格.这是一件小事,但它对我来说很烦人,所以我想把它放进去,但如果你不使用需要time_posted_suffix密钥值的语言,这绝不是必要的.我也假设有更好的方法来做到这一点.

问题

我最初在app/assets/javascripts/locales目录下有jquery.timeago.en.js,jquery.timeago.it.js和jquery.timeago.ja.js,但我有一个en文件没有的问题为en语言环境加载; 相反,目录中按字母顺序排列的最后一个文件(即ja)将与en语言环境一起使用.所以,我将en文件重命名为jquery.timeago.xx.js,它显示了英文.我尝试将en文件移动到locales目录之外,但它似乎永远不会被拾取,因此它变成了xx.

更新

我遇到的i18n问题现在已经解决了.有关详细信息,请参阅此Github问题.总之,我摆脱了我的app/assets/javascripts/locales目录,只放了jquery.timeago.ja.js,这是我真正想要自定义的唯一文件,位于lib/assets/javascripts/locales目录下,这意味着:it和:enlocales,timeago使用默认翻译,:en翻译按预期显示.所以,我确实得到了我认为对rails-timeagogem 这个问题的一个很好的解决方案.

更新2

此解决方案目前在本地工作,但由于资产预编译问题,无法正确部署到Heroku ...

更新3

找到一个似乎在本地和Heroku工作的配置解决方案:

配置/初始化/ timeago.rb

Rails::Timeago.default_options limit: proc { 20.days.ago }, nojs: true
Rails::Timeago.locales = [:en, :it, :ja]
Rails::Timeago.map_locale "en", "jquery.timeago.js"  # default
Rails::Timeago.map_locale "it", "locales/jquery.timeago.it.js"  # default
Rails::Timeago.map_locale "ja", "timeago/jquery.timeago.ja.js"  # customized

配置/环境/ production.rb

# ...
config.assets.precompile += %w( jquery.timeago.js locales/jquery.timeago.it.js timeago/jquery.timeago.ja.js )

而且,在这种情况下,唯一需要的自定义文件是app/assets/javascripts/timeago/jquery.timeago.ja.js

更多细节可以在相关的Github问题上找到.