Unicode-merkkien näyttäminen HTML:ssä ja Rails-koodissa

Keksin että voisin Muokkaa ja Poista -tekstien sijaan näyttää sopivan Unicode-merkin. Niillä on omat koodit, jotka toimivat hienosti HTML:n seassa.

    <th>&#9998;</th>
    <th>&#10060;</th>

Sitten ajattelin, että haluaisin myös jonkin merkin yläreunan navipalkkiin erottamaan sanoja toisistaan.

Alkuperäinen linkki:
<%= link_to 'Projektit', controller: 'projects' %>

Ei toimi:
<%= link_to '&#10024; Projektit', controller: 'projects' %>

Rails-koodin sisällä oleva & muuttui &amp; -iksi.
Vähän googlailtuani löysin ohjeen käyttää raw-apulaista. Se olikin avulias:

<%= link_to raw('&#10024; Projektit'), controller: 'projects' %>

Rails meets jQuery: Popup-laatikko

Olen opetellut vähän jQueryn alkeita ja koittanut keksiä, miten voisin kokeilla sitä applikaatiossani. Keksinkin sitten, että sen sijaan että projektilistauksessa (index-sivulla) yhtenä sarakkeena on "kuvaus", kuvausteksti voisi tulla näkyviin, kun käyttäjä laittaa hiiren projektin nimen päälle.

Sen sain aikaan näin:

projects.js

$( document ).ready(function() {
    $(this).on('mouseover', '.table-link', function () {
        var shortDescBox = $(this).closest('.projecttitle').find('#shortdesc-box');
        shortDescBox.text($(this).data('shortdesc'));
        shortDescBox.slideDown();
    });
    $(this).on('mouseleave', '.table-link', function () {
        $(this).closest('.projecttitle').find('#shortdesc-box').slideUp();
    });
});

index.html.erb

...
<% @projects.each do |project| %>
  <tr>
    <td class="projecttitle"><%= link_to project.title, project_path(project), :class => "table-link", :'data-shortdesc' => project.description %><div id="shortdesc-box"></div></td>
    <td><%= project.goals.count %></td>
...

main.css

#shortdesc-box {
    background-color: white;
    border: 1px solid black;
    position: absolute;
    top: 2px;
    right: 5px;
    font-size: 0.9em;
    max-width: 200px;
    padding: 10px;
    display: none;
    z-index: 1;
    -moz-border-radius-bottomright: 30px;
    -webkit-border-bottom-right-radius: 30px;
    border-bottom-right-radius: 30px;
}

Itse jQueryn otin appikseen mukaan näin:

application.html.erb

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

Kuivaksi puristusta: before_action

Olen palannut näin vuoden tauon jälkeen appiksen pariin. Aloin käydä läpi Rails for Zombies -tutorialia, josta opin heti neljännellä oppitunnilla uuden asian ja aloin soveltaa sitä omaan sovellukseeni.

Model-sivulla olevissa toiminnoissa show, edit jne joudutaan usein tekemään sama asia aluksi, esimerkiksi hakemaan tietokannasta käsiteltävänä oleva asia. Sitä on turha tehdä monta kertaa, vaan Railsissa on rakenne märän koodin kuivaamiseksi (D.R.Y. = Don't Repeat Yourself) eli toiston poistamiseksi.

class TemptasksController < ApplicationController

    before_action :get_temptask, only: [:show, :edit, :update, :destroy]
   
    def get_temptask
        @temptask = Temptask.find(params[:id])
    end
   
    def new

    def create

Kaikkien tarvitseman osuuden voi siirtää uuden deffin alle, olen antanut tässä sille nimeksi get_temptask koska se hakee id:n perusteella temptaskin tietokannasta. before_action osaa ajaa tämän ennen joko kaikkia toimintoja tai pelkästään ennen tiettyjä toimintoja kuten tässä.