페이지 위젯에 박스 위젯 추가. 각 위젯마다 배경을 지정할 수 있도록 하고 IE에서 메모리 누수 현상이 발생하던 부분을 수정

git-svn-id: http://xe-core.googlecode.com/svn/sandbox@2983 201d5d3c-b55e-5fd7-737f-ddc643e51545
This commit is contained in:
zero 2007-11-16 10:47:50 +00:00
parent 23ac5b8f54
commit 9124d18a91
31 changed files with 1397 additions and 1001 deletions

View file

@ -6,8 +6,10 @@
<action name="dispWidgetGenerateCodeInPage" type="view" standalone="true" />
<action name="dispWidgetAdminDownloadedList" type="view" standalone="true" admin_index="true" />
<action name="dispWidgetAdminAddContent" type="view" standalone="true" />
<action name="procWidgetGenerateCode" type="controller" standalone="true" />
<action name="procWidgetAddContent" type="controller" standalone="true" />
<action name="procWidgetGenerateCodeInPage" type="controller" standalone="true" />
<action name="procWidgetGetColorsetList" type="controller" standalone="true" />
</actions>

View file

@ -39,5 +39,26 @@
$lang->about_widget_code = 'Please input required value first, and click [Generate Code] button to generate code to add to the template file.';
$lang->about_widget_code_in_page = 'After entering the required values, click the [Add] button to insert the widget code into the page.';
$lang->about_addon = "A widget is a small free-standing application used in a layout or page module.\n It can be linked with internal module or external open api. Through its configuration setting, wide application is possible. \n You can directly add a widget by using the [Generate Code] function without using the Zeroboard XE page module or layout module.";
$lang->about_widget = "A widget is a small free-standing application used in a layout or page module.\n It can be linked with internal module or external open api. Through its configuration setting, wide application is possible. \n You can directly add a widget by using the [Generate Code] function without using the Zeroboard XE page module or layout module.";
$lang->cmd_content_insert = "내용 직접 추가";
$lang->cmd_box_widget_insert = "상자 위젯 추가";
$lang->cmd_remove_all_widgets = "내용 모두 지우기";
$lang->cmd_widget_size = "위젯 크기";
$lang->cmd_widget_align = "위젯 정렬";
$lang->cmd_widget_align_left = "왼쪽";
$lang->cmd_widget_align_right = "오른쪽";
$lang->cmd_widget_margin = "위젯 여백";
$lang->cmd_widget_border = "위젯 테두리";
$lang->cmd_widget_border_solid = "실선";
$lang->cmd_widget_border_dotted = "점선";
$lang->cmd_widget_background_color = "배경색";
$lang->cmd_widget_background_image_url = "배경 이미지";
$lang->cmd_widget_background_image_repeat = "반복";
$lang->cmd_widget_background_image_no_repeat = "고정";
$lang->cmd_widget_background_image_x_repeat = "가로 반복";
$lang->cmd_widget_background_image_y_repeat = "세로 반복";
$lang->cmd_widget_background_image_x = "가로 위치";
$lang->cmd_widget_background_image_y = "세로 위치";
?>

View file

@ -39,5 +39,26 @@
$lang->about_widget_code = 'Ingrese primero los valores requeridos, luego presiona el botón "Generar códigos" para mostrar el código en el espacio inferior para ser añadido en el archivo de los temas.';
$lang->about_widget_code_in_page = 'Luego de ingresar los valores requeridos, presiona el botón "Añadir" para insertar el código de widget dentro de la página.';
$lang->about_addon = "Un Widget es una pequena aplicación para ser usados en los diseños o en el módulo de páginas.\n Puede ser enlazados con un módulo interno o con open api externo y con la configuración de ella puede utilizar en variadas aplicaciones.\nSin la necesidad de utilizar los módulos de página o del diseño de Zeroboard XE, Usted puede directamente añadir un widget usando la función de [Generar Códigos].";
$lang->about_widget = "Un Widget es una pequena aplicación para ser usados en los diseños o en el módulo de páginas.\n Puede ser enlazados con un módulo interno o con open api externo y con la configuración de ella puede utilizar en variadas aplicaciones.\nSin la necesidad de utilizar los módulos de página o del diseño de Zeroboard XE, Usted puede directamente añadir un widget usando la función de [Generar Códigos].";
$lang->cmd_content_insert = "내용 직접 추가";
$lang->cmd_box_widget_insert = "상자 위젯 추가";
$lang->cmd_remove_all_widgets = "내용 모두 지우기";
$lang->cmd_widget_size = "위젯 크기";
$lang->cmd_widget_align = "위젯 정렬";
$lang->cmd_widget_align_left = "왼쪽";
$lang->cmd_widget_align_right = "오른쪽";
$lang->cmd_widget_margin = "위젯 여백";
$lang->cmd_widget_border = "위젯 테두리";
$lang->cmd_widget_border_solid = "실선";
$lang->cmd_widget_border_dotted = "점선";
$lang->cmd_widget_background_color = "배경색";
$lang->cmd_widget_background_image_url = "배경 이미지";
$lang->cmd_widget_background_image_repeat = "반복";
$lang->cmd_widget_background_image_no_repeat = "고정";
$lang->cmd_widget_background_image_x_repeat = "가로 반복";
$lang->cmd_widget_background_image_y_repeat = "세로 반복";
$lang->cmd_widget_background_image_x = "가로 위치";
$lang->cmd_widget_background_image_y = "세로 위치";
?>

View file

@ -39,5 +39,26 @@
$lang->about_widget_code = '選択されたウィゼットで求められる下の項目の値を入力し、「コード生成」ボタンをクリックすると、<br />一番下にテンプレートファイルに適用できるコードが出力されます。';
$lang->about_widget_code_in_page = '下に必要な値を入力した後、追加ボタンをクリックするとページ内にウィジェットが挿入されます。';
$lang->about_addon = "ウィジェットまたはページモジュールに用いられる小単位の構成要素です。内部モジュールまたは外部の OPEN API と連動でき、設定によって様々な応用が利きます。ゼロボードXEのページモジュールまたはレイアウトモジュールを使用しなくても、「コード生成」機能で直接ウィジェットも追加できます。";
$lang->about_widget = "ウィジェットまたはページモジュールに用いられる小単位の構成要素です。内部モジュールまたは外部の OPEN API と連動でき、設定によって様々な応用が利きます。ゼロボードXEのページモジュールまたはレイアウトモジュールを使用しなくても、「コード生成」機能で直接ウィジェットも追加できます。";
$lang->cmd_content_insert = "내용 직접 추가";
$lang->cmd_box_widget_insert = "상자 위젯 추가";
$lang->cmd_remove_all_widgets = "내용 모두 지우기";
$lang->cmd_widget_size = "위젯 크기";
$lang->cmd_widget_align = "위젯 정렬";
$lang->cmd_widget_align_left = "왼쪽";
$lang->cmd_widget_align_right = "오른쪽";
$lang->cmd_widget_margin = "위젯 여백";
$lang->cmd_widget_border = "위젯 테두리";
$lang->cmd_widget_border_solid = "실선";
$lang->cmd_widget_border_dotted = "점선";
$lang->cmd_widget_background_color = "배경색";
$lang->cmd_widget_background_image_url = "배경 이미지";
$lang->cmd_widget_background_image_repeat = "반복";
$lang->cmd_widget_background_image_no_repeat = "고정";
$lang->cmd_widget_background_image_x_repeat = "가로 반복";
$lang->cmd_widget_background_image_y_repeat = "세로 반복";
$lang->cmd_widget_background_image_x = "가로 위치";
$lang->cmd_widget_background_image_y = "세로 위치";
?>

View file

@ -39,5 +39,26 @@
$lang->about_widget_code = '선택하신 위젯에서 요구하는 아래 항목들의 값을 넣고 [코드생성]버튼을 누르시면 제일 아래 칸에 템플릿 파일에 적용할 수 있는 코드가 출력 됩니다';
$lang->about_widget_code_in_page = '아래 필요한 값들을 입력하신 후 추가 버튼을 누르시면 페이지 내에 위젯이 삽입이 됩니다';
$lang->about_addon = "위젯은 레이아웃이나 페이지 모듈에서 사용되는 작은 구성요소입니다.\n내부 모듈 또는 외부 open api와 연동될 수도 있고 설정을 통해서 다양한 응용이 가능합니다.\n제로보드XE의 페이지 모듈이나 레이아웃 모듈을 사용하지 않더라도 [코드생성] 기능을 통해 직접 위젯 추가도 할 수 있습니다";
$lang->about_widget = "위젯은 레이아웃이나 페이지 모듈에서 사용되는 작은 구성요소입니다.\n내부 모듈 또는 외부 open api와 연동될 수도 있고 설정을 통해서 다양한 응용이 가능합니다.\n제로보드XE의 페이지 모듈이나 레이아웃 모듈을 사용하지 않더라도 [코드생성] 기능을 통해 직접 위젯 추가도 할 수 있습니다";
$lang->cmd_content_insert = "내용 직접 추가";
$lang->cmd_box_widget_insert = "상자 위젯 추가";
$lang->cmd_remove_all_widgets = "내용 모두 지우기";
$lang->cmd_widget_size = "위젯 크기";
$lang->cmd_widget_align = "위젯 정렬";
$lang->cmd_widget_align_left = "왼쪽";
$lang->cmd_widget_align_right = "오른쪽";
$lang->cmd_widget_margin = "위젯 여백";
$lang->cmd_widget_border = "위젯 테두리";
$lang->cmd_widget_border_solid = "실선";
$lang->cmd_widget_border_dotted = "점선";
$lang->cmd_widget_background_color = "배경색";
$lang->cmd_widget_background_image_url = "배경 이미지";
$lang->cmd_widget_background_image_repeat = "반복";
$lang->cmd_widget_background_image_no_repeat = "고정";
$lang->cmd_widget_background_image_x_repeat = "가로 반복";
$lang->cmd_widget_background_image_y_repeat = "세로 반복";
$lang->cmd_widget_background_image_x = "가로 위치";
$lang->cmd_widget_background_image_y = "세로 위치";
?>

View file

@ -39,5 +39,26 @@
$lang->about_widget_code = '输入被选控件所需要的下列各项后,按『代码生成』按钮,即可在页面下方获得可以用在布局模版代码片断。';
$lang->about_widget_code_in_page = '输入下列各项必要值后,按“添加”按钮,即可把控件插入到页面当中。';
$lang->about_addon = "控件是在布局或页面模块中使用的一种小部件。\n不仅可以关联内部模块或外部open api而且通过设置可以用在多种用途。\n即使不使用Zeroboard XE的页面模块或布局模块也可以通过『代码生成』功能直接可以添加相应控件。";
$lang->about_widget = "控件是在布局或页面模块中使用的一种小部件。\n不仅可以关联内部模块或外部open api而且通过设置可以用在多种用途。\n即使不使用Zeroboard XE的页面模块或布局模块也可以通过『代码生成』功能直接可以添加相应控件。";
$lang->cmd_content_insert = "내용 직접 추가";
$lang->cmd_box_widget_insert = "상자 위젯 추가";
$lang->cmd_remove_all_widgets = "내용 모두 지우기";
$lang->cmd_widget_size = "위젯 크기";
$lang->cmd_widget_align = "위젯 정렬";
$lang->cmd_widget_align_left = "왼쪽";
$lang->cmd_widget_align_right = "오른쪽";
$lang->cmd_widget_margin = "위젯 여백";
$lang->cmd_widget_border = "위젯 테두리";
$lang->cmd_widget_border_solid = "실선";
$lang->cmd_widget_border_dotted = "점선";
$lang->cmd_widget_background_color = "배경색";
$lang->cmd_widget_background_image_url = "배경 이미지";
$lang->cmd_widget_background_image_repeat = "반복";
$lang->cmd_widget_background_image_no_repeat = "고정";
$lang->cmd_widget_background_image_x_repeat = "가로 반복";
$lang->cmd_widget_background_image_y_repeat = "세로 반복";
$lang->cmd_widget_background_image_x = "가로 위치";
$lang->cmd_widget_background_image_y = "세로 위치";
?>

View file

@ -0,0 +1,29 @@
<!--%import("filter/add_content.xml")-->
<!--%import("js/widget.js")-->
<!--%import("css/widget.css")-->
<div class="pageAddContent"></div>
<form action="./" method="get" onsubmit="return procFilter(this, add_content);" id="content_fo">
<input type="hidden" name="content" value="" />
<input type="hidden" name="mid" value="{$module_info->mid}" />
<input type="hidden" name="module_srl" value="{$module_srl}" />
<input type="hidden" name="style" value="float:left;padding:none;margin:none;width:100%;" />
<input type="hidden" name="widget_margin_left" value="" />
<input type="hidden" name="widget_margin_right" value="" />
<input type="hidden" name="widget_margin_top" value="" />
<input type="hidden" name="widget_margin_bottom" value="" />
<div class="editor">
{$editor}
</div>
<div class="tCenter help">
<span class="button"><input type="submit" value="{$lang->cmd_insert}" class="editor_button" accesskey="s" /></span>
<a href="#" onclick="window.close(); return false;" class="button"><span>{$lang->cmd_close}</span></a>
</div>
</form>
<script type="text/javascript">
xAddEventListener(window, 'load', doSyncPageContent);
</script>

View file

@ -6,3 +6,30 @@
#colorset_area .header { float:left; margin-right:.5em; padding-top:.2em;}
#colorset_area .footer { float:left; }
#zonePageContent { overflow:hidden; width:100%; padding:none !important; margin:none !important;}
.pageAddContent { width:700px; }
.widgetOutput { float:left; cursor:move; z-index:998; overflow:hidden; position:relative; width:100%; }
.widgetOutput .widgetBorder { border:1px dotted #17DA29; z-index:999; }
.widgetOutput .widgetSetup { background:transparent url("../images/widget_setup.gif") no-repeat 1px 1px; width:14px; height:14px; position:absolute; top:1px; right:58px; cursor:pointer; z-index:1000;}
.widgetOutput .widgetCopy { background:transparent url("../images/widget_copy.gif") no-repeat 1px 1px; width:14px; height:14px; position:absolute; top:1px; right:44px; cursor:pointer; z-index:1000;}
.widgetOutput .widgetSize { background:transparent url("../images/widget_size.gif") no-repeat 1px 1px; width:14px; height:14px; position:absolute; top:1px; right:30px; cursor:pointer; z-index:1000;}
.widgetOutput .widgetRemove { background:transparent url("../images/widget_remove.gif") no-repeat 1px 1px; width:14px; height:14px; position:absolute; top:1px; right:15px; cursor:pointer; z-index:1000;}
.widgetOutput .widgetResize { background:transparent url("../images/btn_resize.gif") no-repeat left bottom; width:12px; height:12px; position:absolute; bottom:1px; right:1px; cursor:pointer; z-index:1000;}
.widgetOutput .widgetResizeLeft { background:transparent url("../images/btn_resize_left.gif") no-repeat left bottom; width:12px; height:12px; position:absolute; bottom:0; left:1px; cursor:pointer; z-index:1000;}
#pageSizeLayer { width:500px; overflow:hidden; border:1px solid #888888; background:#FFFFFF; z-index:2000; position:absolute; }
#pageSizeLayer table { border:0; width:100%; table-layout:fixed; }
#pageSizeLayer table th { padding:4px 0 4px 0; background-color:#DEDEDE; text-align:center; color:#888888;}
#pageSizeLayer table th.line { border-top:1px dotted #EEEEEE; }
#pageSizeLayer table td { padding:4px 10px 4px 10px; background-color:#EFEFEF;}
#pageSizeLayer table td div { margin-bottom:5px; }
#pageSizeLayer table td.line { border-top:1px dotted #999999; }
#pageSizeLayer table td.buttonBox { background-color:#FFFFFF; white-space:nowrap; overflow:hidden; vertical-align:top; text-align:center; border-top:1px solid #888888; color:#DDDDDD;}
#pageSizeLayer .input { background:#FFFFFF; border:1px solid #AAAAAA; padding:1px; font:8pt verdana; width:60px; }
#pageSizeLayer .full_input { background:#FFFFFF; border:1px solid #AAAAAA; padding:1px; font:8pt verdana; width:90%; }
#pageSizeLayer .small_input { background:#FFFFFF; border:1px solid #AAAAAA; padding:1px; font:8pt verdana; width:20px; }
#pageSizeLayer .color_input { background:#FFFFFF; border:1px solid #AAAAAA; padding:1px; font:8pt verdana; width:50px; }
#pageSizeLayer .submit { width:90%; border:1px solid #DEDEDE; background-color:#FFFFFF;}

View file

@ -0,0 +1,8 @@
<filter name="add_content" module="widget" act="procWidgetAddContent" confirm_msg_code="confirm_submit">
<form />
<response callback_func="completeAddContent">
<tag name="error" />
<tag name="message" />
<tag name="tpl" />
</response>
</filter>

Binary file not shown.

After

Width:  |  Height:  |  Size: 74 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 59 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 140 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 202 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 120 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 191 B

View file

@ -0,0 +1,930 @@
/**
* @file modules/widget/js/widget.js
* @author zero (zero@nzeo.com)
* @brief 위젯 관리용 자바스크립트
**/
/* DOM 속성을 구하기 위한 몇가지 함수들.. */
// style의 값을 구하는게 IE랑 그외가 다름.
function getStyle(obj) {
var style = obj.getAttribute("style");
if(typeof(style)=="object") style = style["cssText"];
return style;
}
// float: 값을 구하는게 IE랑 그외가 다름
function getFloat(obj) {
var float = xIE4Up?obj.parentNode.style.styleFloat:obj.parentNode.style.cssFloat;
if(!float) float = 'left';
return float;
}
function setFloat(obj, fl) {
if(xIE4Up) obj.style.styleFloat = fl;
else obj.style.cssFloat = fl;
}
// margin값을 구하는 함수 (없을 경우 0으로 세팅), zbxe의 위젯에서만 사용
function getMargin(obj, direct) {
var margin = obj.getAttribute("widget_margin_"+direct);
if(!margin || margin == null) margin = 0;
return margin;
}
/* 위젯 배치 시작을 함 */
var zonePageObj = null;
var zoneModuleSrl = 0;
function doStartPageModify(zoneID, module_srl) {
zonePageObj = xGetElementById(zoneID);
zoneModuleSrl = module_srl;
// 위젯 크기/여백 조절 레이어를 가장 밖으로 뺌
var obj = xGetElementById("tmpPageSizeLayer");
var dummy = xCreateElement("div");
xInnerHtml(dummy, xInnerHtml(obj));
dummy.id="pageSizeLayer";
dummy.style.visibility = "hidden";
dummy.style.position = "absolute";
dummy.style.left = 0;
dummy.style.top = 0;
document.body.appendChild(dummy);
obj.parentNode.removeChild(obj);
// 모든 위젯들의 크기를 정해진 크기로 맞춤
doFitBorderSize();
// 드래그와 리사이즈와 관련된 이벤트 리스너 생성
xAddEventListener(document,"click",doCheckWidget);
xAddEventListener(document,"mousedown",doCheckWidgetDrag);
}
// 내용 모두 삭제
function removeAllWidget() {
xInnerHtml(zonePageObj, '');
}
/**
* 특정 영역에 편집된 위젯들을 약속된 태그로 변환하여 return
**/
function getWidgetContent(obj) {
var html = "";
if(typeof(obj)=='undefined' || !obj) obj = zonePageObj;
var childObj = obj.firstChild;
while(childObj) {
if(childObj.nodeName == "DIV" && childObj.getAttribute("widget")) {
var widget = childObj.getAttribute("widget");
if(widget) {
switch(widget) {
case 'widgetBox' :
html += getWidgetBoxCode(childObj, widget);
break;
case 'widgetContent' :
html += getContentWidgetCode(childObj, widget);
break;
default :
html += getWidgetCode(childObj, widget);
break;
}
}
}
childObj = childObj.nextSibling;
}
return html;
}
// 컨텐츠 위젯 코드 구함
function getContentWidgetCode(childObj, widget) {
var cobj = childObj.firstChild;
while(cobj) {
if(cobj.nodeName == "DIV" && cobj.className == "widgetContent") {
var body = xInnerHtml(cobj);
return '<img src="./common/tpl/images/widget_bg.jpg" class="zbxe_widget_output" widget="widgetContent" style="'+getStyle(childObj)+'" body="'+body+'" widget_margin_left="'+getMargin(childObj,'left')+'" widget_margin_right="'+getMargin(childObj, 'right')+'" widget_margin_top="'+getMargin(childObj, 'top')+'" widget_margin_bottom="'+getMargin(childObj,'bottom')+'" />';
}
cobj = cobj.nextSibling;
}
}
// 위젯 박스 컨텐츠 코드 구함
function getWidgetBoxCode(childObj, widget) {
var cobj = childObj.firstChild;
while(cobj) {
if(cobj.className == "widgetBorder") {
var c2obj = cobj.firstChild;
while(c2obj) {
if(c2obj.className == "nullWidget") {
var body = getWidgetContent(c2obj);
return '<div widget="widgetBox" style="'+getStyle(childObj)+'" widget_margin_left="'+getMargin(childObj,'left')+'" widget_margin_right="'+getMargin(childObj,'right')+'" widget_margin_top="'+getMargin(childObj, 'top')+'" widget_margin_bottom="'+getMargin(childObj, 'bottom')+'"><div><div>'+body+'<div class="clear"></div></div></div></div>';
}
c2obj = c2obj.nextSibling;
}
}
cobj = cobj.nextSibling;
}
}
// 일반 위젯 컨텐츠 코드 구함
function getWidgetCode(childObj, widget) {
var attrs = "";
var code = "";
for(var i=0;i<childObj.attributes.length;i++) {
if(!childObj.attributes[i].nodeName || !childObj.attributes[i].nodeValue) continue;
var name = childObj.attributes[i].nodeName.toLowerCase();
if(name == "contenteditable" || name == "id" || name=="style" || name=="src" || name=="widget" || name == "body" || name == "class" || name == "widget_width" || name == "widget_width_type" || name == "xdpx" || name == "xdpy" || name == "height") continue;
var value = childObj.attributes[i].nodeValue;
if(!value) continue;
if(value && typeof(value)=="string") value = value.replace(/\"/ig,'&quot;');
attrs += name+'="'+value+'" ';
}
var style = childObj.getAttribute("style");
return '<img class="zbxe_widget_output" style="'+getStyle(childObj)+'" widget="'+widget+'" '+attrs+' />';
}
/**
* 직접 내용을 입력하는 위젯을 추가
**/
// 팝업 띄움
function doAddContent() {
popopen("./?module=widget&act=dispWidgetAdminAddContent&module_srl="+zoneModuleSrl, "addContent");
}
// 직접 내용을 입력하기 위한 에디터 활성화 작업 및 form 데이터 입력
function doSyncPageContent() {
if(opener && opener.selectedWidget) {
var fo_obj = xGetElementById("content_fo");
var sel_obj = opener.selectedWidget;
fo_obj.style.value = getStyle(opener.selectedWidget);
fo_obj.widget_margin_left.value = getMargin(sel_obj, 'left');
fo_obj.widget_margin_right.value = getMargin(sel_obj,'right');
fo_obj.widget_margin_bottom.value = getMargin(sel_obj,'bottom');
fo_obj.widget_margin_top.value = getMargin(sel_obj,'top');
var obj = sel_obj.firstChild;
while(obj && obj.className != "widgetContent") obj = obj.nextSibling;
if(obj && obj.className == "widgetContent") {
var content = Base64.decode(xInnerHtml(obj));
xGetElementById("content_fo").content.value = content;
}
}
editorStart(1, "module_srl", "content", false, 400 );
editor_upload_start(1);
setFixedPopupSize();
}
// 부모창에 위젯을 추가
function completeAddContent(ret_obj) {
var tpl = ret_obj["tpl"];
selected_node = opener.selectedWidget;
if(selected_node && selected_node.getAttribute("widget")) {
selected_node = replaceOuterHTML(selected_node, tpl);
} else {
var obj = opener.zonePageObj;
xInnerHtml(obj, xInnerHtml(obj)+tpl);
}
if(opener.doFitBorderSize) opener.doFitBorderSize();
window.close();
return false;
}
/* 박스 위젯 추가 */
function doAddWidgetBox() {
var tpl = ''+
'<div class="widgetOutput" style="float:left;width:100%;height:12px;" widget="widgetBox" >'+
'<div class="widgetCopy"></div>'+
'<div class="widgetSize"></div>'+
'<div class="widgetRemove"></div>'+
'<div class="widgetResize"></div>'+
'<div class="widgetResizeLeft"></div>'+
'<div class="widgetBorder">'+
'<div class="nullWidget" style="width:100%;height:100px;"></div>'+
'<div class="clear"></div>'+
'</div>'+
'</div>';
xInnerHtml(zonePageObj, xInnerHtml(zonePageObj)+tpl);
doFitBorderSize();
}
/* 일반 위젯을 추가하기 위해 위젯 팝업창을 띄움 */
function doAddWidget(fo) {
var sel = fo.widget_list;
var idx = sel.selectedIndex;
var val = sel.options[idx].value;
var module_srl = fo.module_srl.value;
var url = current_url.setQuery('module','widget').setQuery('act','dispWidgetGenerateCodeInPage').setQuery('selected_widget', val).setQuery('module_srl', module_srl);
popopen(url,'GenerateWidgetCode');
}
// widgetBorder에 height를 widgetOutput와 맞춰줌
function doFitBorderSize() {
var obj_list = xGetElementsByClassName('widgetBorder', zonePageObj);
for(var i=0;i<obj_list.length;i++) {
var obj = obj_list[i];
xHeight(obj, xHeight(obj.parentNode));
obj.parentNode.style.clear = '';
}
}
var selectedWidget = null;
// 클릭 이벤트시 위젯의 수정/제거/이벤트 무효화 처리
function doCheckWidget(e) {
var evt = new xEvent(e); if(!evt.target) return;
var obj = evt.target;
selectedWidget = null;
var pObj = obj.parentNode;
while(pObj) {
if(pObj.id == "pageSizeLayer") return;
pObj = pObj.parentNode;
}
doHideWidgetSizeSetup();
// 위젯 설정
if(obj.className == 'widgetSetup') {
var p_obj = obj.parentNode;
var widget = p_obj.getAttribute("widget");
if(!widget) return;
selectedWidget = p_obj;
if(widget == 'widgetContent') popopen("./?module=widget&act=dispWidgetAdminAddContent&module_srl="+zoneModuleSrl, "addContent");
else popopen(request_uri+"?module=widget&act=dispWidgetGenerateCodeInPage&selected_widget="+widget,'GenerateCodeInPage');
return;
// 위젯 복사
} else if(obj.className == 'widgetCopy') {
var p_obj = obj.parentNode;
if(p_obj.className == 'widgetOutput') {
var dummy = xCreateElement("DIV");
xInnerHtml(dummy,xInnerHtml(p_obj));
dummy.widget_sequence = '';
dummy.className = "widgetOutput";
for(var i=0;i<p_obj.attributes.length;i++) {
if(!p_obj.attributes[i].nodeName || !p_obj.attributes[i].nodeValue) continue;
var name = p_obj.attributes[i].nodeName.toLowerCase();
var value = p_obj.attributes[i].nodeValue;
if(!value) continue;
if(value && typeof(value)=="string") value = value.replace(/\"/ig,'&quot;');
dummy.setAttribute(name, value);
}
if(xIE4Up) dummy.style["cssText"] = p_obj.getAttribute("style")["cssText"];
p_obj.parentNode.insertBefore(dummy, p_obj);
}
return;
// 위젯 사이트/ 여백 조절
} else if(obj.className == 'widgetSize') {
var p_obj = obj.parentNode;
var widget = p_obj.getAttribute("widget");
if(!widget) return;
selectedWidget = p_obj;
doShowWidgetSizeSetup(evt.pageX, evt.pageY, selectedWidget);
return;
// 위젯 제거
} else if(obj.className == 'widgetRemove') {
var p_obj = obj.parentNode;
var widget = p_obj.getAttribute("widget");
if(confirm(confirm_delete_msg)) p_obj.parentNode.removeChild(p_obj);
return;
}
// 내용 클릭 무효화
var p_obj = obj;
while(p_obj) {
if(p_obj.className == 'widgetOutput') {
evt.cancelBubble = true;
evt.returnValue = false;
xPreventDefault(e);
xStopPropagation(e);
break;
}
p_obj = p_obj.parentNode;
}
}
// 마우스 다운 이벤트 발생시 위젯의 이동을 처리
function doCheckWidgetDrag(e) {
var evt = new xEvent(e); if(!evt.target) return;
var obj = evt.target;
var pObj = obj.parentNode;
while(pObj) {
if(pObj.id == "pageSizeLayer") return;
pObj = pObj.parentNode;
}
doHideWidgetSizeSetup();
if(obj.className == 'widgetSetup' || obj.className == 'widgetCopy' || obj.className == 'widgetSize' || obj.className == 'widgetRemove') return;
p_obj = obj;
while(p_obj) {
if(p_obj.className == 'widgetOutput' || p_obj.className == 'widgetResize' || p_obj.className == 'widgetResizeLeft') {
widgetDragEnable(p_obj, widgetDragStart, widgetDrag, widgetDragEnd);
widgetMouseDown(e);
return;
}
p_obj = p_obj.parentNode;
}
}
function _getInt(val) {
if(!val || val == "null") return 0;
if(parseInt(val,10)==NaN) return 0;
return parseInt(val,10);
}
// 위젯 크기 조절 레이어를 보여줌
var selectedSizeWidget = null;
function doShowWidgetSizeSetup(px, py, obj) {
var layer = xGetElementById("pageSizeLayer");
var formObj = layer.firstChild;
while(formObj && formObj.nodeName != "FORM") formObj = formObj.nextSibling;
if(!formObj || formObj.nodeName != "FORM") return;
selectedSizeWidget = obj;
layer.style.display = "block";
formObj.width.value = obj.style.width;
formObj.height.value = obj.style.height;
formObj.margin_left.value = _getInt(selectedSizeWidget.getAttribute('widget_margin_left'));
formObj.margin_right.value = _getInt(selectedSizeWidget.getAttribute('widget_margin_right'));
formObj.margin_top.value = _getInt(selectedSizeWidget.getAttribute('widget_margin_top'));
formObj.margin_bottom.value = _getInt(selectedSizeWidget.getAttribute('widget_margin_bottom'));
var widget_align = getFloat(selectedSizeWidget);
if(widget_align == "left") formObj.widget_align.selectedIndex = 0;
else formObj.widget_align.selectedIndex = 1;
formObj.border_top_color.value = transRGB2Hex(selectedSizeWidget.style.borderTopColor);
formObj.border_top_thick.value = selectedSizeWidget.style.borderTopWidth.replace(/px$/i,'');
formObj.border_top_type.selectedIndex = selectedSizeWidget.style.borderTopStyle=='dotted'?1:0;
formObj.border_bottom_color.value = transRGB2Hex(selectedSizeWidget.style.borderBottomColor);
formObj.border_bottom_thick.value = selectedSizeWidget.style.borderBottomWidth.replace(/px$/i,'');
formObj.border_bottom_type.selectedIndex = selectedSizeWidget.style.borderBottomStyle=='dotted'?1:0;
formObj.border_right_color.value = transRGB2Hex(selectedSizeWidget.style.borderRightColor);
formObj.border_right_thick.value = selectedSizeWidget.style.borderRightWidth.replace(/px$/i,'');
formObj.border_right_type.selectedIndex = selectedSizeWidget.style.borderRightStyle=='dotted'?1:0;
formObj.border_left_color.value = transRGB2Hex(selectedSizeWidget.style.borderLeftColor);
formObj.border_left_thick.value = selectedSizeWidget.style.borderLeftWidth.replace(/px$/i,'');
formObj.border_left_type.selectedIndex = selectedSizeWidget.style.borderLeftStyle=='dotted'?1:0;
formObj.background_color.value = transRGB2Hex(selectedSizeWidget.style.backgroundColor);
formObj.background_image_url.value = selectedSizeWidget.style.backgroundImage.replace(/^url\(/i,'').replace(/\)$/i,'');
switch(selectedSizeWidget.style.backgroundRepeat) {
case 'no-repeat' : formObj.background_repeat.selectedIndex = 1; break;
case 'repeat-x' : formObj.background_repeat.selectedIndex = 2; break;
case 'repeat-y' : formObj.background_repeat.selectedIndex = 3; break;
default : formObj.background_repeat.selectedIndex = 0; break;
}
formObj.background_x.value = 0;
formObj.background_y.value = 0;
var pos = selectedSizeWidget.style.backgroundPosition;
if(pos) {
pos = pos.split(' ');
if(pos.length==2) {
formObj.background_x.value = _getInt(pos[0]);
formObj.background_y.value = _getInt(pos[1]);
}
}
if(px+xWidth(layer)>xPageX(zonePageObj)+xWidth(zonePageObj)) px = xPageX(zonePageObj)+xWidth(zonePageObj)-xWidth(layer)-5;
xLeft(layer, px);
xTop(layer, py);
layer.style.visibility = "visible";
try {
formObj.width.focus();
} catch(e) {
}
}
function doHideWidgetSizeSetup() {
var layer = xGetElementById("pageSizeLayer");
layer.style.visibility = "hidden";
layer.style.display = "none";
}
function _getSize(value) {
if(!value) return;
var type = "px";
if(value.lastIndexOf("%")>=0) type = "%";
var num = parseInt(value,10);
if(num<1) return;
if(type == "%" && num > 100) num = 100;
return ""+num+type;
}
function _getBorderStyle(fld_color, fld_thick, fld_type) {
var color = fld_color.value;
if(!color) color = '#FFFFFF';
else color = '#'+color;
var width = fld_thick.value;
if(!width) width = '0px';
else width = parseInt(width,10)+'px';
var style = fld_type.value;
if(!style) style = 'solid';
var str = color+' '+width+' '+style;
return str;
}
function _getBGColorStyle(fld_color) {
var color = fld_color.value;
if(!color) color = '#FFFFFF';
else color = '#'+color;
return color;
}
function doApplyWidgetSize(fo_obj) {
if(selectedSizeWidget) {
if(fo_obj.widget_align.selectedIndex == 1) setFloat(selectedSizeWidget, 'right');
else setFloat(selectedSizeWidget, 'left');
var width = _getSize(fo_obj.width.value);
if(width) selectedSizeWidget.style.width = width;
var height = _getSize(fo_obj.height.value);
if(height) selectedSizeWidget.style.height = height;
selectedSizeWidget.style.borderTop = _getBorderStyle(fo_obj.border_top_color, fo_obj.border_top_thick, fo_obj.border_top_type);
selectedSizeWidget.style.borderBottom = _getBorderStyle(fo_obj.border_bottom_color, fo_obj.border_bottom_thick, fo_obj.border_bottom_type);
selectedSizeWidget.style.borderLeft = _getBorderStyle(fo_obj.border_left_color, fo_obj.border_left_thick, fo_obj.border_left_type);
selectedSizeWidget.style.borderRight = _getBorderStyle(fo_obj.border_right_color, fo_obj.border_right_thick, fo_obj.border_right_type);
selectedSizeWidget.style.backgroundColor = _getBGColorStyle(fo_obj.background_color);
var image_url = fo_obj.background_image_url.value;
if(image_url) selectedSizeWidget.style.backgroundImage = "url("+image_url+")";
else selectedSizeWidget.style.backgroundImage = 'none';
switch(fo_obj.background_repeat.selectedIndex) {
case 1 : selectedSizeWidget.style.backgroundRepeat = 'no-repeat'; break;
case 2 : selectedSizeWidget.style.backgroundRepeat = 'repeat-x'; break;
case 3 : selectedSizeWidget.style.backgroundRepeat = 'repeat-y'; break;
default : selectedSizeWidget.style.backgroundRepeat = 'repeat'; break;
}
selectedSizeWidget.style.backgroundPosition = _getInt(fo_obj.background_x.value)+'px'+ ' '+_getInt(fo_obj.background_y.value)+'px';
var borderObj = selectedSizeWidget.firstChild;
while(borderObj) {
if(borderObj.nodeName == "DIV" && borderObj.className == "widgetBorder") {
var contentObj = borderObj.firstChild;
while(contentObj) {
if(contentObj.nodeName == "DIV") {
contentObj.style.margin = "";
var marginLeft = _getSize(fo_obj.margin_left.value);
if(marginLeft) {
contentObj.style.marginLeft = marginLeft;
selectedSizeWidget.setAttribute('widget_margin_left', marginLeft);
} else {
contentObj.style.marginLeft = '';
selectedSizeWidget.setAttribute('widget_margin_left', '');
}
var marginRight = _getSize(fo_obj.margin_right.value);
if(marginRight) {
contentObj.style.marginRight = marginRight;
selectedSizeWidget.setAttribute('widget_margin_right', marginRight);
} else {
contentObj.style.marginRight = '';
selectedSizeWidget.setAttribute('widget_margin_right', '');
}
var marginTop = _getSize(fo_obj.margin_top.value);
if(marginTop) {
contentObj.style.marginTop = marginTop;
selectedSizeWidget.setAttribute('widget_margin_top', marginTop);
} else {
contentObj.style.marginTop = '';
selectedSizeWidget.setAttribute('widget_margin_top', '');
}
var marginBottom = _getSize(fo_obj.margin_bottom.value);
if(marginBottom) {
contentObj.style.marginBottom = marginBottom;
selectedSizeWidget.setAttribute('widget_margin_bottom', marginBottom);
} else {
contentObj.style.marginBottom = '';
selectedSizeWidget.setAttribute('widget_margin_bottom', '');
}
break;
}
contentObj = contentObj.nextSibling;
}
break;
}
borderObj = borderObj.nextSibling;
}
selectedSizeWidget = null;
doFitBorderSize();
}
doHideWidgetSizeSetup();
}
/* 위젯 드래그 */
// 드래그 중이라는 상황을 간직할 변수
var widgetDragManager = {obj:null, isDrag:false}
var widgetTmpObject = new Array();
var widgetDisappear = 0;
function widgetCreateTmpObject(obj) {
var id = obj.getAttribute('id');
tmpObj = xCreateElement('DIV');
tmpObj.id = id + '_tmp';
tmpObj.className = obj.className;
tmpObj.style.overflow = 'hidden';
tmpObj.style.padding = '0px';
tmpObj.style.margin = '0px';
tmpObj.style.width = obj.style.width;
tmpObj.style.display = 'none';
tmpObj.style.position = 'absolute';
tmpObj.style.opacity = 1;
tmpObj.style.filter = 'alpha(opacity=100)';
xLeft(tmpObj, xPageX(obj));
xTop(tmpObj, xPageY(obj));
document.body.appendChild(tmpObj);
widgetTmpObject[obj.id] = tmpObj;
return tmpObj;
}
// 기생성된 임시 object를 찾아서 return, 없으면 만들어서 return
var idStep = 0;
function widgetGetTmpObject(obj) {
if(!obj.id) obj.id = 'widget_'+idStep++;
var tmpObj = widgetTmpObject[obj.id];
if(!tmpObj) tmpObj = widgetCreateTmpObject(obj);
return tmpObj;
}
// 메뉴에 마우스 클릭이 일어난 시점에 드래그를 위한 제일 첫 동작 (해당 object에 각종 함수나 상태변수 설정)
function widgetDragEnable(obj, funcDragStart, funcDrag, funcDragEnd) {
// 상위 object에 드래그 가능하다는 상태와 각 드래그 관련 함수를 설정
obj.draggable = true;
obj.dragStart = funcDragStart;
obj.drag = funcDrag;
obj.dragEnd = funcDragEnd;
// 드래그 가능하지 않다면 드래그 가능하도록 상태 지정하고 mousemove이벤트 등록
if (!widgetDragManager.isDrag) {
widgetDragManager.isDrag = true;
xAddEventListener(document, 'mousemove', widgetDragMouseMove, false);
}
}
// 드래그를 시작할때 호출되는 함수 (이동되는 형태를 보여주기 위한 작업을 함)
function widgetDragStart(tobj, px, py) {
if(tobj.className == 'widgetResize' || tobj.className == 'widgetResizeLeft' ) return;
var obj = widgetGetTmpObject(tobj);
xInnerHtml(obj, xInnerHtml(tobj));
xLeft(obj, xPageX(tobj));
xTop(obj, xPageY(tobj));
xWidth(obj, xWidth(tobj));
xHeight(obj, xHeight(tobj));
xDisplay(obj, 'block');
}
// 드래그 시작후 마우스를 이동할때 발생되는 이벤트에 의해 실행되는 함수
function widgetDrag(tobj, dx, dy) {
var minWidth = 40;
var minHeight = 10;
var sx = xPageX(tobj.parentNode);
var sy = xPageY(tobj.parentNode);
var nx = tobj.xDPX;
var ny = tobj.xDPY;
var zoneWidth = xWidth(zonePageObj);
var zoneLeft = xPageX(zonePageObj);
var zoneRight = zoneLeft + zoneWidth;
var pWidth = xWidth(tobj.parentNode);
var float = getFloat(tobj.parentNode);
if(!float) float = 'left';
// 위젯 리사이즈 (우측)
if(tobj.className == 'widgetResize') {
if(nx < sx+minWidth) nx = sx+minWidth;
if(nx > zoneRight) nx = zoneRight;
if(float == 'right') nx = sx + pWidth;
var new_width = nx - sx;
if(new_width < minWidth) new_width = minWidth;
var new_height = ny - sy;
if(new_height < minHeight) new_height = minHeight;
if( zoneRight < sx+new_width) new_width = zoneRight - sx;
// 위젯의 크기 조절
xWidth(tobj.nextSibling.nextSibling, new_width);
xHeight(tobj.nextSibling.nextSibling, new_height);
xWidth(tobj.parentNode, new_width);
xHeight(tobj.parentNode, new_height);
// 위젯 리사이즈 (좌측)
} else if(tobj.className == 'widgetResizeLeft') {
if(nx < zoneLeft) nx = zoneLeft;
if(float == 'left') nx = sx;
var new_width = pWidth + (sx - nx);
if(new_width < minWidth) new_width = minWidth;
var new_height = ny - sy;
if(new_height < minHeight) new_height = minHeight;
// 위젯의 크기 조절
xWidth(tobj.nextSibling, new_width);
xHeight(tobj.nextSibling, new_height);
xWidth(tobj.parentNode, new_width);
xHeight(tobj.parentNode, new_height);
// 위젯 드래그
} else {
var obj = widgetGetTmpObject(tobj);
xLeft(obj, parseInt(xPageX(obj),10) + parseInt(dx,10));
xTop(obj, parseInt(xPageY(obj),10) + parseInt(dy,10));
// 박스 안에 있을 경우에는 박스내의 위젯하고 자리를 바꾸고 그 외의 경우에는 박스를 빠져 나간다
if(tobj.parentNode != zonePageObj) {
// 박스내에 있는 위젯들을 구함
var widgetList = xGetElementsByClassName("widgetOutput",tobj.parentNode);
for(var i=0;i<widgetList.length;i++) {
var target_obj = widgetList[i];
var l = xPageX(target_obj);
var t = xPageY(target_obj);
var ll = parseInt(l,10) + parseInt(xWidth(target_obj),10);
var tt = parseInt(t,10) + parseInt(xHeight(target_obj),10);
if( tobj != target_obj && tobj.xDPX >= l && tobj.xDPX <= ll && tobj.xDPY >= t && tobj.xDPY <= tt && tobj.parentNode == target_obj.parentNode) {
var next1 = target_obj.nextSibling;
if(!next1) {
next1 = xCreateElement("DIV");
target_obj.parentNode.appendChild(next1);
}
var next2 = tobj.nextSibling;
if(!next2) {
next2 = xCreateElement("DIV");
tobj.parentNode.appendChild(next2);
}
if(next1) next1.parentNode.insertBefore(tobj, next1);
if(next2) next2.parentNode.insertBefore(target_obj, next2);
doFitBorderSize();
widgetList = null;
return;
}
}
widgetList = null;
// 만약 다른 위젯과 자리를 바꾸지 못하였는데 자기 부모창밖에 있는게 확인이 되면 박스 밖으로 내보낸다.
var l = xPageX(tobj.parentNode);
var t = xPageY(tobj.parentNode);
var ll = parseInt(l,10) + parseInt(xWidth(tobj.parentNode),10);
var tt = parseInt(t,10) + parseInt(xHeight(tobj.parentNode),10);
if( (tobj.xDPX < l || tobj.xDPX > ll) || (tobj.xDPY < t || tobj.xDPY > tt) ) {
var target_obj = tobj.parentNode;
tobj.parentNode.parentNode.insertBefore(tobj, tobj.parentNode);
doFitBorderSize();
return;
}
// 박스 밖에 있을 경우에는 다른 위젯과 자리를 바꾸거나 박스내에 들어가도록 한다
} else {
// 이동하려는 위젯이 박스 위젯이 아니라면 박스 위젯들을 구해서 입력 유무를 검사한다
if(tobj.getAttribute("widget")!="widgetBox") {
var boxList = xGetElementsByClassName("nullWidget", zonePageObj);
for(var i=0;i<boxList.length;i++) {
var target_obj = boxList[i];
xHeight(target_obj, xHeight(target_obj.parentNode));
xWidth(target_obj, xWidth(target_obj.parentNode));
var l = xPageX(target_obj);
var t = xPageY(target_obj);
var ll = parseInt(l,10) + parseInt(xWidth(target_obj),10);
var tt = parseInt(t,10) + parseInt(xHeight(target_obj),10);
if( tobj.xDPX >= l && tobj.xDPX <= ll && tobj.xDPY >= t && tobj.xDPY <= tt) {
if(target_obj.className == "nullWidget") {
target_obj.appendChild(tobj);
// 이동을 멈춤
widgetManualEnd();
doFitBorderSize();
boxList = null;
return;
}
}
}
boxList = null;
}
// 다른 위젯들을 구해서 자리를 바꿈
var widgetList = xGetElementsByClassName("widgetOutput",zonePageObj);
for(var i=0;i<widgetList.length;i++) {
var target_obj = widgetList[i];
var widget = target_obj.getAttribute("widget");
if(widget == 'widgetBox' || target_obj.parentNode != zonePageObj) continue;
var l = xPageX(target_obj);
var t = xPageY(target_obj);
var ll = parseInt(l,10) + parseInt(xWidth(target_obj),10);
var tt = parseInt(t,10) + parseInt(xHeight(target_obj),10);
if( tobj != target_obj && tobj.xDPX >= l && tobj.xDPX <= ll && tobj.xDPY >= t && tobj.xDPY <= tt && tobj.parentNode == target_obj.parentNode) {
var next1 = target_obj.nextSibling;
if(!next1) next1 = target_obj.parentNode.lastChild;
if(!next1) {
next1 = xCreateElement("DIV");
target_obj.parentNode.appendChild(next1);
}
var next2 = tobj.nextSibling;
if(!next2) {
next2 = xCreateElement("DIV");
tobj.parentNode.appendChild(next2);
}
if(next1) next1.parentNode.insertBefore(tobj, next1);
if(next2) next2.parentNode.insertBefore(target_obj, next2);
doFitBorderSize();
widgetList = null;
return;
}
}
widgetList = null;
}
}
}
// 드래그 종료 (이동되는 object가 이동할 곳에 서서히 이동되는 것처럼 보이는 효과)
function widgetDragEnd(tobj, px, py) {
var obj = widgetGetTmpObject(tobj);
widgetDisapear = widgetDisapearObject(obj, tobj);
widgetDragDisable(tobj.getAttribute('id'));
}
// 스르르 사라지게 함 (일단 사라지게 하는 기능을 제거.. 속도 문제)
function widgetDisapearObject(obj, tobj) {
xInnerHtml(tobj,xInnerHtml(obj));
xInnerHtml(obj,'');
xDisplay(obj, 'none');
obj.parentNode.removeChild(obj);
widgetTmpObject[tobj.id] = null;
return;
var it = 5;
var ib = 1;
var x = parseInt(xPageX(obj),10);
var y = parseInt(xPageY(obj),10);
var ldt = (x - parseInt(xPageX(tobj),10)) / ib;
var tdt = (y - parseInt(xPageY(tobj),10)) / ib;
return setInterval(function() {
if(ib < 1) {
clearInterval(widgetDisapear);
xInnerHtml(tobj,xInnerHtml(obj));
xInnerHtml(obj,'');
xDisplay(obj, 'none');
obj.parentNode.removeChild(obj);
widgetTmpObject[tobj.id] = null;
return;
}
ib -= 5;
x-=ldt;
y-=tdt;
xLeft(obj, x);
xTop(obj, y);
}, it/ib);
}
// 마우스다운 이벤트 발생시 호출됨
function widgetMouseDown(e) {
var evt = new xEvent(e);
var obj = evt.target;
while(obj && !obj.draggable) {
obj = xParent(obj, true);
}
if(obj) {
xPreventDefault(e);
obj.xDPX = evt.pageX;
obj.xDPY = evt.pageY;
widgetDragManager.obj = obj;
xAddEventListener(document, 'mouseup', widgetMouseUp, false);
if (obj.dragStart) obj.dragStart(obj, evt.pageX, evt.pageY);
}
}
// 마우스 버튼을 놓았을때 동작될 함수 (각종 이벤트 해제 및 변수 설정 초기화)
function widgetMouseUp(e) {
if (widgetDragManager.obj) {
xPreventDefault(e);
xRemoveEventListener(document, 'mouseup', widgetMouseUp, false);
if (widgetDragManager.obj.dragEnd) {
var evt = new xEvent(e);
widgetDragManager.obj.dragEnd(widgetDragManager.obj, evt.pageX, evt.pageY);
}
widgetDragManager.obj = null;
widgetDragManager.isDrag = false;
}
}
// 드래그할때의 object이동등을 담당
function widgetDragMouseMove(e) {
var evt = new xEvent(e);
if(widgetDragManager.obj) {
xPreventDefault(e);
var obj = widgetDragManager.obj;
var dx = evt.pageX - obj.xDPX;
var dy = evt.pageY - obj.xDPY;
obj.xDPX = evt.pageX;
obj.xDPY = evt.pageY;
if (obj.drag) {
obj.drag(obj, dx, dy);
} else {
xMoveTo(obj, xLeft(obj) + dx, xTop(obj) + dy);
}
}
}
// 해당 object 에 더 이상 drag가 되지 않도록 설정
function widgetDragDisable(id) {
if (!widgetDragManager) return;
var obj = xGetElementById(id);
obj.draggable = false;
obj.dragStart = null;
obj.drag = null;
obj.dragEnd = null;
//obj.style.backgroundColor = obj.getAttribute('source_color');
xRemoveEventListener(obj, 'mousedown', widgetMouseDown, false);
return;
}
// 강제로 드래그를 종료시킴
function widgetManualEnd() {
var tobj = widgetDragManager.obj;
if(!tobj) return;
xRemoveEventListener(document, 'mouseup', widgetMouseUp, false);
var obj = widgetGetTmpObject(tobj);
widgetDisapear = widgetDisapearObject(obj, tobj);
widgetDragDisable(tobj.getAttribute('id'));
widgetDragManager.obj = null;
widgetDragManager.isDrag = false;
}

View file

@ -0,0 +1,101 @@
<div id="tmpPageSizeLayer" style="visibility:hidden;">
<form action="./" onsubmit="doApplyWidgetSize(this); return false;">
<table cellspacing="0">
<col width="140" />
<col />
<col />
<tr>
<th>{$lang->cmd_widget_align}</th>
<td colspan="2">
<select name="widget_align">
<option value="left">{$lang->cmd_widget_align_left}</option>
<option value="right">{$lang->cmd_widget_align_right}</option>
</select>
</td>
</tr>
<tr>
<th class="line">{$lang->cmd_widget_size}</th>
<td colspan="2" class="line"><input type="text" name="width" class="input" value="" /> - <input type="text" class="input" name="height" value="" /></td>
</tr>
<tr>
<th rowspan="3" class="line">{$lang->cmd_widget_margin}</th>
<td colspan="2" class="line tCenter"><input type="text" name="margin_top" class="input" value="" /></td>
</tr>
<tr>
<td><input type="text" name="margin_left" class="input" value="" /></td>
<td class="tRight"><input type="text" name="margin_right" class="input" value="" /></td>
</tr>
<tr>
<td colspan="2" class="tCenter"><input type="text" name="margin_bottom" class="input" value="" /></td>
</tr>
<tr>
<th rowspan="3" class="line">{$lang->cmd_widget_border}</th>
<td colspan="2" class="tCenter line">
<input type="text" name="border_top_thick" value="" class="small_input" />px
<select name="border_top_type">
<option value="solid">{$lang->cmd_widget_border_solid}</option>
<option value="dotted">{$lang->cmd_widget_border_dotted}</option>
</select>
#<input type="text" name="border_top_color" value="" class="color_input" maxlength="6"/>
</td>
</tr>
<tr>
<td>
<input type="text" name="border_left_thick" value="" class="small_input" />px
<select name="border_left_type">
<option value="solid">{$lang->cmd_widget_border_solid}</option>
<option value="dotted">{$lang->cmd_widget_border_dotted}</option>
</select>
#<input type="text" name="border_left_color" value="" class="color_input" maxlength="6"/>
</td>
<td class="tRight">
<input type="text" name="border_right_thick" value="" class="small_input" />px
<select name="border_right_type">
<option value="solid">{$lang->cmd_widget_border_solid}</option>
<option value="dotted">{$lang->cmd_widget_border_dotted}</option>
</select>
#<input type="text" name="border_right_color" value="" class="color_input" maxlength="6"/>
</td>
</tr>
<tr>
<td colspan="2" class="tCenter">
<input type="text" name="border_bottom_thick" value="" class="small_input" />px
<select name="border_bottom_type">
<option value="solid">{$lang->cmd_widget_border_solid}</option>
<option value="dotted">{$lang->cmd_widget_border_dotted}</option>
</select>
#<input type="text" name="border_bottom_color" value="" class="color_input" maxlength="6"/>
</td>
</tr>
<tr>
<th class="line">{$lang->cmd_widget_background_color}</th>
<td colspan="2" class="line">#<input type="text" name="background_color" value="" class="color_input" maxlength="6"/></td>
</tr>
<tr>
<th class="line">{$lang->cmd_widget_background_image_url}</th>
<td colspan="2" class="line">
<div><input type="text" name="background_image_url" value="" class="full_input"/></div>
<div>
<select name="background_repeat">
<option value="repeat">{$lang->cmd_widget_background_image_repeat}</option>
<option value="no-repeat">{$lang->cmd_widget_background_image_no_repeat}</option>
<option value="repeat-x">{$lang->cmd_widget_background_image_x_repeat}</option>
<option value="repeat-y">{$lang->cmd_widget_background_image_y_repeat}</option>
</select>
</div>
<div>
{$lang->cmd_widget_background_image_x} : <input type="text" name="background_x" value="0" class="small_input" />px
</div>
<div>
{$lang->cmd_widget_background_image_y} : <input type="text" name="background_y" value="0" class="small_input" />px
</div>
</td>
</tr>
<tr>
<td colspan="3" class="buttonBox">
<input type="submit" value="{$lang->cmd_save}" class="submit"/>
</td>
</tr>
</table>
</form>
</div>

View file

@ -25,5 +25,35 @@
$this->setTemplateFile('downloaded_widget_list');
}
/**
* @brief 내용 직접 입력 위젯 팝업창 내용을 꾸힘
**/
function dispWidgetAdminAddContent() {
$this->setLayoutFile("popup_layout");
$module_srl = Context::get('module_srl');
if(!$module_srl) return $this->stop("msg_invalid_request");
$oModuleModel = &getModel('module');
$module_info = $oModuleModel->getModuleInfoByModuleSrl($module_srl);
Context::set('module_info', $module_info);
// 에디터 모듈의 getEditor를 호출하여 세팅
$oEditorModel = &getModel('editor');
$option->primary_key_name = 'module_srl';
$option->content_key_name = 'content';
$option->allow_fileupload = true;
$option->enable_autosave = false;
$option->enable_default_component = true;
$option->enable_component = true;
$option->resizable = false;
$option->height = 400;
$option->manual_start = true;
$editor = $oEditorModel->getEditor($module_srl, $option);
Context::set('editor', $editor);
$this->setTemplateFile('add_content_widget');
}
}
?>

View file

@ -81,7 +81,14 @@
unset($vars->body);
unset($vars->act);
unset($vars->selected_widget);
if(!$vars->widget_sequence) $vars->widget_sequence = getNextSequence();
if($vars->widget_sequence) {
$cache_path = './files/cache/widget_cache/';
$cache_file = sprintf('%s%d.%s.cache', $cache_path, $vars->widget_sequence, Context::getLangType());
@unlink($cache_file);
}
$vars->widget_sequence = getNextSequence();
if(!$vars->widget_cache) $vars->widget_cache = 0;
// args 정리
$attribute = array();
@ -122,5 +129,148 @@
$this->add('colorset_list', $colorsets);
}
/**
* @brief 직접 내용 입력된 위젯의 처리
**/
function procWidgetAddContent() {
$content = Context::get('content');
$args = Context::getRequestVars('style','widget_margin_left','widget_margin_right','widget_margin_bottom','widget_margin_top');
$tpl = $this->transEditorContent($content, $args);
$this->add('tpl', $tpl);
}
/**
* @breif 특정 content의 위젯 태그들을 변환하여 return
**/
function transWidgetCode($content, $include_info = false) {
$this->include_info = $include_info;
// 내용중 widget이 아닌 것들을 일단 분리
/*
$none_widget_code = preg_replace('!<img([^\>]*)widget=([^\>]*?)\>!is', '', $content);
$oPageAdminController = &getAdminController('page');
if(trim($none_widget_code)) {
$args->style = "float:left;overflow:hidden;padding:none;margin:none";
$args->widget_margin_left = $args->widget_margin_top = $args->widget_margin_right = $args->widget_margin_bottom = 0;
$none_widget_content = $oPageAdminController->transEditorContent($none_widget_code, $args);
}
*/
// 내용중 위젯을 또다시 구함 (기존 버전에서 페이지 수정해 놓은것과의 호환을 위해서)
$content = preg_replace_callback('!<img([^\>]*)widget=([^\>]*?)\>!is', array($this,'transWidget'), $content);
// 박스 위젯을 다시 구함
$content = preg_replace_callback('!<div([^\>]*)widget=([^\>]*?)\><div><div>!is', array($this,'transWidgetBox'), $content);
// include_info, 즉 위젯의 수정일 경우 css와 js파일을 추가해 주고 위젯 수정용 레이어도 추가함
if($this->include_info) {
Context::addJsFile("./modules/widget/tpl/js/widget.js");
Context::addCSSFile("./modules/widget/tpl/css/widget.css");
$oTemplate = &TemplateHandler::getInstance();
$tpl = $oTemplate->compile($this->module_path.'tpl', 'widget_layer');
$content .= $tpl;
}
return $content;
}
/**
* @brief 위젯 코드를 실제 php코드로 변경
**/
function transWidget($matches) {
$oXmlParser = new XmlParser();
$xml_doc = $oXmlParser->parse(trim($matches[0]));
if($xml_doc->img) $vars = $xml_doc->img->attrs;
else $vars = $xml_doc->attrs;
if(!$vars->widget) return "";
// 캐시 체크
$widget_sequence = $vars->widget_sequence;
$widget_cache = $vars->widget_cache;
if($widget_cache && $widget_sequence && !$this->include_info) {
$output = WidgetHandler::getCache($widget_sequence, $widget_cache);
if($output) return $output;
}
// 위젯의 이름을 구함
$widget = $vars->widget;
unset($vars->widget);
return WidgetHandler::execute($widget, $vars, $this->include_info);
}
/**
* @brief 위젯 박스를 실제 php코드로 변경
**/
function transWidgetBox($matches) {
$buff = preg_replace('/<div><div>$/i','</div>',$matches[0]);
$oXmlParser = new XmlParser();
$xml_doc = $oXmlParser->parse($buff);
$vars = $xml_doc->div->attrs;
$widget = $vars->widget;
unset($vars->widget);
// 위젯의 이름을 구함
if(!$widget) return $matches[0];
return WidgetHandler::execute($widget, $vars, $this->include_info);
}
/**
* @brief 에디터에서 생성한 컨텐츠를 페이지 수정시 사용할 있도록 코드 생성
**/
function transEditorContent($content, $args = null) {
// 에디터의 내용을 변환하여 visual한 영역과 원본 소스를 가지고 있는 code로 분리
$code = $content;
$oContext = &Context::getInstance();
$content = preg_replace_callback('!<div([^\>]*)editor_component=([^\>]*)>(.*?)\<\/div\>!is', array($oContext,'transEditorComponent'), $content);
$content = preg_replace_callback('!<img([^\>]*)editor_component=([^\>]*?)\>!is', array($oContext,'transEditorComponent'), $content);
// 결과물에 있는 css Meta 목록을 구해와서 해당 css를 아예 읽어버림
require_once("./classes/optimizer/Optimizer.class.php");
$oOptimizer = new Optimizer();
preg_match_all('!<\!\-\-Meta:([^\-]*?)\-\->!is', $content, $matches);
$css_header = null;
for($i=0;$i<count($matches[1]);$i++) {
$css_file = $matches[1][$i];
$buff = FileHandler::readFile($css_file);
$css_header .= $oOptimizer->replaceCssPath($css_file, $buff)."\n";
}
$tpl = sprintf(
'<style type="text/css">%s</style>'.
'<div class="widgetOutput" style="%s" widget_margin_left="%s" widget_margin_right="%s" widget_margin_top="%s" widget_margin_bottom="%s" widget="widgetContent">'.
'<div class="widgetSetup"></div>'.
'<div class="widgetCopy"></div>'.
'<div class="widgetSize"></div>'.
'<div class="widgetRemove"></div>'.
'<div class="widgetResize"></div>'.
'<div class="widgetResizeLeft"></div>'.
'<div class="widgetBorder">'.
'<div style="margin:%s %s %s %s;">'.
'%s'.
'</div><div class="clear"></div>'.
'</div>'.
'<div class="widgetContent" style="display:none;width:1px;height:1px;overflow:hidden;">%s</div>'.
'</div>',
$css_header,
$args->style,
$args->widget_margin_left, $args->widget_margin_right, $args->widget_margin_top, $args->widget_margin_bottom,
$args->widget_margin_top, $args->widget_margin_right, $args->widget_margin_bottom, $args->widget_margin_left,
$content,
base64_encode($code)
);
return $tpl;
}
}
?>