4,376 views

この記事は最終更新から 1853日 が経過しています。

やりたいこと

ワードプレスの投稿やウィジェット内で野球のスコアボードを表示したい。
高校野球の結果であったり、
少年野球の結果であったり、
草野球の結果であったり、
プロ野球の結果であったり。

こんな風に表示されます。（ ↓ 本プラグインで表示）

使い方

ショートコード [bb_scoreboard] で表示できます。
このショートコードには5個のパラメータを与えます。
1) size= : 文字サイズ [rem]
2) tm1 : チーム名（先攻）
3) tm2 : チーム名（後攻）
4) scr1 : スコア（先攻）
5) scr2 : スコア（後攻）
※スコアは各イニングの得点を「/」で区切って繋げます。合計点は不要です。例) 0/0/2/0/4/0/0

記述例

[bb_scoreboard size=”1.5″ tm1=”TITANS” tm2=”草巨人軍” scr1=”2/0/0/1/0/0/1″ scr2=”0/0/4/5/0/0/X”]
　↓ 上記のショートコードを使用して本プラグインで表示 ↓

プログラム

スコアボードのデザインを変更したい場合は、proc_output_css()内のCSSを変える。

bbscoreboard.php

<?php
/*
Plugin Name: Baseball ScoreBoard
*/
if (class_exists('BBScoreBoard')) {
  $bb_scoreboard = new BBScoreBoard();
}
class BBScoreBoard {
  //////////////////////////////////////////////////////////////////////
  public function __construct() {
    add_action('wp_head', array($this,'proc_output_css'), 9999);
    add_shortcode('bb_scoreboard', array($this, 'proc_shortcode'));
    add_filter('widget_text', 'do_shortcode');
  }
  //////////////////////////////////////////////////////////////////////
  public function proc_output_css(){
echo <<< EOM
<style type="text/css">
div#BBScoreBoard{
  display: inline; margin: 3px; padding: 0;
}
div#BBScoreBoard table{
  border: 3px #bb0 solid;
  background-color: #060;
}
div#BBScoreBoard td{
  text-align: center;
  padding: 3px;
  border: 1px #ffe solid;
  color: #fff;
}
div#BBScoreBoard .borderB_thick{ border-bottom-width:2px; }
div#BBScoreBoard .borderR_thick{ border-right-width:2px; }
div#BBScoreBoard .borderL_thick{ border-left-width:2px; }
</style>
EOM;
  }
  //////////////////////////////////////////////////////////////////////
  // args['size'] : text size [rem]
  // args['tm1']  : team name #1
  // args['tm2']  : team name #2
  // args['scr1'] : score #1 , separator='/'  ex) 0/0/1/0/0/1
  // args['scr2'] : score #2
  public function proc_shortcode($args){
    $html = "";
    $size = 'font-size:'.$args['size'].'rem !important;';
    $table_class = 'tc_'.str_replace('.','_',$args['size']);
    //------------------------------------------------------------------
    $ary_tm = array();
    $ary_tm[] = $args['tm1'];
    $ary_tm[] = $args['tm2'];
    //------------------------------------------------------------------
    $ary_scr = array();
    $ary_scr[] = explode('/', $args['scr1']);
    $ary_scr[] = explode('/', $args['scr2']);
    $nScr = max(count($ary_scr[0]), count($ary_scr[1]));
    //------------------------------------------------------------------
    // display innings
    $html .= '<tr><td class="borderB_thick borderR_thick"></td>';
    for($i=1 ; $i <= $nScr ; $i++){
      $html .= '<td class="borderB_thick">'.$i.'</td>';
    }
    $html .= '<td class="borderB_thick borderL_thick">R</td></tr>';
    //------------------------------------------------------------------
    // display score
    foreach($ary_scr as $idx => $scr){
      $html .= '<tr><td class="borderR_thick">'.$ary_tm[$idx].'</td>';
      for($i=0 ; $i < $nScr ; $i++){
        $html .= '<td>'.$scr[$i].'</td>';
      }
      $html .= '<td class="borderL_thick">'.array_sum($scr).'</td></tr>';
    }
    //------------------------------------------------------------------
return <<< EOM
<style type="text/css">
div#BBScoreBoard .{$table_class} td{
  {$size}
</style>
<div id="BBScoreBoard"><table class="{$table_class}" style="width:100%">{$html}</table></div>
EOM;
  }
}     // end of class
?>

今後やりたいこと

1) 設定画面を作成し、デザインを自由に編集できるようにすること。
2) 複数デザインを登録できるようにすること。

2017.11.20追記 : 脱Fewer than 10

2017年9月4日に本プラグインをWORDPRESS公式ディレクトリに公開して約2か月半、
やっとActive installationsが Fewer than 10ではなくなりました！

世界中の数千万人のワードプレスユーザーの中の二十数人がこのプラグインをインストール後に削除しないでいてくれる…
なんとも嬉しいではないですか。

どの国の人がどんな試合で使っているのか？
とっても興味がありますが、誰がインストールしたか？の情報は知る術がないのです…
いつかどこかで偶然ふらっと見かけたら嬉しいなぁ