music on iPod

music on iPod

• iPodで音楽を聴くのは外を歩いているときとCafeとかにいるときのみだ
• つまり連続して聞ける時間は長くても２時間、短いと20分程度だ
• そうすると自分のお気に入りの曲しかほとんど聞かない
• だから実際にはiPodにはきっと最近入手したばかりのアルバムの曲とお気に入りの200曲程度入れられれば十分だ
• むしろそれ以外の曲が入っていると邪魔な曲が多くなって、曲選択に無駄な時間を取られる
• おそらくこのことが分かっていても大量の曲を入れてしまうのは、結局選曲が面倒だからだろう

iphone size size(320, 460);

iphone size size(320, 460);

rake task

Rake taskがスクリプトの一元管理にも使えるということがわかったので、早速やってみる
ただ引数を取るスクリプトのやり方がよくわからない

task :default do
  system("rake -T")
end

desc "Login to coosa's mac as user coosa"
task :login_coosamac do
  system("ssh coosa@coosamac.local")
end

desc "Backup keyes's files to Bigmac, then mirror it to Eggmac"
task :backup_and_mirror_keyesmac => [:backup_keyesmac, :mirror_bigmac] do
  puts "backup and mirror to Eggmac completed"
end

desc "Backup keyes's mac important files to Bigmac"
task :backup_keyesmac do
  system("rsync -avz -e ssh --delete --exclude 'Library/Caches/' --exclude 'tmp/' --exclude '.Trash' --exclude '.mddata'
 --exclude 'Library/Application Support/MobileSync/Backup/' /Users/keyes/ /Volumes/BIGMAC/backups/keyesmac/")
end

desc "Mirror Bigmac with Eggmac"
task :mirror_bigmac do
  system("rsync -avz -e ssh --delete --exclude '.*' --exclude 'Desktop*' --exclude 'backups/' /Volumes/BIGMAC/ coosa@coo
samac.local:/Volumes/EGGMAC/backups/keyesmac/")
end

synegy file

.synegy.conf

# sample synergy configuration file
#
# comments begin with the # character and continue to the end of
# line.  comments may appear anywhere the syntax permits.

section: screens
        keyesmac.local:
        gos:
end

section: links
        keyesmac.local:
                left = gos
        gos:
                right = keyesmac.local
end

section: aliases
        keyesmac.local:
              keyesmac
end

synergy.sh

/usr/bin/synergys --name keyesmac --config .synergy.conf

千趣会ブラインドが届いたんだけど…

不良交換ということで千趣会ブラインドが届いた
同じ製品がないということで別の製品が来る予定だったんだけど
全く同じ製品が届いた
まあ文句はないんだけど気をつけないとまたジョイント部分が破損するな
今回は回しすぎないようにとの注意書きが添えてあったので同じトラブルが多発したと予想
一方で取り付けは元の金具がそのまま使えたので簡単に済んで助かる
窓枠の木材が硬くてネジをねじ込むのにとても苦労したことを思い出した

Processing to Hatena Diary

1. Processingのfile->exportでxxx.jarファイルを生成


2. iGoogle用のxmlファイルを作成(xxx.xmlを見よ)


3. DropboxのPublicにxxx.jarとxxx.xmlを配置


4. iGoogleでxxx.xmlをgadgetとして登録(コンテンツを追加->フィードやガジェットを追加, urlはxxx.xmlのpublic linkを指定)


5. はてなの投稿ページにgadgetにアクセスするタグを追加(tagを見よ)
   
   

xxx.xml

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

<Module>

  <ModulePrefs title="Fun of Processing!" height="460" />

  <Content type="html">

     <![CDATA[

        <applet archive= "http://dl.dropbox.com/u/58702/bounce04.jar"

        code="bounce04.class" width="320" height="460" ></applet>

     ]]>

  </Content>

</Module>

tag

<div class="hatena-widget">  

<script src="http://gmodules.com/ig/ifr?url=http://yoursite.jp/applet/yourgadget.xml& 

synd=open&w=100&h=35&title=&border=%23ffffff%7C0px%2C0px+solid+%23ffffff& 

output=js"></script> </div> 

java applet

java appletのarchiveには絶対パスを指定する

    <script type="text/javascript">
      /* <![CDATA[ */

      var attributes = {
            code: 'bounce04.class',
            archive: 'http://localhost:4567/applet/bounce04.jar',
            width: 500,
            height: 700,
            image: 'loading.gif'
          };
          var parameters = { };
          var version = '1.5';
          deployJava.runApplet(attributes, parameters, version);

          /* ]]> */
        </script>

昔のiPodの電卓

こっちのほうがよかったのに

Processing: ballを止める

Ballクラスにboolean on_colliitonを持たせる
mag(x, y)はdist(0, 0, x, y)と等価

    if (mag(vx, vy) < 0.3 && on_collition){
      vx = vy = 0;
    }
    on_collition = false;

Processing: collition2

衝突でボールが離れなくなるバグ有り

float X1, X2, Y1, Y2;
float Spx1, Spy1, Spx2, Spy2;
int r;

void setup(){
  size(400, 400);
  colorMode(HSB, 100);
  X1 = random(r, width-r);
  X2 = random(r, width-r);
  Y1 = random(r, height-r);
  Y2 = random(r, height-r);
  Spx1 = 5;
  Spy1 = Spx1;
  Spx2 = 3;
  Spy2 = -Spx2;
  r = 20;
  frameRate(60);
  smooth();
}

void draw(){
  fadeToWhite(99, 100);

  bounce();
  collide();
  X1 += Spx1;
  Y1 += Spy1;
  X2 += Spx2;
  Y2 += Spy2;
 
  fill(90, 60, 60, 90);
  ellipse(X1, Y1, r*2, r*2);
  fill(40, 60, 60, 90);
  ellipse(X2, Y2, r*2, r*2);
}

void bounce() {
  if (X1 <= r || X1 >= width-r){
    Spx1 = -Spx1;
    if (X1 <= r) { X1 = 2*r - X1; }
    if (X1 >= width-r) { X1 = 2*(width-r) - X1; }
  }
  if (X2 <= r || X2 >= width-r){
    Spx2 = -Spx2;
    if (X2 <= r){ X2 = 2*r - X2; }
    if (X2 >= width-r) { X2 = 2*(width-r) - X2; }
  }
  if (Y1 <= r || Y1 >= height-r){
    Spy1 = -Spy1;
    if (Y1 <= r) { Y1 = 2*r - Y1; }
    if (Y1 >= height-r) { Y1 = 2*(height-r) - Y1; }
  }
  if (Y2 <= r || Y2 >= height-r){
    Spy2 = -Spy2;
    if (Y2 <= r){ Y2 = 2*r - Y2; }
    if (Y2 >= height-r) { Y2 = 2*(height-r) - Y2; }
  }
}

void collide() {
  float dd = dist(X1, Y1, X2, Y2);
  float min = r * 2;
  if (dd <= min){
    Spx1 = -Spx1;
    Spy1 = -Spy1;
    Spx2 = -Spx2;
    Spy2 = -Spy2;
    X1 = X1 - (min - dd);
    X2 = X2 - (min - dd);
    Y1 = Y1 - (min - dd);
    Y2 = Y2 - (min - dd);
  }
}

void fadeToWhite(int max_color, float fade_speed) {
  noStroke();
  fill(max_color, fade_speed);
  rectMode(CORNER);
  rect(0, 0, width, height);
}

Processing: collition

float X1, X2, Y;

float Sp1, Sp2;

int r;



void setup(){

  size(400, 400);

  colorMode(HSB, 100);

  X1 = width/2 + 30;

  X2 = width/2 - 30;

  Y = height/2;

  Sp1 = 5;

  Sp2 = -Sp1;

  r = 20;

  frameRate(30);

  smooth();

}



void draw(){

  fadeToWhite(99, 100);



  bounce();

  collide();

  X1 += Sp1;

  X2 += Sp2;

 

  fill(90, 60, 60, 90);

  ellipse(X1, Y, r*2, r*2);

  fill(40, 60, 60, 90);

  ellipse(X2, Y, r*2, r*2);

}



void bounce() {

  if (X1 <= r || X1 >= width-r){

    Sp1 = -Sp1;

    if (X1 <= r) { X1 = 2*r - X1; }

    if (X1 >= width-r) { X1 = 2*(width-r) - X1; }

  }

  if (X2 <= r || X2 >= width-r){

    Sp2 = -Sp2;

    if (X2 <= r){ X2 = 2*r - X2; }

    if (X2 >= width-r) { X2 = 2*(width-r) - X2; }

  }

}



void collide() {

  float dd = dist(X1, Y, X2, Y);

  float min = r * 2;

  if (dd <= min){

    Sp1 = -Sp1;

    Sp2 = -Sp2;

    X1 = X1 - (min - dd);

    X2 = X2 - (min - dd);

  }

}



void fadeToWhite(int max_color, float fade_speed) {

  noStroke();

  fill(max_color, fade_speed);

  rectMode(CORNER);

  rect(0, 0, width, height);

}

千趣会ブラインド

• ５つ買ったブラインドのうち４つのジョイントがイカれたので、部品を購入する目的で千趣会にTEL。一応ちょっと不良品ぽいと一言
• 後日担当（小谷さん）より電話が有り、部品交換はできず、更に現在その商品は取り扱っていないとの連絡。しかし４つも壊れたということで、検討のため是非とも写真をくれと
• 写真を撮影し簡単な説明と共に、同日メール
• 本日電話あり、破損状況が酷いのにおどろいていると。ついては全品を現行販売品と交換させてもらいたいと。なんと意外な展開
• 商品着後、元の品を返品要。カスタマーセンターに引取り連絡要

買ってから２年半も経過しているので、部品購入、あるいは最悪部品ナシで諦めかと予想していたけど、まさかこのような展開になるとは。
まあでも４つも同じ箇所が破損していることを考えれば、これは不良品といっていいな。
また取り付け作業が大変だけど、不便がなくなるのでそのほうがいい。

Processing methods

1. 画面サイズ： size(x, y)
2. 点と線： point(x, y), line(x1, y1, x2, y2)
3. 多角形： rect(x1, y1, w, h), triangle(x1, y1, x2, y2, x3, y3), quad(x1, y1, x2, y2, x3, y3, x4, y4)
4. 多角形モード： rectMode([CORNER, CENTER, CORNERS])
5. 円と弧： ellipse(xc, yc, dw, dh), arc(xc, yc, dw, dh, radians(rs), radians(re))
6. 曲線： curve(x1, y1, x2, y2, x3, y3, x4, y4), bezier(x1, y1, cx1, cy1, x2, y2, cx2, cy2)
7. 複雑な形： beginShape(); vertex(x1, y1); vertex(x2, y2).. endShape(CLOSE);
8. 複雑な曲形： beginShape(): curveVertex(x1, y1).. endShape();
9. 色モード： colorMode([HSB, RGB], range(h_range, s_range, b_range))
10. 背景色： background([grayscale, 16bit, (H, S, B/R, G, B)])
11. 線の属性： stroke([grayscale, 16bit, (H, S, B/R, G, B)], opac), noStroke(), strokeWeight(w)
12. 面の属性： fill([grayscale, 16bit, (H, S, B/R, G, B)], opac), noFill()
13. エッジの属性： smooth(), noSmooth()
14. データ型： boolean, int, float, color, byte, char
15. 変数宣言： int i_data; float f1_data, f2_data; int i_data = 10
16. 型変換： boolean(string_data), int(data)
17. 色データ型： color c = color(h, s, b); fill(c)
18. システム変数： width, height
19. 座標変換： translate(moveX, moveY), rotate(radians(120)), scale(0.5), pushMatrix(), popMatrix()
20. 画像の読み込み： PImage img = loadImage("sample.jpg")
21. 画像の表示： image(img, x, y, w, h)
22. 画像モード： imageMode([CORNER, CORNERS, CENTER])
23. 画像の色指定： tint([grayscale, 16bit, (H, S, B/R, G, B)]), noTint()
24. 画像の操作： img.width, img.height, img.copy(), img.mask(other_pimage)
25. 文字の表示： textSize(24); textAlign(CENTER), text("hello", x, y (w, h))
26. フォントの指定： PFont font = loadFont("sample.vlw"); textFont(font)
27. コンソール出力： println(x)
28. ゆらぎの表現： rect(x+random(-range, range), y+random(-range, range), 10, 10)
29. マウスの移動距離： dist(mouseX, mouseY, pmouseX, pmouseY)
30. PDFに出力： import processing.pdf.*; size(x, y, "out.pdf"); exit()
31. 初期化： void setup(){ size(x, y); background(); colorMode(); frameRate(r); }
32. メインループ： void draw(){ stroke(color); int x = int(random(w)); int y = int(random(h)); rect(...) }
33. 関数定義： void fadeToWhite(c, f){ noStroke(); fill(c, f); rectMode(CORNER); rect(0,0,width,height); }
34. スピードの減衰： float FRICTION = 0.94; SpeedX *= FRICTION; X += SpeedX
35. 円の動き： Angle += 10; X = CircleX + (R * cos(radians(Angle))); Y = CircleY + sin(radians(Angle))
36. 落下の動き： float GRAVITY = 3; SpeedY += GRAVITY; Y += Speedy
37. バネの動き： float distY = Y - SpringLen; Accy = -K * distY; SpeedY = FRICTION * (SpeedY + Accy)
38. 引力の動き： float SCALE = 0.0005; float distX = X - targetX; Accx = SCALE * sq(distX); if(X>targeX) Accx = -Accx
39. マウスの動き： float speed = dist(mouseX, mouseY, pmouseX, pmouseY)
40. マウスクリック： void mousePressed(){ if(mouseButton == LEFT) ... }
41. マウスの移動： void mouseMoved(){...}, void mouseDragged(){...}
42. キーの入力： void keyPressed(){ switch(key){ case 'a':...break;}}, void keyReleased(){...}
43. 配列宣言： int[] X = new int[Length], int[][] map = {{1,2,3},{4,5,6},{7,8,9}}
44. マウスドラッグ： void mousePressed(){ if(OnMouse) onDrag = true }; void mouseReleased(){ OnDrag = false}
45. 力をためる： if(mousePressed){ Power += 1}
46. ピクセル操作： PImage img = loadImage("s.jpg"); img.loadPixels(); pos = (y*img.width)+x; pixels[pos] = img.pixels[pos]; updatePixels();
47. ３Ｄ座標： size(x, y, P3D); line(x1, y1, z1, x2, y2, z2)
48. クラス定義： public class Ball(){ Ball(){ ..initialize..} public void move(){...} }
49. テキストファイルの読み込み： String[] Str; Str = loadString("data.txt"); text(Str, x, y)
50. 時間の表示： text(year() + "/" + month() + "/" + day())
51. 範囲変換： float mapped_val = map(mouseX, 0, width, 0, 100)
52. 中間色変換：color c = lerpColor(color1, color2, map(x, 0, width, 0, 1))
53. XMLを読む： XMLElement Xml = new XMLElement(this, xml_data); Xml.getChild(0).getContent()
54. 音楽再生： import ddf.minim.*; Minim m = new Minim(this); AudioPlayer audio = m.loadFile("s.mp3", 2048);
55. 音楽再生2： audio.play(), pause(), isPlaying, length, position, close(); m.stop()
56. 波形発振： import ddf.minim.*;import ddf.minim.signals.*; Minim minim; AudioOutput out; SineWave sine; SquareWave square;
57. 波形発振2： minim = new Minim(this); out = minim.getLineOut(Minim.STEREO); sine = new SineWave(440, 0.5, out.sampleRate()); out.addSignal(sine)

Processing Heros

Processing Heros
Ben Fry http://benfry.com/
Casey Reas http://reas.com/
Aaron Koblin http://www.aaronkoblin.com/
Golan Levin http://www.flong.com http://artport.whitney.org/commissions/thedumpster/
Jared Tarbell http://levitated.net/ http://www.complexfication.net/
Karsten Schmidt http://postspectacular.com/
LIA http://www.liaworks.com/
Robert Hodgin http://roberthodgin.com/
Usman Haque http://www.haque.co.uk/
d.v.d http://www.dvd-3.com/

2010年9月分電気代

14,559円！
去年の倍！

vim helptags [dir]

help fileを登録する
:helptags [dir]

processing to pdf

processing to pdf
libraryをインポートして、最後にexit()する

import processing.pdf.*;

size(200, 200, PDF, "sample.pdf");
colorMode(HSB, 100);
background(100);
noStroke();

for (int i = 0; i<500; i++){
 
  float color1 = random(0, 50);
  float color2 = random(50, 100);
  fill(color1, color2, color2, 60);
  float x = random(200);
  float y = random(200);
  rect(x, y, 10, 10);
}
exit();

processing environment

Processingのエディタがチョ絶使い辛いので
VimかTMで環境構築を試みるもどうもうまくいかない
Python実行でこける
で最新のPythonをインストールしたりするもダメ

TMではprocessing bundleが/Library/..に入ってしまいTM_BUNDLE_SUPPORT pathと不一致だったので移行するも効果なし

まあいずれのエディタでもsyntax highlightがつかえるようになったのでよしとするか

vim commands

fa, Fa, ta, Ta: find next a in the line

d3w, d3aw: delete 3 words

df>, dF>: delete words to > mark

. : repeat previous command

mx->d`x: delete words from 'x' mark

mx->y`x: yank words from 'x' mark

!10Gsort: sort 10 lines

!!ls: insert ls output to current line

>>, <<: shift

=%: indent inner of {}

%: move between parentheses

>%, >i{: indent inner block

v->i{>: indent inner block at visual mode

abbreviate

map i{ea} word wrap with {}

fx ; ,: repeat forward or backword find x

s, S: xi, ddi

~: upper lower convert

*, #: word search forward or backword

regex: /\/ : find only 'for' word not include 'forword', 'information'

: \t \= : +, ?

: \a \d : a word a number

iPhone Development

1. iPhone用の画面設計
2. jQTouchの利用
3. クライアントサイド・ストレージの使用
4. オフラインキャッシュの使用
5. ネイティブ化

１．iPhone用の画面設計

• meta veiwport width=device-width, calabe=no
• link stylesheet media=screen
• meta apple-mobile-web-app-capable
• touchstart: document.addEventListener("touchstart", click, false)
• touchmove: document.addEventListener("touchmove", move, false) def move...
• イベントターゲットの調整
  

２．jQTouchの利用
３．クライアントサイド・ストレージの使用

• localStrage
• SessionStrage
• DataBase
  

４．オフラインキャッシュの使用
５．ネイティブ化

• PhoneGap
• Rhodes
  

vim commands

:registers show register text
"ayy : copy to 'a' register
i<C-r>a : yank from 'a' register
<C-w>r, x : rotate or switch windows
:wall, :qall, :wqall  : write all opened files
v-mode:
  $, aw, o  : select to end, word, top-bottom toggle
  gv : repeat last vmode ope
  ~, v, V : convert word
:set scrollbind, :syncbind

Macbook Pro + iPod Touch

Macbook Pro + iPod Touch

• アマゾンは５％OFF
• アマゾンで他業者のが更に500円安い
• 最安値は価格.comでアマゾンより1万円更に安い。でもちょっと不安
• ヨドバシ他は値引きナシポイント8%(現金)とか
  

まあ予算30万円

(追記)英語キーボードヴァージョンはAppleでしか買えないことが、ヨドバシにて判明。

iPhone開発まとめ

現在わかっていること

• 開発の方法として2種類ある
• １つは、スタンダードな方法で、xcode上でObjective-Cを使ってコーディングし、コンパイル
• もう１つは、HTML+CSS+Javascriptを使ってコーディングし、PhoneGapでxcode上のコードに変換する
• HTML..を使う場合、jQTouchは必須。アニメーションはiProcessing.jsがある。
  
• HTML..を使う場合、AppStoreを通さないWebアプリであればPhoneGapは不要
• PhoneGapとiphone対応のxcodeはLeopard上でなければ動作しない
• AppStoreを通す場合は$99/年が必要
  
• 結局、AppStoreを通すiPhone開発にはLeopardは必須

iprocessingが動かない？

ipodでprocessingを動かすためにprocessing.jsを改良したiprocessing.jsというのがあって
これをためしてるんだけれども、うまくいかない。

• ipod独自のファンクションであるtouchmoveとかが普通のmousemoveになっていて効かない
• animationはちょっと重くて使えない
• 現在はhtml+javascriptをそのまま動かしている
• xcodeでobjective-cにコンパイルしてインストールすることができるけれどもTigerじゃできない

だからObjective-Cにコンパイルできればうまくいくかも知れないけど
現時点ではわからない

Michael Schieben // rockitbaby.de http://www.rockitbaby.de/experiments/processingjs-on-iphone#

processing on iphone with sinatra

app.rb

require "sinatra"
require "haml"
require "sass"


get '/' do
  haml :index
end

get '/style.css' do
  content_type 'text/css', :charset => 'utf-8'
  sass :style
end

index.haml

!!!
%html
  %head
    %meta{:'http-equiv' => 'Content-type', :content => 'text/html', :charset => 'utf-8'}
    %meta{:name => "viewport", :content => "user-scalable=no, width=device-width, minimum-scale=1.0, maximum-scale=1.0"} //iphoneで画面の幅を合わせる
    %meta{:name => "apple-mobile-web-app-capable", :content => "yes"}   //iphoneでフルスクリーンモードに
    %meta{:name => "apple-mobile-web-app-status-bar-style", :content => "black"} //iphoneでステータスバーを黒に
    %title Processing
    %link{:rel => 'stylesheet', :href => '/style.css', :type => 'text/css', :media => "only screen and (max-width: 480px)"} //iphone用のCSS
    %link{:rel => 'stylesheet', :href => '/style.css', :type => 'text/css', :media => "only screen and (min-width: 481px)"} //desktop用のCSS
    %script{:type => 'text/javascript', :src => '/javascripts/jquery.js'}
    %script{:type => 'text/javascript', :src => '/javascripts/processing.js'}
    %script{:type => 'text/javascript', :src => '/javascripts/myjs.js'}
  %body
    %canvas.processing //processingの描画エリアの確保

myjs.js

$(document).ready(function(){
  function move (e) {
    e.preventDefault();
    return false;
  }

  function click (e) {
    alert(e);
    return false;
  }
    //processingで外部ファイルの読み込み

    var processing_init = function(obj, url) {
        obj.each( function(){
            var canvas = $(this)[0];
            var p = Processing( canvas );
            var code = $(this).text() || p.ajax( url );
            Processing( canvas, code );
        });
    };
    processing_init( $('.processing'), 'javascripts/head-animation.pjs' );

  //document.addEventListener("touchstart", click, false);
  //document.addEventListener("touchmove", move, false);
  $(document).bind('touchmove', move);//iphoneで画面スクロールを禁止
  $(document).bind('touchstart', click); //iphoneのtouchstartイベント


});

default.pjs

/*
  PROCESSINGJS.COM - BASIC EXAMPLE 
  Delayed Mouse Tracking
  MIT License - Hyper-Metrix.com/F1LT3R
  Native Processing compatible
*/ 

// Global variables
float radius = 50.0;
int X, Y;
int nX, nY;
int delay = 16;

// Setup the Processing Canvas
void setup(){
  size( 180, 100 );
  strokeWeight( 10 );
  frameRate( 15 );
  X = width / 2;
  Y = height / 2;
  nX = X;
  nY = Y; 
}

// Main draw loop
void draw(){
 
  radius = radius + sin( frameCount / 4 );
 
  // Track circle to new destination
  X+=(nX-X)/delay;
  Y+=(nY-Y)/delay;
 
  // Fill canvas grey
  background( 100 );
 
  // Set fill-color to blue
  fill( 0, 121, 184 );
 
  // Set stroke-color white
  stroke(255);
 
  // Draw circle
  ellipse( X, Y, radius, radius );                 
}


// Set circle's next destination
void mouseMoved(){
  nX = mouseX-200;
  nY = mouseY-200; 
}