var changeContent = {

	// CSS の書き換えを行うメソッド
	asContent: function(a) {
				
		// テキストボックスの入力内容が正しく、かつ、フラグが立っていない場合は CSS を書き替えてフラグを立てる
		if(a.type != 'radio') {
			if(this.checkChangeValue(a.fromElement, a.regex)) {
			
				// CSS のプロパティが 単位 + 値 の場合
				if(a.type == 'anteUnit') {
					if($(a.toElement).css(a.property) != a.unit + $(a.fromElement).val())
						$(a.toElement).css(a.property, a.unit + $(a.fromElement).val());
				}
				
				// CSS のプロパティが 値 + 単位 の場合
				else if(a.type == 'postUnit') {
					if($(a.toElement).css(a.property) != $(a.fromElement).val() + a.unit)
						$(a.toElement).css(a.property, $(a.fromElement).val() + a.unit);
				}
				
				// CSS のプロパティに単位がない場合
				else if(a.type == 'noUnit') {
					if($(a.toElement).css(a.property) != $(a.fromElement).val())
						$(a.toElement).css(a.property, $(a.fromElement).val());
				}
				return true;
			}
			else {
				return false;
			}
		}
		
		// ラジオボタンのときは入力内容評価が不要
		else if(a.type == 'radio') {
			if($(a.toElement).css(a.property) != $(a.fromElement).val())
				$(a.toElement).css(a.property, $(a.fromElement).val());
			return true;
		}
	},
	
	// テキストボックスの入力内容評価メソッド
	checkChangeValue: function(element, regex) {
	
		// regex の項目がない場合は /^[0-9a-f]{6}$/i を使う
		if(!regex) regex = /^[0-9a-f]{6}$/i;
		
		// 入力内容が正しいときはテキストボックスの背景を白にして true を返す
		if($(element).val().match(regex)) {
			$(element).css('background-color', '#ffffff');
			return true;
		}
		
		// 入力内容が不正なときはテキストボックスの背景を赤にして false を返す
		else {
			$(element).css('background-color', '#ff0000');
			return false;
		}
	},
	
	colorPicker: function() {
		simplePicker.run(((this.name).substring(0, (this.name).length-6)));
	}

}

// CSS 書き替えリスト
var roll = [
	{ type: 'anteUnit', property: 'color', fromElement: '#changeColor', toElement: 'div.changeColor p.change', unit: '#' },
	{ type: 'postUnit', property: 'border-top-width', fromElement: '#changeWidth', toElement: 'div.changeWidth p.change', unit: 'px', regex: /^[0-9]{1,2}$/ },
	{ type: 'noUnit', property: 'line-height', fromElement: '#changeLineheight', toElement: 'div.changeLineheight p.change', regex: /^[0-9.]{1,3}$/ },
	{ type: 'radio', property: 'text-align', fromElement: 'input[name=changeRadio]:checked', toElement: 'div.changeRadio p.change' }
];

// テキストボックスの評価状況をチェック
var flag = {
	status: null,
	
	// 評価メソッド
	valid: function(b) {
		
		// すでにステータスが false だったら true が渡されても false のまま (論理積)
		this.status = this.status && b? true: false;
	}
};

// メイン
(function($) {

	// カラーピッカーボタンの動作
	$('input.pickerButton').click(changeContent.colorPicker);
	
	// タイマー
	var t = setInterval(function() {
		
		// ステータスを true にしておく
		flag.status = true;
		
		// CSS 書き換えリストを順番にチェック
		for(var i = 0; i < roll.length; i++) {
			flag.valid(changeContent.asContent(roll[i]));
		}
		
		// すべての評価が true だったら送信できる
		if(flag.status) {
			$('p.submit input').removeAttr('disabled', 'disabled');
		}
		else {
			$('p.submit input').attr('disabled', 'disabled');
		}
	}, 1000);
	
})(jQuery);