現在各ポートレットからメッセージにリンク出来る開発を行っていますが、 サムネイルの表示がある場合は
・サムネイル画像を持っているかどうか
・他ユーザかどうか
という4つの分岐です。 これをVelocityで綺麗に書いているコードを見つけたので紹介します.
<div class="avatar mr10"> #if(!$!result.isMatch($!{result.UserId} , $!{record2.OwnerId.Value}))<a href="javascript: void(0)" onclick="aipo.message.openDirect(${record2.OwnerId})">#end #if(${record2.hasPhoto()}) <img src="https://hacknote.jp/wp-content/plugins/lazy-load/images/1x1.trans.gif" data-lazy-src="$!utils.escapeXML($jslink.getTemplate("FileuploadFacePhotoScreen").addQueryData("uid", ${record2.OwnerId}).addQueryData("t", ${record2.PhotoModified}))" alt="$!{record2.OwnerName}" width="32" height="32" /><noscript><img src="$!utils.escapeXML($jslink.getTemplate("FileuploadFacePhotoScreen").addQueryData("uid", ${record2.OwnerId}).addQueryData("t", ${record2.PhotoModified}))" alt="$!{record2.OwnerName}" width="32" height="32" /></noscript> #else <img src="https://hacknote.jp/wp-content/plugins/lazy-load/images/1x1.trans.gif" data-lazy-src="images/common/avatar_default3.png" alt="$!{record2.OwnerName}" width="32" height="32" /><noscript><img src="images/common/avatar_default3.png" alt="$!{record2.OwnerName}" width="32" height="32" /></noscript> #end #if(!$!result.isMatch($!{result.UserId} , $!{record2.OwnerId.Value}))</a>#end </div>
書き直すと
<div> #if(他人である)<a href>#end #if(プロフィール写真を持つ) <img> #else <img> #end #if(他人の条件)</a>#end </div>
といった形になります
リンクのタグであるをそれぞれifの中にいれるという手法です 一番わかりやすくてシンプルだと思いました. 結構一般的なのでしょうか・・・
綺麗に書かれたコードは開発効率に関わるので重要です. 自分も綺麗で読みやすいコードを書けるように心がけます