PDA

View Full Version : Customize Fishbone



evanhood
2005-07-07, 15:56
So the fishbone skin is really great, and gives me all the functionality I need...except for one. As far as I can tell if I'm browsing the current playlist of songs and it's large enough that there is more than one page, there is no way to jump back to the song that is currently playing in the playlist under the Play, pause, etc. The NMBU skin has this ability when you click the song title in now playing, but when you do that in fishbone it takes you to information about the song in the left pane. I took a gander at the code, but don't really know html very well and definitely know nothing about javascript so it all looks really greek to me. Any one know what lines of code I could swap from the NMBU skin into the fishbone skin to get that ability?

Also, if the person who created fishbone happens to read this, the only other thing that would be nice, would be the ability to increase the font size, or at least the size of the buttons that add songs to the playlist since the text size in IE has no effect on this (imagine cause it's javascript?)

All help appreciated!

kdf
2005-07-07, 16:18
Quoting evanhood <evanhood.1rtnlz (AT) no-mx (DOT) forums.slimdevices.com>:

>
> So the fishbone skin is really great, and gives me all the functionality
> I need...except for one. As far as I can tell if I'm browsing the

thanks!

> Any one know what lines of code I could swap from
> the NMBU skin into the fishbone skin to get that ability?

find this line from Fishbone/status_header.html (around line 55):
<a class="songtitle" href="songinfo.html?item=[% track.id %]&amp;player=[%
player | uri %]" target="browser">[% songtitle %]</a>

rewrite it as:
<a class="songtitle" href="playlist.html?player=[% player | uri %]#currentsong"
target="playlist">[% songtitle %]</a>

> Also, if the person who created fishbone happens to read this, the only
> other thing that would be nice, would be the ability to increase the
> font size, or at least the size of the buttons that add songs to the
> playlist since the text size in IE has no effect on this (imagine cause
> it's javascript?)

It's because they are images. If you edit browsedb_list.html (or
browsedb_artwork.html, and status_list.html, browsetree_list.html), you can
change the height and width number (where they exist) and have them scaled up,
albeit nto the best quality scaling.

I've always wanted to make it more stylesheet friendly, so that all that kind of
stuff can just be tweaked in the css file. Sadly, time just does't play along
:)

oh, and after you do all this customisation, consider copying teh whole Fishbone
directory to a folder of a different name, and choose that as your skin. It
will avoid the eventual sadness of having it overwritten when you upgrade
slimserver.

cheers,
kdf

evanhood
2006-04-02, 15:54
KDF, thanks for the code changes. For going to the current song, that worked like a champ (even though the existing code seems to have changed, using the latest nightly 6.5 build)

Little confused on the changing of the height for the play/add/etc buttons. You mention the browsedb_list file and in searching there isn't that file in the fishbone directory. Doing some more digging there is that file in a couple other folders and I changed some values and tested but can't seem to get anything to change. Does the fishbone skin refer to html files in other folders as well?

Last thing, trying to have a party and have people add songs to the playlist is a nightmare because eventually someone has enough adult beverages that they forget to NEVER click play and they wipe out the playlist, which upsets everyone else who added to my saved playlist. Can I either remove the play button entirely or change it so that it adds files to the end of the playlist without clearing everything?

Thanks again for all your help, and for all the work you've put into what is IMO the best slimserver skin out there.

kdf
2006-04-02, 16:08
On 2-Apr-06, at 3:54 PM, evanhood wrote:

>
> KDF, thanks for the code changes. For going to the current song, that
> worked like a champ (even though the existing code seems to have
> changed, using the latest nightly 6.5 build)

yes, many changes in 6.5. Probably more to come, and I'll certainly
start taking a look at other skins to merge in any redundant blocks.

> Does the fishbone
> skin refer to html files in other folders as well?

for much of the recent changes, you want to look in EN, and not just
Fishbone directory. Thanks to the Template Toolkit and CSS changes,
much of the EN, Default and Fishbone skins have been blended into
common templates in the EN directory. Every template falls back to EN
if not found in the skin dir. cmdwrappers handle wrapping common urls
with skin-ed layout framework.

> Can I either remove the play button entirely or change it so that it
> adds files to the end of the playlist without clearing everything?
>
should be a matter of removing the PROCESS cmdlink section from the
playlink BLOCK in EN/cmdwrappers

or, in Fishbone/cmdwrappers_fishbone, add [% BLOCK playlink %][% END %]

to change it, just copy the addlink block from EN and put it in the
cmdwrappers_fishbone as playlink.

that should make it disappear, though you will want to make sure you
have cleared any caches if it doesn't disappear immediately.

-kdf

evanhood
2006-04-02, 18:15
I edited the cmdwrappers_fishbone file per your post and poof the evil play button is gone. Thanks!

In my searches and browsings I was starting to think that the EN directory looked like a default location that skins fell back on for info. I pulled up the files you mentioned in your first post and looked for height and width settings but only saw them for album art in one of the files. Not sure if that functionality moved or if the height values were removed or I'm just blind.

Any other hints as to what and/or where I could modify the size of the play next, add, remove, up down, etc buttons? Could I just modify the .gif files in an image editor to make them slightly larger or would that mess up column sizes/text/etc?

Can't thank you enough for taking time to help a noob.

kdf
2006-04-02, 22:18
On 2-Apr-06, at 6:15 PM, evanhood wrote:
>
> Any other hints as to what and/or where I could modify the size of the
> play next, add, remove, up down, etc buttons? Could I just modify the
> .gif files in an image editor to make them slightly larger or would
> that mess up column sizes/text/etc?
>
layout stuff = *.css and cmdwrappers_* files.
more details are on the wiki, as a work in progress

geoffb
2006-04-03, 08:49
On 7/7/05, evanhood wrote:
> Also, if the person who created fishbone happens to read this, the only
> other thing that would be nice, would be the ability to increase the
> font size, or at least the size of the buttons that add songs to the
> playlist since the text size in IE has no effect on this (imagine cause
> it's javascript?)

Assuming from your IE reference that you're using Windows, you might
want to try easyRead:
http://www.iconico.com/easyRead/

I find it does a much better job scaling web pages than changing IE's
text size setting. On the Fishbone page, it does a passable job of
scaling the buttons too.

Cheers
Geoff

evanhood
2006-04-03, 10:49
For anyone who wants to change the text and or button sizes of a skin, here's what I found worked. (although the quality of the button scaling isn't so hot, it is functional)

edit the skin.css file in the directory of the skin you want to change.

To modify the size of the body font, change the "TD, P, A" section's font-size value. I found that 14 worked nicely on my 1280x1024 flat panel.

To modify the button size you need to add "height" and "width" values to the ".browsedbControls img, .playlistControls img" section. I specified "15" for these.

To position the button images closer to the center of the row they are in instead of all the way at the top you can change the "top" value of the ".browsedbControls,.playlistControls" section. I changed mine to "3px"

If you don't increase the font size then you'll need to increase the size of the space between lines which can be done by adding a height value to ".browsedbListItem", making it slightly larger than the height of the control graphics.

Figured I'd just pass this along to anyone else who knows squat about CSS's and doesn't want to wade through the trial and error I just did.

Enjoy.