何かが悟れそうな画像ジェネレーター

Standard

http://bugcloud.com/worcloud/canvas/3/
 
 

class Block
  constructor:(row, col) ->
    @alive = true
    @row = row
    @col = col
  kill: () ->
    @alive = false

class Grid
  constructor: () ->
    @width = 22
    @height = 22
    winWidth = $(window).width()
    winHeight = $(window).height()
    @totalWidth = winWidth + (@width - (winWidth % @width))
    @totalHeight = winHeight + (@height - (winHeight % @height))
    @cols = Math.ceil(@totalWidth / @width) + 1
    @rows = Math.ceil(@totalHeight / @height) + 1
    @loopCount = @cols * @rows
    @totalWidth = @width * @cols
    @totalHeight = @height * @rows
    @blocks = []
    @blockCollection = []
    for i in [0..(@rows-1)]
      cols = []
      for j in [0..(@cols-1)]
        b = new Block(i, j)
        cols.push b
        @blockCollection.push b
      @blocks[i] = cols
  
  printBlocks: () ->
    str = ""
    for i in [0..(@rows-1)]
      for j in [0..(@cols-1)]
        b = @blocks[i][j]
        str += if b.alive then "□" else "■"
      str += "\n"
    console.log str
  pickupTryCount: 0
  pickup: (width, height) ->
    if @pickupTryCount > 60
      @pickupTryCount = 0
      return null
    else
      @pickupTryCount++
      result = null
      l = @blockCollection.length
      return null if l is 0
      b = @blockCollection[Math.floor(Math.random() * l)]
      if (b.col + width) <= @cols and (b.row + height) <= @rows
        for i in [b.row..(b.row+height-1)]
          for j in [b.col..(b.col+width-1)]
            block = @blocks[i][j]
            unless block.alive
              return this.pickup(width, height)
            else
              result = b
      else
        return this.pickup(width, height)
      @pickupTryCount = 0
      result

class Global
  constructor: () ->
    @canvas
    @context
  init: () ->
    me = this
    @canvas = document.getElementById 'canvas01'
    @context = @canvas.getContext '2d'

class Square
  constructor: (x, y, width, height) ->
    @x = x
    @y = y
    @width = width
    @height = height
    @radius = 3
    @radius2 = 14
    @r = Math.floor(Math.random() * 255)
  render: () ->
    _g.context.beginPath()
    _g.context.fillStyle = "hsla(#{@r}, 100%, 50%, 1)"
    _g.context.rect(@x, @y, @width, @height)
    console.log "x:#{@x}, y:#{@y}, w:#{@width}, h:#{@height}"
    _g.context.fill()
    _g.context.closePath()

_g = new Global()
_grid = new Grid()

$ ->
  $("#canvas01").attr("width", Math.floor($(document).width()))
  $("#canvas01").attr("height", Math.floor($(document).height()))
  _g.init()

  collection = []
  for i in [1.._grid.loopCount]
    collection.push {
      size: {
        col: Math.floor(1 + Math.random() * 4)
        row: Math.floor(1 + Math.random() * 4)
      }
    }
  for i in [1.._grid.loopCount]
    collection.push {
      size: {
        col: 1
        row: 1
      }
    }

  $.each collection, () ->
    block = _grid.pickup(this.size.col, this.size.row)
    unless block is null
      for i in [0..(this.size.row - 1)]
        for j in [0..(this.size.col - 1)]
          bb = _grid.blocks[block.row + i][block.col + j]
          bb.kill()
          newCollection = []
          for b in _grid.blockCollection
            newCollection.push b unless bb is b
          _grid.blockCollection = newCollection

      (new Square((_grid.width * block.col), (_grid.height * block.row), (_grid.width * this.size.col), (_grid.height * this.size.row))).render()
      _grid.printBlocks()

  img = _g.canvas.toDataURL("image/png")
  _g.context.clearRect(0, 0, _grid.totalWidth, _grid.totalHeight)
  $("body").append "<img src='#{img}' />"
  $("#canvas01").remove()

 
 
元ネタはこれです。
http://toyota.jp/86/

卑猥なのとか卑猥なのとか卑猥なのとか好きだし

Standard
卑猥なのとか卑猥なのとか卑猥なのとか好きだし

タバコ税が増税されてたばこの値段が上がるっつっていちいち文句言う人ってなんなの?愛煙家とかなぞの肩書き。健康を害するっていうイメージも事実も変えようがないし、もういちいち反応するのやめましょう。どうせ値上がりしたところでタバコやめないんだし。そんなことよりボクは思いつきました、この不況を打開する新しい税。「貯金税」でどうですか!総理!貯め込むことが趣味の人達に消費活動に専念してもらいましょう。財産なんかモノに変えて貯めたらいいと思う。国のために。
 
 
だいぶ前にボクはこんなこと言ってました。
 
screenshot

screenshot

 
 
ということで、作ってみました。画像は全部スパムメールに付いてた画像です。
 
http://maps-gal-lery.heroku.com/
 
オフザケが過ぎるわ、まったく。
フォトギャラリーの部分はRailsデフォのprototypeとscript.aculo.usを使ってます。こちらのサイトを参考にしました。ありがとうございました。ギャラリー下のリンク(Vote ~~ GAL!!!!! のとこ)をクリックすると投票できますよ。スパム業者の画像の豊富さと卑猥な文章力はハンパないと思いました。少しはウィットに富んだ対応できたかな?あと、卑猥な感じをデザインで出すって実はビックリするほど難しい。エロサイト作ってる人達は卑猥センス抜群やなと思いました。
 
 
今回もHeokuです。rakeコマンドは普通に

  • heroku rake –trace db:migrate

とかやってやれば使えることを知りました。
 
 
 

Technorati Tags:

mixiアプリ作ってみた

Standard
mixiアプリ作ってみた

mixiって今までベータ版だったんですね。全然知りませんでした。
 
 
Opensocialの熱気に便乗して簡単なmixiアプリ作ってみました。
 
http://mixi.jp/view_appli.pl?id=7414
 
マイミクのプロフィール画像をTumblrのフォローリスト風に表示します。画像はその人のプロフページにリンクしてます。
驚くほど人の役に立たないアプリですw
オシャレな気分にすこしだけなれるぐらいです。
 
Gadget.xml

<?xml version="1.0" encoding="UTF-8"?>

<Module>
  <ModulePrefs title="My mixicloud">
    <Require feature="opensocial-0.8" />
    <Require feature="dynamic-height" />
  </ModulePrefs>
  <Content type="html"><![CDATA[

<div><span id="target"></span></div>

<script type="text/javascript">
function init() {
  var ip = {};
  ip[opensocial.IdSpec.Field.USER_ID] = opensocial.IdSpec.PersonId.OWNER;
  ip[opensocial.IdSpec.Field.GROUP_ID] = "FRIENDS";
  var idSpec = opensocial.newIdSpec(ip);
  var dp = {};
  dp[opensocial.DataRequest.PeopleRequestFields.PROFILE_DETAILS] = [
      opensocial.Person.Field.PROFILE_URL,
      mixi.PersonField.BLOOD_TYPE
  ];
  dp[opensocial.DataRequest.PeopleRequestFields.MAX] = 150;
  var req = opensocial.newDataRequest();
  req.add(req.newFetchPeopleRequest(idSpec, dp), "friends");
  req.send(function(data) {
    var htmltext="<style type='text/css'>#cont{background:url(http://bugcloud-flex.appspot.com/static/images/dot1.png) repeat scroll top left;-moz-background-clip:border;-moz-background-inline-policy:continuous;-moz-background-origin:padding;width:100%;height:300%;}ul{list-style-type:none;margin:0 0 0 -33px;padding-top:10px;width:190px;}ul.icons li{display:inline;float:left;position:relative;margin:0;padding:0;width:45px;height:45px;}ul.icons li a img{border:none;width:45px;height:45px;position:absolute;top:0;left:0;z-index:0;}ul.icons li a img:hover{top:5%;left:-3%;border:none;width:90px;height:90px;z-index:10;border: thick solid #000;}</style>";
        htmltext += "<div id='cont'><ul class='icons'>"
    var friends = data.get("friends").getData();
	friends.each(function(friend) {
      var id = friend.getId();
      var nickname = friend.getDisplayName();
      var thumbnailUrl = friend.getField(opensocial.Person.Field.THUMBNAIL_URL);
      // add innerhtml
      htmltext += "<li><a href='http://mixi.jp/show_profile.pl?id=" +id+"'><img src='"+thumbnailUrl+"' title='" +nickname+ "' alt='" +nickname+ "'></a></li>";
    });
    htmltext += "</ul></div>";
    document.getElementById("target").innerHTML = htmltext;
    gadgets.window.adjustHeight();
  });
}
gadgets.util.registerOnLoadHandler(init);
</script>

]]></Content>
</Module>

 
いまのところ奇跡のIE非対応です。
IE以外のブラウザ使ってる人は、機能追加のリクエストとかください。
firefoxで半日かけて作ったあとにIEでありえない表示されたのを見たときはwindowsをほたかしてやろうかと思った。
マウスオーバー時の動きとかCSSオンリーでつくったので、そのうちjqueryでも使って書き換えます。 IE対応します、多分きっと。
 
 
なんかよくわかりませんが、mixiアプリにはステータスっていうのがあって、10人の人が使ってくれないと公開できないらしいです。APIドキュメントがどこにあるのか謎。
 
 
 
P.S.
最近なぜか毛深くなってきたので日焼けするために散歩してます。昼ごはん食べた後。芝公園付近で仕事してる人いたら散歩の達人を一緒に目指さないか?
 
 
P.S.2.
日曜選挙ですね。民主党でもう決まった空気だけど。池田信夫blog曰く、市場原理主義なんて言葉を使ってる時点で鳩山由紀夫は世界から「世界の常識を知らない田舎者として無視される」らしい。日本の未来は暗いですね。外務大臣は巨乳の議員にすればいいと思う。
 
 

Technorati Tags: ,