Complete Game Scorecard: April 17th: #BlueJays at #Twins - Game 3

Game Summary: 'The Strangest game I have ever seen.'

Jays had a 2 run lead going into the bottom of the 8th - Steve Delabar was tapped to start the inning. He walked 2 and then 7-hitter Eduardo Nunez (3B) sac bunted them over. That's when Blue Jays' manager John Gibbins decided Sergio Santos the stopper, had better come in and try to get himself a 5-Out Save with two runners in scoring position.

It didn't work.

Santos walked his first batter with the pitches looking wild. Then the nine hitter - pinch hitter Kurt Suzuki - waited for his walk while watching two wild pitches tie the game. One-hitter, Brian Dozier watched another wild pitch plate the go-ahead run before he too walked. That was the end of Santos as J.A. Happ was brought in.

But that wasn't the end of it. Happ walked his first batter to load 'em up - and then the next one as well, for the starting-to-get-predictable RBI Base-On-Balls. Then Happ gave up the landmark first Hit of the inning(!) plating two more to put the icing on the blow-out, eighth inning cake.

All told, the Twins sent 13 batters to the plate in the inning; walked 7 times and plated 6 runs on 1 hit. Half the runs scored via wild pitches by Santos.

The strangest game I have ever seen.


On a bright note - I was able to keep up while scoring the crazy eighth, with the new Canvas scorecard, which was fast and responsive. 'Tight' would be the word I would use to describe it. I was able to publish the eighth inning about 30 seconds after the last out.

In fact, I was having so much fun early on in the night - that in the 3rd inning I shot another video of me scoring the game Live in the Blogger Compose Interface. This one was an update on how to easily score using the colour coded base-runner notation functionality that this new Canvas Mark-up of the Internet Baseball Scorecard affords. The interface is now so quick and easy that I was able to shoot and post a video of me scoring in the 3rd ... and now in the 7th (when I wrote this part), write this blog while scoring the end of the game at the same time.(little did I know what was coming!).

Speed is key - because the whole point of scoring the game on the computer, is to also write baseball copy about the game at the same time - because as baseball copy hacks have done since the late 1800's - filing their stories with their editor quickly is paramount. It's usually expected about an hour after the game ends.

(This one's a little later than that standard because the turning point in the game happened late - and was tumultuous. Plus the game ended just minutes after the long chaos ceased - with a 1,2,3 Jays top of the ninth.)


Read every play in an html5 Canvas Scorecard for Blogger - with text and colour-coded base-runner-progress notation.

Internet Baseball Scorecard | April 17th: BlueJays at Twins - Gm 3 | http://internetbaseballscorecard2013.blogspot.ca/2014/04/april-17th-blue-jays-at-twins-gm-3.html


Her's the Video I shot of me scoring in the 3rd - showing the excellent functionality of the Blogger Compose Interface with this coding (best practice gleaned so far - this is only the third game I've scored with the new Mark-up).

Scoring Demonstration - Internet Baseball Scorecard, April 17th Blue Jays at Twins Gm 3



From under the video:

How to use the Blogger Compose interface to colour code base-runner notations in the Internet Baseball Scorecard - Canvas Version, using high-light double-clicks and the Blogger colour pallets for Text Color and Text Background Color buttons.

An addendum:

I want to talk about a scoring notation that I did in the eighth during Kurt Susuki's At-Bat. This particular situation has never occurred for me in 25 years of scoring ball games.

Here's an image of the 8th Inning and the At-Bat Box in question - the ninth batter in the order:

Note the mess of notations in the first line of the southeast quadrant of the 9th batter's at-bat box in the 8th Inning. Below is that copied out of the box at the scorecard and simply pasted into this page.

ph/WP#5,6,8-IB/pr(#8)WP6,8-1B
BB
pr

The first line of the At-Bat box is reserved for events that happen before the batter hits the ball into play - or in the case of this particular at-bat - (in fact he did not put the ball in play) - before he walked;

ph followed by a forward slash. The forward slash separates one event from another. "ph" This is the first event that happened after that batter stepped into the at-bat box. 'ph' stands for "pinch hitter". It denotes that the batter in the line-up so far in this game, has at this point been replaced by a different batter. By checking the far left of the scorecard you can see that K Susuki pinch hit for E Escobar in the 8th. (" 8th PH K Suzuki")

Next event that happens before the completion of the at-bat (not including pitches thrown, fouls, balls, strikes called, swings) : "WP#5,6,8-IB"  'WP' means "Wild Pitch" The next set of notation right after WP indicate runners movements on the base-paths. The bases are loaded. #5 means the 5th batter in the order - and then to save space I just add a comma directly after the 5 and add 6 and 8 as well - then dash, and then "1B". 1B means all those base-runners - #5, #6 and #8 - moved one base. So in this case the #5 batter-runner went from 3rd Base to Home Plate. The #6 batter-runner moved from 2nd base to 3rd base and the #8 batter-runner moved from 1st base to 2nd base.

Then a slash separating events and then, "pr(#8)". 'pr' means "Pinch Runner" followed directly by (#8) which notes that the #8 batter-runner has been replaced (he's now at 2nd base remember - now in scoring position, and importantly late in the game, he represents the 'go-ahead' run). Twins Manager Ron Gardenhire replaced the #8 batter-runner with his fastest man in order to give his team the best chance they have to win the game.

(I forgot to add a slash here) The next element in this scoring - the next thing that happens is "WP6,8-1B". Again you recognize this from the second element, it's another wild pitch "WP" - immediately followed by "6,8" (the #6 batter-runner and the #8 batter-runner) and than a dash, and then "1B". Meaning of coarse, the 6 batter and the 8 batter advance one base each. In this case the 6 batter scored a run and the 8 batter moved from 2nd base to 3rd base.

The nest line down is the usual scoring notation for Base on Balls ("BB"). Once Susuki is on base the manager replaces him with a pinch runner - in order to give his team the best change they have to score an 'insurance run' if they should take the lead in the game by plating the #8 batter-runner now on 3rd base; and, also to make turning a double play by the defence harder by having a fast runner at 1st base.

And that's it. :)



mh

Complete Game Scorecard: April 15th: #BlueJays at #Twins - Game 1

In the 3rd inning I shoot a video of me explaining how I'm scoring the game in Blogger - Live.

Read every play in an html5 Canvas Scorecard for Blogger - with text and colour-coded base-runner-progress notation.

Internet Baseball Scorecard | April 15th: Blue Jays at Twins - Gm 1 | http://internetbaseballscorecard2013.blogspot.ca/2014/04/april-15th-blue-jays-at-twins-gm-1.html

Game Summary:

Jays good enough - then in the ninth - 3 walks in a row and then a homie for Lawrie erases Save opportunity.

Brandon Morrow an't find it - just 3.2 IP.

Bullpen gives up one run over 5.1 IP


 Watch me scoring the game Live in the Blogger Compose Interface, shot in the 3rd and posted on the scorecard in the 6th inning:

Scoring a Baseball Game Live in the Internet Baseball Scorecard





mh

New HTML5 Canvas Baseball Scorecard gets put through her paces - and passes with Flying Colours!

Complete Game Scorecard: Internet Baseball Scorecard | "April 7th: Orioles at Yankees - Game 1" | http://internetbaseballscorecard2013.blogspot.ca/2014/04/april-7th-orioles-at-yankees-game-1.html

Scored Live by the author.
Internet Baseball Scorecard
A DIY html baseball scoresheet for scorekeeping baseball games in Blogger

Via the brand new HTML5 Canvas Baseball Scorecard mark-up written by Michael Holloway.

New HTML5/JavaScript coding works like a charm.

I encourage baseball scorekeepers to give it a try.

Use the code from the page source and lay it into a Blogger blog tailored with a 4000 pixel height and a 2000 pixel width.

Creative Commons License

This work is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 3.0 Unported License.

Condition of Use: On publish, Attribute the "Internet Baseball Scorecard by Michael Holloway" and add a link to where you found it - and stipulate this Condition of Use whenever you publish. This is Open Source code - feel free to re-code it for any style, design or purpose you wish.



mh

Dammit Jim, I'm a Health Insurance Adjustor, not a Baseball Writer!

Game Notes from Tuesday night's scorecard - a match between the visiting White Sox and the Toronto Blue Jays --- the complete scorecard of which, is here:
http://internetbaseballscorecard2013.blogspot.ca/2013/04/16-white-sox-at-blue-jays-game-2.html

Game Notes

Gibbons PH for Rasmus in the 7th.

Injury?

Usually you try to put your best defensive team on the field with a lead late. As the score was tied...

I like the way Joe Madden manages - everyone moves to the same position at a certain point in the game when the coach decides it's the best inning. That team is your defensive juggernaut.

Anyway...

It has to be a physical problem, because Rasmus was 2 for 2 with a home run when Gibbons pulled him, late, in a low scoring, tie game.


Dammit Jim, I'm a Health Insurance Adjustor, not a Baseball Writer!



mh

drawing illusions with code

This is a bit of code I wrote that creates the outfield icon perimeter in the Internet Baseball Scorecard 2013.

To show you how it's made, below I add 'border: 1px solid;' to two 'containers'.

The border reveals the two containers which each have a white background. The inner shape is a 'border-radius:' - code that lets you put rounded corners on a box.

Here I show the two containers pulled apart. I moved the right-hand container 'left: 30px;'.

If I put a box with a white background around the half circle you can see the five shapes create an illusion:

A floating semi-circle. The top of a parachute. Perhaps the ice-cream end of the cone.

'radius-simple' - that will go into the scorecard



mh

Scoring baseball via good old radio: lazy play by play and neo-liberal macro-engineering

Wrote this yesterday while scoring a Blue Jays' game off the radio, at The FAN 590 Toronto (see link to the scorecard below):


Accurate Reporting & Scoring

Scoring off the radio broadcast today on the FAN 590 Toronto with Jerry Howarth and Alan Ashby, and I'd just like to provide some constructive criticism by saying that I've had to go the MLB Gameday Play by Play 'thinger' on several occasions so far today beacause the broadcasters are not narrating the story concisely.

For example, in the Jays' 2nd on Gose's double to left centre, no one mentioned that it was CF Reddick who fielded the ball and threw to SS Rosales at cut-off (who then threw to Toronto's own, C George Kottaras for the out at home). That happens often, especially with lots going on.

I should note ESPN's automatic Play-by-Play narrative also does not mention who threw the ball to whom on that play. As well, the ESPN widget regularly calls 1B to Pitcher covering a "ground out to first" - which in my universe means 3UA, rather than 3-1 (out by pitcher covering). It makes a big difference in the stats: the way the widget records the play, the first baseman gets a Put Out; the way it actually happened, the pitcher gets the PO and the 1B gets an Assist.

As we advance towards much better defensive stat keeping it would be nice if the old school stats we do keep for defence were at least accurately kept. MLB Advanced Media supplies all the necessary info for a complete and accurate record of each game; it is all available through an API - it's just a matter of building an interface which supports the data stream. (I guess I''ll have to do it.)


The Radio Meme

The between inning advertising on the FAN590 features an ad from the Power Workers Union that starts off with 'did you know that wind power generators are off half the time?' ... and later, 'instead we can use bio-mass technology to fire generators that are carbon neutral'.

What they're talking about is 'strip mining' the northern boreal forest. The northern boreal forest is a band of forest that starts generally, on a latitude marked by the northern edge of Lake Superior (see image).

Northern Boreal Forest - image via Wikimedia commons - http://upload.wikimedia.org/wikipedia/commons/5/5d/Taiga_ecoregion.png

'Strip mining forestry' (my term) is a new kind of forestry practice. The industry here in Ontario calls it 'whole tree harvesting'. Basically they harvest all the trees in a forest as in clear-cut forestry - but now, towards a leap in efficiency, they harvest the tops, the branches and now - the stump and roots as well.

With almost all funiture now made out of fibreboard, and most housing sheathing materials made out of composites, these new sources of chipped wood and fibre are important; but now the forest industry sees a slow down in consumer demand. Housing starts in the US are down due to the housing collapse, the continuing global economic crisis and the neo-liberal remedy - austerity - is reducing demand for new disposable furniture; like that which Ikea sells. How is the forest industry to maintain profit rates during an forced economic slow down while at the same time maintain their control of global forest sources going forward? The brilliant plan: burn biomass from whole tree harvesting.

Makes you want to vote for more nuclear power stations, doesn't it?

The Northern and Southern boreal forests are one of the biggest 'Carbon Sinks' on the planet. Biomass fired electricity generators are not carbon neutral at all. What we're doing is reducing the planet's ability to sequester carbon; and at the same time releasing thousands of years of natural biomass carbon sequestering through burning. By my reading of several papers on this, it appears, depending on species, that about half the biomass of a tree is in the root system - that biomass in the ground rotting then returns nutrients to the soil that inturn feeds the next generation of growth.

The Power Worker Union claim they are lobbying the Provincial government to go with biomass electricity production - but it's more likely that the Union and the Province are working together - just like they did in the run up to the last Provincial Election. This play by the Province - where the Power Workers Union play the ignorant blue collar moron; and the Province plays the prince all shinny in white to the rescue with the science, the white collar smarts, the nuclear solution - is a play designed to divide the sentiments of the environmentally aware, university educated, white collar urban voter. The thing is, we have to double electricity rates because the nuclear power stations only last half the time we thought they would when we we built them - so now: How to raise electricity rates by 100% and at the same time build 4 Trillion dollars worth of new reactors?

Macro-engineering of the population through deception - that's how.

In my opinion, wind, solar, tidal power and perhaps orbital solar collection delivered by lasers are the answers. We need to invest in these technologies and perfect them; along side a rebuild of existing reactor cores and a modest expansion of this very expensive nuclear power technology to serve the gap in the near term.

Because of the macho-war-culture jingoism in all the ads on Rogers Inc, I can't watch baseball on TV with out muting commercials; now I have to turn off the radio between innings now too because of these evil doings there.

Looks like it's Toronto Maple Leafs semi-pro ball at Christie Pits, or the University League at Stan Waldlow for me... .

Maybe that was always where I had to end up. Outside, in a Park.

This media is no country for old men.



References:

Blogger Baseball Scorecard | 08/04/2012 Blue Jays at Athletics Game 3 Scorecard | http://internetbaseballscorecard.blogspot.ca/2012/08/08042012-blue-jays-at-athletics-game-3_5994.html

Government of Canada | Canadian Forest Service Publications | Effects of forest biomass harvesting on soil productivity in boreal and temperate forests – A review. 2011. Thiffault, E.; Hannam, K.D.; Paré, D.; Titus, B.D.; Hazlett, P.W.; Maynard, D.G.; Brais, S. Environ. Rev. 19:278-309. - http://cfs.nrcan.gc.ca/publications?id=32736

Government of Ontario | Ministry of Natural Resources | A BRIEF REVIEW OF THE ISSUES SURROUNDING FULL TREE HARVESTING [PDF] | by Alan Wiensczyk | http://www.mnr.gov.on.ca/stdprodconsume/groups/lr/@mnr/@nwsi/documents/document/mnr_e005393.pdf





mh

Notes from a scorecard: Phillies - Jays, game 2 - Farrell tries to rally dejected bunch with Umpire abuse - Halladay wins with average stuff

Below are my notes from today's Live Internet Scorecard Blog of the Phillies Jays game at Toronto featuring Roy Halladay in his first start at Rogers Centre since the trade.

See the complete game scorecard at the Blogger BaseballScorecard:

Scorecard: July 2, 2011 Philadelphia Phillies at Toronto Blue Jays - Game 2 of 3

From Rogers Centre, Toronto, Ontario, Canada

Philadelphia Phillies (52-31)
Manager: Charlie Manuel

@

Toronto Blue Jays (40-43)
Manager: John Farrell

Game 2 of 3

First pitch: 1:07 PM EST


Starting Pitchers:
Philadelphia Phillies - Roy Halladay
Toronto Blue Jays - Carlos Villanueva


Umpires:
Home - Alfonso Marquez
First Base - Ed Hickox
Second Base - Ed Rapuano
Third Base - Brian Onora


Weather:
Sunny - haze
Temp: 24°C | 75°F
Wind:Southerly at 10 kph | 6 mph
(home plate out to right centre field)

9th

Rauch ejected in the ninth, he seems to respond to a comment by HP Umpire Alfonso Marquez, arguing the last ball on Howard (Halladay got the same call earlier, which you could see Roy wasn't happy with either - but same call same place).

Rauch is already ejected

Manager John Farrell is trying to save him a suspension

 6' 10", 290 lb. Rauch gets away!!

The 'monster' emerges...

'help!'

Then Farrell tackles his relief ace and JP Arencibia tries to help

Marquez is overly aggressive in an argument with Farrell after the Rauch ejection - while Shawn Camp is coming in - and bumps Farrell, but that was after he'd already ejected Farrell. Farrell is obviously arguing ball and strikes as he's drawing a line in the dirt beside the plate while he yells at the besieged Ump.. I think Jerry Howarth is right on as he points out Farrells theatrics are about trying to find some team élan as this team seems to be in a funk.

John Ferrall shows Alfonso Marquez where the strike zone is...

..and HP Umpire Alfonso Marquez tosses him

Now I'll tell you what I really think...

It seems of late that everything that can go wrong, is going wrong - the usually solid defensive play of John McDonald for example - who yesterday let two nuclear-hot shots go between his legs - on balls hit right at him. Not to pick on the usually perfect infielder; yesterday's horrible path to the ball by Juan Rivera in LF in the 8th looked like grade school defence - and lost the game - and on a pop play on the left field line behind third yesterday had Baustista 'not hearing' Patterson yelling on a ball that dropped for a base hit and allowed runners to advance that later scored. I've been that player who 'didn't hear the call of another fielder' and to me it looked like vanity on Bautistas part - but then he's just back at third so you have to forgive him that one. Anyways, so the team restarts the season in the second half - goes back to the spring training defensive positions and the whole thing seems to be breaking down.


The Blue Jays are 4 games under .500 after this NL swing - and home cooking hasn't helped - they're now 4-1 after the long road trip on which they produced a 5-5 record. One more game against this juggernaut Phillie franchise and then it's off to face the Run Scoring Beast and the Green Monster - heaven help John Farrell and his of late keystone-cop defence.


Attendance: 43,078!




Line ups and pitching totals from ESPN - Box Score.

Farrell/Rauch image from MLB video, "Rauch, Farrell get tossed" 07/02/11 02:36



mh

Blogger Baseball Scorecard presents a Free Printable Classic Scorecard

"Blogger Baseball Scorecard" free baseball score sheet (1,600px × 1,574px JPEG Image)


I don't have a printer so I don't know the ins and outs of that meme. None-the-less, I've up-loaded the original size here - it's 1,600px × 1,415px - if you click on the image it opens at it's own page reduced, then left click on the image to see full awesome grandness, then select 'copy', open Microsoft Paint or other such editing application, paste it (click on EDIT top left select paste from, a window opens paste in the web address into the file box and click open); save it - and print it from there. That way you'll always have a copy to print from every time you need a scorecard!

(Is there a simpler way? Please let me know. :)

The Creative Commons Attribution 2.5 Canada License is on the image - so print out lots of copies and pass them around to all your baseball playing friends.

Please let me know, if you would, whether this lay out works well in a paper and pencil - as you may know, this printable scorecard is just a picture of this Blogs Blogger Baseball Scorecard; it was produced to score games online - in a blog - live. But it looks just like the old style scorecards - so it should work - right?

Cheers. :)

I am very happy with my new upgraded "Screen Capture Elite" - it grabbed a 2.51 MB (3495px X  3438px) copy from my screen - unfortunately Blogger only allowed 397.6 KB (1,600px × 1,574px)

:(

Below is a screenshot of the top half of the Blogger Baseball Scorecard.

( http://bit.ly/PrintableBaseballScorecard )


This article was originally published in the Blogger Baseball Scorecard - 03 31 2011.




mh

History of Graphic Design through Scorecards of the Chicago Cubs

Update: 03/08/2011 - 3:19 PM   With some direction from commenter, "norman" I have gotten a little further in my research on Otis Shepard. When Shepard came to Wrigley in 1933 he was already a big time advertising Art Director, he had been designing advertising with "Foster & Kleiser Outdoor Advertising" for years. Foster & Kleiser were one of the big rising names in advertising at the time, their innovations in outdoor advertising (read: highway billboards,) and the increasing popularity of the car turned them into a national firm working with companies like Pontiac, branding Hollywood movie stars for Paramount Pictures and many other national brands by 1930. These were the Ad Men, the masters of think on the leading edge of an understanding of the psychology of a Nation, the beginning of Madison Avenue.

By the time Otis Shepard moved on to the Wm. Wrigley Jr. Company as Art Director in 1933 he was creating "design concepts" with-in "branding strategies" - not pieces of art. So... enjoy the concepts below, very few of which were likely drawn by the man himself, but all of which were undoubtedly approved by him.

References:
Clear Channel-Outdoor History.
Clear Channel-Outdoor History - 1926 to 1950
Cathy Wade Shepard's comment at Heckadude + Design.

Chicago Cubs Scorecard - 1952

A week ago Allan Wood at Joy of Sox ran a nice piece on the art of Otis Shepard (1894-1969), who worked 30 years for Wrigley's Gum as artist and then Art Director between 1932-1963.

By some accounts Shepard worked for Wrigley's from 1914 and by others didn't start at Wrigley until 1932. Some have him born in 1893 others in 1894. Details are sketchy, and often when I found out something new about him, the blogs in question didn't reference their sources.

The Wrigley site doesn't talk about people except the great man himself; all else is branding and numbers. Soul-less corporations, full of poor faceless souls. Wrigley is now a subsidiary of Mars Incorporated, so perhaps the history of the company didn't make the leap to digital; or perhaps the divide to new ownership.
(ed 03/08/2011 - 3:19PM)
 
The Wm. Wrigley Jr. Company site has this to say about Shepard:

"The distinctive billboard campaigns created in the late 1930s by Wrigley art director Otis Shepard fixed the Doublemint twin concept in the American imagination. Shepard's distinctive airbrush techniques and simple, clear designs were well suited for outdoor advertisements and have been widely recognized in the commercial art field." 

The only thing new I could dig up on Shepard was a short reference to him in a piece at Today's Inspiration, "Fred Ludekens, Close-up". Apparently he taught at the  University of California Extension School in the 1920's or early 1930's where he taught, Fred Ludekens (1900-1982). Fred Ludekens so the story and the school tells me, was a member of the Famous Artists School's founding faculty. The Famous Artists School's history section says, it was "founded by the giants in their field, nationally known and recognized [...] in the “golden age” of American illustration".

Shepard hasn't left much of a trail for us curators of the internet to follow, but it seems like more and more people are wakening to this fellows talent. My research today reminds me of the later years of the resurgence of the minor leagues, in the early 1990's - I caught the tail end of the cult before it exploded and died - about the time the movie Bull Durham came out... Feels like that now, like Otis Shepard's work is on the verge of a renaissance - and perhaps all of those extraordinarily talented graphic designers from the 1950's and 1960's. In 2003 "Antiques and the Arts Online" reported that a poster by Otis Shepard, "Rails to Sales / Subway Posters" (1947) sold for $5,060.00.

Below are some examples of Shepard's work, and perhaps some that may only be influenced by him - drawn by artists that he taught the ropes, at Wrigley's as head of the Art Department. The following were covers of Chicago Cubs Scorecards between 1950 - 1968.

1950

1953

1963

1966

1968

See Allan Wood's piece at Joy of Sox, "Otis Shepard - Cubs Scorecard Art".

See Chicago Cubs scorecards from 1898 - 2010 - at "Cubs By The Numbers" blog.


Reference sources:

Heckadude + Design - "Otis Shepard & the Chicago Cubs":
http://heckadude.blogspot.com/2009/01/otis-shepard-chicago-cubs.html

Famous Artists School:
http://www.famous-artists-school.com/index.php/fas/history/

Cubs By The Numbers - "Cubs Scorecards Thru The Years":
http://www.cubsbythenumbers.com/scorecards.html

Today's Inspiration - "Fred Ludekens, Close-up":
http://todaysinspiration.blogspot.com/2009/06/fred-ludekens-close-up.html

2Blowhards - "Otis Shepard, Who Didn't Gum Things Up":
http://www.2blowhards.com/archives/2009/04/otis_shepard.html



mh

How to score games with the new "2011 Blogger Baseball Scorecard"

(This piece was simultaneously published at "Michael Holloway's FilterBlogs".)

Microsoft's Internet Explorer browser won't show certain properties of border tags which make up the diamond shape of the 'At Bat' boxes that are at the centre of the new 2011 Blogger Baseball Scorecard's design.

The two images below (side by side) show Microsoft's Internet Explorer's rendering of my code:

Internet Explorer Rendering

Below are images as above, from the same web page, this one rendered by Firefox 3.6.15 browser:

Firefox Browser Rendering

The code has been validated at W3C as HTML 4.01 Transitional - Passed. I'm working on finding out why Internet Explorer won't render the border tags properly, and fixing it. In the meantime if you want to read this years scorecards, you'll have to do it with a different browser.

Firefox browser is available here. I have found that I can have more than one browser on my Windows XP Operating System. In my experience even running both at the same time doesn't compromise performance on my machine.

On Sunday March 6th, I used the new scorecard to score-keep the Toronto Blue Jays at Pittsburgh Pirates spring training game in Bradenton Florida, which was on Rogers SNET-1 in this market. You can see it here - if you must, it's an awful mess of scoring. As I say at the Internet Baseball Scorecard Blog, "This is the new, never before used in-game, 2011 Internet Baseball Scorecard - bear with me." I scored all the runs, but missed a lot of outs, and substitutions and even the staring line-ups were incomplete - etc., etc., etc.. But you can see that it functions as it's supposed to. So far, I'm really happy with it.


How it Works

Above is an example of a border tag used to make a simple two tone border - note the angles at the corners. In the scorecard, each quadrant of the diamond is actually the corner of a border (see Figure 1.) - it's the only way to make an angle with HTML!

At the top of this post - in the Firefox Browser Rendering, 2 image set - the left image has all four of the vertical border lines set to "solid black" - and the horizontal border lines set to match the background colour, thus they are invisible. In the image right next to that, the four horizontal border colours are set to a slightly darker colour than the background - so the appearance is of a frame around a diamond.

A scorekeeper can change the horizontal border's colour attributes on the fly, using the Blogger Compose mode "Text background color" widget. By selecting one of the four horizontal borders in each AB box, and changing it's colour with the "Text background color" button, one can indicate the progress of a runner around the bases:



The first box on the left, is how all the boxes in the entire scorecard appear before the game starts. The next box shows a runner on First Base, next one on Second Base, and so on. A solitary black diamond indicates a Run Scored - just like in pencil and paper scoring! :)


How to score with it

To change the attributes of the borders that make up the black diamond while scoring a baseball game is easy. Below I've taken a screen shot of me about to change the colour of the south-east quadrant - in order to indicate a runner is on First Base The colour indicated in the palette is the slightly darker peach. I'm about to change the colour of the horizontal border to the colour right above the one indicated - to the same colour as the background of the quadrant box:

First you highlight the border attribute by left clicking beside the diamond in the quadrant you wish to change. Next, left click on the "Text background color" button and choose the colour you want.

And Viola, a runner is on First Base:

Specifications

I think there's more than enough space in the 2011 Blogger Baseball Scorecard to score the game with any iconography you wish to invent.

Below (or above) each angle of the diamond there are four lines for text, room for 10 uppercase letters or 12 lower case letters on each line.

In the Pitches column there is again, more than enough room for the number of pitches in the best plate appearance (a great plate appearance is around 12 pitches).

Modern Project Scoresheet defensive notations and ball trajectory notations can be noted in the Pitches column as well.

Also note that if you have to, you can keep on writing outside of any of the boxes - the letters render where you put them - by hitting return you can create a block of script that extends into the next inning's AB box (which usually remains empty - unless the team bats around).

In a few days I will finish the new 2011 Blogger Baseball Scorecard.  It still needs Per-Inning totals boxes; Pitchers Totals boxes and a Per-Inning Box Score table for across the top. When all that is done I will post the code for the 2011 Blogger Baseball Scorecard to a Google Document and you can run it in a special extra-wide Blogger blog.

The Extra-wide Blogger code is available below:

Blogger Code to make your Blog Wider

<br /> <?xml version="1.0" encoding="UTF-8" ?><br /> <br /> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><br /> <br /> <html expr:dir='data:blog.languageDirection' xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'><br /> <br /> <head><br /> <br /> <b:include data='blog' name='all-head-content'/><br /> <br /> <title><data:blog.pageTitle/></title><br /> <br /> <b:skin><![CDATA[/* ----------------------------------------------- Blogger Template Style Name: Minima Date: 26 Feb 2004 Updated by: Blogger Team ----------------------------------------------- */ /* Variable definitions ==================== <variable name="bgcolor" description="Page Background Color" type="color" default="#ffe599" value="#ffe599"><br /> <br /> <variable name="textcolor" description="Text Color" type="color" default="#333" value="#333333"><br /> <br /> <variable name="linkcolor" description="Link Color" type="color" default="#58a" value="#5588aa"><br /> <br /> <variable name="pagetitlecolor" description="Blog Title Color" type="color" default="#A80" value="#A80000"><br /> <br /> <variable name="descriptioncolor" description="Blog Description Color" type="color" default="#FFFF66" value="#FFFF66"><br /> <br /> <variable name="titlecolor" description="Post Title Color" type="color" default="#c60" value="#cc6600"><br /> <br /> <variable name="bordercolor" description="Border Color" type="color" default="#ccc" value="#cccccc"><br /> <br /> <variable name="sidebarcolor" description="Sidebar Title Color" type="color" default="#999" value="#999999"><br /> <br /> <variable name="sidebartextcolor" description="Sidebar Text Color" type="color" default="#666" value="#666666"><br /> <br /> <variable name="visitedlinkcolor" description="Visited Link Color" type="color" default="#999" value="#999999"><br /> <br /> <variable name="bodyfont" description="Text Font" type="font" default="normal normal 110% Georgia, Serif" value="normal normal 110% Georgia, Serif"><br /> <br /> <variable name="headerfont" description="Sidebar Title Font" type="font" default="normal normal 130% 'Trebuchet MS',Trebuchet,Arial,Verdana,Sans-serif" value="normal normal 130% 'Trebuchet MS',Trebuchet,Arial,Verdana,Sans-serif"><br /> <br /> <variable name="pagetitlefont" description="Blog Title Font" type="font" default="normal normal 475% Georgia, Serif" value="normal normal 475% Georgia, Serif"><br /> <br /> <variable name="descriptionfont" description="Blog Description Font" type="font" default="normal normal 125% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif" value="normal normal 125% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif"><br /> <br /> <variable name="postfooterfont" description="Post Footer Font" type="font" default="normal normal 130% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif" value="normal normal 130% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif"><br /> <br /> <variable name="startSide" description="Side where text starts in blog language" type="automatic" default="left" value="left"><br /> <br /> <variable name="endSide" description="Side where text ends in blog language" type="automatic" default="right" value="right"><br /> <br /> */<br /> <br /> /* Use this with templates/template-twocol.html */<br /> <br /> body {<br /> <br /> background:$bgcolor;<br /> <br /> margin:0;<br /> <br /> color:$textcolor;<br /> <br /> font:x-small Georgia Serif;<br /> <br /> font-size/* */:/**/small;<br /> <br /> font-size: /**/small;<br /> <br /> text-align: left;<br /> <br /> }<br /> <br /> a:link {<br /> <br /> color:$linkcolor;<br /> <br /> text-decoration:none;<br /> <br /> }<br /> <br /> a:visited {<br /> <br /> color:$visitedlinkcolor;<br /> <br /> text-decoration:none;<br /> <br /> }<br /> <br /> a:hover {<br /> <br /> color:$titlecolor;<br /> <br /> text-decoration:underline;<br /> <br /> }<br /> <br /> a img {<br /> <br /> border-width:0;<br /> <br /> }<br /> <br /> /* Header<br /> <br /> -----------------------------------------------<br /> <br /> */<br /> <br /> #header-wrapper {<br /> <br /> width:1632px;<br /> <br /> margin:1 auto 10px;<br /> <br /> border:1px solid $bordercolor;<br /> <br /> }<br /> <br /> #header-inner {<br /> <br /> background-position: center;<br /> <br /> margin-left: auto;<br /> <br /> margin-right: auto;<br /> <br /> }<br /> <br /> #header {<br /> <br /> margin: 5px;<br /> <br /> border: 1px solid $bordercolor;<br /> <br /> text-align: center;<br /> <br /> color:$pagetitlecolor;<br /> <br /> }<br /> <br /> #header h1 {<br /> <br /> margin:5px 5px 0;<br /> <br /> padding:15px 20px .25em;<br /> <br /> line-height:2.2em;<br /> <br /> text-transform:uppercase;<br /> <br /> letter-spacing:.2em;<br /> <br /> font: $pagetitlefont;<br /> <br /> }<br /> <br /> #header a {<br /> <br /> color:$pagetitlecolor;<br /> <br /> text-decoration:none;<br /> <br /> }<br /> <br /> #header a:hover {<br /> <br /> color:$pagetitlecolor;<br /> <br /> }<br /> <br /> #header .description {<br /> <br /> margin:0 5px 5px;<br /> <br /> padding:0 20px 15px;<br /> <br /> max-width:1460px;<br /> <br /> text-transform:uppercase;<br /> <br /> letter-spacing:.2em;<br /> <br /> line-height: 3.4em;<br /> <br /> font: $descriptionfont;<br /> <br /> color: $descriptioncolor;<br /> <br /> }<br /> <br /> #header img {<br /> <br /> margin-$startSide: auto;<br /> <br /> margin-$endSide: auto;<br /> <br /> }<br /> <br /> /* Outer-Wrapper<br /> <br /> ----------------------------------------------- */<br /> <br /> #outer-wrapper {<br /> <br /> width: 4800px;<br /> <br /> margin:0 auto;<br /> <br /> padding:10px;<br /> <br /> text-align:$startSide;<br /> <br /> font: $bodyfont;<br /> <br /> }<br /> <br /> #main-wrapper {<br /> <br /> width: 4800px;<br /> <br /> float: $startSide;<br /> <br /> word-wrap: break-word; /* fix for long text breaking sidebar float in IE */<br /> <br /> overflow: hidden; /* fix for long non-text content breaking IE sidebar float */<br /> <br /> }<br /> <br /> /* Headings<br /> <br /> ----------------------------------------------- */<br /> <br /> h2 {<br /> <br /> margin:1.5em 0 .75em;<br /> <br /> font:$headerfont;<br /> <br /> line-height: 1.4em;<br /> <br /> text-transform:uppercase;<br /> <br /> letter-spacing:.2em;<br /> <br /> color:$sidebarcolor;<br /> <br /> }<br /> <br /> /* Posts<br /> <br /> -----------------------------------------------<br /> <br /> */<br /> <br /> h2.date-header {<br /> <br /> margin:1.5em 0 .5em;<br /> <br /> }<br /> <br /> .post {<br /> <br /> margin:.5em 0 1.5em;<br /> <br /> border-bottom:1px dotted $bordercolor;<br /> <br /> padding-bottom:1.5em;<br /> <br /> }<br /> <br /> .post h3 {<br /> <br /> margin:.25em 0 0;<br /> <br /> padding:0 0 4px;<br /> <br /> font-size:200%;<br /> <br /> font-weight:normal;<br /> <br /> line-height:1.4em;<br /> <br /> color:$titlecolor;<br /> <br /> }<br /> <br /> .post h3 a, .post h3 a:visited, .post h3 strong {<br /> <br /> display:block;<br /> <br /> text-decoration:none;<br /> <br /> color:$titlecolor;<br /> <br /> font-weight:normal;<br /> <br /> }<br /> <br /> .post h3 strong, .post h3 a:hover {<br /> <br /> color:$textcolor;<br /> <br /> }<br /> <br /> .post-body {<br /> <br /> margin:0 0 .75em;<br /> <br /> line-height:1.6em;<br /> <br /> }<br /> <br /> .post-body blockquote {<br /> <br /> line-height:1.3em; <br /> <br /> }<br /> <br /> .post-footer {<br /> <br /> margin: .75em 0;<br /> <br /> color:$sidebarcolor;<br /> <br /> text-transform:uppercase;<br /> <br /> letter-spacing:.1em;<br /> <br /> font: $postfooterfont;<br /> <br /> line-height: 1.4em;<br /> <br /> }<br /> <br /> .comment-link {<br /> <br /> margin-$startSide:.6em;<br /> <br /> }<br /> <br /> .post img, table.tr-caption-container {<br /> <br /> padding:4px;<br /> <br /> border:1px solid $bordercolor;<br /> <br /> }<br /> <br /> .tr-caption-container img {<br /> <br /> border: none;<br /> <br /> padding: 0;<br /> <br /> }<br /> <br /> .post blockquote {<br /> <br /> margin:1em 20px;<br /> <br /> }<br /> <br /> .post blockquote p {<br /> <br /> margin:.75em 0;<br /> <br /> }<br /> <br /> /* Comments<br /> <br /> ----------------------------------------------- */<br /> <br /> #comments h1 {<br /> <br /> margin:1em 0;<br /> <br /> font-weight: bold;<br /> <br /> line-height: 1.4em;<br /> <br /> text-transform:uppercase;<br /> <br /> letter-spacing:.2em;<br /> <br /> color: $sidebarcolor;<br /> <br /> }<br /> <br /> #comments-block {<br /> <br /> margin:1em 0 1.5em;<br /> <br /> line-height:1.6em;<br /> <br /> }<br /> <br /> #comments-block .comment-author {<br /> <br /> margin:.5em 0;<br /> <br /> }<br /> <br /> #comments-block .comment-body {<br /> <br /> margin:.25em 0 0;<br /> <br /> }<br /> <br /> #comments-block .comment-footer {<br /> <br /> margin:-.25em 0 2em;<br /> <br /> line-height: 1.4em;<br /> <br /> text-transform:uppercase;<br /> <br /> letter-spacing:.1em;<br /> <br /> }<br /> <br /> #comments-block .comment-body p {<br /> <br /> margin:0 0 .75em;<br /> <br /> }<br /> <br /> .deleted-comment {<br /> <br /> font-style:italic;<br /> <br /> color:gray;<br /> <br /> }<br /> <br /> #blog-pager-newer-link {<br /> <br /> float: $startSide;<br /> <br /> }<br /> <br /> #blog-pager-older-link {<br /> <br /> float: $endSide;<br /> <br /> }<br /> <br /> #blog-pager {<br /> <br /> text-align: center;<br /> <br /> }<br /> <br /> .feed-links {<br /> <br /> clear: both;<br /> <br /> line-height: 2.5em;<br /> <br /> }<br /> <br /> /* Sidebar Content<br /> <br /> ----------------------------------------------- */<br /> <br /> .sidebar {<br /> <br /> color: $sidebartextcolor;<br /> <br /> line-height: 1.5em;<br /> <br /> }<br /> <br /> .sidebar ul {<br /> <br /> list-style:none;<br /> <br /> margin:0 0 0;<br /> <br /> padding:0 0 0;<br /> <br /> }<br /> <br /> .sidebar li {<br /> <br /> margin:0;<br /> <br /> padding-top:0;<br /> <br /> padding-$endSide:0;<br /> <br /> padding-bottom:.25em;<br /> <br /> padding-$startSide:30px;<br /> <br /> text-indent:-30px;<br /> <br /> line-height:1.5em;<br /> <br /> }<br /> <br /> .sidebar .widget, .main .widget {<br /> <br /> border-bottom:1px dotted $bordercolor;<br /> <br /> margin:0 0 1.5em;<br /> <br /> padding:0 0 1.5em;<br /> <br /> }<br /> <br /> .main .Blog {<br /> <br /> border-bottom-width: 0;<br /> <br /> }<br /> <br /> /* Profile<br /> <br /> ----------------------------------------------- */<br /> <br /> .profile-img {<br /> <br /> float: $startSide;<br /> <br /> margin-top: 0;<br /> <br /> margin-$endSide: 5px;<br /> <br /> margin-bottom: 5px;<br /> <br /> margin-$startSide: 0;<br /> <br /> padding: 4px;<br /> <br /> border: 1px solid $bordercolor;<br /> <br /> }<br /> <br /> .profile-data {<br /> <br /> margin:0;<br /> <br /> text-transform:uppercase;<br /> <br /> letter-spacing:.1em;<br /> <br /> font: $postfooterfont;<br /> <br /> color: $sidebarcolor;<br /> <br /> font-weight: bold;<br /> <br /> line-height: 1.6em;<br /> <br /> }<br /> <br /> .profile-datablock {<br /> <br /> margin:.5em 0 .5em;<br /> <br /> }<br /> <br /> .profile-textblock {<br /> <br /> margin: 0.5em 0;<br /> <br /> line-height: 1.6em;<br /> <br /> }<br /> <br /> .profile-link {<br /> <br /> font: $postfooterfont;<br /> <br /> text-transform: uppercase;<br /> <br /> letter-spacing: .1em;<br /> <br /> }<br /> <br /> /* Footer<br /> <br /> ----------------------------------------------- */<br /> <br /> #footer {<br /> <br /> width:4800px;<br /> <br /> clear:both;<br /> <br /> margin:0 auto;<br /> <br /> padding-top:15px;<br /> <br /> line-height: 1.6em;<br /> <br /> text-transform:uppercase;<br /> <br /> letter-spacing:.1em;<br /> <br /> text-align: left;<br /> <br /> }<br /> <br /> ]]></b:skin><br /> <br /> <script type='text/javascript'> var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-1777332-3']); _gaq.push(['_trackPageview']); (function() { var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); })(); </script><br /> <br /> </head><br /> <br /> <body><br /> <br /> <div id='outer-wrapper'><div id='wrap2'><br /> <!-- skip links for text browsers --><br /> <br /> <span id='skiplinks' style='display:none;'><br /> <br /> <a href='#main'>skip to main </a> |<br /> <br /> <a href='#sidebar'>skip to sidebar</a><br /> <br /> </span><br /> <br /> <div id='header-wrapper'><br /> <b:section class='header' id='header' maxwidgets='1' showaddelement='no'><br /> <br /> <b:widget id='Header1' locked='true' title='Internet Baseball Scorecard Blog (Header)' type='Header'/><br /> <br /> </b:section><br /> <br /> </div><br /> <!-- STOP REFRESH <script language='javascript' type='text/javascript'><br /> <br /> setTimeout("StratRefresh()", 30000);<br /> <br /> function StratRefresh()<br /> <br /> { window.location.reload(); }<br /> <br /> </script><br /> <br /> --><br /> <br /> <div style='float: left; margin: 10px 2px;'><img alt='' border='2' height='18' src='http://png-5.findicons.com/files/icons/767/wp_woothemes_ultimate/128/arrow_cycle.png' width='22'/><b> During games the scorecard automatically refreshes every 30 seconds. </b></div><pre></pre><br /> <div style='float: left; margin: 10px 0px;'><br /> </div><br /> <div style='float: left; margin: 10px 0px;'><br /> <a href='http://baseball---blog.blogspot.com/' target='blank'><button style='background-color: rgb(153, 0, 0); color: rgb(255, 204, 0);'>The Score Card's Sister Blog "BaseballBlogs"</button></a><br /> <br /> <a href='http://bikingtoronto.com/michaelhollowayblog' target='blank'><button style='background-color: rgb(153, 0, 0); color: rgb(255, 204, 0);'>Biking Toronto Blog</button></a><br /> <br /> <a href='http://bikingtoronto.com/bicycleroutemappingwiki' target='blank'><button style='background-color: rgb(153, 0, 0); color: rgb(255, 204, 0);'>BT Bicycle Route Mapping Wiki</button></a><br /> <br /> <a href='http://filter--blog.blogspot.com/' target='blank'><button style='background-color: rgb(153, 0, 0); color: rgb(255, 204, 0);'>FilterBlogs</button></a></div><br /> <div id='content-wrapper'><br /> <div id='crosscol-wrapper' style='text-align:center'><br /> <b:section class='crosscol' id='crosscol'><br /> <br /> <b:widget id='HTML3' locked='false' title='' type='HTML'/><br /> <br /> </b:section><br /> <br /> </div><br /> <div id='main-wrapper'><br /> <b:section class='main' id='main' showaddelement='no'><br /> <br /> <b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/><br /> <br /> </b:section><br /> <br /> </div><br /> <div id='sidebar-wrapper'><br /> <b:section class='sidebar' id='sidebar' preferred='yes'><br /> <br /> <b:widget id='HTML2' locked='false' title='' type='HTML'/><br /> <br /> <b:widget id='HTML4' locked='false' title='' type='HTML'/><br /> <br /> <b:widget id='HTML1' locked='false' title='' type='HTML'/><br /> <br /> <b:widget id='HTML7' locked='false' title='StatCounter' type='HTML'/><br /> <br /> <b:widget id='HTML6' locked='false' title='Calling for a Public Inquiry into Policing at the G20 Summit.' type='HTML'/><br /> <br /> <b:widget id='Profile1' locked='false' title='About Me' type='Profile'/><br /> <br /> <b:widget id='Followers1' locked='false' title='Followers' type='Followers'/><br /> <br /> <b:widget id='BlogArchive1' locked='false' title='Blog Archive' type='BlogArchive'/><br /> <br /> </b:section><br /> <br /> </div><br /> <!-- spacer for skins that want sidebar and main to be the same height--><br /> <br /> <div class='clear'> </div><br /> </div><!-- end content-wrapper --><br /> <br /> <div id='footer-wrapper'><br /> <b:section class='footer' id='footer'/><br /> <br /> </div><br /> </div></div><!-- end outer-wrapper --><br /> <br /> </body><br /> <br /> </html><br /> <br />

To read an overview of how to install this code into a Blogger Blog go to, "2011 Scorecard: Bigger! Better!"

(Note the "2011 Scorecard Bigger! Better!" is an article about a simpler version I used in the 2010 MLB Postseason - it doesn't have the diamond feature - but the width of the blog you'll need for this, new version is the same.)


mh