js玩具——UI组件：HtmlUI 操作底层html的基类

/*

 * 操作底层html的基类
 *  author: 吴安国
 * version: 1.0
 */
function HtmlUI(view, element) {
	this.view = view;
	this.element = element;
}

/**
 * 改变属性
 * @param propertyName 属性名称
 * @param value   属性值
 */
HtmlUI.prototype.propertyChange = function(propertyName, value) {
	if(!ObjectUtil.isNull(propertyName) && !ObjectUtil.isNull(value)) {
		eval("this.set" + propertyName + "(value)");
	}
};

/**
 * 设置元素大小
 * @param value 规格
 */
HtmlUI.prototype.setSize = function(value){
	var width = value.getWidth();
	var height = value.getHeight();
	this.setStyle("width", "'" + width + "'");
	this.setStyle("height", "'" + height + "'");
};

/**
 * 元素定位
 * @param value 位置
 */
HtmlUI.prototype.setPosition = function(position){
	this.setStyle("position", "'" + position + "'");
};

/**
 * @param float left or right
 */
HtmlUI.prototype.setFloat = function(styleFloat) {
	this.setStyle("styleFloat", "'" + styleFloat + "'");
};

/**
 * 设置边框
 * @param border 边框
 */
HtmlUI.prototype.setBorder = function(border) {
	var attr = border.getBorder();
	var value = border.getValue();
	this.setStyle(attr, value);
};

/**
 * 元素位置
 * @param value 位置
 */
HtmlUI.prototype.setPoint = function(value){
	var left =  value.getLeft();
	var top = value.getTop();
	
	this.setStyle("left", left);
	this.setStyle("top", top);	
};

/**
 * 设置元素背景色
 * @param color
 * @return
 */
HtmlUI.prototype.setBackgroundColor = function(color){
	this.setStyle("backgroundColor", color.getRGBColor());	
};

/**
 * 设置外边距
 * @param margin 外边距
 */
HtmlUI.prototype.setMargin = function(margin) {
	this.setStyle("margin", margin);
};

/**
 * 设置内边距
 * @param padding 内边距
 */
HtmlUI.prototype.setPadding = function(padding) {
	this.setStyle("padding", padding);
};

/**
 * 设置显示文字
 * @param text 显示文字
 */
HtmlUI.prototype.setText = function(text) {
	this.element.innerText = text;
};

 
/**
 * 设置文字颜色
 * @param color 文字颜色
 */
HtmlUI.prototype.setColor = function(color) {
	this.setStyle("color", color.getRGBColor());
};

/**
 * 设置文字高度
 * @param lineHeight 文字高度
 */
HtmlUI.prototype.setLineHeight = function(lineHeight) {
	this.setStyle("lineHeight", "'" + lineHeight +  "'");
};


/**
 * 设置字体
 * @param font 字体
 */
HtmlUI.prototype.setFont = function(font) {
	this.setStyle("font", "'" + font +  "'");
};

/**
 * 设置鼠标指针外观
 * @param cursor
 * @return
 */
HtmlUI.prototype.setCursor = function(cursor) {
	this.setStyle("cursor", "'" + cursor +  "'");
};

/**
 * 设置元素背景色
 * @param color
 * @return
 */
HtmlUI.prototype.setStyle = function(styleAttr, value){
	eval("this.element.style." + styleAttr + " = " + value);
};