삭제

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

modules/editor/components/image_link/image_link.class.php

@@ -0,0 +1,85 @@
+<?php
+    /**
+     * @class  image_link
+     * @author zero (zero@nzeo.com)
+     * @brief  이미지를 추가하거나 속성을 수정하는 컴포넌트
+     **/
+
+    class image_link extends EditorHandler { 
+
+        // upload_target_srl 는 에디터에서 필수로 달고 다녀야 함....
+        var $upload_target_srl = 0;
+        var $component_path = '';
+
+        /**
+         * @brief upload_target_srl과 컴포넌트의 경로를 받음
+         **/
+        function image_link($upload_target_srl, $component_path) {
+            $this->upload_target_srl = $upload_target_srl;
+            $this->component_path = $component_path;
+        }
+
+        /**
+         * @brief popup window요청시 popup window에 출력할 내용을 추가하면 된다
+         **/
+        function getPopupContent() {
+            // 템플릿을 미리 컴파일해서 컴파일된 소스를 return
+            $tpl_path = $this->component_path.'tpl';
+            $tpl_file = 'popup.html';
+
+            Context::set("tpl_path", $tpl_path);
+
+            $oTemplate = &TemplateHandler::getInstance();
+            return $oTemplate->compile($tpl_path, $tpl_file);
+        }
+
+        /**
+         * @brief 에디터 컴포넌트가 별도의 고유 코드를 이용한다면 그 코드를 html로 변경하여 주는 method
+         *
+         * 이미지나 멀티미디어, 설문등 고유 코드가 필요한 에디터 컴포넌트는 고유코드를 내용에 추가하고 나서
+         * DocumentModule::transContent() 에서 해당 컴포넌트의 transHtml() method를 호출하여 고유코드를 html로 변경
+         **/
+        function transHTML($xml_obj) {
+            $src = $xml_obj->attrs->src;
+            $width = $xml_obj->attrs->width;
+            $height = $xml_obj->attrs->height;
+            $align = $xml_obj->attrs->align;
+            $alt = $xml_obj->attrs->alt;
+            $border = $xml_obj->attrs->border;
+            $link_url = $xml_obj->attrs->link_url;
+            $open_window = $xml_obj->attrs->open_window;
+
+            if(!$alt) {
+                $tmp_arr = explode('/',$src);
+                $alt = array_pop($tmp_arr);
+            }
+
+            $src = str_replace(array('&','"'), array('&amp;','&qout;'), $src);
+            if(!$alt) $alt = $src;
+
+            $attr_output = array();
+            $style_output = array();
+            $attr_output = array("src=\"".$src."\"");
+            if($alt) {
+                $attr_output[] = "alt=\"".$alt."\"";
+                $attr_output[] = "title=\"".$alt."\"";
+            }
+            if($align) $attr_output[] = "align=\"".$align."\"";
+
+            if(eregi("\.png$",$src)) $attr_output[] = "class=\"iePngFix\"";
+
+            if($width) $style_output[] = "width:".$width."px";
+            if($height) $style_output[] = "height:".$height."px";
+            if(!$align) $style_output[] = "display:block";
+            if($border) $style_output[] = "border:".$border."px";
+            $code = sprintf("<img %s style=\"%s\" />", implode(" ",$attr_output), implode(";",$style_output));
+
+            if($link_url) {
+                if($open_window =='Y') $code = sprintf('<a href="%s" onclick="window.open(this.href);return false;">%s</a>', $link_url, $code);
+                else $code = sprintf('<a href="%s" >%s</a>', $link_url, $code);
+            }
+            return $code;
+        }
+
+    }
+?>

modules/editor/components/image_link/info.xml

@@ -0,0 +1,17 @@
+<?xml version="1.0" encoding="utf-8"?>
+<component version="0.1">
+    <title xml:lang="ko">이미지 추가</title>
+    <title xml:lang="jp">イメージ追加</title>
+    <title xml:lang="zh-CN">插入图像</title>
+    <title xml:lang="en">Add Images</title>
+    <author email_address="zero@zeroboard.com" link="http://www.zeroboard.com" date="2007. 2. 28">
+        <name xml:lang="ko">제로</name>
+        <name xml:lang="jp">Zero</name>
+        <name xml:lang="zh-CN">zero</name>
+        <name xml:lang="en">zero</name>
+        <description xml:lang="ko">에디터에 이미지를 추가하거나 속성을 변경할 수 있습니다.</description>
+        <description xml:lang="jp">エディターにイメージを追加したり、属性を変更したりすることができます。</description>
+        <description xml:lang="zh-CN">可以插入图像或编辑其相应属性。</description>
+        <description xml:lang="en">It can add an image to editor or change the attribution of image.</description>
+    </author>
+</component>

modules/editor/components/image_link/lang/en.lang.php

@@ -0,0 +1,21 @@
+<?php
+    /**
+     * @file   /modules/editor/components/image_link/lang/en.lang.php
+     * @author zero <zero@nzeo.com>
+     * @brief  editor Module > language pack of image_link component
+     **/
+
+    $lang->image_url = "Image Path";
+    $lang->image_alt = "Input Description";
+    $lang->image_scale = "Image Size";
+    $lang->image_align = "Align Style";
+    $lang->image_align_normal = "Occupy a Paragraph";
+    $lang->image_align_left = "Left of Article";
+    $lang->image_align_middle = "Center";
+    $lang->image_align_right = "Right of Article";
+    $lang->image_border = "Border Thickness";
+    $lang->urllink_url = "URL";
+
+    $lang->about_url_link_open_window = "Make the link to open as a new window";
+    $lang->cmd_get_scale = "Get Image Size";
+?>

modules/editor/components/image_link/lang/jp.lang.php

@@ -0,0 +1,23 @@
+<?php
+    /**
+     * @file   /modules/editor/components/image_link/lang/jp.lang.php
+     * @author zero <zero@nzeo.com> 翻訳：RisaPapa
+     * @brief  ウィジウィグエディター（editor）モジュール > イメージリンク（image_link）コンポネント言語パッケージ
+     **/
+
+    $lang->image_url = "イメージパス";
+    $lang->image_alt = "説明（Alt）入力";
+    $lang->image_scale = "イメージサイズ";
+    $lang->image_align = "アライン位置";
+    $lang->image_align_normal = "一段落";
+    $lang->image_align_left = "左揃え";
+    $lang->image_align_middle = "中央揃え";
+    $lang->image_align_right = "右揃え";
+    $lang->image_border = "ボーダー";
+    $lang->urllink_url = "URL";
+
+    $lang->about_url_link_open_window = "チェックするとリンクをクリックした時に、新しいウィンドウで開きます。";
+    $lang->cmd_get_scale = "サイズ表示";
+
+    $lang->cmd_get_scale = "サイズ表示";
+?>

modules/editor/components/image_link/lang/ko.lang.php

@@ -0,0 +1,22 @@
+<?php
+    /**
+     * @file   /modules/editor/components/image_link/lang/ko.lang.php
+     * @author zero <zero@nzeo.com>
+     * @brief  위지윅에디터(editor) 모듈 > 이미지링크(image_link) 컴포넌트의 언어팩
+     **/
+
+    $lang->image_url = "이미지 경로";
+    $lang->image_alt = "설명 입력";
+    $lang->image_scale = "이미지크기";
+    $lang->image_align = "정렬 방법 ";
+    $lang->image_align_normal = "한 문단을 차지";
+    $lang->image_align_left = "글의 왼쪽으로";
+    $lang->image_align_middle = "가운데";
+    $lang->image_align_right = "글의 우측으로";
+    $lang->image_border = "경계선 두께";
+
+    $lang->urllink_open_window = "새창열기";
+    $lang->about_url_link_open_window = "선택하시면 링크 선택시 새창으로 열립니다";
+
+    $lang->cmd_get_scale = "크기 구하기";
+?>

modules/editor/components/image_link/lang/zh-CN.lang.php

@@ -0,0 +1,21 @@
+<?php
+    /**
+     * @file   /modules/editor/components/image_link/lang/zh-CN.lang.php
+     * @author zero <zero@nzeo.com>
+     * @brief  网页编辑器(editor) 模块 > 图像链接(image_link) 组件的语言包
+     **/
+
+    $lang->image_url = "图像路径";
+    $lang->image_alt = "图像说明";
+    $lang->image_scale = "图像大小";
+    $lang->image_align = "对齐方式";
+    $lang->image_align_normal = "占一个段落";
+    $lang->image_align_left = "内容左侧";
+    $lang->image_align_middle = "居中";
+    $lang->image_align_right = "内容右侧";
+    $lang->image_border = "边框粗细";
+    $lang->urllink_url = "URL";
+
+    $lang->about_url_link_open_window = "将在新窗口中打开链接。";
+    $lang->cmd_get_scale = "获得图片大小";
+?>

modules/editor/components/image_link/tpl/popup.css

@@ -0,0 +1,10 @@
+@charset "utf-8";
+@import url(../../../../../../modules/admin/tpl/css/admin.css);
+
+.image_align {
+    margin:0px 0px 5px 0px;
+    float:left;
+    width:200px;
+}
+
+li {list-style:none; float:left; margin-right:.5em;}

modules/editor/components/image_link/tpl/popup.html

@@ -0,0 +1,90 @@
+<!--%import("popup.js")-->
+<!--%import("popup.css")-->
+<!--%import("../lang")-->
+
+<div id="popHeadder">
+    <h1>{$component_info->title} ver. {$component_info->version}</h1>
+</div>
+
+<form action="./" method="get" onSubmit="return false" id="fo">
+
+    <div id="popBody">
+        <table cellspacing="0" class="tableType5">
+        <col width="100" />
+        <col />
+
+        <tr>
+            <th scope="row">{$lang->image_url}</th>
+            <td><input type="text" id="image_url" value="{url_decode($manual_url)}" onblur="getImageScale();" class="inputTypeText w100" /></td>
+        </tr>
+        <tr>
+            <th scope="row">{$lang->image_scale}</th>
+            <td>
+                <ul>
+                    <li><input type="text" id="width" value="0" size="4" class="inputTypeText" onblur="setScale('width');return false;" />px </li>
+                    <li><input type="text" id="height" value="0" size="4" class="inputTypeText" onblur="setScale('height');return false;" />px </li>
+                    <li><a href="#" onclick="getImageScale(); return false;" class="button"><span>{$lang->cmd_get_scale}</span></a></li>
+                </ul>
+            </td>
+        </tr>
+        <tr>
+            <th scope="row">URL</th>
+            <td><input type="text" id="link_url" value="" class="inputTypeText w100"/></td>
+        </tr>
+        <tr>
+            <th scope="row">{$lang->urllink_open_window}</th>
+            <td><input type="checkbox" id="open_window" value="Y" /> {$lang->about_url_link_open_window}</td>
+        </tr>
+        <tr>
+            <th scope="row">{$lang->image_alt}</th>
+            <td><input type="text" id="image_alt" value="" class="inputTypeText w100"/></td>
+        </tr>
+        <tr>
+            <th scope="row">{$lang->image_align}</th>
+            <td>
+                <div class="image_align">
+                    <input type="radio" name="align" value="" id="align_normal" checked="checked"/>
+                    <label for="align_normal">
+                        <img src="./images/align_normal.gif" alt="{$lang->image_align_normal}" />
+                        {$lang->image_align_normal}
+                    </label>
+                </div>
+
+                <div class="image_align">
+                    <input type="radio" name="align" value="left" id="align_left" />
+                    <label for="align_left">
+                        <img src="./images/align_left.gif" alt="{$lang->image_align_left}" />
+                        {$lang->image_align_left}
+                    </label>
+                </div>
+
+                <div class="image_align">
+                    <input type="radio" name="align" value="middle" id="align_middle" />
+                    <label for="align_middle">
+                        <img src="./images/align_middle.gif" alt="{$lang->image_align_middle}" />
+                        {$lang->image_align_middle}
+                    </label>
+                </div>
+
+                <div class="image_align">
+                    <input type="radio" name="align" value="right" id="align_right" />
+                    <label for="align_right">
+                        <img src="./images/align_right.gif" alt="{$lang->image_align_right}" />
+                        {$lang->image_align_right}
+                    </label>
+                </div>
+            </td>
+        </tr>
+        <tr>
+            <th scope="row">{$lang->image_border}</th>
+            <td><input type="text" id="image_border" value="0" size="2" class="inputTypeText" />px</td>
+        </tr>
+        </table>
+    </div>
+    <div id="popFooter" class="tCenter">
+        <a href="#" onclick="insertImage()" class="button"><span>{$lang->cmd_insert}</span></a>
+        <a href="#" onclick="window.close(); return false;" class="button"><span>{$lang->cmd_close}</span></a>
+        <a href="#" onclick="winopen('./?module=editor&amp;act=dispEditorComponentInfo&amp;component_name={$component_info->component_name}','ComponentInfo','left=10,top=10,width=10,height=10,resizable=no,scrollbars=no,toolbars=no');return false;" class="button"><span>{$lang->about_component}</span></a>
+    </div>
+
+</form>

modules/editor/components/image_link/tpl/popup.js

@@ -0,0 +1,135 @@
+/**
+ * popup으로 열렸을 경우 부모창의 위지윅에디터에 select된 이미지가 있는지 체크하여
+ * 있으면 가져와서 원하는 곳에 삽입
+ **/
+
+var orig_width = 0;
+var orig_height = 0;
+function getImage() {
+    // 부모 위지윅 에디터에서 선택된 영역이 있는지 확인
+    if(typeof(opener)=="undefined") return;
+
+    // url이 미리 입력되어 있을 경우 scale구해줌
+    if(xGetElementById("image_url").value) {
+        getImageScale();
+        return;
+    }
+
+    // 부모 위지윅 에디터에서 선택된 영역이 있으면 처리
+    var node = opener.editorPrevNode;
+    if(!node || node.nodeName != "IMG") {
+        return;
+    }
+    var src = node.getAttribute("src");
+    var border = node.getAttribute("border");
+    var align = node.getAttribute("align");
+    var alt = node.getAttribute("alt");
+    var width = node.getAttribute("width");
+    var height = node.getAttribute("height");
+    orig_width = width;
+    orig_height = height;
+    var link_url = node.getAttribute("link_url");
+    var open_window = node.getAttribute("open_window");
+
+    xGetElementById("image_url").value = src;
+    xGetElementById("image_alt").value = alt;
+
+    if(link_url) {
+        link_url = link_url.replace(/<([^>]*)>/ig,'').replace(/&lt;/ig,'<').replace(/&gt;/ig,'>').replace(/&amp;/ig,'&');
+        xGetElementById('link_url').value = link_url;
+    }
+    if(open_window == 'Y') xGetElementById('open_window').checked = "true";
+
+    switch(align) {
+        case 'left' : xGetElementById("align_left").checked = true; break;
+        case 'middle' : xGetElementById("align_middle").checked = true; break;
+        case 'right' : xGetElementById("align_right").checked = true; break;
+        default : xGetElementById("align_normal").checked = true; break;
+    }
+
+    xGetElementById("image_border").value = border;
+
+    xGetElementById("width").value = width;
+    xGetElementById("height").value = height;
+
+}
+
+function getImageScale() {
+    var url = xGetElementById("image_url").value;
+    if(!url) return;
+
+    var img = new Image();
+    img.src = url;
+
+    xGetElementById("width").value = img.width;
+    xGetElementById("height").value = img.height;
+
+    orig_width = img.width;
+    orig_height = img.height;
+}
+function insertImage(obj) {
+    if(typeof(opener)=="undefined") return;
+
+    var link_url = xGetElementById('link_url').value;
+    if(link_url) link_url = link_url.replace(/&/ig,'&amp;').replace(/</ig,'&lt;').replace(/>/ig,'&gt;');
+    var open_window = 'N';
+    if(xGetElementById('open_window').checked) open_window = 'Y';
+
+    var url = xGetElementById("image_url").value;
+    var alt = xGetElementById("image_alt").value;
+    var align = "";
+    if(xGetElementById("align_normal").checked==true) align = "";
+    else if(xGetElementById("align_left").checked==true) align = "left";
+    else if(xGetElementById("align_middle").checked==true) align = "middle";
+    else if(xGetElementById("align_right").checked==true) align = "right";
+    var border = parseInt(xGetElementById("image_border").value,10);
+
+    var width = xGetElementById("width").value;
+    var height = xGetElementById("height").value;
+
+    if(!url) {
+      window.close();
+      return;
+    }
+
+    url = url.replace(request_uri,'');
+    var text = "<img editor_component=\"image_link\" src=\""+url+"\" border=\""+border+"\" ";
+    if(alt) text+= " alt=\""+alt+"\"";
+    if(width) text+= " width=\""+width+"\" ";
+    if(height) text+= " height=\""+height+"\" ";
+    if(link_url) text+= " link_url=\""+link_url+"\" ";
+    if(open_window=='Y') text+= " open_window=\"Y\" ";
+    if(align) text+= " align=\""+align+"\" ";
+    text+= " />";
+
+    opener.editorFocus(opener.editorPrevSrl);
+
+    var iframe_obj = opener.editorGetIFrame(opener.editorPrevSrl)
+
+    opener.editorReplaceHTML(iframe_obj, text);
+    opener.editorFocus(opener.editorPrevSrl);
+
+    window.close();
+}
+
+xAddEventListener(window, "load", getImage);
+
+function setScale(type) {
+    switch(type) {
+        case 'width' :
+                if(!orig_height) return;
+                var n_width = xGetElementById('width').value;
+                var p = n_width/orig_width;
+                var n_height = parseInt(orig_height * p,10);
+                xGetElementById('height').value = n_height;
+            break;
+        case 'height' :
+                if(!orig_width) return;
+                var n_height = xGetElementById('height').value;
+                var p = n_height/orig_height;
+                var n_width = parseInt(orig_width * p,10);
+                xGetElementById('width').value = n_width;
+            break;
+    }
+
+}