yarffaJ nalA (jnala) wrote in lj_dev,
yarffaJ nalA
jnala
lj_dev

Userinfo friend/community display

Right now, the userinfo page looks like:
Friends:35: bradfitz, changelog, cruiser, dolohov, dormando, evan, insomnia, linux, lj_audit, lj_biz, lj_dev, lj_everywhere, lj_maintenance, lj_sysdoc, lj_userdoc, lj_win32, ljstyle, loserjabber, lyonesse, mtffm, news, piman, silverhawk273, sine, sme, some_kitten, spanglemaker, suggestions, syndicated, thaisa, tikva, trysha, ukelele, upsilon, visions
Friend of:21: boojum, bradfitz, cruiser, czakari, dolohov, dormando, dphilli1, eustaciavye, evan, insomnia, loserjabber, mtffm, silverhawk273, sine, sme, some_kitten, tikva, trysha, upsilon, visions, vyxn
Member of:12: linux, ljstyle, lj_audit, lj_biz, lj_dev, lj_everywhere, lj_sysdoc, lj_userdoc, outofcontext, paidmembers, spanglemaker, suggestions
This has problems. Specifically, it makes it difficult to tell who's a mutual friend and who's a one-way relationship, it repeats names, and it doesn't say which friends are communities and which are people. I'd like to suggest that it instead look like
Friends: 15: bradfitz, cruiser, dolohov, dormando, evan, insomnia, mtffm, silverhawk273, sine, sme, some_kitten, tikva, trysha, upsilon, visions
4: lyonesse, piman, thaisa, ukelele
4: boojum, czakari, dphilli1,
[Error: Irreparable invalid markup ('<a [...] /userinfo.bml?user>') in entry. Owner must fix manually. Raw contents below.]

Right now, the userinfo page looks like: <TABLE CELLPADDING=5 WIDTH=100% border=0> <TR><TD ALIGN=RIGHT VALIGN=TOP><B><A HREF="http://www.livejournal.com/users/alanj/friends">Friends</A>:</B></TD><TD COLSPAN=2><B>35:</B> <A HREF="/userinfo.bml?user=bradfitz">bradfitz</A>, <A HREF="/userinfo.bml?user=changelog">changelog</A>, <A HREF="/userinfo.bml?user=cruiser">cruiser</A>, <A HREF="/userinfo.bml?user=dolohov">dolohov</A>, <A HREF="/userinfo.bml?user=dormando">dormando</A>, <A HREF="/userinfo.bml?user=evan">evan</A>, <A HREF="/userinfo.bml?user=insomnia">insomnia</A>, <A HREF="/userinfo.bml?user=linux">linux</A>, <A HREF="/userinfo.bml?user=lj_audit">lj_audit</A>, <A HREF="/userinfo.bml?user=lj_biz">lj_biz</A>, <A HREF="/userinfo.bml?user=lj_dev">lj_dev</A>, <A HREF="/userinfo.bml?user=lj_everywhere">lj_everywhere</A>, <A HREF="/userinfo.bml?user=lj_maintenance">lj_maintenance</A>, <A HREF="/userinfo.bml?user=lj_sysdoc">lj_sysdoc</A>, <A HREF="/userinfo.bml?user=lj_userdoc">lj_userdoc</A>, <A HREF="/userinfo.bml?user=lj_win32">lj_win32</A>, <A HREF="/userinfo.bml?user=ljstyle">ljstyle</A>, <A HREF="/userinfo.bml?user=loserjabber">loserjabber</A>, <A HREF="/userinfo.bml?user=lyonesse">lyonesse</A>, <A HREF="/userinfo.bml?user=mtffm">mtffm</A>, <A HREF="/userinfo.bml?user=news">news</A>, <A HREF="/userinfo.bml?user=piman">piman</A>, <A HREF="/userinfo.bml?user=silverhawk273">silverhawk273</A>, <A HREF="/userinfo.bml?user=sine">sine</A>, <A HREF="/userinfo.bml?user=sme">sme</A>, <A HREF="/userinfo.bml?user=some_kitten">some_kitten</A>, <A HREF="/userinfo.bml?user=spanglemaker">spanglemaker</A>, <A HREF="/userinfo.bml?user=suggestions">suggestions</A>, <A HREF="/userinfo.bml?user=syndicated">syndicated</A>, <A HREF="/userinfo.bml?user=thaisa">thaisa</A>, <A HREF="/userinfo.bml?user=tikva">tikva</A>, <A HREF="/userinfo.bml?user=trysha">trysha</A>, <A HREF="/userinfo.bml?user=ukelele">ukelele</A>, <A HREF="/userinfo.bml?user=upsilon">upsilon</A>, <A HREF="/userinfo.bml?user=visions">visions</A></TD></TR> <TR><TD ALIGN=RIGHT VALIGN=TOP><B><nobr>Friend of:</nobr></B></TD><TD COLSPAN=2><B>21:</B> <A HREF="/userinfo.bml?user=boojum">boojum</A>, <A HREF="/userinfo.bml?user=bradfitz">bradfitz</A>, <A HREF="/userinfo.bml?user=cruiser">cruiser</A>, <A HREF="/userinfo.bml?user=czakari">czakari</A>, <A HREF="/userinfo.bml?user=dolohov">dolohov</A>, <A HREF="/userinfo.bml?user=dormando">dormando</A>, <A HREF="/userinfo.bml?user=dphilli1">dphilli1</A>, <A HREF="/userinfo.bml?user=eustaciavye">eustaciavye</A>, <A HREF="/userinfo.bml?user=evan">evan</A>, <A HREF="/userinfo.bml?user=insomnia">insomnia</A>, <A HREF="/userinfo.bml?user=loserjabber">loserjabber</A>, <A HREF="/userinfo.bml?user=mtffm">mtffm</A>, <A HREF="/userinfo.bml?user=silverhawk273">silverhawk273</A>, <A HREF="/userinfo.bml?user=sine">sine</A>, <A HREF="/userinfo.bml?user=sme">sme</A>, <A HREF="/userinfo.bml?user=some_kitten">some_kitten</A>, <A HREF="/userinfo.bml?user=tikva">tikva</A>, <A HREF="/userinfo.bml?user=trysha">trysha</A>, <A HREF="/userinfo.bml?user=upsilon">upsilon</A>, <A HREF="/userinfo.bml?user=visions">visions</A>, <A HREF="/userinfo.bml?user=vyxn">vyxn</A></TD></TR> <TR><TD ALIGN=RIGHT VALIGN=TOP><B><nobr>Member of:</nobr></B></TD><TD COLSPAN=2><B>12:</B> <A HREF="/userinfo.bml?user=linux">linux</A>, <A HREF="/userinfo.bml?user=ljstyle">ljstyle</A>, <A HREF="/userinfo.bml?user=lj_audit">lj_audit</A>, <A HREF="/userinfo.bml?user=lj_biz">lj_biz</A>, <A HREF="/userinfo.bml?user=lj_dev">lj_dev</A>, <A HREF="/userinfo.bml?user=lj_everywhere">lj_everywhere</A>, <A HREF="/userinfo.bml?user=lj_sysdoc">lj_sysdoc</A>, <A HREF="/userinfo.bml?user=lj_userdoc">lj_userdoc</A>, <A HREF="/userinfo.bml?user=outofcontext">outofcontext</A>, <A HREF="/userinfo.bml?user=paidmembers">paidmembers</A>, <A HREF="/userinfo.bml?user=spanglemaker">spanglemaker</A>, <A HREF="/userinfo.bml?user=suggestions">suggestions</A></TD></TR> </table> This has problems. Specifically, it makes it difficult to tell who's a mutual friend and who's a one-way relationship, it repeats names, and it doesn't say which friends are communities and which are people. I'd like to suggest that it instead look like <TABLE CELLPADDING=5 WIDTH=100% border=0> <TR> <TD ALIGN=RIGHT VALIGN=TOP rowspan=3><B>Friends:</B></TD> <TD valign=top><img src="http://pobox.com/~jaffray/lj/userinfo/doublearrow.gif"></td> <td> <b>15:</b> <A HREF="/userinfo.bml?user=bradfitz">bradfitz</A>, <A HREF="/userinfo.bml?user=cruiser">cruiser</A>, <A HREF="/userinfo.bml?user=dolohov">dolohov</A>, <A HREF="/userinfo.bml?user=dormando">dormando</A>, <A HREF="/userinfo.bml?user=evan">evan</A>, <A HREF="/userinfo.bml?user=insomnia">insomnia</A>, <A HREF="/userinfo.bml?user=mtffm">mtffm</A>, <A HREF="/userinfo.bml?user=silverhawk273">silverhawk273</A>, <A HREF="/userinfo.bml?user=sine">sine</A>, <A HREF="/userinfo.bml?user=sme">sme</A>, <A HREF="/userinfo.bml?user=some_kitten">some_kitten</A>, <A HREF="/userinfo.bml?user=tikva">tikva</A>, <A HREF="/userinfo.bml?user=trysha">trysha</A>, <A HREF="/userinfo.bml?user=upsilon">upsilon</A>, <A HREF="/userinfo.bml?user=visions">visions</A> </td> </tr> <tr> <td valign=top><img src="http://pobox.com/~jaffray/lj/userinfo/rightarrow.gif"></td> <td> <b>4:</b> <A HREF="/userinfo.bml?user=lyonesse">lyonesse</A>, <A HREF="/userinfo.bml?user=piman">piman</A>, <A HREF="/userinfo.bml?user=thaisa">thaisa</A>, <A HREF="/userinfo.bml?user=ukelele">ukelele</A> </td> </tr> <tr> <td valign=top><img src="http://pobox.com/~jaffray/lj/userinfo/leftarrow.gif"></td> <td> <b>4:</b> <A HREF="/userinfo.bml?user=boojum">boojum</A>, <A HREF="/userinfo.bml?user=czakari">czakari</A>, <A HREF="/userinfo.bml?user=dphilli1">dphilli1</A>, <A HREF="/userinfo.bml?user=eustaciavye>eustaciavye</A>, <A HREF="/userinfo.bml?user=vyxn">vyxn</A> </td></tr> <TD ALIGN=RIGHT VALIGN=TOP rowspan=3><B>Communities:</B></TD> <TD valign=top><img src="http://pobox.com/~jaffray/lj/userinfo/doublearrow.gif"></td> <td><b>10:</b> <a href="/userinfo.bml?user=linux">linux</a>, <a href="/userinfo.bml?user=lj_audit">lj_audit</a>, <a href="/userinfo.bml?user=lj_biz">lj_biz</a>, <a href="/userinfo.bml?user=lj_dev">lj_dev</a>, <a href="/userinfo.bml?user=lj_everywhere">lj_everywhere</a>, <a href="/userinfo.bml?user=lj_sysdoc">lj_sysdoc</a>, <a href="/userinfo.bml?user=lj_userdoc">lj_userdoc</a>, <a href="/userinfo.bml?user=ljstyle">ljstyle</a>, <a href="/userinfo.bml?user=spanglemaker">spanglemaker</a>, <a href="/userinfo.bml?user=suggestions">suggestions</a> </td></tr> <tr> <TD valign=top><img src="http://pobox.com/~jaffray/lj/userinfo/rightarrow.gif"></td> <td><b>2:</b> <a href="/userinfo.bml?user=lj_maintenance">lj_maintenance</a>, <a href="/userinfo.bml?user=syndicated">syndicated</a> </td></tr> <tr> <TD valign=top><img src="http://pobox.com/~jaffray/lj/userinfo/leftarrow.gif"></td> <td><b>2:</b> <a href="/userinfo.bml?user=outofcontext">outofcontext</a>, <a href="/userinfo.bml?user=paidmembers">paidmembers</a> </td></tr> </table> This doesn't take any more space, and it's clearer. For large friends lists it'll take considerably less space, since the mutual friends won't get duplicated. In very small friends lists, one or more of the categories will be missing.<p> An alternative which avoids the duplicate table structure is to group friends and communities together, and use the <img src="http://img.livejournal.com/userinfo.gif">userinfo and <img src="http://img.livejournal.com/community.gif">community icons to distinguish them within the lists. But I think that'd add excessive clutter. Other ideas are welcome; but I think the current layout has to go.<p> (BTW, I wrote the "make mutual friends boldface in userinfo" thing ... will post a patch tomorrow. *yawn*)
Subscribe
  • Post a new comment

    Error

    Anonymous comments are disabled in this journal

    default userpic

    Your reply will be screened

    Your IP address will be recorded 

  • 51 comments
Previous
← Ctrl ← Alt
Next
Ctrl → Alt →
Previous
← Ctrl ← Alt
Next
Ctrl → Alt →