Editor ing.

git-svn-id: http://xe-core.googlecode.com/svn/sandbox@4735 201d5d3c-b55e-5fd7-737f-ddc643e51545
This commit is contained in:
ChanMyeong 2008-10-31 18:49:20 +00:00
parent b47437b088
commit 2accecec5d
12 changed files with 937 additions and 723 deletions

View file

@ -7,6 +7,7 @@ body{ background:#fff;}
/* Board Reset */ /* Board Reset */
.board{ font-family:"나눔고딕", NanumGothic, "맑은 고딕", MalgunGothic, AppleGothic, "굴림", Gulim, "돋움", Dotum, Tahoma, Sans-serif; line-height:normal; font-size:.8em;} .board{ font-family:"나눔고딕", NanumGothic, "맑은 고딕", MalgunGothic, AppleGothic, "굴림", Gulim, "돋움", Dotum, Tahoma, Sans-serif; line-height:normal; font-size:.8em;}
.board *{ font-size:1em;} .board *{ font-size:1em;}
.board label{ cursor:pointer;}
.board img{ border:0;} .board img{ border:0;}
.board a{ text-decoration:none; color:#000;} .board a{ text-decoration:none; color:#000;}
.board a:hover, .board a:hover,
@ -211,16 +212,35 @@ body{ background:#fff;}
.replyForm dt{ width:80px; float:left; padding-top:6px; font-weight:bold;} .replyForm dt{ width:80px; float:left; padding-top:6px; font-weight:bold;}
.replyForm dd{ margin-bottom:5px;} .replyForm dd{ margin-bottom:5px;}
.boardWrite{ font-size:.75em;} /* Board Write */
.boardWrite{}
.boardWrite *{ margin:0; padding:0;} .boardWrite *{ margin:0; padding:0;}
.boardWrite li{ list-style:none;} .boardWrite li{ list-style:none;}
.boardWrite fieldset{ border:0; position:relative;} .boardWrite fieldset{ border:0; position:relative;}
.boardWrite legend{ position:absolute; width:0; height:0; overflow:hidden; font:0/0 Sans-serif; visibility:hidden;} .boardWrite legend{ position:absolute; width:0; height:0; overflow:hidden; font:0/0 Sans-serif; visibility:hidden;}
.boardWrite dl:after{ content:""; display:block; float:none; clear:both;}
.boardWrite dt{ float:left; width:50px; margin-right:-50px; font-weight:bold; clear:left; padding-top:6px;} .boardWrite .boardWriteHeader dl{ margin-bottom:5px;}
.boardWrite dd{ margin-left:50px; clear:right;} .boardWrite .boardWriteHeader dl *{ vertical-align:middle; font-family:inherit; font-size:inherit;}
.boardWrite .boardWriteHeader .inputText{ width:96%; border:1px solid #ccc; padding:2px 4px 4px 4px; height:15px; *margin:-1px 0;} .boardWrite .boardWriteHeader dt{ font-weight:bold; display:inline;}
.boardWrite .boardWriteHeader{ margin-bottom:10px;} .boardWrite .boardWriteHeader dd{ display:inline;}
.boardWrite .boardWriteHeader .inputText{ border:1px solid #ccc; padding:2px 4px 4px 4px; height:15px; *margin:-1px 0;}
.boardWrite .boardWriteHeader .userNameAndPw{ margin:0;}
.boardWrite .boardWriteHeader .userNameAndPw dl{ display:inline; white-space:nowrap;}
.boardWrite .boardWriteHeader .userNameAndPw dt{ position:relative; top:-3px;}
.boardWrite .boardWriteHeader .userNameAndPw dd{ margin-right:5px;}
.boardWrite .boardWriteHeader .userNameAndPw dd .inputText{ margin-bottom:5px;}
.boardWrite .boardWriteHeader .userNameAndPw dd.userName .inputText{ width:80px;}
.boardWrite .boardWriteHeader .userNameAndPw dd.userPw .inputText{ width:80px;}
.boardWrite .boardWriteHeader .userNameAndPw dd.emailAddress .inputText{ width:120px;}
.boardWrite .boardWriteHeader .userNameAndPw dd.homePage .inputText{ width:120px;}
.boardWrite .boardWriteHeader dl.title dd{ white-space:nowrap;}
.boardWrite .boardWriteHeader dl.title dd .inputText{ width:60%;}
.boardWrite .boardWriteHeader dl.option input{ width:13px; height:13px;}
.boardWrite .boardWriteHeader dl.option dd{ margin-right:5px; white-space:nowrap;}
.boardWrite .boardWriteBody{ margin-bottom:10px;} .boardWrite .boardWriteBody{ margin-bottom:10px;}
.boardWrite .boardWriteBody dt{ padding-top:30px;} .boardWrite .boardWriteBody dt{ padding-top:30px;}
.boardWrite .boardWriteBody dd{ _zoom:1;} .boardWrite .boardWriteBody dd{ _zoom:1;}

View file

@ -37,7 +37,7 @@
</div> </div>
<div class="buttonRight"> <div class="buttonRight">
<a href="{getUrl('act','dispBoardWrite','document_srl','')}" class="button"><span>{$lang->cmd_write}</span></a> <a href="{getUrl('act','dispBoardWrite','document_srl','')}" class="button green"><span>{$lang->cmd_write}</span></a>
</div> </div>
<!-- 페이지 네비게이션 --> <!-- 페이지 네비게이션 -->

View file

@ -1,9 +1,9 @@
<?xml version="1.0" encoding="UTF-8"?> <?xml version="1.0" encoding="UTF-8"?>
<skin version="0.2"> <skin version="0.2">
<title xml:lang="ko">Zeroboard XE Default Skin.</title> <title xml:lang="ko">Zeroboard XE Default Skin</title>
<title xml:lang="zh-TW">Zeroboard XE 預設面板</title> <title xml:lang="zh-TW">Zeroboard XE 預設面板</title>
<description xml:lang="ko"> <description xml:lang="ko">
Zeroboard XE Default Skin. Zeroboard XE Default Skin
Front-end : Jeong, Chan Myeong (http://naradesign.net/) Front-end : Jeong, Chan Myeong (http://naradesign.net/)
Back-end : Kim, Ye Sol (http://ngleader.com/) Back-end : Kim, Ye Sol (http://ngleader.com/)
</description> </description>

View file

@ -134,12 +134,17 @@
<!-- 목록, 수정/삭제 버튼 --> <!-- 목록, 수정/삭제 버튼 -->
<div class="boardNavigation"> <div class="boardNavigation">
<!--@if($module_info->default_style != 'blog')--> <!--@if($module_info->default_style != 'blog')-->
<a href="{getUrl('document_srl','')}" class="button"><span>{$lang->cmd_list}</span></a> <div class="buttonLeft">
<a href="{getUrl('document_srl','')}" class="button"><span>{$lang->cmd_list}</span></a>
</div>
<!--@end--> <!--@end-->
<!--@if($oDocument->isEditable())--> <!--@if($oDocument->isEditable())-->
<a href="{getUrl('act','dispBoardWrite','document_srl',$oDocument->document_srl,'comment_srl','')}" class="button"><span>{$lang->cmd_modify}</span></a> <div class="buttonRight">
<a href="{getUrl('act','dispBoardDelete','document_srl',$oDocument->document_srl,'comment_srl','')}" class="button"><span>{$lang->cmd_delete}</span></a> <a href="{getUrl('act','dispBoardWrite','document_srl',$oDocument->document_srl,'comment_srl','')}" class="button"><span>{$lang->cmd_modify}</span></a>
<a href="{getUrl('act','dispBoardDelete','document_srl',$oDocument->document_srl,'comment_srl','')}" class="button"><span>{$lang->cmd_delete}</span></a>
</div>
<!--@end--> <!--@end-->
</div> </div>

View file

@ -1,85 +1,97 @@
<!--%import("filter/insert.xml")--> <!--%import("filter/insert.xml")-->
<!--#include("_header.html")--> <!--#include("_header.html")-->
<form action="./" method="post" onsubmit="return procFilter(this, window.insert)" id="fo_write"> <form action="./" method="post" onsubmit="return procFilter(this, window.insert)" id="fo_write" class="boardWrite">
<input type="hidden" name="mid" value="{$mid}" /> <input type="hidden" name="mid" value="{$mid}" />
<input type="hidden" name="content" value="{$oDocument->getContentText()}" /> <input type="hidden" name="content" value="{$oDocument->getContentText()}" />
<input type="hidden" name="document_srl" value="{$document_srl}" /> <input type="hidden" name="document_srl" value="{$document_srl}" />
<div class="boardWrite"> <div class="boardWriteHeader">
<!--@if(!$is_logged)-->
<div class="userNameAndPw"> <!--@if(!$is_logged)-->
<label for="userName">{$lang->writer}</label> <div class="userNameAndPw">
<input type="text" name="nick_name" value="{$oDocument->getNickName()}" class="userName inputTypeText" id="userName"/> <dl>
<dt><label for="userName">{$lang->writer}</label> :</dt>
<label for="userPw">{$lang->password}</label> <dd class="userName"><input type="text" name="nick_name" value="{$oDocument->getNickName()}" class="inputText" id="userName"/></dd>
<input type="password" name="password" value="" id="userPw" class="userPw inputTypeText" /> </dl>
<dl>
<label for="emailAddress">{$lang->email_address}</label> <dt><label for="userPw">{$lang->password}</label> :</dt>
<input type="text" name="email_address" value="{htmlspecialchars($oDocument->get('email_address'))}" id="emailAddress" class="emailAddress inputTypeText"/> <dd class="userPw"><input type="password" name="password" value="" id="userPw" class="inputText" /></dd>
</dl>
<label for="homePage">{$lang->homepage}</label> <dl>
<input type="text" name="homepage" value="{htmlspecialchars($oDocument->get('homepage'))}" id="homePage" class="homePage inputTypeText"/> <dt><label for="emailAddress">{$lang->email_address}</label> :</dt>
</div> <dd class="emailAddress"><input type="text" name="email_address" value="{htmlspecialchars($oDocument->get('email_address'))}" id="emailAddress" class="inputText"/></dd>
<!--@end--> </dl>
<dl>
<div class="title"> <dt><label for="homePage">{$lang->homepage}</label> :</dt>
<!--@if($module_info->use_category=="Y")--> <dd class="homePage"><input type="text" name="homepage" value="{htmlspecialchars($oDocument->get('homepage'))}" id="homePage" class="inputText"/></dd>
<select name="category_srl" class="category"> </dl>
<option value="">{$lang->category}</option> </div>
<!--@foreach($category_list as $val)--> <!--@end-->
<option <!--@if(!$val->grant)-->disabled="disabled"<!--@endif--> value="{$val->category_srl}" <!--@if($val->grant&&$val->selected||$val->category_srl==$oDocument->get('category_srl'))-->selected="selected"<!--@endif-->>
{str_repeat("&nbsp;&nbsp;",$val->depth)} {$val->title} ({$val->document_count}) <dl class="title">
</option> <dt>제목 : </dt>
<!--@endforeach--> <dd>
</select> <!--@if($module_info->use_category=="Y")-->
<!--@else--> <select name="category_srl" class="category">
<label class="title">{$lang->title}</label> <option value="">{$lang->category}</option>
<!--@endif--> <!--@foreach($category_list as $val)-->
<input type="text" name="title" class="title inputTypeText" value="{htmlspecialchars($oDocument->getTitleText())}" /> <option <!--@if(!$val->grant)-->disabled="disabled"<!--@endif--> value="{$val->category_srl}" <!--@if($val->grant&&$val->selected||$val->category_srl==$oDocument->get('category_srl'))-->selected="selected"<!--@endif-->>
</div> {str_repeat("&nbsp;&nbsp;",$val->depth)} {$val->title} ({$val->document_count})
</option>
<dl class="option"> <!--@endforeach-->
<!--@if($grant->manager)--> </select>
{@ $_color = array('555555','222288','226622','2266EE','8866CC','88AA66','EE2222','EE6622','EEAA22','EEEE22') } <!--@else-->
<dd><select name="title_color" id="title_color" <!--@if($oDocument->get('title_color'))-->style="background-color:#{$oDocument->get('title_color')};"<!--@end--> onchange="this.style.backgroundColor=this.options[this.selectedIndex].style.backgroundColor;"> <label class="title">{$lang->title}</label>
<option value="" style="background-color:#FFFFFF;">{$lang->title_color}</option> <!--@endif-->
<!--@foreach($_color as $_col)--> <input type="text" name="title" class="inputText" value="{htmlspecialchars($oDocument->getTitleText())}" />
<option value="{$_col}" style="background-color:#{$_col}" <!--@if($oDocument->get('title_color')==$_col)-->selected="selected"<!--@end-->>{$lang->title_color}</option> </dd>
<!--@endforeach--> </dl>
</select></dd>
<dd> <dl class="option">
<input type="checkbox" name="title_bold" id="title_bold" value="Y" <!--@if($oDocument->get('title_bold')=='Y')-->checked="checked"<!--@end--> /> <dt>옵션 : </dt>
<label for="title_bold">{$lang->title_bold}</label> <!--@if($grant->manager)-->
</dd> {@ $_color = array('555555','222288','226622','2266EE','8866CC','88AA66','EE2222','EE6622','EEAA22','EEEE22') }
<dd> <dd><select name="title_color" id="title_color" <!--@if($oDocument->get('title_color'))-->style="background-color:#{$oDocument->get('title_color')};"<!--@end--> onchange="this.style.backgroundColor=this.options[this.selectedIndex].style.backgroundColor;">
<input type="checkbox" name="is_notice" value="Y" <!--@if($oDocument->isNotice())-->checked="checked"<!--@end--> id="is_notice" /> <option value="" style="background-color:#FFFFFF;">{$lang->title_color}</option>
<label for="is_notice">{$lang->notice}</label> <!--@foreach($_color as $_col)-->
</dd> <option value="{$_col}" style="background-color:#{$_col}" <!--@if($oDocument->get('title_color')==$_col)-->selected="selected"<!--@end-->>{$lang->title_color}</option>
<dd> <!--@endforeach-->
<input type="checkbox" name="lock_comment" value="Y" <!--@if($oDocument->isLocked())-->checked="checked"<!--@end--> id="lock_comment" /> </select></dd>
<label for="lock_comment">{$lang->lock_comment}</label> <dd>
</dd> <input type="checkbox" name="title_bold" id="title_bold" value="Y" <!--@if($oDocument->get('title_bold')=='Y')-->checked="checked"<!--@end--> />
<!--@endif--> <label for="title_bold">{$lang->title_bold}</label>
<dd> </dd>
<input type="checkbox" name="is_secret" value="Y" <!--@if($oDocument->isSecret())-->checked="checked"<!--@end--> id="is_secret" /> <dd>
<label for="is_secret">{$lang->secret}</label> <input type="checkbox" name="is_notice" value="Y" <!--@if($oDocument->isNotice())-->checked="checked"<!--@end--> id="is_notice" />
</dd> <label for="is_notice">{$lang->notice}</label>
<dd> </dd>
<input type="checkbox" name="allow_comment" value="Y" <!--@if($oDocument->allowComment())-->checked="checked"<!--@end--> id="allow_comment" /> <dd>
<label for="allow_comment">{$lang->allow_comment}</label> <input type="checkbox" name="lock_comment" value="Y" <!--@if($oDocument->isLocked())-->checked="checked"<!--@end--> id="lock_comment" />
</dd> <label for="lock_comment">{$lang->lock_comment}</label>
<dd> </dd>
<input type="checkbox" name="allow_trackback" value="Y" <!--@if($oDocument->allowTrackback())-->checked="checked"<!--@end--> id="allow_trackback" /> <!--@endif-->
<label for="allow_trackback">{$lang->allow_trackback}</label> <dd>
</dd> <input type="checkbox" name="is_secret" value="Y" <!--@if($oDocument->isSecret())-->checked="checked"<!--@end--> id="is_secret" />
<!--@if($is_logged)--> <label for="is_secret">{$lang->secret}</label>
<dd> </dd>
<input type="checkbox" name="notify_message" value="Y" <!--@if($oDocument->useNotify())-->checked="checked"<!--@end--> id="notify_message" /> <dd>
<label for="notify_message">{$lang->notify}</label> <input type="checkbox" name="allow_comment" value="Y" <!--@if($oDocument->allowComment())-->checked="checked"<!--@end--> id="allow_comment" />
</dd> <label for="allow_comment">{$lang->allow_comment}</label>
<!--@end--> </dd>
</dl> <dd>
<input type="checkbox" name="allow_trackback" value="Y" <!--@if($oDocument->allowTrackback())-->checked="checked"<!--@end--> id="allow_trackback" />
<label for="allow_trackback">{$lang->allow_trackback}</label>
</dd>
<!--@if($is_logged)-->
<dd>
<input type="checkbox" name="notify_message" value="Y" <!--@if($oDocument->useNotify())-->checked="checked"<!--@end--> id="notify_message" />
<label for="notify_message">{$lang->notify}</label>
</dd>
<!--@end-->
</dl>
</div>
<!--@if($module_info->extra_vars)--> <!--@if($module_info->extra_vars)-->
<table cellspacing="0" summary="" class="extraVarsList"> <table cellspacing="0" summary="" class="extraVarsList">
@ -102,21 +114,23 @@
<input type="text" name="tags" value="{htmlspecialchars($oDocument->get('tags'))}" class="inputTypeText" /> <input type="text" name="tags" value="{htmlspecialchars($oDocument->get('tags'))}" class="inputTypeText" />
<p class="info">{$lang->about_tag}</p> <p class="info">{$lang->about_tag}</p>
</div> </div>
</div>
<div class="boardNavigation">
<div class="fl gap1"> <div class="buttonLeft">
<!--@if($is_logged)--> <!--@if($is_logged)-->
<span class="button"><input type="button" value="{$lang->cmd_temp_save}" onclick="doDocumentSave(this); return false;" /></span> <span class="button"><input type="button" value="{$lang->cmd_temp_save}" onclick="doDocumentSave(this); return false;" /></span>
<span class="button"><input type="button" value="{$lang->cmd_load}" onclick="doDocumentLoad(this); return false;" /></span> <span class="button"><input type="button" value="{$lang->cmd_load}" onclick="doDocumentLoad(this); return false;" /></span>
<!--@end--> <!--@end-->
</div> </div>
<div class="fr gap1"> <div class="buttonRight">
<span class="button"><input type="button" value="{$lang->cmd_back}" onclick="location.href='{getUrl('act','')}'" /></span> <span class="button"><input type="button" value="{$lang->cmd_back}" onclick="location.href='{getUrl('act','')}'" /></span>
<span class="button"><input type="button" value="{$lang->cmd_preview}" onclick="doDocumentPreview(this); return false;" /></span> <span class="button"><input type="button" value="{$lang->cmd_preview}" onclick="doDocumentPreview(this); return false;" /></span>
<span class="button"><input type="submit" value="{$lang->cmd_registration}" accesskey="s" /></span> <span class="button black"><input type="submit" value="{$lang->cmd_registration}" accesskey="s" /></span>
</div> </div>
</div>
<div class="clear"></div>
</form> </form>
<!--#include("_footer.html")--> <!--#include("_footer.html")-->

View file

@ -1,52 +1,207 @@
@charset "utf-8"; @charset "utf-8";
.xeEditor { } .xeEditor{}
.xeEditor .optionABC { clear:both; width:100%; overflow:hidden; background:transparent;}
.xeEditor .optionABC .selectGroup { white-space:nowrap; display:block; height:21px; margin:0 .5em 0 0; padding-left:1em; float:left;} .editorTypeSelector{ position:relative; right:3px; z-index:10; float:right; clear:both; *zoom:1; margin-bottom:-2px !important;}
.xeEditor .optionABC .buttonGroup { white-space:nowrap; position:relative; display:block; margin:0 .5em 0 0; float:left; height:21px; overflow:hidden; padding-left:2px;} .editorTypeSelector:after{ content:""; display:block; clear:both;}
.xeEditor .optionABC .buttonGroup img { float:left; display:block; margin-left:-1px; cursor:pointer;} .editorTypeSelector li,
.xeEditor .optionA, .editorTypeSelector a{ display:block; float:left; position:relative; background-image:url(../images/tabEditorSelector.gif); background-repeat:no-repeat;}
.xeEditor .optionB, .editorTypeSelector li{ background-position:left top; margin-right:5px;}
.xeEditor .optionC { float:left; background:transparent; padding:.5em 0 .5em .7em; overflow:hidden;} .editorTypeSelector li a{ padding:3px 10px 0 10px; height:21px; left:3px; background-position:right top; text-decoration:none !important; white-space:nowrap;}
.xeEditor .optionA *, .editorTypeSelector li.active{ background-position:left -24px;}
.xeEditor .optionB *, .editorTypeSelector li.active a{ background-position:right -24px; font-weight:bold; height:23px;}
.xeEditor .optionC * { vertical-align:middle;}
.xeEditor .optionA { background-position:-3px bottom; padding-left:0;} .editorList{ clear:both; position:relative; z-index:1; border-top:1px solid #ddd; *zoom:1}
.xeEditor .optionA select option { font-size:.9em; } .editorList .editorItem{ display:none;}
.xeEditor .optionDE { width:100%; clear:both; overflow:hidden; background:transparent;height:29px;} .editorList.xe #xeEditor,
.xeEditor .optionDE .buttonGroup { white-space:nowrap; position:relative; display:block; float:left; height:21px; overflow:hidden; padding-left:2px;} .editorList.text #textEditor,
.xeEditor .optionDE img { float:left; display:block; margin-right:.5em; cursor:pointer;} .editorList.html #htmlEditor{ display:block;}
.xeEditor .optionD { padding:.5em 0 .5em .8em; overflow:hidden; float:left; border-right:1px solid #e0e0e0;}
.xeEditor .optionE { padding:4px 0 0 9px; overflow:hidden; float:left;} .toolBox{ padding:5px 10px 8px 10px !important; background:#fafafa url(../images/buttonSetBg.gif) repeat-x left bottom; *zoom:1;}
.toolBox:after{ content:""; display:block; clear:both;}
.xeEditor .editorInfo { background:transparent; padding:.5em; border:1px solid #e1e1dd; color:#999999; position:relative; margin:5px 10px 0 10px;} .toolBox .toolA{ position:relative; float:left; clear:both; *margin-bottom:5px;}
.xeEditor .close { cursor:pointer; position:absolute; top:3px; right:3px; _top:3px; _right:15px;} .toolBox .toolA ul{ float:left; margin:0 5px 5px 0;}
.xeEditor .editor_iframe_box { clear:both; border:1px solid; border-color:#a6a6a6 #d8d8d8 #d8d8d8 #a6a6a6; padding:0; margin:3px 10px 5px 10px; } .toolBox .toolA li{ float:left; font-size:0; line-height:0;}
.xeEditor .editor_iframe_textarea { background:#ffffff; clear:both; border:1px solid; border-color:#a6a6a6 #d8d8d8 #d8d8d8 #a6a6a6; margin:5px 10px 0 10px; width:100%; font-size:1em; display:none;} .toolBox .toolA button{ border:0; width:21px; height:21px; background-color:#fff; background-image:url(../images/buttonSet.gif); background-position:no-repeat; cursor:pointer;}
.toolBox .toolA span{ position:relative; z-index:-1;}
.xeEditor .textAreaDragIndicator { text-align:center; background:url(../images/lineTextAreaDrag.gif) repeat-x left center; padding:5px 0 5px 0; }
.xeEditor .textAreaDragIndicatorBar { background:url(../images/buttonTextAreaDrag.gif) no-repeat center; cursor:move;height:14px;} .toolBox .toolB{ clear:both; position:relative; left:-5px; overflow:hidden;}
.toolBox .toolB li{ position:relative; left:-1px; display:inline; padding-left:3px; background:url(../images/lineV11.gif) no-repeat left center; *zoom:1;}
.xeEditor .editor_info { clear:both; padding:5px 10px 0 10px; overflow:hidden;} .toolBox .toolB li button{ background:none; border:none; height:21px; *margin:0 -5px; cursor:pointer; font:11px Dotum, Tahoma; letter-spacing:-1px; display:inline; padding:0 !important;}
.xeEditor .editor_info .editor_option { float:left; color:#888888; }
.xeEditor .editor_info .editor_autosaved_message { display:none; color:#888888; float:right; } /* ToolBox Button Default */
.toolBox .do{ width:43px;}
.xeEditor .inputTypeTextArea { background:#fbfbfb; padding:1em; width:94%;} .toolBox .undo button{ width:22px;}
.toolBox .redo button{ background-position:-22px 0;}
.xeEditor .fileAttach { border:none; table-layout:fixed; margin:0 10px 0 10px; }
.toolBox .type *{ font-size:12px; line-height:100%;}
.xeEditor .fileAttach .preview { padding:5px; border:1px solid #e1e1dd; width:100px; height:100px; margin-right:10px;} .toolBox .type select{ height:21px;}
.xeEditor .fileAttach .preview img { width:100px; height:100px; } .toolBox .type .hx{}
.toolBox .type .size .px10{ font-size:10px;}
.xeEditor .fileAttach .fileListArea .fileList { background:transparent; overflow:auto; width:100%; height:auto; border:1px solid; border-color:#a6a6a6 #d8d8d8 #d8d8d8 #a6a6a6; margin-bottom:10px; font-size:11px;} .toolBox .type .size .px13{ font-size:13px;}
.xeEditor .fileAttach .fileListArea .fileList option { line-height:100%; padding-left:.5em;} .toolBox .type .size .px16{ font-size:16px;}
.xeEditor .fileAttach .fileUploadControl { float:left; } .toolBox .type .size .px18{ font-size:18px;}
.xeEditor .fileAttach .file_attach_info { color:#AAAAAA; font-size:.9em; _font-size:8pt; text-align:right;} .toolBox .type .size .px24{ font-size:24px;}
*:first-child+html .xeEditor .fileAttach .file_attach_info { font-size:8pt; } .toolBox .type .size .px32{ font-size:32px;}
.toolBox .type .size .px48{ font-size:48px;}
.xeEditor .fileAttach .fileUploadControl .uploaderButton { display:block; cursor:pointer; background:url(../images/buttonTypeBCenter.gif) repeat-x left center; line-height:100%; overflow:visible; color:#3f4040; margin:0 1px; font-size:.9em; white-space:nowrap;} .toolBox .type .family{}
.xeEditor .fileAttach .fileUploadControl .uploaderButton:hover { text-decoration:none;}
.xeEditor .fileAttach .fileUploadControl .uploaderButton img { vertical-align:middle;} .toolBox .style{ width:214px;}
.xeEditor .fileAttach .fileUploadControl .uploaderButton .leftCap { width:2px; height:21px; background:url(../images/buttonTypeBLeft.gif) no-repeat; margin:0 .3em 0 0; position:relative; left:-1px;} .toolBox .bold button{ width:22px; background-position:-43px 0;}
.xeEditor .fileAttach .fileUploadControl .uploaderButton .rightCap { width:2px; height:21px; background:url(../images/buttonTypeBRight.gif) no-repeat; margin:0 -1px 0 .4em;} .toolBox .underline button{ background-position:-65px 0;}
.xeEditor .fileAttach .fileUploadControl .uploaderButton .icon { margin:0 .2em;} .toolBox .italic button{ background-position:-86px 0;}
.toolBox .strike button{ background-position:-107px 0;}
.toolBox .sup button{ background-position:-128px 0;}
.toolBox .sub button{ background-position:-149px 0;}
.toolBox .txColor button{ background-position:-170px 0;}
.toolBox .bgColor button{ background-position:-191px 0;}
.toolBox .styleRemover button{ width:45px; background-position:-212px 0;}
.toolBox .paragraph{ width:169px;}
.toolBox .alignLeft button{ width:22px; background-position:-257px 0;}
.toolBox .alignCenter button{ background-position:-279px 0;}
.toolBox .alignRight button{ background-position:-300px 0;}
.toolBox .alignJustify button{ background-position:-321px 0;}
.toolBox .orderedList button{background-position:-342px 0;}
.toolBox .unorderedList button{ background-position:-363px 0;}
.toolBox .outdent button{ background-position:-384px 0;}
.toolBox .indent button{ background-position:-405px 0;}
.toolBox .extension{ width:132px;}
.toolBox .url button{ width:27px; background-position:-426px 0;}
.toolBox .blockquote button{ background-position:-453px 0;}
.toolBox .table button{ background-position:-474px 0;}
.toolBox .image button{ background-position:-495px 0;}
.toolBox .movie button{ background-position:-516px 0;}
.toolBox .emoticon button{ background-position:-537px 0;}
/* ToolBox Button Hover & Focus & Active */
.toolBox .undo button:hover,
.toolBox .undo button:focus{ background-position:0 -21px;}
.toolBox .undo button:active{ background-position:0 -42px;}
.toolBox .redo button:hover,
.toolBox .redo button:focus{ background-position:-22px -21px;}
.toolBox .redo button:active{ background-position:-22px -42px;}
.toolBox .bold button:hover,
.toolBox .bold button:focus{ background-position:-43px -21px;}
.toolBox .bold button:active{ background-position:-43px -42px;}
.toolBox .underline button:hover,
.toolBox .underline button:focus{ background-position:-65px -21px;}
.toolBox .underline button:active{ background-position:-65px -42px;}
.toolBox .italic button:hover,
.toolBox .italic button:focus{ background-position:-86px -21px;}
.toolBox .italic button:active{ background-position:-86px -42px;}
.toolBox .strike button:hover,
.toolBox .strike button:focus{ background-position:-107px -21px;}
.toolBox .strike button:active{ background-position:-107px -42px;}
.toolBox .sup button:hover,
.toolBox .sup button:focus{ background-position:-128px -21px;}
.toolBox .sup button:active{ background-position:-128px -42px;}
.toolBox .sub button:hover,
.toolBox .sub button:focus{ background-position:-149px -21px;}
.toolBox .sub button:active{ background-position:-149px -42px;}
.toolBox .txColor button:hover,
.toolBox .txColor button:focus{ background-position:-170px -21px;}
.toolBox .txColor button:active{ background-position:-170px -42px;}
.toolBox .bgColor button:hover,
.toolBox .bgColor button:focus{ background-position:-191px -21px;}
.toolBox .bgColor button:active{ background-position:-191px -42px;}
.toolBox .styleRemover button:hover,
.toolBox .styleRemover button:focus{ background-position:-212px -21px;}
.toolBox .styleRemover button:active{ background-position:-212px -42px;}
.toolBox .alignLeft button:hover,
.toolBox .alignLeft button:focus{ background-position:-257px -21px;}
.toolBox .alignLeft button:active{ background-position:-257px -42px;}
.toolBox .alignCenter button:hover,
.toolBox .alignCenter button:focus{ background-position:-279px -21px;}
.toolBox .alignCenter button:active{ background-position:-279px -42px;}
.toolBox .alignRight button:hover,
.toolBox .alignRight button:focus{ background-position:-300px -21px;}
.toolBox .alignRight button:active{ background-position:-300px -42px;}
.toolBox .alignJustify button:hover,
.toolBox .alignJustify button:focus{ background-position:-321px -21px;}
.toolBox .alignJustify button:active{ background-position:-321px -42px;}
.toolBox .orderedList button:hover,
.toolBox .orderedList button:focus{background-position:-342px -21px;}
.toolBox .orderedList button:active{background-position:-342px -42px;}
.toolBox .unorderedList button:hover,
.toolBox .unorderedList button:focus{ background-position:-363px -21px;}
.toolBox .unorderedList button:active{ background-position:-363px -42px;}
.toolBox .outdent button:hover,
.toolBox .outdent button:focus{ background-position:-384px -21px;}
.toolBox .outdent button:active{ background-position:-384px -42px;}
.toolBox .indent button:hover,
.toolBox .indent button:focus{ background-position:-405px -21px;}
.toolBox .indent button:active{ background-position:-405px -42px;}
.toolBox .url button:hover,
.toolBox .url button:focus{ background-position:-426px -21px;}
.toolBox .url button:active{ background-position:-426px -42px;}
.toolBox .blockquote button:hover,
.toolBox .blockquote button:focus{ background-position:-453px -21px;}
.toolBox .blockquote button:active{ background-position:-453px -42px;}
.toolBox .table button:hover,
.toolBox .table button:focus{ background-position:-474px -21px;}
.toolBox .table button:active{ background-position:-474px -42px;}
.toolBox .image button:hover,
.toolBox .image button:focus{ background-position:-495px -21px;}
.toolBox .image button:active{ background-position:-495px -42px;}
.toolBox .movie button:hover,
.toolBox .movie button:focus{ background-position:-516px -21px;}
.toolBox .movie button:active{ background-position:-516px -42px;}
.toolBox .emoticon button:hover,
.toolBox .emoticon button:focus{ background-position:-537px -21px;}
.toolBox .emoticon button:active{ background-position:-537px -42px;}
/* .xeEditor { }
.xeEditor .optionABC { clear:both; width:100%; overflow:hidden; background:transparent;}
.xeEditor .optionABC .selectGroup { white-space:nowrap; display:block; height:21px; margin:0 .5em 0 0; padding-left:1em; float:left;}
.xeEditor .optionABC .buttonGroup { white-space:nowrap; position:relative; display:block; margin:0 .5em 0 0; float:left; height:21px; overflow:hidden; padding-left:2px;}
.xeEditor .optionABC .buttonGroup img { float:left; display:block; margin-left:-1px; cursor:pointer;}
.xeEditor .optionA,
.xeEditor .optionB,
.xeEditor .optionC { float:left; background:transparent; padding:.5em 0 .5em .7em; overflow:hidden;}
.xeEditor .optionA *,
.xeEditor .optionB *,
.xeEditor .optionC * { vertical-align:middle;}
.xeEditor .optionA { background-position:-3px bottom; padding-left:0;}
.xeEditor .optionA select option { font-size:.9em; }
.xeEditor .optionDE { width:100%; clear:both; overflow:hidden; background:transparent;height:29px;}
.xeEditor .optionDE .buttonGroup { white-space:nowrap; position:relative; display:block; float:left; height:21px; overflow:hidden; padding-left:2px;}
.xeEditor .optionDE img { float:left; display:block; margin-right:.5em; cursor:pointer;}
.xeEditor .optionD { padding:.5em 0 .5em .8em; overflow:hidden; float:left; border-right:1px solid #e0e0e0;}
.xeEditor .optionE { padding:4px 0 0 9px; overflow:hidden; float:left;}
.xeEditor .editorInfo { background:transparent; padding:.5em; border:1px solid #e1e1dd; color:#999999; position:relative; margin:5px 10px 0 10px;}
.xeEditor .close { cursor:pointer; position:absolute; top:3px; right:3px; _top:3px; _right:15px;}
.xeEditor .editor_iframe_box { clear:both; border:1px solid; border-color:#a6a6a6 #d8d8d8 #d8d8d8 #a6a6a6; padding:0; margin:3px 10px 5px 10px; }
.xeEditor .editor_iframe_textarea { background:#ffffff; clear:both; border:1px solid; border-color:#a6a6a6 #d8d8d8 #d8d8d8 #a6a6a6; margin:5px 10px 0 10px; width:100%; font-size:1em; display:none;}
.xeEditor .textAreaDragIndicator { text-align:center; background:url(../images/lineTextAreaDrag.gif) repeat-x left center; padding:5px 0 5px 0; }
.xeEditor .textAreaDragIndicatorBar { background:url(../images/buttonTextAreaDrag.gif) no-repeat center; cursor:move;height:14px;}
.xeEditor .editor_info { clear:both; padding:5px 10px 0 10px; overflow:hidden;}
.xeEditor .editor_info .editor_option { float:left; color:#888888; }
.xeEditor .editor_info .editor_autosaved_message { display:none; color:#888888; float:right; }
.xeEditor .inputTypeTextArea { background:#fbfbfb; padding:1em; width:94%;}
.xeEditor .fileAttach { border:none; table-layout:fixed; margin:0 10px 0 10px; }
.xeEditor .fileAttach .preview { padding:5px; border:1px solid #e1e1dd; width:100px; height:100px; margin-right:10px;}
.xeEditor .fileAttach .preview img { width:100px; height:100px; }
.xeEditor .fileAttach .fileListArea .fileList { background:transparent; overflow:auto; width:100%; height:auto; border:1px solid; border-color:#a6a6a6 #d8d8d8 #d8d8d8 #a6a6a6; margin-bottom:10px; font-size:11px;}
.xeEditor .fileAttach .fileListArea .fileList option { line-height:100%; padding-left:.5em;}
.xeEditor .fileAttach .fileUploadControl { float:left; }
.xeEditor .fileAttach .file_attach_info { color:#AAAAAA; font-size:.9em; _font-size:8pt; text-align:right;}
*:first-child+html .xeEditor .fileAttach .file_attach_info { font-size:8pt; }
.xeEditor .fileAttach .fileUploadControl .uploaderButton { display:block; cursor:pointer; background:url(../images/buttonTypeBCenter.gif) repeat-x left center; line-height:100%; overflow:visible; color:#3f4040; margin:0 1px; font-size:.9em; white-space:nowrap;}
.xeEditor .fileAttach .fileUploadControl .uploaderButton:hover { text-decoration:none;}
.xeEditor .fileAttach .fileUploadControl .uploaderButton img { vertical-align:middle;}
.xeEditor .fileAttach .fileUploadControl .uploaderButton .leftCap { width:2px; height:21px; background:url(../images/buttonTypeBLeft.gif) no-repeat; margin:0 .3em 0 0; position:relative; left:-1px;}
.xeEditor .fileAttach .fileUploadControl .uploaderButton .rightCap { width:2px; height:21px; background:url(../images/buttonTypeBRight.gif) no-repeat; margin:0 -1px 0 .4em;}
.xeEditor .fileAttach .fileUploadControl .uploaderButton .icon { margin:0 .2em;} */

View file

@ -1,195 +1,215 @@
<!--// 스킨 css 로드 --> <!--// 스킨 css 로드 -->
<!--%import("css/editor.css")--> <!--%import("css/editor.css")-->
<!--// 기본 js/언어파일 로드 --> <!--// 기본 js/언어파일 로드 -->
<!--%import("../../tpl/js/editor_common.js")--> <!--%import("../../tpl/js/editor_common.js")-->
<!--%import("../../tpl/js/editor.js")--> <!--%import("../../tpl/js/editor.js")-->
<!-- 자동저장용 폼 --> <!-- 자동저장용 폼 -->
<!--@if($enable_autosave)--> <!--@if($enable_autosave)-->
<input type="hidden" name="_saved_doc_title" value="{htmlspecialchars($saved_doc->title)}" /> <input type="hidden" name="_saved_doc_title" value="{htmlspecialchars($saved_doc->title)}" />
<input type="hidden" name="_saved_doc_content" value="{htmlspecialchars($saved_doc->content)}" /> <input type="hidden" name="_saved_doc_content" value="{htmlspecialchars($saved_doc->content)}" />
<input type="hidden" name="_saved_doc_message" value="{$lang->msg_load_saved_doc}" /> <input type="hidden" name="_saved_doc_message" value="{$lang->msg_load_saved_doc}" />
<!--@end--> <!--@end-->
<!-- 에디터 --> <ul class="editorTypeSelector">
<div class="xeEditor"> <li class="active"><a href="#xeEditor" onclick="return false"><span>스타일 편집기</span></a></li>
<li><a href="#textEditor" onclick="return false"><span>텍스트 편집기</span></a></li>
<div id="xeEditorOption_{$editor_sequence}">
<!-- HTML 모드 사용 -->
<!--@if($enable_default_component)--> <!--@if($html_mode)-->
<!-- 기본 컴포넌트 출력 --> <!--@if($html_mode)-->
<div class="optionABC"> <li><a href="#htmlEditor" id="use_html_{$editor_sequence}" onclick="editorChangeMode(this, '{$editor_sequence}')"><span>HTML 편집기</span></a></li>
<div class="optionA"> <!--@end-->
<div class="selectGroup"> <!--@end-->
<select onchange="editorChangeFontName(this,'{$editor_sequence}')" id="editor_font_{$editor_sequence}"> </ul>
<option value="">{$lang->edit->fontname}</option>
<!--@foreach($lang->edit->fontlist as $key=>$obj)--> <!-- 에디터 -->
<option style="font-family:{$obj}" value="{$obj}">{$obj}</option> <div class="editorList xe">
<!--@end--> <!-- class="editorList xe" | class="editorList text" | class="editorList html" -->
</select>
<div id="xeEditor" class="editorItem">
<select onchange="editorChangeFontSize(this,'{$editor_sequence}')" id="editor_fontsize_{$editor_sequence}">
<option value="" selected="selected">{$lang->edit->fontsize}</option> <div id="xeEditorOption_{$editor_sequence}" class="toolBox">
<option value="1">8pt</option>
<option value="2">10pt</option> <!--@if($enable_default_component)-->
<option value="3">12pt</option> <!-- 기본 컴포넌트 출력 -->
<option value="4">14pt</option> <div class="toolA">
<option value="5">18pt</option>
<option value="6">24pt</option> <ul class="do">
<option value="7">36pt</option> <li class="undo"><button type="button" title="Ctrl+Z:Un Do"><span>Un Do</span></button></li>
</select> <li class="redo"><button type="button" title="Ctrl+Y:Re Do"><span>Re Do</span></button></li>
</ul>
<select onchange="editorChangeHeader(this,'{$editor_sequence}')" id="editor_header_{$editor_sequence}">
<option value="">{$lang->edit->header}</option> <ul class="type">
<!--@foreach($lang->edit->header_list as $key=>$obj)--> <li class="hx">
<option value="{$key}">{$obj}</option> <select onchange="editorChangeHeader(this,'{$editor_sequence}')" id="editor_header_{$editor_sequence}">
<!--@end--> <option value="">{$lang->edit->header}</option>
</select> <!--@foreach($lang->edit->header_list as $key=>$obj)-->
</div> <option value="{$key}">{$obj}</option>
<!--@end-->
<div class="buttonGroup"> </select>
<img src="./images/editor_btn_b.gif" width="23" height="63" title="{$lang->edit->help_bold}" alt="{$lang->edit->help_bold}" id="component_{$editor_sequence}_Bold" onmouseover="eOptionOver(this)" onmouseout="eOptionOut(this)" /> </li>
<img src="./images/editor_btn_i.gif" width="23" height="63" title="{$lang->edit->help_italic}" alt="{$lang->edit->help_italic}" id="component_{$editor_sequence}_Italic" onmouseover="eOptionOver(this)" onmouseout="eOptionOut(this)" /> <li class="size">
<img src="./images/editor_btn_u.gif" width="23" height="63" title="{$lang->edit->help_underline}" alt="{$lang->edit->help_underline}" id="component_{$editor_sequence}_Underline" onmouseover="eOptionOver(this)" onmouseout="eOptionOut(this)" /> <select onchange="editorChangeFontSize(this,'{$editor_sequence}')" id="editor_fontsize_{$editor_sequence}">
<img src="./images/editor_btn_strikethrough.gif" width="23" height="63" title="{$lang->edit->help_strike_through}" alt="{$lang->edit->help_underline}" id="component_{$editor_sequence}_StrikeThrough" onmouseover="eOptionOver(this)" onmouseout="eOptionOut(this)" /> <option value="" selected="selected">{$lang->edit->fontsize}</option>
<img src="./images/editor_btn_removeformat.gif" width="23" height="63" title="{$lang->edit->help_remove_format}" alt="{$lang->edit->help_underline}" id="component_{$editor_sequence}_RemoveFormat" onmouseover="eOptionOver(this)" onmouseout="eOptionOut(this)" /> <option value="1" class="px10">10px</option>
<img src="./images/editor_btn_c.gif" width="23" height="63" title="{$lang->edit->help_fontcolor}" alt="{$lang->edit->help_fontcolor}" id="component_{$editor_sequence}_colorpicker_text" onmouseover="eOptionOver(this)" onmouseout="eOptionOut(this)" /> <option value="2" class="px13">13px</option>
<img src="./images/editor_btn_bg.gif" width="23" height="63" title="{$lang->edit->help_fontbgcolor}" alt="{$lang->edit->help_fontbgcolor}" id="component_{$editor_sequence}_colorpicker_bg" onmouseover="eOptionOver(this)" onmouseout="eOptionOut(this)" /> <option value="3" class="px16">16px</option>
</div> <option value="4" class="px18">18px</option>
</div> <option value="5" class="px24">24px</option>
<option value="6" class="px32">32px</option>
<div class="optionB"> <option value="7" class="px48">48px</option>
<div class="buttonGroup"> </select>
<img src="./images/editor_btn_al.gif" width="23" height="63" title="{$lang->edit->help_align_left}" alt="{$lang->edit->help_align_left}" id="component_{$editor_sequence}_JustifyLeft" onmouseover="eOptionOver(this)" onmouseout="eOptionOut(this)" /> </li>
<img src="./images/editor_btn_ac.gif" width="23" height="63" title="{$lang->edit->help_align_center}" alt="{$lang->edit->help_align_center}" id="component_{$editor_sequence}_JustifyCenter" onmouseover="eOptionOver(this)" onmouseout="eOptionOut(this)" /> <li class="family">
<img src="./images/editor_btn_ar.gif" width="23" height="63" title="{$lang->edit->help_align_right}" alt="{$lang->edit->help_align_right}" id="component_{$editor_sequence}_JustifyRight" onmouseover="eOptionOver(this)" onmouseout="eOptionOut(this)" /> <select onchange="editorChangeFontName(this,'{$editor_sequence}')" id="editor_font_{$editor_sequence}">
<img src="./images/editor_btn_aj.gif" width="23" height="63" title="{$lang->edit->help_align_full}" alt="{$lang->edit->help_align_full}" id="component_{$editor_sequence}_JustifyFull" onmouseover="eOptionOver(this)" onmouseout="eOptionOut(this)" /> <option value="">{$lang->edit->fontname}</option>
</div> <!--@foreach($lang->edit->fontlist as $key=>$obj)-->
<option style="font-family:{$obj}" value="{$obj}">{$obj}</option>
<div class="buttonGroup"> <!--@end-->
<img src="./images/editor_btn_od.gif" title="{$lang->edit->help_remove_indent}" alt="{$lang->edit->help_remove_indent}" id="component_{$editor_sequence}_Outdent" width="23" height="63" onmouseover="eOptionOver(this)" onmouseout="eOptionOut(this)" /> </select>
<img src="./images/editor_btn_id.gif" width="23" height="63" title="{$lang->edit->help_add_indent}" alt="{$lang->edit->help_add_indent}" id="component_{$editor_sequence}_Indent" onmouseover="eOptionOver(this)" onmouseout="eOptionOut(this)" /> </li>
</div> </ul>
<div class="buttonGroup"> <ul class="style">
<img src="./images/editor_btn_ul.gif" title="{$lang->edit->help_list_bullet}" alt="{$lang->edit->help_list_bullet}" id="component_{$editor_sequence}_InsertUnorderedList" width="23" height="63" onmouseover="eOptionOver(this)" onmouseout="eOptionOut(this)" /> <li class="bold"><button type="button" title="Ctrl+B:{$lang->edit->help_bold}" id="component_{$editor_sequence}_Bold"><span>Bold</span></button></li>
<img src="./images/editor_btn_ol.gif" title="{$lang->edit->help_list_number}" alt="{$lang->edit->help_list_number}" id="component_{$editor_sequence}_InsertOrderedList" width="23" height="63" onmouseover="eOptionOver(this)" onmouseout="eOptionOut(this)" /> <li class="underline"><button type="button" title="Ctrl+U:{$lang->edit->help_underline}" id="component_{$editor_sequence}_Underline"><span>Underline</span></button></li>
</div> <li class="italic"><button type="button" title="Ctrl+I:{$lang->edit->help_italic}" id="component_{$editor_sequence}_Italic"><span>Italic</span></button></li>
<li class="strike"><button type="button" title="{$lang->edit->help_strike_through}" id="component_{$editor_sequence}_StrikeThrough"><span>Strike</span></button></li>
<!-- <li class="sup"><button type="button" title="Sup"><span>Sup</span></button></li>
<div class="buttonGroup"> <li class="sub"><button type="button" title="Sub"><span>Sub</span></button></li>
<img src="./images/editor_btn_lh.gif" alt="Line hight" width="23" height="63" onmouseover="eOptionOver(this)" onmouseout="eOptionOut(this)" /> <li class="txColor"><button type="button" title="{$lang->edit->help_fontcolor}" id="component_{$editor_sequence}_colorpicker_text"><span>Text Color</span></button></li>
</div> <li class="bgColor"><button type="button" title="{$lang->edit->help_fontbgcolor}" id="component_{$editor_sequence}_colorpicker_bg"><span>Background Color</span></button></li>
--> <li class="styleRemover"><button type="button" title="Ctrl+D:{$lang->edit->help_remove_format}" id="component_{$editor_sequence}_RemoveFormat"><span>Style Remover</span></button></li>
</div> </ul>
<!-- <ul class="paragraph">
<div class="optionC"> <li class="alignLeft"><button type="button" title="{$lang->edit->help_align_left}" id="component_{$editor_sequence}_JustifyLeft"><span>Align Left</span></button></li>
<div class="buttonGroup"> <li class="alignCenter"><button type="button" title="{$lang->edit->help_align_center}" id="component_{$editor_sequence}_JustifyCenter"><span>Align Center</span></button></li>
<img src="./images/editor_btn_tag.gif" alt="Tag" width="23" height="63" onmouseover="eOptionOver(this)" onmouseout="eOptionOut(this)" /> <li class="alignRight"><button type="button" title="{$lang->edit->help_align_right}" id="component_{$editor_sequence}_JustifyRight"><span>Align Right</span></button></li>
</div> <li class="alignJustify"><button type="button" title="{$lang->edit->help_align_full}" id="component_{$editor_sequence}_JustifyFull"><span>Align Justify</span></button></li>
</div> <li class="orderedList"><button type="button" title="{$lang->edit->help_list_number}" id="component_{$editor_sequence}_InsertOrderedList"><span>Orderd List</span></button></li>
--> <li class="unorderedList"><button type="button" title="{$lang->edit->help_list_bullet}" id="component_{$editor_sequence}_InsertUnorderedList"><span>Unordered List</span></button></li>
</div> <li class="outdent"><button type="button" title="{$lang->edit->help_remove_indent}" id="component_{$editor_sequence}_Outdent"><span>Outdent</span></button></li>
<!--@end--> <li class="indent"><button type="button" title="{$lang->edit->help_add_indent}" id="component_{$editor_sequence}_Indent"><span>Indent</span></button></li>
</ul>
<!--@if($enable_component)-->
<!-- 확장 컴포넌트 출력 --> <ul class="extension">
<div class="optionDE"> <li class="url"><button type="button" title="Ctrl+L:URL" id="component_1_url_link"><span>URL</span></button></li>
<div class="optionE"> <li class="blockquote"><button type="button" title="Blockquote" id="component_1_quotation"><span>Blockquote</span></button></li>
<div class="buttonGroup" id="editor_component_{$editor_sequence}"> <li class="table"><button type="button" title="Table" id="component_1_table_maker"><span>Table</span></button></li>
<!--@foreach($component_list as $component_name => $component)--> <li class="image"><button type="button" title="Image" id="component_1_image_link"><span>Image</span></button></li>
<!--@if(substr($component_name,0,11)!="colorpicker")--> <li class="movie"><button type="button" title="Movie" id="component_1_multimedia_link"><span>Movie</span></button></li>
<img src="../../components/{$component_name}/icon.gif" alt="{$component->title}" title="{$component->title}" id="component_{$editor_sequence}_{$component_name}" onmouseover="eOptionOver(this)" onmouseout="eOptionOut(this)" /> <li class="emoticon"><button type="button" title="Emoticon" id="component_1_emoticon"><span>Emoticon</span></button></li>
<!--@end--> </ul>
<!--@end-->
</div> </div>
</div> <!--@end-->
</div>
<!--@end--> <!--@if($enable_component)-->
</div> <!-- 확장 컴포넌트 출력 -->
<ul id="editor_component_{$editor_sequence}" class="toolB">
<!--@if(!$_COOKIE['EditorInfo'])--> <!--@foreach($component_list as $component_name => $component)-->
<!-- 에디터 안내 출력 --> <!--@if(substr($component_name,0,11)!="colorpicker")-->
<div id="editorInfo_{$editor_sequence}" class="editorInfo" > <li><button type="button" id="component_{$editor_sequence}_{$component_name}"><span>{$component->title}</span></button></li>
{$lang->about_dblclick_in_editor} <!--@end-->
<span id="for_ie_help_{$editor_sequence}" style="display:none">{$lang->edit->help_use_paragrapth}</span> <!--@end-->
<img src="./images/buttonClose.gif" alt="close" width="13" height="13" class="close" onclick="closeEditorInfo('{$editor_sequence}'); return false;" /> </ul>
</div> <!--@end-->
<!--@end-->
</div>
<!-- HTML 모드 사용 기능 및 자동저장 메세지 출력용 -->
<!--@if($html_mode || $enable_autosave)--> <!--@if(!$_COOKIE['EditorInfo'])-->
<div class="editor_info"> <!-- 에디터 안내 출력 -->
<!--@if($html_mode)--> <div id="editorInfo_{$editor_sequence}" class="editorInfo" >
<div class="editor_option"> {$lang->about_dblclick_in_editor}
<input type="checkbox" id="use_html_{$editor_sequence}" value="Y" onclick="editorChangeMode(this, '{$editor_sequence}');" /> <label for="use_html_{$editor_sequence}">HTML</label> <span id="for_ie_help_{$editor_sequence}" style="display:none">{$lang->edit->help_use_paragrapth}</span>
</div> <img src="./images/buttonClose.gif" alt="close" width="13" height="13" class="close" onclick="closeEditorInfo('{$editor_sequence}'); return false;" />
<!--@end--> </div>
<!--@if($enable_autosave)--> <!--@end-->
<div class="editor_autosaved_message" id="editor_autosaved_message_{$editor_sequence}"></div>
<!--@end--> <!-- HTML 모드 사용 기능 및 자동저장 메세지 출력용 -->
</div> <!--@if($html_mode || $enable_autosave)-->
<!--@end--> <div class="editor_info">
<!--@if($html_mode)-->
<!-- 에디터 출력 --> <div class="editor_option">
<div class="editor_iframe_box"><iframe id="editor_iframe_{$editor_sequence}" frameborder="0" height="{$editor_height}" style="background-color:transparent;" allowTransparency="true"></iframe></div> <input type="checkbox" id="use_html_{$editor_sequence}" value="Y" onclick="editorChangeMode(this, '{$editor_sequence}');" /> <label for="use_html_{$editor_sequence}">HTML</label>
<textarea id="editor_textarea_{$editor_sequence}" class="editor_iframe_textarea" style="display:none; height:{$editor_height}" rows="10" cols="10"></textarea> </div>
<!--@end-->
<!-- 에디터 크기 조절 bar --> <!--@if($enable_autosave)-->
<!--@if($enable_resizable)--> <div class="editor_autosaved_message" id="editor_autosaved_message_{$editor_sequence}"></div>
<div class="textAreaDragIndicator"><div class="textAreaDragIndicatorBar" id="editor_drag_bar_{$editor_sequence}"></div></div> <!--@end-->
<!--@end--> </div>
<!--@end-->
<!--@if($allow_fileupload)-->
<!-- 첨부파일 영역 --> <!-- 에디터 출력 -->
<!--%import("../../tpl/js/uploader.js",optimized=false)--> <div class="editor_iframe_box"><iframe id="editor_iframe_{$editor_sequence}" frameborder="0" height="{$editor_height}" style="background-color:transparent;" allowTransparency="true"></iframe></div>
<!--%import("../../tpl/js/swfupload.js",optimized=false)--> <textarea id="editor_textarea_{$editor_sequence}" class="editor_iframe_textarea" style="display:none; height:{$editor_height}" rows="10" cols="10"></textarea>
<script type="text/javascript">//<![CDATA[
editorUploadInit( <!-- 에디터 크기 조절 bar -->
{ <!--@if($enable_resizable)-->
"editorSequence" : {$editor_sequence}, <div class="textAreaDragIndicator"><div class="textAreaDragIndicatorBar" id="editor_drag_bar_{$editor_sequence}"></div></div>
"sessionName" : "{session_name()}", <!--@end-->
"allowedFileSize" : "{$file_config->allowed_filesize}",
"allowedFileTypes" : "{$file_config->allowed_filetypes}", <!--@if($allow_fileupload)-->
"allowedFileTypesDescription" : "{$file_config->allowed_filetypes}", <!-- 첨부파일 영역 -->
"insertedFiles" : {(int)$files_count}, <!--%import("../../tpl/js/uploader.js",optimized=false)-->
"replaceButtonID" : "swfUploadButton{$editor_sequence}", <!--%import("../../tpl/js/swfupload.js",optimized=false)-->
"fileListAreaID" : "uploaded_file_list_{$editor_sequence}", <script type="text/javascript">//<![CDATA[
"previewAreaID" : "preview_uploaded_{$editor_sequence}", editorUploadInit(
"uploaderStatusID" : "uploader_status_{$editor_sequence}" {
} "editorSequence" : {$editor_sequence},
); "sessionName" : "{session_name()}",
//]]></script> "allowedFileSize" : "{$file_config->allowed_filesize}",
<table cellspacing="0" class="fileAttach"> "allowedFileTypes" : "{$file_config->allowed_filetypes}",
<col width="120" /> "allowedFileTypesDescription" : "{$file_config->allowed_filetypes}",
<col width="100%" /> "insertedFiles" : {(int)$files_count},
<tr valign="top"> "replaceButtonID" : "swfUploadButton{$editor_sequence}",
<td width="120"><div class="preview" id="preview_uploaded_{$editor_sequence}"><img src="./images/blank.gif" alt="preview" width="100" height="100" /></div></td> "fileListAreaID" : "uploaded_file_list_{$editor_sequence}",
<td> "previewAreaID" : "preview_uploaded_{$editor_sequence}",
<!-- 파일 업로드 영역 --> "uploaderStatusID" : "uploader_status_{$editor_sequence}"
<div class="fileListArea"> }
<select id="uploaded_file_list_{$editor_sequence}" multiple="multiple" size="5" class="fileList"></select> );
</div> //]]></script>
<div class="fileUploadControl"> <table cellspacing="0" class="fileAttach">
<span id="swfUploadButton{$editor_sequence}"><span class="button"><button type="button">{$lang->edit->upload_file}</button></span></span> <col width="120" />
<a href="#" onclick="removeUploadedFile('{$editor_sequence}');return false;" class="button"><span>{$lang->edit->delete_selected}</span></a> <col width="100%" />
<a href="#" onclick="insertUploadedFile('{$editor_sequence}');return false;" class="button"><span>{$lang->edit->link_file}</span></a> <tr valign="top">
</div> <td width="120"><div class="preview" id="preview_uploaded_{$editor_sequence}"><img src="./images/blank.gif" alt="preview" width="100" height="100" /></div></td>
<div class="file_attach_info" id="uploader_status_{$editor_sequence}">{$upload_status}</div> <td>
</td> <!-- 파일 업로드 영역 -->
</tr> <div class="fileListArea">
</table> <select id="uploaded_file_list_{$editor_sequence}" multiple="multiple" size="5" class="fileList"></select>
<!--@end--> </div>
</div> <div class="fileUploadControl">
<span id="swfUploadButton{$editor_sequence}"><span class="button"><button type="button">{$lang->edit->upload_file}</button></span></span>
<!-- 에디터 활성화 --> <a href="#" onclick="removeUploadedFile('{$editor_sequence}');return false;" class="button"><span>{$lang->edit->delete_selected}</span></a>
<script type="text/javascript">//<![CDATA[ <a href="#" onclick="insertUploadedFile('{$editor_sequence}');return false;" class="button"><span>{$lang->edit->link_file}</span></a>
var editor_path = "{$editor_path}"; </div>
var auto_saved_msg = "{$lang->msg_auto_saved}"; <div class="file_attach_info" id="uploader_status_{$editor_sequence}">{$upload_status}</div>
</td>
<!--@if(!$editor_manual_start)--> </tr>
editorStart("{$editor_sequence}", "{$editor_primary_key_name}", "{$editor_content_key_name}", '{$editor_height}' , '#000000'); </table>
<!--@end--> <!--@end-->
//]]></script> </div>
<div id="textEditor" class="editorItem">
여기에 class "textEditor"의 내용 입력
</div>
<div id="htmlEditor" class="editorItem">
여기에 class "htmlEditor"의 내용 입력
</div>
</div>
<!-- 에디터 활성화 -->
<script type="text/javascript">//<![CDATA[
var editor_path = "{$editor_path}";
var auto_saved_msg = "{$lang->msg_auto_saved}";
<!--@if(!$editor_manual_start)-->
editorStart("{$editor_sequence}", "{$editor_primary_key_name}", "{$editor_content_key_name}", '{$editor_height}' , '#000000');
<!--@end-->
//]]></script>

Binary file not shown.

After

Width:  |  Height:  |  Size: 12 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 168 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 44 B

Binary file not shown.

After

Width:  |  Height:  |  Size: 1 KiB

View file

@ -1,375 +1,375 @@
/** /**
* 에디터에서 사용하기 위한 변수 * 에디터에서 사용하기 위한 변수
**/ **/
var editorMode = new Array(); ///<< 에디터의 html편집 모드 flag 세팅 변수 (html or null) var editorMode = new Array(); ///<< 에디터의 html편집 모드 flag 세팅 변수 (html or null)
var editorAutoSaveObj = {fo_obj:null, editor_sequence:0, title:'', content:'', locked:false} ///< 자동저장을 위한 정보를 가진 object var editorAutoSaveObj = {fo_obj:null, editor_sequence:0, title:'', content:'', locked:false} ///< 자동저장을 위한 정보를 가진 object
var editorRelKeys = new Array(); ///< 에디터와 각 모듈과의 연동을 위한 key 값을 보관하는 변수 var editorRelKeys = new Array(); ///< 에디터와 각 모듈과의 연동을 위한 key 값을 보관하는 변수
var editorDragObj = {isDrag:false, y:0, obj:null, id:'', det:0, source_height:0} var editorDragObj = {isDrag:false, y:0, obj:null, id:'', det:0, source_height:0}
/** /**
* 에디터 사용시 사용되는 이벤트 연결 함수 호출 * 에디터 사용시 사용되는 이벤트 연결 함수 호출
**/ **/
xAddEventListener(document, 'mouseup', editorEventCheck); xAddEventListener(document, 'click', editorEventCheck);
xAddEventListener(document, 'mousedown', editorDragStart); xAddEventListener(document, 'mousedown', editorDragStart);
xAddEventListener(document, 'mouseup', editorDragStop); xAddEventListener(document, 'mouseup', editorDragStop);
function editorGetContent(editor_sequence) { function editorGetContent(editor_sequence) {
// 입력된 내용을 받아옴 // 입력된 내용을 받아옴
var content = editorRelKeys[editor_sequence]["func"](editor_sequence); var content = editorRelKeys[editor_sequence]["func"](editor_sequence);
// 첨부파일 링크시 url을 변경 // 첨부파일 링크시 url을 변경
var reg_pattern = new RegExp( request_uri.replace(/\//g,'\\/')+"(files|common|modules|layouts|widgets)", 'ig' ); var reg_pattern = new RegExp( request_uri.replace(/\//g,'\\/')+"(files|common|modules|layouts|widgets)", 'ig' );
return content.replace(reg_pattern, "$1"); return content.replace(reg_pattern, "$1");
} }
// 에디터에 포커스를 줌 // 에디터에 포커스를 줌
function editorFocus(editor_sequence) { function editorFocus(editor_sequence) {
var iframe_obj = editorGetIFrame(editor_sequence); var iframe_obj = editorGetIFrame(editor_sequence);
iframe_obj.contentWindow.focus(); iframe_obj.contentWindow.focus();
} }
/** /**
* 자동 저장 기능 * 자동 저장 기능
**/ **/
// 자동 저장 활성화 시키는 함수 (10초마다 자동저장) // 자동 저장 활성화 시키는 함수 (10초마다 자동저장)
function editorEnableAutoSave(fo_obj, editor_sequence) { function editorEnableAutoSave(fo_obj, editor_sequence) {
var title = fo_obj.title.value; var title = fo_obj.title.value;
var content = editorRelKeys[editor_sequence]['content'].value; var content = editorRelKeys[editor_sequence]['content'].value;
editorAutoSaveObj = {"fo_obj":fo_obj, "editor_sequence":editor_sequence, "title":title, "content":content, locked:false}; editorAutoSaveObj = {"fo_obj":fo_obj, "editor_sequence":editor_sequence, "title":title, "content":content, locked:false};
setTimeout(_editorAutoSave, 10000); setTimeout(_editorAutoSave, 10000);
} }
// ajax를 이용하여 editor.procEditorSaveDoc 호출하여 자동 저장시킴 // ajax를 이용하여 editor.procEditorSaveDoc 호출하여 자동 저장시킴
function _editorAutoSave() { function _editorAutoSave() {
var fo_obj = editorAutoSaveObj.fo_obj; var fo_obj = editorAutoSaveObj.fo_obj;
var editor_sequence = editorAutoSaveObj.editor_sequence; var editor_sequence = editorAutoSaveObj.editor_sequence;
// 현재 자동저장중이면 중지 // 현재 자동저장중이면 중지
if(editorAutoSaveObj.locked == true) return; if(editorAutoSaveObj.locked == true) return;
// 대상이 없으면 자동저장 시키는 기능 자체를 중지 // 대상이 없으면 자동저장 시키는 기능 자체를 중지
if(!fo_obj || typeof(fo_obj.title)=='undefined' || !editor_sequence) return; if(!fo_obj || typeof(fo_obj.title)=='undefined' || !editor_sequence) return;
// 자동저장을 위한 준비 // 자동저장을 위한 준비
var title = fo_obj.title.value; var title = fo_obj.title.value;
var content = editorGetContent(editor_sequence); var content = editorGetContent(editor_sequence);
// 내용이 이전에 저장하였던 것과 다르면 자동 저장을 함 // 내용이 이전에 저장하였던 것과 다르면 자동 저장을 함
if(title != editorAutoSaveObj.title || content != editorAutoSaveObj.content ) { if(title != editorAutoSaveObj.title || content != editorAutoSaveObj.content ) {
var params = new Array(); var params = new Array();
params["title"] = title; params["title"] = title;
params["content"] = content; params["content"] = content;
params["document_srl"] = editorRelKeys[editor_sequence]['primary'].value; params["document_srl"] = editorRelKeys[editor_sequence]['primary'].value;
editorAutoSaveObj.title = title; editorAutoSaveObj.title = title;
editorAutoSaveObj.content = content; editorAutoSaveObj.content = content;
var obj = xGetElementById("editor_autosaved_message_"+editor_sequence); var obj = xGetElementById("editor_autosaved_message_"+editor_sequence);
obj.style.display = 'block'; obj.style.display = 'block';
var oDate = new Date(); var oDate = new Date();
html = oDate.getHours()+':'+oDate.getMinutes()+' '+auto_saved_msg; html = oDate.getHours()+':'+oDate.getMinutes()+' '+auto_saved_msg;
xInnerHtml(obj, html); xInnerHtml(obj, html);
obj.style.display = "block"; obj.style.display = "block";
// 현재 자동저장중임을 설정 // 현재 자동저장중임을 설정
editorAutoSaveObj.locked = true; editorAutoSaveObj.locked = true;
// 서버 호출 (서버와 교신중이라는 메세지를 보이지 않도록 함) // 서버 호출 (서버와 교신중이라는 메세지를 보이지 않도록 함)
show_waiting_message = false; show_waiting_message = false;
exec_xml("editor","procEditorSaveDoc", params, function() { editorAutoSaveObj.locked = false; } ); exec_xml("editor","procEditorSaveDoc", params, function() { editorAutoSaveObj.locked = false; } );
show_waiting_message = true; show_waiting_message = true;
} }
// 10초마다 동기화를 시킴 // 10초마다 동기화를 시킴
setTimeout(_editorAutoSave, 10000); setTimeout(_editorAutoSave, 10000);
} }
// 자동저장된 모든 메세지를 삭제하는 루틴 // 자동저장된 모든 메세지를 삭제하는 루틴
function editorRemoveSavedDoc() { function editorRemoveSavedDoc() {
exec_xml("editor","procEditorRemoveSavedDoc"); exec_xml("editor","procEditorRemoveSavedDoc");
} }
/** /**
* 에디터의 상태나 객체를 구하기 위한 함수 * 에디터의 상태나 객체를 구하기 위한 함수
**/ **/
// editor_sequence값에 해당하는 iframe의 object를 return // editor_sequence값에 해당하는 iframe의 object를 return
function editorGetIFrame(editor_sequence) { function editorGetIFrame(editor_sequence) {
if(editorRelKeys != undefined && editorRelKeys[editor_sequence] != undefined && editorRelKeys[editor_sequence]['editor'] != undefined) if(editorRelKeys != undefined && editorRelKeys[editor_sequence] != undefined && editorRelKeys[editor_sequence]['editor'] != undefined)
return editorRelKeys[editor_sequence]['editor'].getFrame(); return editorRelKeys[editor_sequence]['editor'].getFrame();
return xGetElementById( 'editor_iframe_'+ editor_sequence ); return xGetElementById( 'editor_iframe_'+ editor_sequence );
} }
/** /**
* iframe 세로 크기 조절 드래그 관련 * iframe 세로 크기 조절 드래그 관련
**/ **/
function editorDragStart(evt) { function editorDragStart(evt) {
var e = new xEvent(evt); var e = new xEvent(evt);
var obj = e.target; var obj = e.target;
if(typeof(obj.id)=='undefined'||!obj.id) return; if(typeof(obj.id)=='undefined'||!obj.id) return;
var id = obj.id; var id = obj.id;
if(id.indexOf('editor_drag_bar_')!=0) return; if(id.indexOf('editor_drag_bar_')!=0) return;
editorDragObj.isDrag = true; editorDragObj.isDrag = true;
editorDragObj.y = e.pageY; editorDragObj.y = e.pageY;
editorDragObj.obj = e.target; editorDragObj.obj = e.target;
editorDragObj.id = id.substr('editor_drag_bar_'.length); editorDragObj.id = id.substr('editor_drag_bar_'.length);
var iframe_obj = editorGetIFrame(editorDragObj.id); var iframe_obj = editorGetIFrame(editorDragObj.id);
editorDragObj.source_height = xHeight(iframe_obj); editorDragObj.source_height = xHeight(iframe_obj);
xAddEventListener(document, 'mousemove', editorDragMove, false); xAddEventListener(document, 'mousemove', editorDragMove, false);
xAddEventListener(editorDragObj.obj, 'mousemove', editorDragMove, false); xAddEventListener(editorDragObj.obj, 'mousemove', editorDragMove, false);
} }
function editorDragMove(evt) { function editorDragMove(evt) {
if(!editorDragObj.isDrag) return; if(!editorDragObj.isDrag) return;
var e = new xEvent(evt); var e = new xEvent(evt);
var h = e.pageY - editorDragObj.y; var h = e.pageY - editorDragObj.y;
editorDragObj.isDrag = true; editorDragObj.isDrag = true;
editorDragObj.y = e.pageY; editorDragObj.y = e.pageY;
editorDragObj.obj = e.target; editorDragObj.obj = e.target;
var iframe_obj = editorGetIFrame(editorDragObj.id); var iframe_obj = editorGetIFrame(editorDragObj.id);
xHeight(iframe_obj, xHeight(iframe_obj)+h); xHeight(iframe_obj, xHeight(iframe_obj)+h);
xHeight(iframe_obj.parentNode, xHeight(iframe_obj)+10); xHeight(iframe_obj.parentNode, xHeight(iframe_obj)+10);
} }
function editorDragStop(evt) { function editorDragStop(evt) {
if(!editorDragObj.isDrag) return; if(!editorDragObj.isDrag) return;
xRemoveEventListener(document, 'mousemove', editorDragMove, false); xRemoveEventListener(document, 'mousemove', editorDragMove, false);
xRemoveEventListener(editorDragObj.obj, 'mousemove', editorDragMove, false); xRemoveEventListener(editorDragObj.obj, 'mousemove', editorDragMove, false);
var iframe_obj = editorGetIFrame(editorDragObj.id); var iframe_obj = editorGetIFrame(editorDragObj.id);
if(typeof(fixAdminLayoutFooter)=='function') fixAdminLayoutFooter(xHeight(iframe_obj)-editorDragObj.source_height); if(typeof(fixAdminLayoutFooter)=='function') fixAdminLayoutFooter(xHeight(iframe_obj)-editorDragObj.source_height);
editorDragObj.isDrag = false; editorDragObj.isDrag = false;
editorDragObj.y = 0; editorDragObj.y = 0;
editorDragObj.obj = null; editorDragObj.obj = null;
editorDragObj.id = ''; editorDragObj.id = '';
} }
// Editor Option Button // Editor Option Button
function eOptionOver(obj) { function eOptionOver(obj) {
obj.style.marginTop='-21px'; obj.style.marginTop='-21px';
obj.style.zIndex='99'; obj.style.zIndex='99';
} }
function eOptionOut(obj) { function eOptionOut(obj) {
obj.style.marginTop='0'; obj.style.marginTop='0';
obj.style.zIndex='1'; obj.style.zIndex='1';
} }
function eOptionClick(obj) { function eOptionClick(obj) {
obj.style.marginTop='-42px'; obj.style.marginTop='-42px';
obj.style.zIndex='99'; obj.style.zIndex='99';
} }
/** /**
* 에디터 컴포넌트 구현 부분 * 에디터 컴포넌트 구현 부분
**/ **/
// 에디터 상단의 컴포넌트 버튼 클릭시 action 처리 (마우스다운 이벤트 발생시마다 요청이 됨) // 에디터 상단의 컴포넌트 버튼 클릭시 action 처리 (마우스다운 이벤트 발생시마다 요청이 됨)
var editorPrevSrl = null; var editorPrevSrl = null;
function editorEventCheck(evt) { function editorEventCheck(evt) {
editorPrevNode = null; editorPrevNode = null;
// 이벤트가 발생한 object의 ID를 구함 // 이벤트가 발생한 object의 ID를 구함
var e = new xEvent(evt); var e = new xEvent(evt);
var target_id = e.target.id; var target_id = e.target.id;
if(!target_id) return; if(!target_id) return;
// editor_sequence와 component name을 구함 (id가 포맷과 다르면 return) // editor_sequence와 component name을 구함 (id가 포맷과 다르면 return)
var info = target_id.split('_'); var info = target_id.split('_');
if(info[0]!="component") return; if(info[0]!="component") return;
var editor_sequence = info[1]; var editor_sequence = info[1];
var component_name = target_id.replace(/^component_([0-9]+)_/,''); var component_name = target_id.replace(/^component_([0-9]+)_/,'');
if(!editor_sequence || !component_name) return; if(!editor_sequence || !component_name) return;
if(editorMode[editor_sequence]=='html') return; if(editorMode[editor_sequence]=='html') return;
switch(component_name) { switch(component_name) {
// 기본 기능에 대한 동작 (바로 실행) // 기본 기능에 대한 동작 (바로 실행)
case 'Bold' : case 'Bold' :
case 'Italic' : case 'Italic' :
case 'Underline' : case 'Underline' :
case 'StrikeThrough' : case 'StrikeThrough' :
case 'undo' : case 'undo' :
case 'redo' : case 'redo' :
case 'JustifyLeft' : case 'JustifyLeft' :
case 'JustifyCenter' : case 'JustifyCenter' :
case 'JustifyRight' : case 'JustifyRight' :
case 'JustifyFull' : case 'JustifyFull' :
case 'Indent' : case 'Indent' :
case 'Outdent' : case 'Outdent' :
case 'InsertOrderedList' : case 'InsertOrderedList' :
case 'InsertUnorderedList' : case 'InsertUnorderedList' :
case 'SaveAs' : case 'SaveAs' :
case 'Print' : case 'Print' :
case 'Copy' : case 'Copy' :
case 'Cut' : case 'Cut' :
case 'Paste' : case 'Paste' :
case 'RemoveFormat' : case 'RemoveFormat' :
case 'Subscript' : case 'Subscript' :
case 'Superscript' : case 'Superscript' :
editorDo(component_name, '', editor_sequence); editorDo(component_name, '', editor_sequence);
break; break;
// 추가 컴포넌트의 경우 서버에 요청을 시도 // 추가 컴포넌트의 경우 서버에 요청을 시도
default : default :
openComponent(component_name, editor_sequence); openComponent(component_name, editor_sequence);
break; break;
} }
return; return;
} }
// 컴포넌트 팝업 열기 // 컴포넌트 팝업 열기
function openComponent(component_name, editor_sequence, manual_url) { function openComponent(component_name, editor_sequence, manual_url) {
editorPrevSrl = editor_sequence; editorPrevSrl = editor_sequence;
if(editorMode[editor_sequence]=='html') return; if(editorMode[editor_sequence]=='html') return;
var popup_url = request_uri+"?module=editor&act=dispEditorPopup&editor_sequence="+editor_sequence+"&component="+component_name; var popup_url = request_uri+"?module=editor&act=dispEditorPopup&editor_sequence="+editor_sequence+"&component="+component_name;
if(typeof(manual_url)!="undefined" && manual_url) popup_url += "&manual_url="+escape(manual_url); if(typeof(manual_url)!="undefined" && manual_url) popup_url += "&manual_url="+escape(manual_url);
popopen(popup_url, 'editorComponent'); popopen(popup_url, 'editorComponent');
} }
// 더블클릭 이벤트 발생시에 본문내에 포함된 컴포넌트를 찾는 함수 // 더블클릭 이벤트 발생시에 본문내에 포함된 컴포넌트를 찾는 함수
var editorPrevNode = null; var editorPrevNode = null;
function editorSearchComponent(evt) { function editorSearchComponent(evt) {
var e = new xEvent(evt); var e = new xEvent(evt);
editorPrevNode = null; editorPrevNode = null;
var obj = e.target; var obj = e.target;
// 위젯인지 일단 체크 // 위젯인지 일단 체크
if(obj.getAttribute("widget")) { if(obj.getAttribute("widget")) {
// editor_sequence을 찾음 // editor_sequence을 찾음
var tobj = obj; var tobj = obj;
while(tobj && tobj.nodeName != "BODY") { while(tobj && tobj.nodeName != "BODY") {
tobj = xParent(tobj); tobj = xParent(tobj);
} }
if(!tobj || tobj.nodeName != "BODY" || !tobj.getAttribute("editor_sequence")) { if(!tobj || tobj.nodeName != "BODY" || !tobj.getAttribute("editor_sequence")) {
editorPrevNode = null; editorPrevNode = null;
return; return;
} }
var editor_sequence = tobj.getAttribute("editor_sequence"); var editor_sequence = tobj.getAttribute("editor_sequence");
var widget = obj.getAttribute("widget"); var widget = obj.getAttribute("widget");
editorPrevNode = obj; editorPrevNode = obj;
if(editorMode[editor_sequence]=='html') return; if(editorMode[editor_sequence]=='html') return;
popopen(request_uri+"?module=widget&act=dispWidgetGenerateCodeInPage&selected_widget="+widget+"&module_srl="+editor_sequence,'GenerateCodeInPage'); popopen(request_uri+"?module=widget&act=dispWidgetGenerateCodeInPage&selected_widget="+widget+"&module_srl="+editor_sequence,'GenerateCodeInPage');
return; return;
} }
// 선택되어진 object부터 상단으로 이동하면서 editor_component attribute가 있는지 검사 // 선택되어진 object부터 상단으로 이동하면서 editor_component attribute가 있는지 검사
if(!obj.getAttribute("editor_component")) { if(!obj.getAttribute("editor_component")) {
while(obj && !obj.getAttribute("editor_component")) { while(obj && !obj.getAttribute("editor_component")) {
if(obj.parentElement) obj = obj.parentElement; if(obj.parentElement) obj = obj.parentElement;
else obj = xParent(obj); else obj = xParent(obj);
} }
} }
if(!obj) obj = e.target; if(!obj) obj = e.target;
var editor_component = obj.getAttribute("editor_component"); var editor_component = obj.getAttribute("editor_component");
// editor_component를 찾지 못했을 경우에 이미지/텍스트/링크의 경우 기본 컴포넌트와 연결 // editor_component를 찾지 못했을 경우에 이미지/텍스트/링크의 경우 기본 컴포넌트와 연결
if(!editor_component) { if(!editor_component) {
// 이미지일 경우 // 이미지일 경우
if(obj.nodeName == "IMG") { if(obj.nodeName == "IMG") {
editor_component = "image_link"; editor_component = "image_link";
editorPrevNode = obj; editorPrevNode = obj;
// 테이블의 td일 경우 // 테이블의 td일 경우
} else if(obj.nodeName == "TD") { } else if(obj.nodeName == "TD") {
editor_component = "table_maker"; editor_component = "table_maker";
editorPrevNode = obj; editorPrevNode = obj;
// 링크거나 텍스트인 경우 // 링크거나 텍스트인 경우
} else if(obj.nodeName == "A" || obj.nodeName == "BODY" || obj.nodeName.indexOf("H")==0 || obj.nodeName == "LI" || obj.nodeName == "P") { } else if(obj.nodeName == "A" || obj.nodeName == "BODY" || obj.nodeName.indexOf("H")==0 || obj.nodeName == "LI" || obj.nodeName == "P") {
editor_component = "url_link"; editor_component = "url_link";
editorPrevNode = obj; editorPrevNode = obj;
} }
} else { } else {
editorPrevNode = obj; editorPrevNode = obj;
} }
// 아무런 editor_component가 없다면 return // 아무런 editor_component가 없다면 return
if(!editor_component) { if(!editor_component) {
editorPrevNode = null; editorPrevNode = null;
return; return;
} }
// editor_sequence을 찾음 // editor_sequence을 찾음
var tobj = obj; var tobj = obj;
while(tobj && tobj.nodeName != "BODY") { while(tobj && tobj.nodeName != "BODY") {
tobj = xParent(tobj); tobj = xParent(tobj);
} }
if(!tobj || tobj.nodeName != "BODY" || !tobj.getAttribute("editor_sequence")) { if(!tobj || tobj.nodeName != "BODY" || !tobj.getAttribute("editor_sequence")) {
editorPrevNode = null; editorPrevNode = null;
return; return;
} }
var editor_sequence = tobj.getAttribute("editor_sequence"); var editor_sequence = tobj.getAttribute("editor_sequence");
// 해당 컴포넌트를 찾아서 실행 // 해당 컴포넌트를 찾아서 실행
openComponent(editor_component, editor_sequence); openComponent(editor_component, editor_sequence);
} }
// 에디터 내의 선택된 부분의 html코드를 변경 // 에디터 내의 선택된 부분의 html코드를 변경
function editorReplaceHTML(iframe_obj, html) { function editorReplaceHTML(iframe_obj, html) {
// 에디터가 활성화 되어 있는지 확인 후 비활성화시 활성화 // 에디터가 활성화 되어 있는지 확인 후 비활성화시 활성화
var editor_sequence = iframe_obj.contentWindow.document.body.getAttribute("editor_sequence"); var editor_sequence = iframe_obj.contentWindow.document.body.getAttribute("editor_sequence");
// iframe 에디터에 포커스를 둠 // iframe 에디터에 포커스를 둠
iframe_obj.contentWindow.focus(); iframe_obj.contentWindow.focus();
if(xIE4Up) { if(xIE4Up) {
var range = iframe_obj.contentWindow.document.selection.createRange(); var range = iframe_obj.contentWindow.document.selection.createRange();
if(range.pasteHTML) { if(range.pasteHTML) {
range.pasteHTML(html); range.pasteHTML(html);
} else if(editorPrevNode) { } else if(editorPrevNode) {
editorPrevNode.outerHTML = html; editorPrevNode.outerHTML = html;
} }
} else { } else {
try { try {
if(iframe_obj.contentWindow.getSelection().focusNode.tagName == "HTML") { if(iframe_obj.contentWindow.getSelection().focusNode.tagName == "HTML") {
var range = iframe_obj.contentDocument.createRange(); var range = iframe_obj.contentDocument.createRange();
range.setStart(iframe_obj.contentDocument.body,0); range.setStart(iframe_obj.contentDocument.body,0);
range.setEnd(iframe_obj.contentDocument.body,0); range.setEnd(iframe_obj.contentDocument.body,0);
range.insertNode(range.createContextualFragment(html)); range.insertNode(range.createContextualFragment(html));
} else { } else {
var range = iframe_obj.contentWindow.getSelection().getRangeAt(0); var range = iframe_obj.contentWindow.getSelection().getRangeAt(0);
range.deleteContents(); range.deleteContents();
range.insertNode(range.createContextualFragment(html)); range.insertNode(range.createContextualFragment(html));
} }
} catch(e) { } catch(e) {
xInnerHtml(iframe_obj.contentWindow.document.body, html+xInnerHtml(iframe_obj.contentWindow.document.body)); xInnerHtml(iframe_obj.contentWindow.document.body, html+xInnerHtml(iframe_obj.contentWindow.document.body));
} }
} }
} }
// 에디터 내의 선택된 부분의 html 코드를 return // 에디터 내의 선택된 부분의 html 코드를 return
function editorGetSelectedHtml(editor_sequence) { function editorGetSelectedHtml(editor_sequence) {
var iframe_obj = editorGetIFrame(editor_sequence); var iframe_obj = editorGetIFrame(editor_sequence);
if(xIE4Up) { if(xIE4Up) {
var range = iframe_obj.contentWindow.document.selection.createRange(); var range = iframe_obj.contentWindow.document.selection.createRange();
var html = range.htmlText; var html = range.htmlText;
return html; return html;
} else { } else {
var range = iframe_obj.contentWindow.getSelection().getRangeAt(0); var range = iframe_obj.contentWindow.getSelection().getRangeAt(0);
var dummy = xCreateElement('div'); var dummy = xCreateElement('div');
dummy.appendChild(range.cloneContents()); dummy.appendChild(range.cloneContents());
var html = xInnerHtml(dummy); var html = xInnerHtml(dummy);
return html; return html;
} }
} }