Resizable Customizable Domestic Advisor

[Dresden]

Note: this topic was originally about adding different sizing options to the CDA, but now it's more of a catch-all for all things CDA.

Time to split off the CDA discussion from the new features topic so I can spam pictures all over the place and feel less guilty about it. Note that most pictures are thumbnails which link to full-size versions

Current CDA (BUG 3.5):
The screen is always 1024x768. The panel is offset by 29 px from the top and 177px from the bottom meaning it is only 562 px tall; in terms of coords relative to the screen it occupies (0,29) to (1024, 591). If your game resolution is larger than that, it simply centers itself in the space and does not change size. So it looks like this:



First is a 1024x768 game window; second is 1280x800; third is 1440x900

Large Size:
What I have done is make it scale to resolution. It will expand left/right from its minimum 1024 to (nearly) the full window width; a buffer of no more than 40px on each side (changeable in Python; could become an option if needed) will occur at higher res just cause I thought it looked a bit nicer. So here is the larger size with the same 177 px gap at the bottom to show the production buttons. The top has a small gap (23px) similar to the old one at low resolutions but increases to as much as 105px (to allow access to the culture sliders) at high resolutions.



First is a 1024x768 game window; second is 1280x800; third is 1440x900

Options:
But wait, there's more. I'm also adding a BUG config option that lets you determine the minimal amount of space you want up top. I'm not yet completely happy with the text and it might be too wide right now but here are your options:

So here's 1024x768 res with "Minimal" and "See Culture Sliders" options respectively:



I'm looking for any feedback on this, particularly as it relates to the options. Right now the options only affect the minimum spacing because they were implemented last. So if I have monster resolution and choose "Minimal" it still leaves space for the culture sliders which is counter intuitive unless I do a way better job with the hover text. It is probably better off (and less confusing) to have the option apply exactly since people aren't likely to change their resolution very often anyway.

Also, the current implementation calculates the dimensions/positions every time you open the CDA. I had originally put in a flag that would make it only calculate once but then it doesn't react to changing resolutions (or BUG options) on the fly and that should probably be fixed.

And regarding the width, 40px buffers on the sides are probably too large. Other widescreen advisors use different numbers (the EFA and MA use 20px per side and the widescreen tech advisor uses 30) and we should probably be consistent.

 

[The Doc]

For the 1024-res, I would prefer the CDA to still show the Great Person Progress Bar instead of just the Tech bar.
For resolutions above that: Is it possible to have the CDA scale automatically like the BUG Military Advisor does? Maybe in a set ratio (16:9 or whatever it is now) up to a specific width and height (having it extended all over the screen in 1920x1200 wouldn't make it exceptionally readable )?

 

[Dresden]

For the 1024-res, I would prefer the CDA to still show the Great Person Progress Bar instead of just the Tech bar.

You can do that with the options. If you pick "show advisor buttons" then you can also see the GP Bar.

For resolutions above that: Is it possible to have the CDA scale automatically like the BUG Military Advisor does? Maybe in a set ratio (16:9 or whatever it is now) up to a specific width and height (having it extended all over the screen in 1920x1200 wouldn't make it exceptionally readable )?

This proposal would scale it automatically but it is constrained by the options. Based on your reply and ruff's comment in the other thread, I am thinking that perhaps a second option relating to width would be useful too. The tricky part is getting a set of options that are useful and easy to understand without being overwhelming because there are too many or they are too complex.

How many spacing options would be best? We could go with as many as 4 (Above, Below, Left, and Right) however I don't know how useful a "Below" option would be since in most cases you want to keep the production buttons accessible and the "Above" option can control the height. Left/Right could be combined into one option too although I can see a situation where someone might want the left large enough to get to the sliders but the right to not be so large.

A three-option proposal could be:

• Above Space
  • Minimal/None (0px)
  • Small (i.e. enough to see the turnclock and tech bar; ~25px)
  • Medium (i.e. enough to see the advisor buttons and bars below the tech bar; ~55px)
  • Large (i.e. enough to see all the culture sliders; ~105px)
• Left Space
  • Minimal/None (0px)
  • Small (i.e. the standard 20px that the EFA/MA use)
  • Medium (i.e. something like the 40 px in the previous screenshots)
  • Large (i.e. ~110px on left to reach the sliders)
• Right Space
  • Minimal/None (0px)
  • Small (i.e. the standard 20px that the EFA/MA use)
  • Medium (i.e. something like the 40 px in the previous screenshots)
  • Large (i.e. ~110px to balance a large left)

A possible two-option proposal would be:

• Above Space
  • Minimal/None (0px)
  • Small (i.e. enough to see the turnclock and tech bar; ~25px)
  • Medium (i.e. enough to see the advisor buttons and bars below the tech bar; ~55px)
  • Large (i.e. enough to see all the culture sliders; ~105px)
• Side Space
  • Minimal/None (0px)
  • Small (i.e. the standard 20px that the EFA/MA use)
  • Medium (i.e. something like the 40 px in the previous screenshots)
  • Large Both (i.e. something like 110px each side; enough to adjust the sliders on the left but keep it centered)
  • Large Left (i.e. ~110px on left to reach the sliders but less (probably 0 or 20) on right)

In either case, the choice would always apply regardless of resolution; you are telling it how much space to leave and the screen expands until it hits those boundaries. Thoughts?

Note: I change the topic title to something that I think better reflects the direction this is taking.

 

[Dresden]

Okay, I've decided to go with 2 options for now to save space and the options will be absolute. If you choose "Small" space above, then that exact amount of space is what you get no matter the resolution. Defaults will be small for both.

Here's a look at the options. If there are no problems I'll probably commit it sometime this weekend.

Overall layout:

Option #1:

Option #2:

Resizable CDA in action:
1440x900 with Medium space at top & Large Left space to sides:


1024x768 with Small space at top & None to sides (basically matches previous size):


Somewhat off-topic: The hover text there is a little fancier than most other dropdown options but I think it looks nicer and is easier to read than just plain white text everywhere. Anyone have any opinions on that?

 

[EmperorFool]

That looks terrific. Another fine addition, Dresden.

The hover text there is a little fancier than most other dropdown options but I think it looks nicer and is easier to read than just plain white text everywhere. Anyone have any opinions on that?

Absolutely. I thought I tried using the same formatting and icons when I first set up the hovers, but the text was in Python before. I wonder if putting it into XML gave us more options?

In any case, I would definitely like to see this formatting pushed into the other hovers. The list bullet is great, and I like the color. Off the top of my head I cannot think of any other formatting we'd want to apply. Anyone else? You might want to email the team list just to catch the documentation team to see if they have any thoughts on it.

 

[Cammagno]

Somewhat off-topic: The hover text there is a little fancier than most other dropdown options but I think it looks nicer and is easier to read than just plain white text everywhere. Anyone have any opinions on that?

Wonderful, we have to apply it everywhere in BOS!

 

[draco963]

How do I get my hands on this? I don't see a download anywhere...

 

[Dresden]

It's in the current development version which can be accessed via an SVN client. See the instructions in the download topic.

 

[Dresden]

This doesn't have anything to do with resizing, but it does have to do with the CDA so what the hell...

I like colors. I also sometimes find it hard to pick out which cities are building units or who is still stuck building Wealth when looking at the CDA. So, to address some of that here's the initial test of color-coded production options for the CDA.

My idea is that there will be 3 choices:

Spoiler preview; links to larger size :

1. No color-coding (just like it is now)
   
   Spoiler preview; links to larger size :

   
2. "Simple" color-coding; each of the following can have different colors; my test colors (some of them pretty bad) are listed
   • Buildings (including Wonders) - White
   • Processes (e.g. Wealth) - Yellow
   • Projects - Dk Grey
   • Units - Green
   Spoiler preview; links to larger size :

   
3. "Advanced" color-coding; each of the following can have different colors; my test colors (some of them pretty bad) are listed
   • Buildings by type
     • "Normal" buildings - White
     • National Wonders - Lt Grey
     • Team Wonders - also Lt Grey
     • World Wonders - Med Grey
   • Processes by type
     • Wealth - Yellow
     • Research - Cyan (lt blue)
     • Culture - Magenta (pinkish)
   • Projects by type
     • World Projects - Dk Grey
     • Team Projects - also Dk Grey
   • Units by domain
     • Sea - Blue
     • Land - Green
     • Air - Red
     • Immobile (e.g. ICBM) - also Red
   Spoiler preview; links to larger size :

   

Obviously, the color choices need to be improved since Blue, Dark Grey, and possibly Red are hard to read on the default theme. And Light Grey really isn't much different than white. Basically the choices started with the processes being colored similar to their icons, buildings & projects being shades of white/grey and units being whatever else was available. I was also only using the first 12 or so defined colors; there are many more choices if we used the more abstract color entries like COLOR_WARNING_TEXT and the various player-related colors. Any suggestions there are welcome.

For now the colors are hard-coded in the Python similar to how the Green/Yellow/Red for stuff like happiness are handled. It'd be better if it was more flexible but then the CDA would probably need its own tab. Also the divisions can be a little flexible. For example in the "Simple" setup it might make more sense to group Wonders with Projects for coloring. It'd take a little code juggling but probably wouldn't be too hard.

I'm also not entirely happy with the help text either and might use "detailed" rather than "advanced" so if you have wording suggestions I'd like to hear those.

Finally, please ignore the "(+5 XP)" stuff for now. That was another thing I was playing around with that fit in the same section of code but right now I want to focus on the color-coding.

 

[EmperorFool]

I'm very glad you tackled this--it's a great idea. The only suggestion I have with a semi-strong opinion behind it is "green for research" to match the beakers and bar. Other than that: use lighter colors; dark gray is nearly impossible to see against the background.

This just popped into my head. I have a version of the font file with the anchor/tank/airplane icons that NikNaks made for PLE. How about using a single color for units, but put the icon in front? We could then use the beaker/gold/music icons already present for the processes, and work in some of the other icons for the buildings and remaining things (silver star for projects, gold star for wonders). The bonus with doing this is that sorting by that column would group related builds together.

I like this because when you get over 4 or so choices, colors start to become harder to process than icons. The processes relate to on-screen elements, but the other colors are totally arbitrary, requiring memorization to be useful. Icons are immediately obvious (mostly).

BTW so far.

 

[Dresden]

Oooh. Nice idea on the icons. That might work well. We would only need an on/off option then and fewer colors. You're right that too many colors gets kinda "busy." Or maybe options like none/colors only/icons only/colors + icons. (similar to what Cam wants for the EFA )

How about yellow/green/magenta for processes with their icon, maybe cyan for units with domain icons, the middle grey for wonders/projects with the stars to differentiate, and white for normal buildings? Should everything have an icon (maybe using the bullet for normal buildings) or just some things? I can work up a test later using stuff from the current icon file to see what it would look like.

 

[EmperorFool]

+1 on everything you said. I was thinking maybe different icons for the building types, but that would also get too busy. And which icon to choose for buildings that provide benefits to multiple areas?

One more icon idea though: praying hands for missionaries and hammer (?) for workers and food for settlers. Maybe those are overkill.

I think everything should have an icon only to align the names after the icons nicely.

 

[Dresden]

Hmm. The bullet isn't as wide as the other icons so that didn't look very good... but then I remembered the special "space" icon we've added. So here's a look with the following settings:

• Normal Buildings: white, no icon
• Wonders: grey; gold star for world, silver star for team/national
• Projects: grey; gold star for world, silver star for team/national
• Processes: yellow/green/magenta; associated commerce icon
• Units: cyan with following icons:
  • Land Combat: (placeholder)
  • Sea Combat: (placeholder)
  • Air/Immobile Combat: (placeholder)
  • Spy:
  • Worker:
  • Settler:
  • Missionary:
  • Corp Exec:

A couple things bother me about that. All the various unit icons are kinda distracting and the wonder/project grey is pretty blah. So this is what it would look like using COLOR_YIELD_FOOD orange and only the icon for combat units and icon for non-combats:



We could still do different icons for the 3 domains, but they maybe shouldn't be too varied in terms of color. However, I think sticking to a single icon (or even the space) for all (or at least most) non-combat units might be a good move. Also we could maybe use then as the generic building icon instead of the space.

There's also the possibility of swapping orange to units and cyan to wonder/projects since cyan is the color of the in-game messages you get when a project is built.

 

[draco963]

Oooo... Purdy...

If I may, I agree Dresden that the cyan and orange would be better swapped. I can't wait till this is done...

 

[EmperorFool]

I agree on the color swap and minimizing the number of icons. You can always sort by that column to see related units together.

PLE uses the war (crossed swords) icon for military units and the peace icon for civilian units. Dunno if they would look as good in the table. I do like the flexed arm for combat troops, and the foot works well enough for civilian units.

 

[Caesium]

Here's a file, where MatzeHH, my co-modder for my mod, has added some parts on eXPerience. Maybe that's something, you'd like to add.

 

[Dresden]

Thanks Caesium; that goes along with the discussions from the request topic and I want to play with experience more after I finalize the color grouping.

Speaking of which, this is how the test-case looks with the units orange and wonders/projects cyan plus using the hammer icon for generic builds:



And an idea of how it looks sorted:



A more real-world example from a current game of mine:

 

[EmperorFool]

Freakin' awesome! Maybe drop the + from +#XP to minimize trimming (...) and since the # is the actual XP the unit will have once built. I like that addition.

NikNaks added the Military Instructor icon to the font file for the "# of MIs" column addition. It will go nicely with the XP per domain columns. Did you want to add those yourself along with your current work?

 

[Dresden]

Yeah, I can add the XP columns when I polish this up. Font graphics for the domains would be useful for the column headings there because otherwise we'd probably have to use something like the "LXP", "SXP", "AXP" that MatzeHH used.

For the grouping/coloring you're right about the +; I'll remove that when I make the XML entry for it (testing used a recycled one with hardcoded parens).

 

[EmperorFool]

I've committed the font file and init.xml containing the new icons: MI, domains, and a few extras not yet used. Feel free to use FontUtil to get at them.