Ruby on Railsの最近のブログ記事
Think ITのこちらの記事を読みながら、オンライン付箋を実際に作ってみたものの、RoRとAIRのバージョンがあがっていてうまく動作しなかったり、最後までできたけどスクリプト中途半端だっりしたたので、ある程度動くものに改造してみた。
とはいうものの、
ActionScript2は結構さわっていたけど、AS3は今回はじめて。
AIRもはじめて。
Ruby on Railsもはじめて。
コマンドプロンプトなんていうのもよくわからない。
と新年早々初めて三昧気味だったので、全体的にやっつけ感もあるけど、まぁ最初はこんなもんだ。
以下覚えている注意点
Ruby on Rails (Rails v2.0.2, ruby v1.6.8) :
●「scaffold_resource」は「scaffold」になった（参考）
●database.yamlでsyntax エラーが発生する（参考）
adapter: mysql
encoding: utf8
database: stickes_development
username: root
password: *********
host: localhost
というかんじで「:」のあとにスペースが必要。
それぞれの項目の前にタブをいれてもエラーになった。
●InvalidAuthenticityTokenというエラーが出る（参考）
protect_from_forgeryというので解決。
AIR (beta3):
●<rootContent>というタグはなくなったので<initialWindow>の中に<content>として入れる（参考）
●xmlns="http://ns.adobe.com/air/application/1.0.M6"
あとの仕様の変更はたくさんありすぎて、覚えていない。
そういうのを調べつつ、記事を読みながら完成させたが、ちょっとご本人もお忙しかったのか、あまり良い出来のものではなかった。
そこでカスタムし、
- アプリケーションを立ち上げると自動で付箋を読み込む
- 付箋を移動すると、自動保存
- テキストエリアに書き込むと、自動保存
- xボタンを押すと、削除
と、ある程度実用的なものにしてみた。
（RoR側の変更はなし。）
stickies-app.xml
<?xml version="1.0" encoding="utf-8" ?>
<application xmlns="http://ns.adobe.com/air/application/1.0.M6" minimumPatchLevel="1047">
<id>jp.onlinehusen</id>
<version>1.0</version >
<filename>オンライン付箋</filename>
<name>オンライン付箋</name>
<description>Ruby on RailsとAdobe AIRでデスクトップアプリを作るデモ</description>
<copyright>Copyright 2006</copyright>
<installFolder>Adobe/Examples</installFolder>
<programMenuFolder>Adobe/Examples</programMenuFolder>
<initialWindow>
<content>menu.swf</content>
<title>online husen</title>
<systemChrome>standard</systemChrome>
<transparent>false</transparent>
<visible>true</visible>
<width>60</width>
<height>20</height>
<x>250</x>
<y>0</y>
<minSize>10 10</minSize>
<maxSize>100 100</maxSize>
<minimizable>true</minimizable>
<maximizable>false</maximizable>
<resizable>false</resizable>
</initialWindow>
<icon>
</icon>
<customUpdateUI>false</customUpdateUI>
<allowBrowserInvocation>false</allowBrowserInvocation>
</application>
menu.mxml
<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" width="100" height="20" creationComplete="load();" closing="onClosing(event);" >
<mx:Script>
<![CDATA[
public var stickies:Array = new Array();
public var stickNum:Number = new Number();
public function create():void {
var sticky:Sticky = new Sticky();
stickNum++;
sticky.id = stickNum;
var request:URLRequest;
request = new URLRequest("http://localhost:3000/stickies.xml");
request.method = 'POST';
var variables : URLVariables = new URLVariables ();
variables['sticky[x]'] = sticky.window.x ;// Capabilities.screenResolutionX;
variables['sticky[y]'] = sticky.window.y ;// Capabilities.screenResolutionY;
variables['sticky[width]'] = sticky.window.width;
variables['sticky[height]'] = sticky.window.height;
variables['sticky[body]'] = sticky.editor.text;
request.data = variables;
var loader:URLLoader = new URLLoader();
loader.load(request);
sticky.show();
stickies.push(sticky);
}
public function load():void {
var request:URLRequest = new URLRequest("http://localhost:3000/stickies.xml");
request.method = 'GET';
var loader:URLLoader = new URLLoader();
loader.addEventListener(Event.COMPLETE, function(e:Event):void {
var xml:XML = new XML(e.target.data);
var sL:Number = xml.sticky.length();
for each(var element:Object in xml.sticky){
var sticky:Sticky = new Sticky();
sticky.createNew = new Boolean(false);
sticky.id = element.id;
sticky.editor.text = element.body;
sticky.window.x = element.x; //* Capabilities.screenResolutionX;
sticky.window.y = element.y; //* Capabilities.screenResolutionY;
sticky.window.width = element.width;
sticky.window.height = element.height;
sticky.show();
stickNum = sticky.id;
stickies.push(sticky);
}
});
loader.load(request);
}
private function onClosing(event:Event):void {
for each (var sticky:Sticky in stickies) {
if(sticky){
sticky.window.close();
}}
}
]]>
</mx:Script>
<mx:Button left="10" top="10" label="new" id="new_btn" click="create();" />
<!--<mx:Button right="60" top="10" label="load" id="load_btn" click="load();" /> -->
<!-- <mx:Button right="10" top="10" label="save" id="save_btn" /> click="save();" -->
<!--<mx:TextArea right="10" top="40" left="10" bottom="10" id="messages" />-->
</mx:WindowedApplication>
menu.mxml
package {
import flash.text.*;
import flash.display.*;
import flash.events.*;
import flash.system.*;
import mx.controls.*;
import flash.net.*;
import flash.utils.Timer;
public class Sticky extends Sprite{
public var window:NativeWindow;
public var editor:TextField;
public var id:Number;
public var createNew:Boolean;
public var button:SimpleButton = new SimpleButton( );
public var timer:Timer = new Timer(1000,1);
public static var RESIZE_HANDLE_SIZE:int = 20;
public function Sticky():void {
timer.addEventListener(TimerEvent.TIMER,onTick);
var initOptions:NativeWindowInitOptions = new NativeWindowInitOptions();
initOptions.systemChrome = NativeWindowSystemChrome.NONE;
initOptions.transparent = false;
initOptions.type = NativeWindowType.LIGHTWEIGHT;
window = new NativeWindow(initOptions);
window.stage.align = StageAlign.TOP_LEFT;
window.stage.scaleMode = StageScaleMode.NO_SCALE;
editor = new TextField();
editor.x = editor.y = 0;
editor.selectable = true;
editor.border = false;
editor.type = TextFieldType.INPUT;
editor.multiline = true;
editor.background = true;
editor.wordWrap = true;
editor.backgroundColor = 0xE6E082;
window.stage.addChild(editor);
window.width = editor.width = 300;
window.height = editor.height = 100;
window.stage.addEventListener(Event.RESIZE, function(evt:Event):void {
resized();
});
window.stage.addEventListener(MouseEvent.MOUSE_DOWN,
function(evt:MouseEvent):void {
var x:Number = evt.stageX;
var y:Number = evt.stageY;
if (y > window.height - RESIZE_HANDLE_SIZE && x > window.width - RESIZE_HANDLE_SIZE) {
window.startResize(NativeWindowResize.BOTTOM_RIGHT);
}
else {
window.startMove();
}
}
);
window.stage.addEventListener(MouseEvent.MOUSE_UP,
function(evt:MouseEvent):void {
save();
}
);
editor.addEventListener(TextEvent.TEXT_INPUT,
function(evt:TextEvent):void {
if(timer){
timer.stop();
}
timerSave();
}
);
} // end of function Sticky
public function show():void {
window.visible = true;
//閉じるボタンの生成
button.x = window.width-15;
button.y = 5;
button.upState = createBox( 0xE6E082, 10 ,0.3);
button.overState = createBox( 0xE6E082, 10 ,1);
button.downState = createBox( 0xCCCCCC, 10 ,1);
button.hitTestState = button.upState;
button.addEventListener( MouseEvent.CLICK, onMouseDown );
window.stage.addChild( button );
}
public function resized():void {
editor.width = window.width;
editor.height = window.height;
button.x = window.width-15;
button.y = 5;
save();
}
public function save():void {
var request:URLRequest;
request = new URLRequest("http://localhost:3000/stickies/"+id+".xml");
request.method = 'PUT';
var variables : URLVariables = new URLVariables ();
variables['sticky[x]'] = window.x ;// Capabilities.screenResolutionX;
variables['sticky[y]'] = window.y ;// Capabilities.screenResolutionY;
variables['sticky[width]'] = window.width;
variables['sticky[height]'] = window.height;
variables['sticky[body]'] = editor.text;
request.data = variables;
var loader:URLLoader = new URLLoader();
loader.load(request);
}
private function onMouseDown(e:MouseEvent):void{
trace("onMouseDown");
var requ:URLRequest = new URLRequest("http://localhost:3000/stickies/"+id+".xml");
requ.method = 'DELETE';
var loader:URLLoader = new URLLoader();
loader.load(requ);
window.close();
}
private function createBox( color:uint, radius:Number ,vis:Number):Shape {
var xShape:Shape = new Shape( );
xShape.graphics.lineStyle( 1, 0x000000 );
xShape.graphics.beginFill( color );
xShape.graphics.drawRect( 0, 0, radius ,radius);
xShape.graphics.moveTo( 0, radius );
xShape.graphics.lineTo( radius, 0);
xShape.graphics.moveTo( radius, radius );
xShape.graphics.lineTo( 0, 0);
xShape.graphics.endFill( );
xShape.alpha = vis;
return xShape;
}
public function timerSave():void{
timer.start();
}
public function onTick (evt:TimerEvent):void {
timer.stop();
save();
}
} // end of class Sticky
} // end of package
