Rockbox Technical Forums
Support and General Use => Theming and Appearance Customization => Topic started by: Bieber on July 15, 2010, 02:48:12 AM
-
I'm the GSOC student working on the Theme Editor this Summer, and I'm interested in any feedback, feature requests, etc. the community has about it. There's a wiki page (http://www.rockbox.org/wiki/ThemeEditor) about it with some more info. If you have the Rockbox source tree checked out, you can just "qmake" and "make" the project in /utils/themeeditor, or else get precompiled binaries for Windows/OSX from the link on the wiki page.
-
Hi Bieber,
I've been testing your theme editor already for a while and I'm quite happy with your work til now. Thanks for being so busy with it.
I'm currently working with your latest windows build r27405 and you've done a wonderful job so far.
It's great to open a project and have all important files listed automatically.
Selecting a file leads to the colored code so orientation is made easy.
The code is parsed in the background and errors are shown immediately - great help while coding new lines.
You've done a preview of the skins in the right upper window so the success of adding new code is shown visually - super.
In the right lower window I find the parse tree so I'm able to get more deeper into the parsing functionality.
Really a great job so far. And you've been really fast with your planned implementation !
Now that you're asking for some feedback I would like to give some suggestions as well.
1. You've added touchscreen areas, that's great but if I put them in a viewport like
%V(161,192,35,47,0)%Vf(CCCCCC)%Vb(000000)
%T(0,0,35,35,play)
If I take a look at the preview window then the touchscreen area is shown in a viewport %V(0,0,35,35,..) instead of %V(161,192,35,35,...). I think that's no big problem for you and it's the only bug I've seen so far.
2. You've placed the included files in the left window. This is the first orientation which files are important for this project. Then you've placed the source window in the middle and on the right side the preview and the parsing windows. I would like to have a bigger preview window and a smaller file window. I can resize them that's right, but maybe you could swap them (in spite you're right looking at the process: if you go from left to right you see the right order of process steps from opening a file to the parsing results) But for me a bigger preview window for the D2 skins would be great.
3. The parsing window is no big help for me trying to realize a new skin. Especially having errors I currently see no additional use of this output. I write the code with your theme editor and try it with the simulator and with the debugwps option there's the same output. And these information aren't helpful as well in most cases for me. But as a fair comment: I'm able to close the parsing error then it's ok for me (if the saved space could be used for the preview window (see 2.).
So no big issues at the moment. I'm really happy with the theme editor since now. Great job so far - stick with it, I'm really looking forward to your next steps. I saw on the wiki page you will try to implement graphical editing of WPS documents. So I'm really curious about this.
Keep it up, Bieber, you're doing a great job. :)
-
Thanks for the feedback. I'll definitely fix that touch area issue shortly.
As for the layout, I do think that in later releases I'll leave the parse tree hidden by default, and probably make the preview window a little bigger. In the meantime, you can completely rearrange the panels if you want: you can close them with the little 'x' buttons in the corners, and if you want you can grab them by the title window and drag them around, or even tear them off into separate windows. I've also added a timer module recently (I believe this was present in the last Windows build) that you can access from the view menu and dock along the edges of the main window, while we're on the topic of the layout. You can use that to step the preview forward through time, if you like.
-
Thanks for these hints, Bieber.
Dragging the windows is a nice feature but after closing the theme editor and restarting my window configuration does not exist anymore. Shouldn't it be stored in a config file?
EDIT: Sorry, I got two instances of your theme editor opened. Window positions were stored correctly - my fault.
A nice feature could be that the actual viewport regarding the actual line in the code window would be highlighted in another colour in the preview window. This would make it easier to change the viewport limits.
And yes the timer is a nice feature to test the clock depending output of the skin. On the other hand you'll get the question what's in scope of your theme editor and what's the goal of the simulator. My personal view is that a theme editor should be able enter the code, eventually to edit the code on a graphically way and to show parsing errors. The realtime behavior of the skin can be tested with the simulator, I think. So in my opinion it could be sufficient to spend the time on editing and simple previewing features otherwise the simulator will not be needed anymore ;)
So no offence, your hard work gives great results - thank you.
Edit, 15.07.2010:
Thanks for providing r27436, Bieber.
Now the touchscreen areas are working, thank you.
Would it be possible to implement a feature to set conditional viewports?
Maybe you might take a look at my AF_Remote.sbs:
http://themes.rockbox.org/index.php?themeid=884&target=cowond2
The structure of a more complex theme like this depends on conditional viewports just to show the right information at the right time. With your editor we're able to see only the static viewports - do you see any possibility here to see them all depending on manually setting the conditional?
Opening and closing the project:
The last build didn't have the close project functionality. Is it right that closing the project only closes the regarding filenames in the project window? I would have expected that closing a project means closing all open files as well but they stay open at the moment and I have to close them manually.
View of the config file:
You changed the view of the config file. The structured view in the past has been dropped for a normal text based view. When I saw your structured view at the first time I was a bit confused but it reminded me that I'm in the config file and had to change parameters and not the skin code so after a while I loved this view. Why did you drop it?
Loading a file lasts a while
The loading of a wps or sbs file lasts a bit in the recent releases. Do you check now the files before loading them? I felt loading was faster in the past. Maybe an hour glass or a progressbar would be nice...
Quit does not work
Could you please check the quit program function - nothing happens when clicking at it.
Rendering sbs
If I click on render sbs and show viewports the ui viewport is shown at the wrong place. In my AF_Satin skin I defined
# Declaration of UI Viewport
%Vi(-,135,38,170,130,-)
And this viewport is shown as
%V(0,0,170,130,-)
in the preview window.
Album art
If I define album art in my WPS I get a red/white checked rectangle in the preview window but with smaller dimensions than they are in reality. Do I interpret this the wrong way?
-
Edit, 15.07.2010:
Thanks for providing r27436, Bieber.
Now the touchscreen areas are working, thank you.
Would it be possible to implement a feature to set conditional viewports?
Maybe you might take a look at my AF_Remote.sbs:
http://themes.rockbox.org/index.php?themeid=884&target=cowond2
The structure of a more complex theme like this depends on conditional viewports just to show the right information at the right time. With your editor we're able to see only the static viewports - do you see any possibility here to see them all depending on manually setting the conditional?
Viewports can be displayed conditionally, you just need to set the appropriate tag values in the device config panel. Is there any specific tag that's giving you problems in conditionals?
Opening and closing the project:
The last build didn't have the close project functionality. Is it right that closing the project only closes the regarding filenames in the project window? I would have expected that closing a project means closing all open files as well but they stay open at the moment and I have to close them manually.
At the moment, no, it doesn't close any open files. I'll change this in the near future.
View of the config file:
You changed the view of the config file. The structured view in the past has been dropped for a normal text based view. When I saw your structured view at the first time I was a bit confused but it reminded me that I'm in the config file and had to change parameters and not the skin code so after a while I loved this view. Why did you drop it?
You can now switch back and forth between the two. If you look at the bottom left of the config file viewer, you'll see two icons. Clicking the icon with the bars will switch you to the old view, and it will stay there as long as you want.
Loading a file lasts a while
The loading of a wps or sbs file lasts a bit in the recent releases. Do you check now the files before loading them? I felt loading was faster in the past. Maybe an hour glass or a progressbar would be nice...
Could you give me your hardware/OS specs? I've never heard of the program hanging on file load, and it shouldn't take long at all. How long of a delay are you experiencing?
Quit does not work
Could you please check the quit program function - nothing happens when clicking at it.
This may be an OS-specific bug: the quit action seems to be working fine for me.
Rendering sbs
If I click on render sbs and show viewports the ui viewport is shown at the wrong place. In my AF_Satin skin I defined
# Declaration of UI Viewport
%Vi(-,135,38,170,130,-)
And this viewport is shown as
%V(0,0,170,130,-)
in the preview window.
I'll have to look into this, I thought I had the UI viewport displaying correctly.
Album art
If I define album art in my WPS I get a red/white checked rectangle in the preview window but with smaller dimensions than they are in reality. Do I interpret this the wrong way?
There's an option in the device config panel that allows you to change the album art size, so that you can observe how it will scale at different sizes. If you want it to fill the entire area you have allocated for the album art, just set it to a size >= that area.
I would also like to add that if you're compiling from source, you can rearrange the options in the device control panel by editing the file resources/deviceoptions (which is just a text file that defines all the options) and recompiling. If anyone comes up with a configuration that's more convenient than the default layout, please send it along to me and I may replace the default with it.
-
Found a bug:
%V(4,242,232,20,2)%Vf(a4c0e4)
%s%ac%?id<%id%?iy<(%iy)>|%?iy<Year:%iy|--->>
I wrote this in order to show like:
Air OST(Year:2002)
And it does works on my DAP. But when I wrote this in the Theme Editor it doesn't work.
-
Found a bug:
%V(4,242,232,20,2)%Vf(a4c0e4)
%s%ac%?id<%id%?iy<(%iy)>|%?iy<Year:%iy|--->>
I wrote this in order to show like:
Air OST(Year:2002)
And it does works on my DAP. But when I wrote this in the Theme Editor it doesn't work.
When the new parser is fully integrated in Rockbox this won't parse. The problem is that you put parentheses around %iy without escaping them. The correct way is like this
%V(4,242,232,20,2)%Vf(a4c0e4)
%s%ac%?id<%id%?iy<%(%iy%)>|%?iy<Year:%iy|--->>
-
I hope this is the right place for this...
How about adding a function that will convert an old theme to the new format?
Thanks for your hard work.
-
DavidW
This is already possible, a pre-compiled executable is here:
skinupdater (http://www.datafilehost.com/download-7bcbc8e3.html)
The syntax is: skinupdater wps_name.wps wps_new_name.wps
Update your .wps .fms and .sbs files seperately
[St.]
-
Great work so far on the theme editor. I have already used it to clean up a couple of my themes that had issues with viewport alignment. I am looking forward to the finished project.
Some comments after testing themeeditor-r27559 (windows version)
1. FMS preview does not render SBS info
2. An SBS viewport that is conditional on current screen (%cs) and playmode (%mp) does not render properly. For example, I have an SBS viewport set to display song info while the song is playing or paused and the screen is the menu screen. It is set to display an empty viewport when the song is stopped or the screen switches away from the menu screen. The current behavior of the theme editor displays this viewport properly when displaying the SBS preview, but when displaying the WPS preview it merges the contents displayed in the SBS with the contents of the WPS viewport that occupies the same screen coordinates.
3. The Export Project function creates a zip file with a top level directory with no name. It also includes all font files which are used in the theme. The standard practice for theme submission is to only include fonts which are not already included in the font pack.
4. Export Project messages could be a little more descriptive:
- Warning: configfile not found (what configfile)
- Warning: themebase not found (what themebase)
-
Great work so far on the theme editor. I have already used it to clean up a couple of my themes that had issues with viewport alignment. I am looking forward to the finished project.
Some comments after testing themeeditor-r27559 (windows version)
1. FMS preview does not render SBS info
2. An SBS viewport that is conditional on current screen (%cs) and playmode (%mp) does not render properly. For example, I have an SBS viewport set to display song info while the song is playing or paused and the screen is the menu screen. It is set to display an empty viewport when the song is stopped or the screen switches away from the menu screen. The current behavior of the theme editor displays this viewport properly when displaying the SBS preview, but when displaying the WPS preview it merges the contents displayed in the SBS with the contents of the WPS viewport that occupies the same screen coordinates.
Could you start a FlySpray bug page or otherwise contact me with the theme files that are causing these bugs for you? I have some suspicions as to what might be going wrong, but I'll need to be able to reproduce the issue the same way you're experiencing it to know for sure.
3. The Export Project function creates a zip file with a top level directory with no name. It also includes all font files which are used in the theme. The standard practice for theme submission is to only include fonts which are not already included in the font pack.
Is it not standard practice to make the first directory in the zip file .rockbox? This is how I see all the themes on the themesite. As for the fonts, the only fonts you want to put in your project's fonts/ directory are ones that you want bundled with the theme. If you take a look at the "Render" tab of the preferences dialog, you'll see that there's an option for a directory to store fonts in and a button to download the font pack. Just pick somewhere you want to keep the font pack (mine is ~/rbthemes/.fontpack, just pick somewhere that won't get in your way), click the download button, and it will dl/extract the font pack in that directory (or you can just copy them over if you already have it). You'll be able to use those fonts in your themes without having to put them in the fonts/ directory, so they won't be included in the exported project
4. Export Project messages could be a little more descriptive:
- Warning: configfile not found (what configfile)
- Warning: themebase not found (what themebase)
configfile and themebase are both internal settings that shouldn't be showing up there :( Could you show me the config file that gave you those warnings?
-
Could you start a FlySpray bug page or otherwise contact me with the theme files that are causing these bugs for you?
I have a copy of the theme uploaded on jdgordan's BIG display code cleanup task here: http://www.rockbox.org/tracker/task/11470?getfile=22284
Is it not standard practice to make the first directory in the zip file .rockbox?
The zip file that i get when exporting the project has a folder with no name at the top level and then the .rockbox folder within that one. I see this when opening the file with 7-zip. Extracting the zip file contents does give the expected results. See the attached screen shot.
As for the fonts, the only fonts you want to put in your project's fonts/ directory are ones that you want bundled with the theme.
You are exactly correct on this one. I had set up the font pack location with an earlier version that I was looking at, but had not done so this time.
configfile and themebase are both internal settings that shouldn't be showing up there :( Could you show me the config file that gave you those warnings?
See the theme linked above.
-
The zip file that i get when exporting the project has a folder with no name at the top level and then the .rockbox folder within that one. I see this when opening the file with 7-zip. Extracting the zip file contents does give the expected results. See the attached screen shot.
I can't reproduce this one, I'm going to have to take a look at with 7-zip on a Windows machine later. I'm pretty sure that my last couple revisions fixed all the other bugs you reported: if you get a chance, it would be nice to know if it worked out for you :)
-
SBS info does now render in the FMS preview and the configfile and themebase warnings on export are no longer displayed.
The SBS no longer merges the two lines on the WPS preview, but the line is no longer displayed on the SBS preview (%?cs on line 37 of the SBS file). Also, two additional lines which should prevent the the shuffle and repeat icons from displaying on the radio screen are not rendered properly (%?cs on lines 55 and 59 of the SBS file).
-
The SBS no longer merges the two lines on the WPS preview, but the line is no longer displayed on the SBS preview (%?cs on line 37 of the SBS file). Also, two additional lines which should prevent the the shuffle and repeat icons from displaying on the radio screen are not rendered properly (%?cs on lines 55 and 59 of the SBS file).
That one's not really a bug, just a less-than-intuitive feature ;) To get those things to render, you had to change the "Current Screen" setting in the "Misc." tab of the device options panel. I just committed an update that checks the file extension of documents when they're first loaded and changes the "Current Screen" setting to "WPS" for WPS documents, "FM Screen" for FMS documents, and "Menus" for SBS documents, so that should give you a better preview by default.
-
Thanks for the explanation! I had seen that setting on the Misc. tab but I didn't realize that is what it did.
-
Yeah, I know it's not entirely intuitive to have it there, but it should at least be useful when creating the SBS document, so you can see how it will look when rendered for the various screens. Hopefully the auto-setting will confuse people a little less :)
-
Pair of ideas, in an attempt to make it more WYSIWYG:
1]
how feasible would it be to code a wizard to build bitmap strip strings for playback/repeat etc tags.
the wizard could be a form questionnaire asking
width/height, and total parts (for the custom ones like volume/battery);
tag to apply it to
then according to answers provided, load a bitmap, and have it show in parts what each part will correspond to (preview function) and the tag string ready for copy/paste
the export project function would also package the bitmap in the appropriate folder when it zips.
2]
was the intention for the parser window something along the lines of having the parser pull descriptive tag definitions from a database-type file, the parser would show output similar to --debugwps from the simulator? if not, then should it?
-
Pair of ideas, in an attempt to make it more WYSIWYG:
1]
how feasible would it be to code a wizard to build bitmap strip strings for playback/repeat etc tags.
slight side issue, are you asking because %?mp<%xd(Aa)|%xd(Ab)|%xd(Ac)|%xd(Ad)|...> is too complicated? not understandable? error prone? long winded?
-
Pair of ideas, in an attempt to make it more WYSIWYG:
1]
how feasible would it be to code a wizard to build bitmap strip strings for playback/repeat etc tags.
slight side issue, are you asking because %?mp<%xd(Aa)|%xd(Ab)|%xd(Ac)|%xd(Ad)|...> is too complicated? not understandable? error prone? long winded?
Just saying the editor should have an ability to show where these parts go, and as well be able to display it into the preview window as it currently doesn't load the images listed in %xl tags unless within a project
If you are pointing out the fact i am still working on the theme with that tag usage - i've already got it straight, but changed other things.
-
no, never mind. I was hoping you would say yes that forma to display the images is hard to understand (initially)
-
Congratulations on the great work.
One minor idea, how about showing the x,y position while hovering (or clicking) in the skin preview area?
-
I've just updated the binaries of the Theme Editor I'm providing (at http://www.alice-dsl.net/dominik.riebeling/rockbox/themeeditor/) and for the first time added a NSIS based installer for Windows. This is my first attempt at an installer so please expect it to be anything but final. However, there are some things I'm not completely sure about:
- should the installer offer creating a desktop icon?
- should the installer download the fonts? Right now it does (if the option is enabled), but given that the Theme Editor itself can download the fonts too I'm not sure if it makes sense having an option to download the fonts in the installer at all.
- anything else important that's missing?
- and last: is there interest in having an installer for Windows at all? If yes please test and let me know of any issues with the installer :)
-
bluebrother,
A Start Menu entry would be nice, I have a habit of automatically selecting "no" for desktop shortcuts...(I hate them), and I was surprised to find I had to go digging to launch the app as it wasn't in my Start Menu.
re: Downloading the Font Pack, no, I don't believe the installer should do this personally.
[St.]
EDIT:
*Gah!* Ignore the part about the Strat Menu shortcut...I somehow read it as "Desktop Shortcut" in the installer :/
-
Congratulations on the great work.
One minor idea, how about showing the x,y position while hovering (or clicking) in the skin preview area?
I think I actually intended to do that before, and it fell by the wayside. I'll probably throw that in sometime next week after pencils-down (that's Monday). Right now I'm trying to get in as much as I can on the GUI editing front before Monday, and then after that I'll devote some time to the little features that I've wanted to add along the way, I think.
Edit - Actually, I just implemented that. I've been working on some graphical editing features: at the moment, you should be able to move and resize viewports, images, album art, and progress bars (although obviously resizing an image won't have any permanent effect). Clicking the little gear button at the left of the preview window will update the code with the changes you've made, and clicking the arrow button will undo any changes you've made. The coordinates should show up in the middle of the skin preview panel at the bottom. I'd love to hear feedback on any of this, right now I'm trying to decide how to work in the capability to add new viewports/images/progress bars...
-
Theme editor is coming along nicely. Great work.
Here's my feature suggestion:
Something to allow toggling different conditions. Maybe a control panel where the user can set the battery level, the volume, the play/rw/ff/stop, etc. Then based on that setting the preview window will update accordingly.
Another way to do this would be to change the preview window when the user hovers over the code.
IE:
%?mp<||%xd(Pa)|%xd(Pb)|%xd(Pc)>
Hovering over the %xd(Pa) part of this statement would show the Pa image in the preview window.
A toggling control panel would probably be the easiest to implement and also use.
Another thing that would be nice would be a few text boxes to set the various tags (artist, album, track title, etc) That way the user could see how different strings would be displayed and perhaps test the scrolling.
Keep up the great work!
-
Here's my feature suggestion:
Something to allow toggling different conditions. Maybe a control panel where the user can set the battery level, the volume, the play/rw/ff/stop, etc. Then based on that setting the preview window will update accordingly.
You might want to go exploring in the menu of the themeeditor, all this is already implemented.
Try navigation to "View - Device Configuration" (or simply press "Ctrl+D").
Another thing that would be nice would be a few text boxes to set the various tags (artist, album, track title, etc) That way the user could see how different strings would be displayed and perhaps test the scrolling.
Again, this is in the Device Configuration menu (Ctrl+D) under the tab "ID3 Info".
Scrolling and anything else that requires a timeout can can be viewed by using the "Timer" function in "View - Timer" (or simply press Ctrl+T).
Hope this helps,
[St.]
-
Don't I feel stupid!
You're right, this is all implemented... and implemented well. ;D
-
Thanks for implementing the x,y positional indicator. It is great.
One further suggestion and a possible bug:
- Suggestion - could there be an option for word wrap (for display of) of long lines (in the editor)
- Could there be a bug in the way a progress bar is displayed in the preview window? Possibly between 27667 and 27700.
The following was displayed as I expected in 27667 and the simulator
%Vl(Info_Menu_NoAA,0,199,168,2,0)
%?mp<|%pb(8,-,-,-,linebarpb.bmp)>
In 27700 the progress bar is justified to the left margin
Edit:Could it be that x&y got somehow reversed?
Thanks again for your work.
-
It feels like the last two builds have started to double up the directory names when loading images within projects? i've tried a pair of projects and get the projectname/projectname/wps/wps/projectname/imagename.bmp is not found error
-
Just wanted to chime in with a thank you for this. Fixing themes is way easier than going back and forth with the simulator line by line.
However, my first attempt at fixing a wps for the current build is still borked according to Rockbox...
-
its definitely line 17! I'll wager those 3 dots that it is anyway
-
its definitely line 17! I'll wager those 3 dots that it is anyway
You sure?
As for a more serious response: the lastest build of the Theme Editor is around a month old, and unless I'm mixing things up there have been changes to the WPS syntax / parser in the meanwhile.
-
I've designed a theme that works well in the editor except that the animations I've designed won't show. They work as intended on the Clip itself and the Simulator, so I was wondering if someone could point out how to get it working properly in the Editor.
http://themes.rockbox.org/index.php?themeid=1425&target=sansaclipplus
The Trouble code is this:
%xl(S,s1.bmp,0,0)
%xl(T,s2.bmp,0,0)
%xl(U,s3.bmp,0,0)
%xl(X,s4.bmp,0,0)
%xl(W,s5.bmp,0,0)
#%Vl(g,0,0,120,19,6)
%t(3)%pb(0,0,-,19,-,slider,S,nofill,nobar);%t(3)%pb(0,0,-,19,-,slider,T,nofill,nobar);%t(3)%pb(0,0,-,19,-,slider,U,nofill,nobar);%t(3)%pb(0,0,-,19,-,slider,X,nofill,nobar);%t(3)%pb(0,0,-,19,-,slider,W,nofill,nobar)
#
-
It just.....wont.
You're using syntax that is far newer than the theme editor is aware of.
With the changes in the skin syntax of late, its really best to not use the theme editor.
You'll make a grand theme that works fine in the editor, with old and perhaps inefficient syntax, that doesn't work on device. Or try to edit a new theme with modern and efficient code, that doesn't works on the device and not at all in the theme editor ;)
"Mr. Someone" needs to put some work into syncing the theme editor to current SVN...the problem is, those that know the syntax either (or a combination of all) have disappeared (albeit temporarily or from lack of time), quit Rockbox development, or run screaming from the implementation used in the theme editor...
On the upside, we *did* get a shiny new skin parser in core out of the theme editor development, so even if it is currently broken (the editor, not the parser)...that was a pretty big plus.
[Saint]
-
I'd personally prefer to use the Simulator :-*. But, the Simulator can do way more with themes than my Clip actual. The Editor, from when I tried it a few months ago, and am trying again now, seemed to be less tolerant of not so good code. What I like about the Editor, is that the changes seem to take effect immediately, whereas, on the Simulator, my fingers are doing the two-step, while I sleep. All those bloody key-presses ;D and now that I've tried it again, I think I could get to liking it.
It's a good thing that I'm able to pause the Rugby. Go the All Blacks!
-
In theory, the sim and the device should behave exactly the same with regard to skins...if they don't, that would be a bug.
Can you clarify on the differences you see?
[Saint]
-
Can you clarify on the differences you see?
[Saint]
Absolutely. I'll have to take some time to recall those I've noticed. But, I'll come back about it. Two that come to mind, are that the Sim allows the use of extra Bitmaps, or at least, more repeats of the stored images. Able to handle more combinations, and sequences. Probably the best way would be for me to find some examples. I'll dredge back through previous saves, or just try and replicate them.
I have a suggestion for a change to two of the plugins. Do I make those suggestions in the Features section?
Gawd. I'm so nervous about the game, I'm still watching the Anthem.