同人活動の一環としてブログパーツを作ってみた

がしかし、はてなダイアリーのサイドメニューに組み込もうとしたら「許可されていないscriptタグです」って怒られた件。imgタグで仕込める奴にしないと、普通のブログサービスでは使えないのかもね。

使うとこんな感じ(FirefoxとSafariで動作確認)
http://itgames.coresv.net/blogparts/test.html

コード（本体）

// Version 0.01 alpha
(function(){
  var data = [
    "hoge","fuga","foo","bar","hogefoo" // test
  ];

  var getRandomVal = function(now){
    var newVal = Math.floor(Math.random() * data.length);
    return newVal != now ? newVal : getRandomVal(now);
  };
	
  var num = getRandomVal(-1);
  var html = [];
  with(html){
    push('<div style="border:1px solid #FFBBBB; max-width:200px; height:170px;position:relative;">');
    push('<div style="border-bottom:2px solid #FFBBBB; padding:5px; background:#FFDDDE; color:#666666;">本日のデスマ現場</div>');
    push('<div style="padding:5px; background:#FFF; color:#333; overflow:hidden;">');
    push('<span id="PPAC.DM.Text" style="font-size:15px;">');
    push(data[num]);
    push('</span>');
    push('<div style="position:absolute;bottom:5px;"><span style="font-style:italic;font-size:12px;">Powerd by <a href="http://itgames.coresv.net/deathmarch/" target="_blank">PPAC</a></span></div></div>');
  }
  document.write(html.join(''));
	
  var textE = document.getElementById('PPAC.DM.Text');

  var isMSIE = /*@cc_on!@*/false;
  var setOpacity = function(elm, opacity){
    if(isMSIE) {
      elm.style.filter = 'alpha(opacity='+ opacity*10 +')';
    } else {
      elm.style.MozOpacity = (opacity/10);
      elm.style.opacity = (opacity/10);
    }
  };

  var repeatTimer = setInterval(function(){
    num = getRandomVal(num);
    var opacity = 10;
    var count = 0;
    var fadeTimer = setInterval(function(){
      setOpacity(textE, count++ < 10 ? --opacity : ++opacity);
      if(count === 10){
        textE.firstChild.data = data[num];
      } else
      if(count === 20){
        clearInterval(fadeTimer);
      }
    },50);
  }, 5000);
})();

コード（呼び出し側）

<!-- ですまブログパーツ -->
<script type="text/javascript" src="http://itgames.coresv.net/blogparts/main.js" charset="utf-8"></script>

次はデータの蓄積方法を考える。ニュースサイトとかからそれっぽい記事を抜き出してきてネタが追加されるようにしたい。