Umbenennen meiner Datei zu .js.erb erlaubt mir, erb innerhalb Javascript aber nicht Javascript innerhalb erb

Question

Ich benutze Schachbrett-0.3.0.js auf einer Schiene Anwendung. Aufgrund der Sache mit der Pipeline-Pipeline musste ich jeden Teil des js-Codes bearbeiten, der ein Bild rendert, zum Beispiel Pieces. Linie 445 von chessboard.js sagt

cfg.pieceTheme = 'img/chesspieces/wikipedia/{piece}.png' 

was natürlich ein Problem für die Schienen darstellen würde, so hatte ich Schachbrett mit der .erb Erweiterung umbenannt und änderte diese Linie

cfg.pieceTheme = <%= asset_path('chesspieces/wikipedia/{piece}.png') %> 

schließlich setzen die erforderlichen Bilder im Ordner "Assets/Images".

Mein Problem hier ist, dass die Bilder immer noch nicht gerendert werden, vermutete ich es wegen der Art und Weise {piece}.png ist in dieser Zeile platziert, das ist im Grunde js in einem Rails-Helfer, richtig? Und deshalb werden meine Bilder nicht gerendert. Natürlich konnte ich die ganzen "fast 2000" Codezeilen lesen und versuchen, einen Weg zu finden, auf jedes Bild nacheinander zuzugreifen, aber ich könnte etwas anderes auf dem Weg kaputt machen, 2k Zeilen machen keinen Spaß für einen Anfänger wie mich.

Gibt es eine Möglichkeit, dies zu beheben, ohne den besseren Teil des Codes neu zu schreiben?

Answer 1

Es gibt eine Alternative, die einige der js neu schreiben müsste.

Der Grund, warum der Code nicht funktioniert, ist, weil das Erb vor dem Rendern kompiliert wird, aber die js wird nach dem Rendern ausgeführt, so dass der Assetpfad falsch und nicht dynamisch ist.

Sie könnten ein Objekt erstellen, das alle verfügbaren Routen auflistet und dann die Pfadnamen einfügen.

Ihre Schleife Unter der Annahme, ist so etwas wie

var piecesList = [ 
    "first", 
    "second" 
] 
$.each(var piece in piecesList) function(piece) { 
    var image_path = "img/path/{piece}.png" 
} 

Sie manuell alle diese Stücke in einem Objekt wie so

var piecesRoutes = { 
    "first" : "<%= image_path('chesspieces/first.png') %>", 
    "second" : "<%= image_path('chesspieces/second.png') %>", 
    } 

Und dann in der Schleife zuweisen könnte, rufen sie wie so

var image_path = piecesRoutes[piece] 

Answer 2

Ich denke, der einfachste Weg wäre, deine Schachfiguren direkt in/public einzubauen, damit sie nicht gehashed werden. Sie werden sich wahrscheinlich nicht ändern, wenn sie aus einer externen Bibliothek stammen, so dass Sie sich keine Gedanken über das Caching machen müssen.