The 'Minima' Blogger Baseball Scorecard

Introducing an important milestone in the development of this html baseball scorecard

I began this html scorecard project to score baseball games in a blog about a year ago. I started with very little experience in coding - just a basic understanding of blog writing production coding;  like how to write code to make a link, how to code for italics, bold, make a headline sized font - basically stuff I learned producing the style I wanted and fixing problems while blogging over seven years.

Last spring I hacked a table out of an ESPN page that had 10 columns; I figured I could create a 9 inning wide by nine batter deep table with it - and score a baseball game using notations I would invent on the keyboard. (See Michael Holloway's Baseball Blogs - Thursday, May 6, 2010: "My HTML Baseball Score Card Hack".)

It worked fine, but it was pretty sprase looking - and the more data I added to each at-bat 'box' the more distorted the scorecard graph became ... so sometimes one couldn't quite follow what inning or what batter you were looking at. In the first go around I didn't know what 'cascading style sheets' were (they were those scary looking squiggly lines at the top that I never touched for fear of blowing up my computer), and I quickly threw out the CSS notation as they didn't do anything (I hadn't imported the style sheet). So I began by making boxes with html style tags - using width and height in almost every line of code. (Interestingly my development path followed the same path - ten years later - that led programmers to develop CSS.)

My learning curve in table making was all about stabilizing the scorecard graph while at the same time inventing a scoring notation that one could create with a keyboard, and creating a card that had enough room to score 'everything'.

The result is the table below which is made entirely of CSS boxes - 80% of them hidden from view now (thus the "Minima"). Those boxes are the 'skeleton' that keeps the thing stable. Below in the first player row of at-bat boxes, I've input some scoring notations that test every parameter of the scorecard and show some extreme scoring situations that test the size of the text areas - thanks to, for example, the Blue Jays vs. Mariners - April 11th, bottom of the 8th inning - 3 bases loaded walks. (See the 8th inning - April 11)

The places where text is input give you a clue to where the invisible or 'transparent' boxes are - the four quadrants around the diamond shape are the four - of Twenty boxes that make up One at-bat box - that can receive text; the rest hold the diamond shape in place, 'pressing' against the table that holds them, all the tables of all the rows constructed exactly the same so that when a reader zooms in and out, or resets their screen resolution - nothing moves relative to the rest. So anyone can learn to read it with out a jumble of distorting x, y axis making it difficult.


The next step in this project is to set up a web address, turn a computer into a server and rebuild the scorecard with position attributes, and use server-side includes (SSI) to lay in the tables (there are 333 of them in all - but only 13 different tables in all.)

Soon I'll need some programming help (and some financial backing - hint, hint), to produce a web site where people an come and score baseball games - a whole social networking thing with-in a baseball scorekeepers meme - anally retentive people like myself scorekeeping, saving scorecards to their personal accounts, printing copies, sharing them electronically, talking about scoring techniques in forums, developing the craft and the scorecard in wikis... .

Later still, and on the 'drawing board' (in my head) is an idea for a program that can 'lay in' data into these scorecards in real time, taking advantage of the work done at Retrosheet, to produce scorecards that update as the game progresses. Conversely a similar 'scraper' could extract data from html scorecards - written according to Project Scoresheet notations guidelines - to build an digital archive of baseball from across the culture - woman's leagues, children's leagues and even co-ed softball bar leagues.

If information is power then this much baseball information would be... well, confusing - and that ain't all bad.


Much thanks to:

• Kathryn Barrett, Sr. Publicist at O'Reilly Media, Inc who prized me Head First HTML, just for responding to a questionaire after an O'Reilly Web Cast.
• Also kudos to W3C school's CSS Tutorial pages and especially their neat-o "Try It Yourself" widget which I will continue to use extensively as I move forward.
• And thanks to Robert Brodrecht of "Robertdot" for being so clear and concise about "Triangles in CSS".
• And last but not least, my friend Chris F.A. Johnson who's timely tips and regular cues in direction have sped my learning - and who's vast knowledge of coding has helped make me aware of some of the best practices in this sub-culture of coding crafts-people.

Please note: I am self taught and don't follow the paths of teachers - rather the path of necessity (the mother of). Some may find my seemingly gargantuan gaps in knowledge unfathomable - and my blithe ignorance of well known CSS solutions worrisome ... so for those who's materials I have used as reference or who's advice I have sought, it should be noted that they are not to blame for the way I learn - I am.  :)

mh

A coloured angle indicates where a runner is, and how they got there

Red is an out.

Pink are un-earned bases - wild pitch, passed ball or an error.

Yellow is Intentional Base on Balls or Defensive Indifference.

Neon Green is a base hit.

Forest Green is a runner advanced by a base hit.

Ocean Blue is a stolen base.

Neon Blue is a base earned via a hit that results in a run scored.

Box Score 1st 2nd 3rd 4th 5th 6th 7th 8th 9th Runs Hits Errors Visitors 1 4 0 Home

Visiting Team 1st 2nd 3rd 4th 5th 6th 7th 8th 9th AB R H BB SAC RBI SO HBP LOB 2BH 3BH HR AVG PO A E 1. Jarrod Saltalamacchia C PH 7th Jason Varitek C sub sub sub sub sub sub BH7 RBI 2BH8(9) #9 2,H #9 1,2 3BH9 RS RBI HR8 BBBB BB BCSB FFBF S Ks WP-B BBB wp#7 3,H BB #8 2,3 #9 1,2 1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4 BBBB 2 3 4 5 6 7 8 UPPERCASES lowercases 5 0 1 0 4 0 1 1 0 0 1 0 1 0 0 0 4 1 1 0 1 0 1 0 .800 0.000 0 0 0 0 0 0 2. 3. 4. 5. 6. 7. 8. 9.

Per-Inning Totals 1st 2nd 3rd 4th 5th 6th 7th 8th 9th Totals Runs 0 0 0 1 0 0 0 0 0 1 Hits 1 1 1 1 0 0 0 0 0 4 Errors 0 0 0 0 0 0 0 0 0 0 LOB 1 1 1 0 1 0 1 0 0 5

Pitching Totals IP H R ER BB K HR P/S ERA Pitcher's name 0.0 0 0 0 0 0 0 0/0 0.00

Home Team 1st 2nd 3rd 4th 5th 6th 7th 8th 9th AB R H BB SAC RBI SO HBP LOB 2BH 3BH HR AVG PO A E 1. 2. 3. 4. 5. 6. 7. 8. 9.

Per-Inning Totals 1st 2nd 3rd 4th 5th 6th 7th 8th 9th Totals Runs Hits Errors LOB

Pitching Totals IP H R ER BB K HR P/S ERA