Add ParamSetID to runs list in /jobs

[morimorihoge]

refs: #714

既存の app/datatables/parameter_sets_list_datatable.rb の内容をベースにParamSetID（jobs.parameter_set_id）を表示するようにした。
-> 2021/01/08: Tooltiopの表示内容をParameterSet IDからSimulator Nameとパラメータリストを表示するように修正

Screenshots

before

after

要確認事項

マウスhoverして表示されるtooltipのIDが、table側に表示されているIDと明らかに違うが、これは問題ないか？
#shortened_id の実装上こうなること、既存の simulators#index でも同様の仕様でParamSetIDが表示されていることから仕様としては既存のものに揃っているが、ぱっと見バグにも見えてしまうのでやや気になる。
-> これはUUIDを使っている関係で先頭数文字はほぼ全部同じIDになってしまうことによる仕様。現状利用者側からも問題にはなっていないとのことなので、この仕様を踏襲して良い
--> その後、Tooltipの表示内容がSimulator Nameとパラメータリストに変更されたので、この違和感はなくなった

[yohm]

ありがとうございます。tooltipで表示する中身ですが、ParameterSetのIDではなく、Simulatorの名前とパラメータの値を表示するようにしていただけませんんか？
例えば、以下のような感じです。Simulatorの名前は ps.simulator.name パラメータの値は ps.v にHashとして格納されています。

Simulator: NS_model
L: 100
Vmax: 5
density: 0.3
p_d: 0.1
t_init: 100
t_measure: 100

注意点として、ps.v の値（つまりHashの値）に別のHashが含まれる場合があります。その場合はonelineのJSON形式で表示していただけるとみやすいかと思います。

[morimorihoge]

tooltipの内容について、承知いたしました。
こちら対応してみます！

[morimorihoge]

遅くなりまして申し訳ありません。こちら、対応済みのモノをpushいたしましたのでご確認下さい。

PR descriptionのスクリーンショットも更新済みになります。

[morimorihoge]

定例にてコメントを頂きました。

• 表示内容はこれで問題ないが、:で横位置を揃えられたらうれしい

ということで、tableなのかDL/DTなのかやれそうな方法を検討してみます。

[morimorihoge]

本件、取り急ぎ現状報告です。やや難航してしまっており引き続き調査中です。

状況としては、Bootstrap Tooltipのドキュメントを見つつHTML挿入するだけだと、どうも一部のタグが消える挙動が起こっています。

• 挿入できたタグ
  • h1
  • b
  • span
• 消えたタグ
  • table
  • dl / dt / dd

タグによっては挿入できることを見ると、HTMLエンティティのエスケープ問題などではなく、JSレベルでフィルタなどがされていそうに思うのですが、Bootstrap TooltipのJSコードを見る限りでは普通にjQuery.html()を使って挿入しているだけのように見えます。

ただ、以下のJSFiddleなどではtableが挿入できているので、Bootstrap Tooltipのバージョンなども原因かもしれない、という所で引き続き調査中です。

http://jsfiddle.net/56arN/

[morimorihoge]

調査に時間かかってしまいましたが諸々対応版に更新しました。

[morimorihoge]

Bootstrap純正のdescription listを使っています。

https://getbootstrap.com/docs/3.4/css/#description

[morimorihoge]

@yohm 調査時間かかってしまいましたが、無事表形式表示ができましたのでご確認下さい。

原因等についてはソースコメントに書いておきました 🙇‍♂️

[yohm]

ありがとうございます。細かいところで恐縮なのですが、tooltipの中身がだいぶ右に寄せられているのと、一番下に空白行があるのでその部分を調整していただけないでしょうか？

[morimorihoge]

承知しました。

今確認してみたところ、Bootstrapのdescription listのCSS問題（widthやmarginに固定値が指定されている）のようでした。
こちら、修正の際ですが、全.dl-horizontal要素に適用してしまって良いか、tooltip内の.dl-horizontalにのみ適用した方が良いかなど希望あればお願いいたします。

＃他でdlタグを使っていなければ全体適用してしまってもよさそうですが

[morimorihoge]

定例メモ：tooltip内の.dl-horizontalの上書きで対応する

[morimorihoge]

@yohm
色々と試行錯誤してみたところ、Bootstrap 3のDLタグは横幅が動的に変わるような要素をあまり想定しておらず、単純にwidthサイズ指定されている値を上書きするだけだと以下のようにoverflow扱いになってしまう（自動で伸張しない）ことが分かりました。

※なお、伸張するようにしようとすると、今度はDD側がmargin-leftで位置調整されているため別の問題が発生してしまっていました。

というわけで、DLタグを使うのを諦め、TABLEタグで書き直したところ、見る限りいい感じになったように見えます。

TABLEのスタイルは .table.table-condensed （ちょっと詰め気味のTABLE）にしつつ、borderを外したものになっています。
こちら、スタイルの方こちらで良ければ内容確認をお願いします。

[yohm]

ありがとうございます。確認しました。