Subject Developer Date
03. 그래프(pchart) 에디터 컴포넌트 템플릿 popup.html 만들기 (current) sol 2009.08.20 12:28:54
Restore
<div class="eArea xe_content xe_dr_img"><p>
<img src="./files/attach/images/18093223/589/241/018/set.png" class="" alt="">
</p><p class="desc">* 파이차트 입력 팝업창</p></div><div class="eArea xe_content xe_dr_txt"><p>pchart의 넓이(#chart_width)와 높이(#chart_height)를 입력 받고, 파이 그래프 항목의 타이틀(#title0 ~ #title4)과 값(#title0 ~ #title5)을 입력 받도록 합니다. 그리고 실제 에디터에 추가 되는 부분(위 그림에서 "추가" 버튼)은 insertPChart() javscript 함수를 호출하도록 하였습니다.<br></p></div><div class="eArea xe_content xe_dr_txt"><p>&lt;!--%import("popup.js")--&gt;<br>&lt;!--%import("popup.css")--&gt;<br><br>&lt;div id="popHeader"&gt;<br>&nbsp;&nbsp;&nbsp; &lt;h3 class="xeAdmin"&gt;{$component_info-&gt;title} ver. {$component_info-&gt;version}&lt;/h3&gt;<br>&lt;/div&gt;<br>&lt;form action="./" onSubmit="return false"&gt;<br>&nbsp;&nbsp;&nbsp; &lt;input type="hidden" id="api_url" value="{$api_url}" /&gt;<br>&nbsp;&nbsp;&nbsp; &lt;div id="popBody"&gt;<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;table cellspacing="0" class="rowTable"&gt;<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;col width="100" /&gt;<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;col /&gt;<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;col width="100" /&gt;<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;col /&gt;<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;tr&gt;<br><span style="background-color: rgb(225, 225, 225);"><span style="background-color: rgb(225, 225, 225);">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;th scope="row"&gt;&lt;div&gt;차트 넓이&lt;/div&gt;&lt;/th&gt;</span></span><br><span style="background-color: rgb(225, 225, 225);"><span style="background-color: rgb(225, 225, 225);">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;td&gt;&lt;input type="text" id="<span style="font-weight: bold;">chart_width</span>" value="" class="inputTypeText w100" /&gt;&lt;/td&gt;</span></span><br><span style="background-color: rgb(225, 225, 225);"><span style="background-color: rgb(225, 225, 225);">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;th scope="row"&gt;&lt;div&gt;차트 높이&lt;/div&gt;&lt;/th&gt;</span></span><br><span style="background-color: rgb(225, 225, 225);"><span style="background-color: rgb(225, 225, 225);">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;td&gt;&lt;input type="text" id="<span style="font-weight: bold;">chart_height</span>" value="" class="inputTypeText w100" /&gt;&lt;/td&gt;</span></span><br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/tr&gt;<br>&lt;!--@for($i=0;$i&lt;5;$i++)--&gt;<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;tr&gt;<br><span style="background-color: rgb(225, 225, 225);"><span style="background-color: rgb(225, 225, 225);">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;th scope="row"&gt;&lt;div&gt;항목{$i+1}&lt;/div&gt;&lt;/th&gt;</span></span><br><span style="background-color: rgb(225, 225, 225);"><span style="background-color: rgb(225, 225, 225);">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;td&gt;&lt;input type="text" id="<span style="font-weight: bold;">title{$i}</span>" value="" class="inputTypeText w200" /&gt;&lt;/td&gt;</span></span><br><span style="background-color: rgb(225, 225, 225);"><span style="background-color: rgb(225, 225, 225);">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;th scope="row"&gt;&lt;div&gt;값{$i+1}&lt;/div&gt;&lt;/th&gt;</span></span><br><span style="background-color: rgb(225, 225, 225);"><span style="background-color: rgb(225, 225, 225);">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;td&gt;&lt;input type="text" id="<span style="font-weight: bold;">value{$i}</span>" value="" class="inputTypeText w100" /&gt;&lt;/td&gt;</span></span><br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/tr&gt;<br>&lt;!--@end--&gt;<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;/table&gt;<br>&nbsp;&nbsp;&nbsp; &lt;/div&gt;<br>&nbsp;&nbsp;&nbsp; &lt;div id="popFooter" class="tCenter"&gt;<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;a href="#" onclick="<span style="font-weight: bold;">insertPChart()</span>" class="button black strong"&gt;&lt;span&gt;{$lang-&gt;cmd_insert}&lt;/span&gt;&lt;/a&gt;<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &lt;a href="#" onclick="winopen('./?module=editor&amp;amp;act=dispEditorComponentInfo&amp;amp;component_name={$component_info-&gt;component_name}','ComponentInfo','left=10,top=10,width=10,height=10,resizable=no,scrollbars=no,toolbars=no');return false;" class="button"&gt;&lt;span&gt;{$lang-&gt;about_component}&lt;/span&gt;&lt;/a&gt;<br>&nbsp;&nbsp;&nbsp; &lt;/div&gt;<br>&lt;/form&gt;<br><br></p></div>
sol 2009.08.20 11:52:05