위젯 편집 기능 개선

- 위젯 추가/복사등을 할 때 페이지 리로드 없이 바로 적용되도록 변경
- 위젯 스타일 수정 또는 추가시 위젯의 스타일값이 변경되는 오류 수정


git-svn-id: http://xe-core.googlecode.com/svn/sandbox@5917 201d5d3c-b55e-5fd7-737f-ddc643e51545

modules/widget/tpl/css/widget.css

@@ -56,7 +56,7 @@ div.editor { width:700px; }
 ul.midCommand { float:left; margin:0 0 0 10px;; padding:0; *zoom:1; }
 ul.midCommand li { display:block; margin-bottom:5px; list-style:none;}
 
-a.widgetStyle { float:left; margin-right:10px; border:1px solid #CCC; overflow:hidden; *zoom:1; }
+a.widgetStyle { float:left; margin:0 10px 10px 0; border:1px solid #CCC; overflow:hidden; *zoom:1;  width:96px; height:96px;}
 a.widgetStyle:hover { border:1px solid #444; }
 a.widgetStyle.selected { border:1px solid #000; }
 a.widgetStyle img {width:96px; height:96px; margin:1px; }

modules/widget/tpl/filter/style_generate_code_in_page.xml

@@ -6,4 +6,4 @@
         <tag name="tpl" />
         <tag name="css_header" />
     </response>
-</filter>
+</filter>

modules/widget/tpl/js/widget.js

@@ -4,24 +4,6 @@
  * @brief  위젯 관리용 자바스크립트
  **/
 
-/* document.write(ln)의 경우 ajax로 처리시 가로채기 위한 함수 */
-document.write = document.writeln = function(str){
-    if ( str.match(/^<\//) ) return;
-    if ( !window.opera ) str = str.replace(/&(?![#a-z0-9]+;)/g, "&");
-    str = str.replace(/(<[a-z]+)/g, "$1 xmlns='http://www.w3.org/1999/xhtml'");
-    var div = null;
-    if(document.createElementNS) div = document.createElementNS("http://www.w3.org/1999/xhtml","div");
-    else div = xCreateElement('div');
-    xInnerHtml(div, str);
-    var pos;
-    pos = document.getElementsByTagName("*");
-    pos = pos[pos.length - 1];
-    var nodes = div.childNodes;
-    while ( nodes.length ) {
-        pos.parentNode.appendChild( nodes[0] );
-    }
-};
-
 /* DOM 속성을 구하기 위한 몇가지 함수들.. */
 // style의 값을 구하는게 IE랑 그외가 다름.
 function getStyle(obj) {
@@ -267,12 +249,15 @@ function completeAddContent(ret_obj, response_tags, params, fo_obj) {
         attr = contentWidget.get(0).attributes;
     }
 
+    var editor_sequence = params['editor_sequence'];
+    var content = editorGetContent(editor_sequence);
+
     var tpl = ''+
         '<div class="widgetOutput" style="'+fo_obj.style.value+'" widget_padding_left="'+fo_obj.widget_padding_left.value+'" widget_padding_right="'+fo_obj.widget_padding_right.value+'" widget_padding_top="'+fo_obj.widget_padding_top.value+'" widget_padding_bottom="'+fo_obj.widget_padding_bottom.value+'" document_srl="'+document_srl+'" widget="widgetContent">'+
         '<div class="widgetResize"></div>'+
         '<div class="widgetResizeLeft"></div>'+
         '<div class="widgetBorder">'+
-        '<div style="padding:'+fo_obj.widget_padding_top.value+'px '+fo_obj.widget_padding_right.value+'px'+fo_obj.widget_padding_bottom.value+'px'+fo_obj.widget_padding_left.value+'px"></div><div class="clear"></div>'+
+        '<div style="padding:'+fo_obj.widget_padding_top.value+'px '+fo_obj.widget_padding_right.value+'px'+fo_obj.widget_padding_bottom.value+'px'+fo_obj.widget_padding_left.value+'px"></div>'+content+'<div class="clear"></div>'+
         '</div>'+
         '<div class="widgetContent" style="display:none;width:1px;height:1px;overflow:hidden;"></div>'+
         '</div>';
@@ -340,34 +325,95 @@ function doFitBorderSize() {
 }
 
 var selectedWidget = null;
+var writedText = null;
+var checkDocumentWrite = false;
+
+// document.write(ln)의 경우 ajax로 처리시 가로채기 위한 함수 
+// 아래 함수는 str 내용을 단지 전역 변수에 보관 후 doAddWidgetCode 에서 재사용하기 위해 사용됨.
+window.document.write = window.document.writeln = function(str){ 
+    if(checkDocumentWrite) {
+        writedText = str;
+        return;
+    }
+    if ( str.match(/^<\//) ) return;
+    if ( !window.opera ) str = str.replace(/&(?![#a-z0-9]+;)/g, "&");
+    str = str.replace(/(<[a-z]+)/g, "$1 xmlns='http://www.w3.org/1999/xhtml'");
+
+    var div = xCreateElement("DIV");
+    xInnerHtml(div, str);
+
+    var pos;
+    pos = document.getElementsByTagName("*");
+    pos = pos[pos.length - 1];
+    var nodes = div.childNodes;
+    while ( nodes.length ) {
+        pos.parentNode.appendChild( nodes[0] );
+    }
+}
 
 // 위젯 추가
 function doAddWidgetCode(widget_code) {
+    restoreWidgetButtons();
+
+    // css 추가
+    var tmp = widget_code;
+    while(tmp.indexOf("<!--Meta:")>-1) {
+        var pos = tmp.indexOf("<!--Meta:");
+        tmp = tmp.substr(pos);
+        var eos = tmp.indexOf("-->");
+        var cssfile = tmp.substr(9,eos-9);
+        if(!cssfile) break;
+        tmp = tmp.substr(eos);
+
+        var cssfile = request_uri+'/'+cssfile;
+        var css ='<style type="text/css"> @import url("'+cssfile+'"); </style>';
+        var dummy  = xCreateElement("DIV");
+        xInnerHtml(dummy , css);
+        document.body.appendChild(dummy);
+    }
+
+    // widget 코드에서 javascript 부분을 빼서 eval후 결과값을 대체함
+    checkDocumentWrite = true; ///< document.write(ln)등의 함수값을 바로 사용하기 위한 check flag
+
+    // widget_code의 javascript 부분 수정
+    var tmp = widget_code.toLowerCase();
+    while(tmp.indexOf("<script")>-1) {
+
+        var pos = tmp.indexOf("<script");
+
+        tmp = tmp.substr(pos);
+        var length = tmp.indexOf("</script>")+9;
+
+        var script = widget_code.substr(pos,length);
+        script = script.replace(/^<script([^>]*)>/i,'').replace(/<\/script>$/i,'');
+
+        writedText = null;
+        eval(script);
+        widget_code = widget_code.substr(0,pos)+writedText+widget_code.substr(pos+length);
+        tmp = widget_code.toLowerCase();
+    }
+
+    checkDocumentWrite = false;
+
+    // html 추가
     var dummy = xCreateElement('div');
     xInnerHtml(dummy, widget_code);
+    var obj = dummy.childNodes[0];
 
-    var nodes = dummy.childNodes;
+    if(selectedWidget && selectedWidget.getAttribute("widget")) {
+        selectedWidget.parentNode.insertBefore(obj, selectedWidget);
+        selectedWidget.parentNode.removeChild(selectedWidget);
+    } else {
+        xGetElementById('zonePageContent').appendChild(obj);
+    }
 
-    var zoneObj = xGetElementById('zonePageContent');
+    selectedWidget = null;
 
+    /*
     //zoneObj.style.visibility = 'hidden';
     zoneObj.style.opacity = 0.2;
     zoneObj.style.filter = "alpha(opacity=20)";
 
-
-    if(selectedWidget  && selectedWidget.getAttribute("widget")) {
-        while ( nodes.length ) {
-            if(nodes[0].className == 'widgetClass') zoneObj.parentNode.insertBefore(nodes[0], zoneObj);
-            else selectedWidget.parentNode.insertBefore(nodes[0], selectedWidget);
-        }
-        selectedWidget.parentNode.removeChild(selectedWidget);
-    } else {
-        while ( nodes.length ) {
-            if(nodes[0].className == 'widgetClass') zoneObj.parentNode.insertBefore(nodes[0], zoneObj);
-            else zoneObj.appendChild(nodes[0]);
-        }
-    }
-
     // 위젯 추가후 페이지 리로딩
     var tpl = getWidgetContent();
 
@@ -375,6 +421,7 @@ function doAddWidgetCode(widget_code) {
     fo_obj.content.value = tpl;
     fo_obj.mid.value = current_mid;
     fo_obj.submit();
+    */
 }
 
 // 클릭 이벤트시 위젯의 수정/제거/이벤트 무효화 처리

modules/widget/tpl/js/widget_admin.js

@@ -75,6 +75,15 @@ function getWidgetVars() {
     if(!opener || !opener.selectedWidget || !opener.selectedWidget.getAttribute("widget")) return;
     selected_node = opener.selectedWidget;
 
+    if(!xGetElementById('fo_widget').widgetstyle.value) {
+        xGetElementById('fo_widget').widgetstyle.value = selected_node.getAttribute('widgetstyle');
+    }
+
+    doFillWidgetVars();
+    /*
+    if(!opener || !opener.selectedWidget || !opener.selectedWidget.getAttribute("widget")) return;
+    selected_node = opener.selectedWidget;
+
     var fo_widget = jQuery('#fo_widget');
     var attrs = selected_node.attributes;
     for (i=0; i< attrs.length ; i++){
@@ -87,13 +96,12 @@ function getWidgetVars() {
             }
         }
     }
+    */
 }
 
 /* 페이지 모듈에서 내용의 위젯을 더블클릭하여 수정하려고 할 경우 */
 function doFillWidgetVars() {
-
     if(!opener || !opener.selectedWidget || !opener.selectedWidget.getAttribute("widget")) return;
-
     selected_node = opener.selectedWidget;
 
     // 스킨과 컬러셋은 기본
@@ -125,6 +133,7 @@ function doFillWidgetVars() {
     for(var j=0;j<obj_list.length;j++) {
         var node = obj_list[j];
         if(node.name.indexOf('_')==0) continue;
+        if(node.name == 'widgetstyle') continue;
 
         var length = node.length;
         var type = node.type;

modules/widget/tpl/widget_style_generate_code_in_page.html

@@ -14,21 +14,24 @@
 </div>
 
 <form action="{getUrl('')}" method="post" enctype="multipart/form-data" target="hidden_iframe" onsubmit="return procFilter(this, style_generate_code_in_page);" id="fo_widget">
+<input type="hidden" name="module_srl" value="{$module_srl}" />
+<input type="hidden" name="widget_sequence" value="" />
+<input type="hidden" name="style" value="" />
+<input type="hidden" name="widget_padding_left" value="" />
+<input type="hidden" name="widget_padding_right" value="" />
+<input type="hidden" name="widget_padding_top" value="" />
+<input type="hidden" name="widget_padding_bottom" value="" />
 <input type="hidden" name="module" value="widget" />
 <input type="hidden" name="act" value="" />
-<input type="hidden" name="module_srl" value="{$module_srl}" />
 <input type="hidden" name="widgetstyle" value="{$widgetstyle}" />
-<input type="hidden" name="widget_sequence" value="" />
 <input type="hidden" name="selected_widget" value="{$selected_widget}" />
-
-
-
 <div id="popBody">
 
     <a href="{getUrl('widgetstyle','none')}" class="widgetStyle"><img src="images/widgetstyle_none.gif" title="{$lang->notuse}" /></a>
+
     <!--@foreach($widgetStyle_list as $key => $widgetStyle)-->
         <!--@if($widgetStyle->preview)-->
-    <a href="{getUrl('widgetstyle',$widgetStyle->widgetStyle)}" class="widgetStyle <!--@if($widgetStyle->widgetStyle==$widgetstyle)-->selected<!--@end-->"><img src="{getUrl()}{$widgetStyle->preview}" title="{$widgetStyle->title}" /></a>
+            <a href="{getUrl('widgetstyle',$widgetStyle->widgetStyle)}" class="widgetStyle <!--@if($widgetStyle->widgetStyle==$widgetstyle)-->selected<!--@end-->"><img src="{getUrl()}{$widgetStyle->preview}" title="{$widgetStyle->title}" /></a>
         <!--@end-->
     <!--@end-->
     <div class="clear"></div>

modules/widget/widget.controller.php

@@ -99,7 +99,7 @@
         function procWidgetGenerateCodeInPage() {
             $widget = Context::get('selected_widget');
             if(!$widget) return new Object(-1,'msg_invalid_request');
-//            if(!Context::get('skin')) return new Object(-1,Context::getLang('msg_widget_skin_is_null'));
+            if(!Context::get('skin')) return new Object(-1,Context::getLang('msg_widget_skin_is_null'));
             $attribute = $this->arrangeWidgetVars($widget, Context::getRequestVars(), $vars);
 
             // 결과물을 구함

modules/wiki/skins/xe_wiki/comment.html

@@ -2,7 +2,6 @@
 <div class="replyBox">
 
     {@ $_comment_list = $oDocument->getComments() }
-    {@ debugPrint($oDocument) }
     <!--@foreach($_comment_list as $key => $comment)-->
 
         <div class="replyItem <!--@if($comment->get('depth'))-->reply<!--@end-->">

modules/wiki/wiki.controller.php

@@ -138,7 +138,6 @@
 
         function procWikiDeleteComment() {
             // check the comment's sequence number 
-            debugPrint('here');
             $comment_srl = Context::get('comment_srl');
             if(!$comment_srl) return $this->doError('msg_invalid_request');
 
@@ -146,7 +145,6 @@
             $oCommentController = &getController('comment');
 
             $output = $oCommentController->deleteComment($comment_srl, $this->grant->manager);
-            debugPrint($output);
             if(!$output->toBool()) return $output;
 
             $this->add('mid', Context::get('mid'));