万華鏡 - Kaleidoscope

万華鏡 (KaleidoscopeController) by enok
画像はJPG, GIF, PNGに対応してます。サイズは200KBまでです。
画像サイズを400～600pxぐらいにするといい感じ。縦横の長さが違うと効果あります。
その他詳細はこちら http://linkalink.jp/enok/?p=573

linktale

forked:14
favorite:30
lines:292
license : MIT License
modified : 2009-09-03 02:40:12

Embed: Tweet

// 万華鏡 (KaleidoscopeController) by enok
//
// 画像はJPG, GIF, PNGに対応してます。サイズは200KBまでです。
// 画像サイズを400～600pxぐらいにするといい感じ。縦横の長さが違うと効果あります。
//
// その他詳細はこちら http://linkalink.jp/enok/?p=573

package {
    import flash.display.Sprite;

[SWF(backgroundColor="0x000000", frameRate="24")]

public class KaleidoscopeController extends Sprite { 
        public function KaleidoscopeController():void {
            //背景をしく
            graphics.beginFill(0x000000);
            graphics.drawRect(0, 0, stage.stageWidth, stage.stageHeight);
            graphics.endFill();
       
            //万華鏡を配置
            var trick:Kaleidoscope = new Kaleidoscope(this);
            addChild(trick);
        } 
    } 
}

import flash.display.Bitmap;
import flash.display.BitmapData;
import flash.display.BitmapDataChannel;
import flash.display.DisplayObjectContainer;
import flash.display.SimpleButton;
import flash.display.Sprite;
import flash.events.Event;
import flash.geom.Matrix;
import flash.geom.Point;
import flash.geom.Rectangle;
import flash.utils.Timer;
//万華鏡本体
class Kaleidoscope extends Sprite {
    protected var _centerX:Number; //中心X
    protected var _centerY:Number; //中心Y
    protected var _imgBmp:Bitmap; //読込画像ビットマップ
    protected var _sec:Sector; //扇クラス
    protected var _partsBmpArray:Array; //万華鏡のパーツ配列
    protected var _partsAngle:Number = 30; //一つの万華鏡の角度
    protected var _ksRadius:Number = 0; //万華鏡の半径
    protected var _imgParam:Object = new Object(); //画像のパラメータ配列
    protected var _maskBmpData:BitmapData; //扇型マスクのビットマップデータ
    protected var _fileup:fileUpload; //ファイルアップクラス
    protected var _viewSp:Sprite; //万華鏡スプライト

public function Kaleidoscope(s:DisplayObjectContainer):void {
        //中点
        _centerX = s.stage.stageWidth / 2;
        _centerY = s.stage.stageHeight / 2;

//初期画像の取得
        var imgLoader:ImageLoader = new ImageLoader(this, "http://linkalink.jp/enok/wonderfl/kaleidoscope/images/sample/1.jpg");
        imgLoader.addEventListener(ImageLoader.LOAD_COMPLETE, init);
    }
   
    //ロード画像の初期化
    protected function init(e:Event):void {
        //画像変数初期化
        _imgParam["angle"] = 0.0;
        _imgParam["scale"] = 1.0;
        _imgParam["vx"] = 0.0;
        _imgParam["vec"] = 1;
       
        //画像のビットマップ化
        var loader:Loader = e.currentTarget.loader;

var imgBmpData:BitmapData = new BitmapData(loader.width, loader.height);
        imgBmpData.draw(loader);
        _imgBmp = new Bitmap(imgBmpData);
       
        //長い方の片を万華鏡の半径にする
        _ksRadius = Math.min(Math.max(loader.width, loader.height), 420) / 2;
       
        //扇型クラス取得
        _sec = new Sector(0, 0, _partsAngle, 0, _ksRadius);
        //扇型マスクのBitmap化
        _maskBmpData = new BitmapData(_imgBmp.width, _imgBmp.height, true, 0x00000000);
        _maskBmpData.draw(_sec);
       
        //万華鏡パーツの設置
        _viewSp = new Sprite();
        _partsBmpArray = new Array()
        for (var i:uint = 0; i < Math.ceil(360 / _partsAngle); i++ ) {
            var partsBmp:Bitmap = new Bitmap();
            _partsBmpArray.push(partsBmp);
            _viewSp.addChild(partsBmp);
        }

//追加
        addChild(_viewSp);
        addEventListener( Event.ENTER_FRAME, update );
       
        //ファイルアップ系
        _fileup = new fileUpload(this);
        _fileup.addEventListener(fileUpload.UP_COMPLETE, changeImgLoad);
    }
   
    //繰り返し処理
    protected function update(e:Event):void {
        copyKsParts( createKsParts() );
    }
   
    //扇型画像作成
    protected function createKsParts():BitmapData {       
        //画像ビットマップの変形処理
        var mat:Matrix = new Matrix();
        mat.translate( -_ksRadius, -_ksRadius);
        if (_ksRadius - stage.mouseX > 0) {
            _imgParam["vec"] = 1.0;
        }else {
            _imgParam["vec"] = -1.0;
        }
        var dist:Number = Math.sqrt(Math.pow(_centerX - stage.mouseX, 2) + Math.pow(_centerY - stage.mouseY, 2))
        _imgParam["vx"] = dist / _ksRadius * Math.PI * _imgParam["vec"];
        _imgParam["angle"] += _imgParam["vx"] * 0.02;
        mat.rotate(_imgParam["angle"]);
        _imgParam["scale"] = Math.min(1 / (dist / _ksRadius), 1.0);
        mat.scale(_imgParam["scale"], _imgParam["scale"]);

//画像ビットマップマップデータ化
        var imgBmpData:BitmapData = new BitmapData(_imgBmp.height, _imgBmp.height, true, 0x00000000);
        imgBmpData.draw(_imgBmp, mat);
       
        //画像と扇型マスクを合体
        imgBmpData.copyChannel(_maskBmpData, new Rectangle(0, 0, _imgBmp.width, _imgBmp.height), new Point(0, 0), BitmapDataChannel.ALPHA, BitmapDataChannel.ALPHA);
       
        //処理後のビットマップマップデータを返す
        return imgBmpData;
    }
   
    //扇型画像をコピー
    protected function copyKsParts(imgBmpData:BitmapData):void {
        for (var i:uint = 0; i < _partsBmpArray.length; i++) {
            var mat:Matrix = new Matrix();
            //配置処理
            if (i % 2 != 0) {
                mat.scale( 1.0, -1.0);
                mat.rotate(_partsAngle * Math.PI / 180);
            }
            mat.rotate((i * _partsAngle - 90) * Math.PI / 180);
            mat.translate(_centerX, _centerY);
           
            //反映
            _partsBmpArray[i].transform.matrix = mat;
            _partsBmpArray[i].bitmapData = imgBmpData;
        }
    }
   
    //画像変更
    protected function changeImgLoad(e:Event):void {
        //画像ロード
        var imgLoader:ImageLoader = new ImageLoader(this, "http://linkalink.jp/enok/wonderfl/kaleidoscope/images/users/"+_fileup.name);
		imgLoader.addEventListener(ImageLoader.LOAD_COMPLETE, changeImg);
    }
   
    //画像変更処理
    protected function changeImg(e:Event):void {
        //画像のビットマップ化
        var loader:Loader = e.currentTarget.loader;
        var imgBmpData:BitmapData = new BitmapData(loader.width, loader.height);
        imgBmpData.draw(loader);
        _imgBmp = new Bitmap(imgBmpData);
       
        //万華鏡半径算出
        _ksRadius = Math.min(Math.max(loader.width, loader.height), 420) / 2;
    }
}

//扇型クラス
//sketchbook参考にさせて頂きました
class Sector extends Sprite {
    public function Sector(px:Number, py:Number, partsRotate:Number, startAngle:Number, ksRadius:Number):void {
        var points:Array = getArcPoints(px, py, ksRadius, partsRotate, startAngle, 180);
        points.unshift( new Point(x, y) );
        drawLines(points);
    }
   
    //扇形、円弧と中心点を結んだ形状を算出
    private function getArcPoints(x:Number, y:Number, radius:Number, degree:Number, fromDegree:Number=0, split:Number=36):Array{
        var points:Array = new Array();
        var fromRad:Number = fromDegree * Math.PI / 180;
        var dr:Number = (degree * Math.PI / 180) / split;
       
        for(var i:int=0; i<split + 1; i++){
            var pt:Point = new Point();
            var rad:Number = fromRad + dr * i;
            pt.x = Math.cos(rad) * radius + x;
            pt.y = Math.sin(rad) * radius + y;
            points.push(pt);
        }
       
        return points;
    }
   
    //扇を描画
    public function drawLines(points:Array):void {
        graphics.lineStyle(1, 0xffffff);
        graphics.beginFill(0xffffff);
        graphics.moveTo(points[0].x, points[0].y);
        for(var i:Number=1; i<points.length; i++){
            graphics.lineTo(points[i].x, points[i].y);
        }
    }
}

import flash.events.ProgressEvent;
import flash.events.IOErrorEvent;
import flash.events.TimerEvent;
import flash.display.Loader;
import flash.display.LoaderInfo;
import flash.system.LoaderContext;
import flash.net.URLRequest;
//画像ローダーディスパッチャー
class ImageLoader extends EventDispatcher {
    public static const LOAD_COMPLETE:String = "LOAD_COMPLETE";
    public static const IOERROR:String = "IOERROR";
    protected var _loader:Loader;
	protected var _sv:statusView;
	protected var _timer:Timer;
   
    public function ImageLoader(s:DisplayObjectContainer , url:String) {
        //登録
        _loader = new Loader();
        _loader.contentLoaderInfo.addEventListener(ProgressEvent.PROGRESS, onProgress);
        _loader.contentLoaderInfo.addEventListener(Event.COMPLETE, onLoaded);
        _loader.contentLoaderInfo.addEventListener(IOErrorEvent.IO_ERROR, error);

//セキュリティ
		var loaderContext:LoaderContext = new LoaderContext(true);

//画像ロード開始
        var urlReq:URLRequest = new URLRequest(url);
        _loader.load(urlReq, loaderContext);

//ステータス表示
		_sv = new statusView();
		_sv.view("IMAGE LOAD START");
		s.addChild(_sv);
		s.setChildIndex(_sv, 0);
    }
   
    //画像ロード完了
    protected function onLoaded(e:Event):void {
        _sv.view("");
        dispatchEvent(new Event(LOAD_COMPLETE));
    }

//画像ロード中
    protected function onProgress(e:ProgressEvent):void {
        _sv.view("IMAGE LOADING...");
        //var per:Number = Math.round(e.bytesLoaded / e.bytesTotal * 100);
    }
   
    //エラー
    protected function error(e:IOErrorEvent):void {
		_sv.view("IMAGE LOAD ERROR");
		_timer = new Timer(3000, 1);
		_timer.addEventListener(TimerEvent.TIMER, onTimer);
		_timer.start();

dispatchEvent(new Event(IOERROR));
    }
	
	protected function onTimer(event:TimerEvent):void {
		_sv.view("");
		_timer.removeEventListener(TimerEvent.TIMER, onTimer);
	}
   
    //プロパティ
    public function get loader():Loader { return _loader;}
}

import flash.events.EventDispatcher;
import flash.events.MouseEvent;
import flash.net.FileReference;
import flash.net.FileFilter;
//ファイルアップディスパッチャ
class fileUpload extends EventDispatcher {
    public static const UP_COMPLETE:String = "UP_COMPLETE";
    protected var s:DisplayObjectContainer;
    protected var fileRef:FileReference;;
    protected var uploadURL:URLRequest;
	protected var _sv:statusView;
   
    public function fileUpload(ps:DisplayObjectContainer):void {
        s = ps;
       
        //初期化
        fileRef = new FileReference();
        fileRef.addEventListener(Event.SELECT, onSelect);
		fileRef.addEventListener(ProgressEvent.PROGRESS , onProgress); 
        fileRef.addEventListener(Event.COMPLETE, onComplete);
        uploadURL = new URLRequest();
        uploadURL.url = "http://linkalink.jp/enok/wonderfl/kaleidoscope/upload.php";
       
        //ボタン設置
        var upBtn:customButton = new customButton(s);
        upBtn.x = 5;
        upBtn.y = s.stage.stageHeight - upBtn.height - 5;
       
		//ステータス表示
		_sv = new statusView();;
		s.addChild(_sv);
		s.setChildIndex(_sv, 0);
		
        //追加
        s.addChild(upBtn);
        upBtn.addEventListener(MouseEvent.MOUSE_DOWN, function(event:Event):void{ var fileFilter:FileFilter = new FileFilter("Images", "*.jpg;*.gif;*.png"); fileRef.browse([fileFilter]);});
    }
   
    //ファイル選んだ時
    protected function onSelect(e:Event):void {
        var fileRef:FileReference = FileReference(e.target);
        fileRef.upload(uploadURL);
    }
	
	//アップが完了
    protected function onProgress(e:Event):void {
		_sv.view("FILE UPLOADING...");
    }
   
    //アップが完了
    protected function onComplete(e:Event):void {
		_sv.view("");
        dispatchEvent(new Event(UP_COMPLETE));
    }
   
    //プロパティ
    public function get name():String {
        return fileRef.name;
    }
}

import flash.geom.ColorTransform;
import flash.text.TextField;
import flash.text.TextFormat;
import flash.text.TextFieldAutoSize;
//ボタンクラス
class customButton extends SimpleButton {
    private var s:DisplayObjectContainer;
   
    public function customButton(ps:DisplayObjectContainer):void {
        s = ps;
       
        //ボタンの色とか設定
        var state:Sprite = makeUpstate();
        state.transform.colorTransform = new ColorTransform(1, 1, 1, 0.9, 0, 0, 0, 0);
        downState = upState = state;
        state = makeUpstate();
        state.transform.colorTransform = new ColorTransform(1, 1, 1, 0.8, 0, 0, 0, 0);
        overState = state;
        useHandCursor = true;
        hitTestState = upState;
    }
   
    //ボタン画像作成
    protected function makeUpstate():Sprite {
        var state:Sprite = new Sprite();
        var w:Number = 50;
        var h:Number = 10;
        var margin:Number = 2;
       
        //枠系
        state.graphics.lineStyle(1, 0xffffff);
        state.graphics.drawRect(0, 0, w + margin * 2, h + margin * 2);
        state.graphics.endFill();
        state.graphics.beginFill(0xffffff);
        state.graphics.drawRect(margin, margin, w, h);
        state.graphics.endFill();
       
        //テキスト系
        var txtFormat:TextFormat = new TextFormat();
        txtFormat.font = "_sans";
        txtFormat.size = 10;
        txtFormat.color = 0xcc2222;
        txtFormat.bold = true;
        var txtField:TextField = new TextField();
        txtField.defaultTextFormat = txtFormat;
        txtField.text = "CHANGE";
        txtField.autoSize = TextFieldAutoSize.LEFT;
        txtField.x = 4;
        txtField.y = -1;
        state.addChild(txtField);
       
        return state;
    }
}

class statusView extends Sprite {
	protected var _txtField:TextField;
		
	public function statusView():void {
		//テキスト系
        var txtFormat:TextFormat = new TextFormat();
        txtFormat.font = "_sans";
        txtFormat.size = 10;
        txtFormat.color = 0xeeeeee;
        //txtFormat.bold = true;
        _txtField = new TextField();
        _txtField.defaultTextFormat = txtFormat;
        _txtField.text = "";
        _txtField.autoSize = TextFieldAutoSize.LEFT;
        _txtField.x = 0;
        _txtField.y = 0;
		addChild(_txtField);
	}
	
	public function view(mess:String):void {
		_txtField.text = mess;
	}
	
}

Code Fullscreen

Preview Fullscreen