Add programming language icons

[winniederidder]

This pull request uses different icons for activities depending on their Programming Language.

Sample of a current table:

Current issues:
Example testing exercises are always linked to Python, so e.g. Echo JS shows a Python logo.
Blank, a.k.a. Programming Language = text is also not available yet to test visually.

Exercises are created via a git repo, so I require explanation on how to work with that.
Closes #1975 .

[rien]

Can you update your screenshot with an exercise for each language?
You can change an exercise's programming language trough the console.

[winniederidder]

Picture with icons from different languages.

[pdawyndt]

If we also attach a programming language to a submission (inherited from the exercise for now), we could also add the programming language icon to all tables showing a list of submissions. If feasible, this could be turned into a new issue.

[bmesuere]

Also add the programming language to the title tag (and thus tooltip) of the icon ("exercise" -> "python exercise").

@rien don't we want to handle the "no icon" case in the model so we don't have to add that exception each time we use it?

[rien]

@rien don't we want to handle the "no icon" case in the model so we don't have to add that exception each time we use it?

I would maybe put it in a helper, because otherwise we're mixing application logic with its views.

[pdawyndt]

Also useful to show the icons in the overview of learning activities for a series in the right margin (navigation element) and also on the exercise page itself (after the title in the header?).

[bmesuere]

@rien don't we want to handle the "no icon" case in the model so we don't have to add that exception each time we use it?

I would maybe put it in a helper, because otherwise we're mixing application logic with its views.

Yes, but this is logic, right? It seems logical to overwrite the icon attribute in the model and return the string from the datababase or "file-document-edit-outline". That way there's one place where de default icon is set and you can trust the icon call to return something useful.

[rien]

Yes, but this is logic, right? It seems logical to overwrite the icon attribute in the model and return the string from the datababase or "file-document-edit-outline". That way there's one place where de default icon is set and you can trust the icon call to return something useful.

Hmm yes, you're right. I think putting the icon in the database was mixing logic and views with each other to begin with. But adding a constant mapping in the ProgrammingLanguage class is also not ideal.

I would indeed write something in the model like

def icon
  self[:icon] || "file-document-edit-outline"
end

[bmesuere]

@winniederidder can you modify the code as proposed by @rien and add the title?

[winniederidder]

Updated tooltip visual:

[bmesuere]

The tests still seem to fail. Probably a missing &. somewhere.

[winniederidder]

The tests still seem to fail. Probably a missing &. somewhere.

Was working on that while also updating the i18n
Visuals now:

[rien]

👌

[bmesuere]

Looks good, but I don't think the file test/remotes/exercises/public/CodersApprentice.png should be in this PR. Ping me if removed so I can merge.