<?xml version="1.0" encoding="utf-8" ?>
<jsml xmlns="http://cutesoft.net/jsml"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://cutesoft.net/jsml ../../core/jsml.xsd">

	<execute>
		dialog.set_title(editor.GetLangText("pageproperties"));
	</execute>

	<panel jsml-class="pageprops_dialog" dock="fill" overflow="visible" back_color="#f9f9f9">

		<panel dock="bottom" margin="3" padding="6" overflow="visible">

			<panel dock="right" margin="3" overflow="visible">
				<initialize>
					if(!option.nestedmode)self.set_visible(false);
				</initialize>
				<button dock="left" width="82" height="24"  text="@CLOSE">
					<attach name="click">
						dialog.close();
					</attach>
				</button>
			</panel>

			<panel dock="right" margin="3" overflow="visible">
				<initialize>
					if(option.nestedmode)self.set_visible(false);
				</initialize>
				<button dock="left" width="82" height="24"  text="@OK" margin="0,12,0,0">
					<initialize>
						if(option.oktext)self.set_text(option.oktext);
					</initialize>
					<attach name="click">
						editor.SaveBodyNode();
						dialog.result=true;
						dialog.close();
					</attach>
				</button>
				<button dock="left" width="82" height="24"  text="@CANCEL">
					<attach name="click">
						dialog.close();
					</attach>
				</button>
			</panel>

		</panel>

		<groupbox text="@DOCUMENT" dock="top" overflow="visible" margin="5,5,15,5">
			<panel margin="7,3,2,3" height="18" dock="top">
				<label dock="left" vertical_align="middle" width="80" text="@TITLE|:" text_align="right"/>
				<panel dock="left" width="4" />
				<panel dock="left" jsml-base="rteproptextbox" width="320" propname="#">
					<method name="set_node_value">
						editor.SetPageTitle(value);
					</method>
					<method name="get_node_value">
						return editor.GetPageTitle();
					</method>
				</panel>
			</panel>
			<panel margin="7,3,2,3" height="45" dock="top">
				<label dock="left" vertical_align="middle" width="80" text="@DESCRIPTION|:" text_align="right"/>
				<panel dock="left" width="4" />
				<panel dock="left" jsml-base="rteproptextbox" width="320" propname="#" height="45">
					<initialize>
						self.textbox.set_text_mode("multipleline");
					</initialize>
					<method name="set_node_value">
						editor.SetPageDescription(value);
					</method>
					<method name="get_node_value">
						return editor.GetPageDescription();
					</method>
				</panel>
			</panel>
			<panel margin="7,3,2,3" height="45" dock="top">
				<label dock="left" vertical_align="middle" width="80" text="@KEYWORDS|:" text_align="right"/>
				<panel dock="left" width="4" />
				<panel dock="left" jsml-base="rteproptextbox" width="320" propname="#" height="45">
					<initialize>
						self.textbox.set_text_mode("multipleline");
					</initialize>
					<method name="set_node_value">
						editor.SetPageKeywords(value);
					</method>
					<method name="get_node_value">
						return editor.GetPageKeywords();
					</method>
				</panel>
			</panel>
			<panel margin="7,3,2,3" height="18" dock="top">
				<label dock="left" vertical_align="middle" width="80" text="@CHARSET|:" text_align="right"/>
				<panel dock="left" width="4" />
				<panel dock="left" jsml-base="rtepropdropdown" editable="true" width="100" propname="#">
					<method name="set_node_value">
						editor.SetPageContentType(value?("text/html;charset="+value):null);
					</method>
					<method name="get_node_value">
						var t=editor.GetPageContentType();
						if(!t)return "";
						return t.replace(/^.*charset\=(.*)$/i,"$1");
					</method>
					<initialize>
						<![CDATA[
						var list=",ascii,utf-8,gb2312";
						list=list.split(',');
						for(var i=0;i<list.length;i++)
						{
							self.jsml_append(jsml.new_listitem(list[i],list[i]));
						}
						]]>
					</initialize>
				</panel>
				<panel dock="left" width="12" />
				<label dock="left" vertical_align="middle" width="80" text="@CONTENT-LANGUAGE|:" text_align="right"/>
				<panel dock="left" width="4" />
				<panel dock="left" jsml-base="rtepropdropdown" editable="true" width="100" propname="#">
					<method name="set_node_value">
						editor.SetPageContentLanguage(value);
					</method>
					<method name="get_node_value">
						return editor.GetPageContentLanguage();
					</method>
					<initialize>
						<![CDATA[
						var list=",en-us,zh-cn";
						list=list.split(',');
						for(var i=0;i<list.length;i++)
						{
							self.jsml_append(jsml.new_listitem(list[i],list[i]));
						}
						]]>
					</initialize>
				</panel>
			</panel>

			<panel margin="7,3,2,3" height="18" dock="top">
			</panel>
			
		</groupbox>

		<groupbox text="@BODY|.|@ATTRIBUTES" dock="top" overflow="visible" margin="5">

			<panel margin="7,3,2,3" height="18" dock="top">
				<label dock="left" vertical_align="middle" width="80" text="@CSSCLASS|:" text_align="right"/>
				<panel dock="left" width="4" />
				<panel dock="left" jsml-base="rteproptextbox" width="100" propname="class"/>


				<panel dock="left" width="104" />
				<button dock="left" text="@STYLES" css_text="padding:0 10px">
					<attach name="click">
						<![CDATA[
						var newoption={}
						newoption.width=480;
						newoption.height=320;
                  
						newoption.targetnode=option.targetnode;
						newoption.ondialogload=function(dialog)
						{
							dialog._rtenode=option.targetnode;
							dialog.set_back_color("#f9f9f9");
							dialog.set_title(editor.GetLangText("styles"));
						}
						newoption.callback=function(dialog)
						{
							instance.invoke_recursive("loadvalue");
						}
						editor.ShowXmlDialog(editor.BuildDialogUrl("properties_style.xml"),newoption);
						]]>
					</attach>
				</button>
				
			</panel>

			<panel margin="7,3,2,3" height="18" dock="top">
				<label dock="left" vertical_align="middle" text="@COLOR|:" text_align="right" width="80"/>
				<panel dock="left" width="4" />
				<panel dock="left" jsml-base="rtepropcolorbox" propname="style:color" width="100"/>
				<label dock="left" vertical_align="middle" text="@BACKGROUNDCOLOR|:" text_align="right" width="100"/>
				<panel dock="left" width="4" />
				<panel dock="left" jsml-base="rtepropcolorbox" propname="style:background-color" width="100"/>
				
			</panel>




			<panel margin="7,3,2,3" height="18" dock="top">

				<label dock="left" vertical_align="middle" text="@MARGIN|:" width="80" text_align="right"/>
				<panel dock="left" width="4" />
				<panel dock="left" width="60" jsml-base="rtepropnumupdown" propname="style:margin" suffix="px" />
				<image dock="left" width="20" cursor="pointer" src="{folder}images/box.png">
					<attach name="click">
						marginfloatbox._rtenode=option.targetnode;
						marginfloatbox.invoke_recursive("editor_ready",editor);
						marginfloatbox._estyle.zIndex=editor._config.dialog_zindex;
						marginfloatbox.show({control:self,stopDispose:true});
					</attach>
				</image>
				<attach name="disposing">
					marginfloatbox.dispose();
				</attach>
				<panel jsml-base="floatbox" jsml-local="marginfloatbox" jsml-append="false" height="180" padding="18">

					<panel dock="bottom" margin="5">
						<button text="@RESET" right="0">
							<attach name="click">
								option.targetnode.SetStyle("margin-left",null);
								option.targetnode.SetStyle("margin-right",null);
								option.targetnode.SetStyle("margin-top",null);
								option.targetnode.SetStyle("margin-bottom",null);
								marginfloatbox.invoke_recursive("loadvalue");
							</attach>
						</button>
					</panel>

					<panel dock="left" overflow="visible" vertical_align="middle">
						<panel overflow_x="visible" height="20">
							<label dock="left" width="1" overflow="visible" text="@LEFT|:" vertical_align="middle" text_align="right"  />
							<panel dock="left" jsml-base="rtepropnumupdown" propname="style:margin-left" suffix="px" />
						</panel>
					</panel>

					<panel dock="right" overflow="visible" vertical_align="middle">
						<panel overflow_x="visible" height="20">
							<label dock="left" width="60" text="@RIGHT|:" vertical_align="middle" text_align="right"  />
							<panel dock="left" jsml-base="rtepropnumupdown" propname="style:margin-right" suffix="px" />
						</panel>
					</panel>
					<panel dock="top" overflow="visible" horizontal_align="center">
						<panel overflow_x="visible" height="20">
							<label dock="left" width="60" text="@TOP|:" vertical_align="middle" text_align="right"  />
							<panel dock="left" jsml-base="rtepropnumupdown" propname="style:margin-top" suffix="px" />
						</panel>
					</panel>
					<panel dock="bottom" overflow="visible" horizontal_align="center">
						<panel overflow_x="visible" height="20">
							<label dock="left" width="60" text="@BOTTOM|:" vertical_align="middle" text_align="right"  />
							<panel dock="left" jsml-base="rtepropnumupdown" propname="style:margin-bottom" suffix="px" />
						</panel>
					</panel>
				</panel>

			</panel>



			<panel margin="7,3,2,3" height="18" dock="top">

				<label dock="left" vertical_align="middle" text="@PADDING|:" width="80" text_align="right"/>
				<panel dock="left" width="4" />
				<panel dock="left" width="60" jsml-base="rtepropnumupdown" propname="style:padding" suffix="px" min_value="0" />
				<image dock="left" width="20" cursor="pointer" src="{folder}images/box.png">
					<attach name="click">
						paddingfloatbox._rtenode=option.targetnode;
						paddingfloatbox.invoke_recursive("editor_ready",editor);
						paddingfloatbox._estyle.zIndex=editor._config.dialog_zindex;
						paddingfloatbox.show({control:self,stopDispose:true});
					</attach>
				</image>
				<attach name="disposing">
					paddingfloatbox.dispose();
				</attach>
				<panel jsml-base="floatbox" jsml-local="paddingfloatbox" jsml-append="false" height="180" padding="18">

					<panel dock="bottom" margin="5">
						<button text="@RESET" right="0">
							<attach name="click">
								option.targetnode.SetStyle("padding-left",null);
								option.targetnode.SetStyle("padding-right",null);
								option.targetnode.SetStyle("padding-top",null);
								option.targetnode.SetStyle("padding-bottom",null);
								paddingfloatbox.invoke_recursive("loadvalue");
							</attach>
						</button>
					</panel>

					<panel dock="left" overflow="visible" vertical_align="middle">
						<panel overflow_x="visible" height="20">
							<label dock="left" width="1" overflow="visible" text="@LEFT|:" vertical_align="middle" text_align="right"  />
							<panel dock="left" jsml-base="rtepropnumupdown" propname="style:padding-left" suffix="px" />
						</panel>
					</panel>

					<panel dock="right" overflow="visible" vertical_align="middle">
						<panel overflow_x="visible" height="20">
							<label dock="left" width="60" text="@RIGHT|:" vertical_align="middle" text_align="right"  />
							<panel dock="left" jsml-base="rtepropnumupdown" propname="style:padding-right" suffix="px" />
						</panel>
					</panel>
					<panel dock="top" overflow="visible" horizontal_align="center">
						<panel overflow_x="visible" height="20">
							<label dock="left" width="60" text="@TOP|:" vertical_align="middle" text_align="right"  />
							<panel dock="left" jsml-base="rtepropnumupdown" propname="style:padding-top" suffix="px" />
						</panel>
					</panel>
					<panel dock="bottom" overflow="visible" horizontal_align="center">
						<panel overflow_x="visible" height="20">
							<label dock="left" width="60" text="@BOTTOM|:" vertical_align="middle" text_align="right"  />
							<panel dock="left" jsml-base="rtepropnumupdown" propname="style:padding-bottom" suffix="px" />
						</panel>
					</panel>
				</panel>
			</panel>


			<panel margin="7,3,2,3" height="18" dock="top">

				<label dock="left" width="80" text="@BORDER|:" vertical_align="middle" text_align="right"  />
				<panel dock="left" width="4" />
				<panel dock="left" width="60" jsml-base="rtepropnumupdown" propname="style:border-width" suffix="px" min_value="0">
					<attach name="change">
						<![CDATA[
						var size=parseInt(self.get_text());
						if(isNaN(size))
							ddborderstyle.set_text("");
						else if(size&&!ddborderstyle.get_text())
							ddborderstyle.set_text("solid");
						]]>
					</attach>
				</panel>
				<image dock="left" width="20" cursor="pointer" src="{folder}images/box.png">
					<attach name="click">
						borderfloatbox._rtenode=option.targetnode;
						borderfloatbox.invoke_recursive("editor_ready",editor);
						borderfloatbox._estyle.zIndex=editor._config.dialog_zindex;
						borderfloatbox.show({control:self,stopDispose:true});
					</attach>
				</image>
				<attach name="disposing">
					borderfloatbox.dispose();
				</attach>
				<panel jsml-base="floatbox" jsml-local="borderfloatbox" jsml-append="false" height="180" padding="18">


					<panel dock="bottom" margin="5">
						<button text="@RESET" right="0">
							<attach name="click">
								option.targetnode.SetStyle("border-left-width",null);
								option.targetnode.SetStyle("border-right-width",null);
								option.targetnode.SetStyle("border-top-width",null);
								option.targetnode.SetStyle("border-bottom-width",null);
								borderfloatbox.invoke_recursive("loadvalue");
							</attach>
						</button>
					</panel>

					<panel dock="left" overflow="visible" vertical_align="middle">
						<panel overflow_x="visible" height="20">
							<label dock="left" width="1" overflow="visible" text="@LEFT|:" vertical_align="middle" text_align="right"  />
							<panel dock="left" jsml-base="rtepropnumupdown" propname="style:border-left-width" suffix="px" />
						</panel>
					</panel>

					<panel dock="right" overflow="visible" vertical_align="middle">
						<panel overflow_x="visible" height="20">
							<label dock="left" width="60" text="@RIGHT|:" vertical_align="middle" text_align="right"  />
							<panel dock="left" jsml-base="rtepropnumupdown" propname="style:border-right-width" suffix="px" />
						</panel>
					</panel>
					<panel dock="top" overflow="visible" horizontal_align="center">
						<panel overflow_x="visible" height="20">
							<label dock="left" width="60" text="@TOP|:" vertical_align="middle" text_align="right"  />
							<panel dock="left" jsml-base="rtepropnumupdown" propname="style:border-top-width" suffix="px" />
						</panel>
					</panel>
					<panel dock="bottom" overflow="visible" horizontal_align="center">
						<panel overflow_x="visible" height="20">
							<label dock="left" width="60" text="@BOTTOM|:" vertical_align="middle" text_align="right"  />
							<panel dock="left" jsml-base="rtepropnumupdown" propname="style:border-bottom-width" suffix="px" />
						</panel>
					</panel>

				</panel>

				<panel dock="left" width="72" jsml-base="rtepropcolorbox" propname="style:border-color" />

				<panel dock="left" width="85" jsml-local="ddborderstyle" margin="0,0,0,4" jsml-base="rtepropdropdown" propname="style:border-style">
					<listitem value="" text="@BORDER_NOTSET" />
					<listitem value="solid" text="@BORDER_SOLID" />
					<listitem value="dotted" text="@BORDER_DOTTED" />
					<listitem value="dashed" text="@BORDER_DASHED" />
					<listitem value="outset" text="@BORDER_OUTSET" />
					<listitem value="inset" text="@BORDER_INSET" />
				</panel>

			</panel>

			<panel margin="7,3,2,3" height="18" dock="top">
			</panel>


		</groupbox>


		<initialize>
			self._rtenode=option.targetnode;
		</initialize>

	</panel>

	<panel jsml-base="pageprops_dialog" />

</jsml>
