PDA

View Full Version : Problem with plugin web ui for Fishbone



erland
2006-05-03, 05:43
I have a problem with the web ui in TrackStat for the Fishbone skin.
The problem is that I am trying to show the ratings and play counts right aligned directly to the left of the add/play controls. The following code is a simlified extract of the html file that shows the list of tracks. The problem is the "controls" BLOCK.
In slimserver 6.5 30/3 this worked correctly, but something has been changed in the stylesheets since then that causes my rating and play counts to be shown on top of the add/play buttons instead of beside them.



[% FOREACH item = browse_items %]
[% BLOCK controls %]
[% IF item.song_count %]([% item.song_count %])[% END %]
 
[% loop = 0 %]
[% WHILE loop < 5 %]
[% loop = loop + 1 %]
[% IF loop <= item.rating %]
<img src="[% webroot %]plugins/TrackStat/html/images/star_noborder.gif" width=13 height=13>
[% ELSE %]
<img src="[% webroot %]plugins/TrackStat/html/images/empty_noborder.gif" width=13 height=13>
[% END %]
[% END %]
[% WRAPPER playlink %][% PROCESS cmdHRef cmdType='play' target='status' %][% END %]
[% WRAPPER addlink %][% PROCESS cmdHRef cmdType='add' target='status' %][% END %]
[% END %]
[%- WRAPPER contentitem controls='controls' %]
<div style="width:77%">
[% PROCESS trackinfo %]
</div>
[% END %]
[% odd = (not odd) %]
[% END %]


Should I be able to add right aligned information when using the "WRAPPER contentitem" and "BLOCK controls" element or do have to implement my own elemnents to solve this ?

Or have I just done something wrong ?

The attached two pictures to show how it looks like(in nightly from 28/4) and how I want it to look like(from nightly 30/3).

I appreciate any help or ideas.

kdf
2006-05-03, 10:12
the controls are using floats, so that the mixer icons don't have to offset the rest (since they end up filling in toward the centre). However, this should still not affect things when you are using the cmdwrappers. I'll try having a look at it tonight.

kdf
2006-05-03, 10:15
oh, as an initial thought, try adding a div around your ratings, using style="float: right;" and have it after the play/add links.

-k

erland
2006-05-03, 22:17
oh, as an initial thought, try adding a div around your ratings, using style="float: right;" and have it after the play/add links.
-k

Thanks for the idea, I changed the order of the add/play and ratings inside the controls block and added a div with style float:right together with some other styles and that seems to do it.

The code that works looks like the following:

[% FOREACH item = browse_items %]
[% BLOCK controls %]
<div style="float:right; width:170px; text-align:right;">
<div style="">
[% WRAPPER playlink %][% PROCESS cmdHRef cmdType='play' target='status' %][% END %]
[% WRAPPER addlink %][% PROCESS cmdHRef cmdType='add' target='status' %][% END %]
</div>
[% IF item.song_count %]([% item.song_count %])[% END %]
&nbsp;
[% loop = 0 %]
[% WHILE loop < 5 %]
[% loop = loop + 1 %]
[% IF loop <= item.rating %]
<img src="[% webroot %]plugins/TrackStat/html/images/star_noborder.gif" width=13 height=13>
[% ELSE %]
<img src="[% webroot %]plugins/TrackStat/html/images/empty_noborder.gif" width=13 height=13>
[% END %]
[% END %]
</div>
[% END %]
[%- WRAPPER contentitem controls='controls' %]
<div style="width:77%">
[% PROCESS trackinfo %]
</div>
[% END %]
[% odd = (not odd) %]
[% END %]


To get the code to also work with the default skin I also needed to add the extra <div style="float:right;"> around the the add/play buttons. So that is the reason I have the extra div around the add/play buttons with no style. The idea is that I want to have the same HTML code for all skins, so in Fishbone the style for this div will be empty and in Default skin it will be "float:right;".

CSS is not my strong side, so if there is an easier/better way to do this I would appreciate all help I can get.

The only thing that I would like to get rid of is the width:170px part in the style but it does not seem to work without it nor replacing it with width:100%.