アプリケーション幅広い変数をjavascriptに変換する

Question

ユーザーがプロフィールページから画像へのリンクを追加した場合、ページの背景画像を変更するために次のコードがあります。しかし、私はこのコードを現在のコードだけでなく、すべてのページに適用したいと思います。

私は個々のページにコードを入れることができますが、それは明らかに理想的ではありません。私はそれをapplication.jsとapplication.html.erbファイルに入れてみましたが、うまくいきませんでした。

私は、gonがそれらの変数をそれらが配置されているページでのみ利用可能にすることと関係があると信じていますか？

$(document).ready(function(){ 
    if(gon.backgroundPicture) { 
     var background = gon.backgroundPicture; 
     document.body.style.backgroundImage = "url(" + background + ")"; 
    };  
}); 

<% if current_user.try(:student?) || current_user.try(:supervisor?) %> 
    <% if current_user.background_picture != :null %> 
    <% @gon.backgroundPicture = current_user.background_picture %> 
    <% end %> 
<% end %> 

Answer 1

あなたはこのような何かを試すことができますが、あなたは確か@gonはどこにでも定義され、あなたが必要とするすべてのJSライブラリがあまりにも定義されていることを確認する必要があります：

# assets/javascripts/background_picture.js.erb

$(document).ready(function(){ 
    if(gon.backgroundPicture) { 
     var background = gon.backgroundPicture; 
     document.body.style.backgroundImage = "url(" + background +  ")"; 
    };  
}); 

<% if current_user.try(:student?) || current_user.try(:supervisor?) %> 
    <% if current_user.background_picture != :null %> 
    <% @gon.backgroundPicture = current_user.background_picture %> 
    <% end %> 
<% end %> 

# assets/javascripts/application.js

//= require background_picture