How to add live scoreboards to custom made parks

[Jorin Guderian]

Hello guys,
adding scoreboard surfaces to your custom made parks works the following way:
-use a texture file with the name ootp_scoreboard_0.png . If you want to have more than
one scoreboard, then the second one would have a texture with the name ootp_scoreboard_1.png
attached and so on. That way the app gets to know what is supposed to be a scoreboard.
The texture file itself is more a placeholder and not really used, so you can use a a file that is
just 2x2 pixels of size to not waste memory. But the texture coordinates have to be set that
way, that the whole image is shown, not just a part of it and the texture should not repeat itself
on the polygon surface.
-Each scoreboard has a layout file. That file is simply a text file with the ".sl" suffix for "scoreboard layout".
Here is one example file with comments:

************************************************** **
1, //file version
1024, //width
707, //height
0,0,0, //default color as rgb
5, //amount of layout elements
0,1,6,7,5, //order of layout elements
0, 532, 834, 707, //1. elements position as min_x, min_y, max_x, max_y
834, 532, 1024, 707, //2. elements position as min_x, min_y, max_x, max_y
545, 0, 1024, 265, //3. elements position as min_x, min_y, max_x, max_y
545, 265, 1024, 532, //4. elements position as min_x, min_y, max_x, max_y
0, 0, 545, 532; //5. elements position as min_x, min_y, max_x, max_y
************************************************** **
But for that file to work, all comments need to be deleted first. The working file would look like this
without the "*************..." on top and button:
************************************************** **
1,
1024,
707,
0,0,0,
5,
0,1,6,7,5,
0, 532, 834, 707,
834, 532, 1024, 707,
545, 0, 1024, 265,
545, 265, 1024, 532,
0, 0, 545, 532;
************************************************** **

The width and height values should not be seen as a "real" resolution but more
as a describtion of the aspect ratio. For example 100w 50h would mean the same thing
as 50w and 25h.
To get all these values easily, do the following thing:

1.In your 3d editor like SketchUp or Blender look at your modeled screen so the virtual camera is in the center and the screen
borders are parallel to the viewport borders. Then use a snipping tool to make a screenshot only from the part of the screen that show pixels that are part of your modeled screen.

2. (Optional) In the snipping tool click on copy and then open irfanview and past it there. Then in irfanview
go to "Image>Resize/Resample" and set the widht value to 1024 or something else, but make sure the number is dividable by two. This step mainly
serves to create a grid that is easy to imagine. Like for example if I would ask you what pixels are at the center
of an image left to right when the with is 1024 ....correct, its 512.

3.Now you are ready to specify your layout. If its easier for you, you can now save and open that image in a paint
program and paint different colored squares to where you would like the screen elements to be and you have to decide of which type it is supposed to be.

The codes for the layout / screan elements are:

0 = linescore
1 = current_count
2 = lineup_home
3 = lineup_away
4 = field_plan
5 = player
6 = batter stats
7 = pitcher stats
8 = lineup for team at-bat
9 = lineup for team on defense

You should choose the size and aspect of each layout element so that it works well together with its type.
your layout can consist of a single element or up to 8 elements. Save your layout as another image
without changing the resoluton

4. Now you can actually start to replace the values in the demo file above with the values for your layout.
Keep the "1" as file version, then replace the resolution with the one of your image, then change the
0,0,0 to something else if you don't want the default color to be black. Now change the 5 if you have a different
amount of layout elements. Now you can decide in which order you want to specifie them beginning
from the next line on. "0,1,6,7,5," means first is the linescore, then the current count then batter stats, pitcher stats and player.
Change the values so they resemble your amount of elements and order in which you would like to specify their positions.
Now open your saved image in irfanview again. To get the smallest and tallest XY values for each element,
you have to click in the upper left corner while keeping the left mouse button pressed. On the top left of the
irfanview window border you now get displayed the X and Y values for that position. Those are the first two values
of your 4 values line for your first layouts elements position. You get the remaining two by klicking into the lower right corner of the same
element in the irfanview window. Do the same thing now for all the other layout elements.

5.When you are done make sure that all lines but the last one in the text file end with a "," and that the last one ends
with a ";" Safe the file and give it the name "scroreboard_0.sl". If you want to have more than one screen, you
have to name the second screen layout file "scroreboard_1.sl", the third one "scroreboard_2.sl" and so on.
The .sl files have to be in the same folder like the .obj and .mtl files.


As long as you do not want to create a custom
layout, all you have to do to make it run in your parks is just to copy one of the
existing .sl files to your stadium folder plus the placeholder image texture
file with the name ootp_scoreboard_0.png and then have that
"ootp_scoreboard_0.png" written in your parks MTL file in one of the
texture describtion sections like shown below. You can even export your
stadium using another texture file to create the OBJ and MTL file and then
open the MTL file afterwards with a text editor and replace the Texture name you've used
in Sketchup with "ootp_scoreboard_0.png" and it should work.

Attached to this post is a minimal example "ootp_scoreboard_demo.zip" for you. Just extract the folder in the zip from the attachement into the ballparks/models folder.
When you open that stadium in ootp, you should see a scoreboard just in front of you.
When opening the MTL file, you see the "ootp_scoreboard_0.png" at the button of the second section:

newmtl scoreboard_1
Ns 96.078431
Ka 0.000000 0.000000 0.000000
Kd 0.640000 0.640000 0.640000
Ks 0.500000 0.500000 0.500000
Ni 1.000000
d 1.000000
illum 2
map_Kd ootp_scoreboard_0.png

And once you tried that one, you can also try out the second attached file "multiple_scoreboards_demo.zip" that shows multiple scoreboards.

If your scoreboard just looks black in game or just fills part of the surfaces area and the rest shows black, it is very likely that you havn't Setup the textures UV map (texture coordinates).
Here is a screenshot from blender that Shows how it looks when the UV map isn't congruent with the image in the UV space and a second one that shows how its supposed to look:

[Deft]

THANK YOU!! Will start working on this tonight!

[eriqjaffe]

BTW, there's a relatively simple way to figure out all the coordinates in Photoshop.

1. Create a mockup of the scoreboard using a document of the correct dimensions, and then draw rectangles for the various elements. The colors don't really matter but make sure they're pretty different where they meet. This is my mockup:
   
   
   
2. Use the magic wand tool to select whichever rectangle you want the coordinates for. This is why you'll want the colors to be different.
   
   
   
3. Enter "Free Transform" mode - in Windows it's CTRL-T. You'll notice that the selection box will now have handles for transforming the selection.
   
   
   
4. Click the top left box in the little matrix thing in the toolbar. That will give you your min_x and min_y coordinates.
   
   
   
5. Click the bottom right box in the matrix, and that will give you your max_x and max_y coordinates.
   

Just plug those coordinates into the .sl file where applicable and Bob, as they say, is your uncle.

[eriqjaffe]

And if you don't have Photoshop, you can do it with GIMP!

1. You'll need to unzip the attached python script into your plug-ins folder. The default path for Windows is C:\Users\(your name)\AppData\Roaming\GIMP\2.10\plug-ins. You can find the path by going to Edit -> Preferences -> Folders -> Plug-ins. Note that if you are using macOS or Linux you'll need to make sure the script is executable:
   

   chmod +x selection_dimensions.py

2. Create the mockup, same basic instructions as the previous post.
   
   
3. Use the magic wand tool to select a rectangle.
   
   
   
4. From the "Select" menu, choose "Show selection margins"
   
   
   
5. The coordinates will show up in a dialog box.
   

[Deft]

Thanks, eriqjaffe!

[Braden]

Originally Posted by eriqjaffe

And if you don't have Photoshop, you can do it with GIMP!

1. You'll need to unzip the attached python script into your plug-ins folder. The default path for Windows is C:\Users\(your name)\AppData\Roaming\GIMP\2.10\plug-ins. You can find the path by going to Edit -> Preferences -> Folders -> Plug-ins. Note that if you are using macOS or Linux you'll need to make sure the script is executable:
   

   chmod +x selection_dimensions.py

2. Create the mockup, same basic instructions as the previous post.
   
   
3. Use the magic wand tool to select a rectangle.
   
   
   
4. From the "Select" menu, choose "Show selection margins"
   
   
   
5. The coordinates will show up in a dialog box.
   

I have been trying for hours to get this to work with either gimp or photoshop and get nowhere. I can never get to the coordinates. All I want is scoreboard with the at bat player photo on top current count under it. Is there any way you make this form as a download?

[Jorin Guderian]

Hey Braden,
then just do it using IrfanView like I've described it in the first post:

"Now open your saved image in irfanview again. To get the smallest and tallest XY values for each element,
you have to click in the upper left corner while keeping the left mouse button pressed. On the top left of the
irfanview window border you now get displayed the X and Y values for that position. Those are the first two values
of your 4 values line for your first layouts elements position. You get the remaining two by klicking into the lower right corner of the same
element in the irfanview window."

[silvam14]

Heres a video I just recorded for those who may need help creating scoreboards in OOTP26 using sketchup. I hope people find it helpful.

Thanks

https://youtube.com/live/pCiQi3GP-Ug