Documented style type

git-svn-id: svn://svn.code.sf.net/p/magicseteditor/code/trunk@597 0fc631ac-6414-0410-93d0-97cfa31319b6

doc/type/choice_render_style.txt

@@ -0,0 +1,31 @@
+Enumeration: render style
+
+A way to render a choice [[type:field]], see [[type:style]].
+
+--Possible values--
+! Value			Sketch		Description
+| @text@		<img src="choice-render-style-text.png" alt=""/>
+		 	Rendered as text
+| @image@		<img src="choice-render-style-image.png" alt=""/>
+		 	Rendered as an image
+| @both@		<img src="choice-render-style-both.png" alt=""/>
+		 	Both an image and text
+| @hidden@		<img src="choice-render-style-hidden.png" alt=""/>
+		 	The box is hidden, but the value can still be edited.
+| @image hidden@	<img src="choice-render-style-hidden.png" alt=""/>
+		 	The box is hidden, but the value can still be edited.
+| @checklist@		<img src="choice-render-style-checklist-text.png" alt=""/>
+		 	A list of checkboxes, for multiple choice styles.
+| @image checklist@	<img src="choice-render-style-checklist-image.png" alt=""/>
+		 	A list of checkboxes with images instead of text.
+| @both checklist@	<img src="choice-render-style-checklist-both.png" alt=""/>
+		 	A list of checkboxes with both images and text.
+| @text list@		<img src="choice-render-style-list-text.png" alt=""/>
+		 	A list of the selected items, for multiple choice styles.
+| @image list@		<img src="choice-render-style-list-image.png" alt=""/>
+		 	A list of the selected items with images instead of text.
+| @both list@		<img src="choice-render-style-list-both.png" alt=""/>
+		 	A list of the selected items with both images and text.
+
+--Examples--
+> render style: image

doc/type/field.txt

@@ -43,14 +43,15 @@ Fields are part of the [[file:style triangle]]:
 | @tab index@		[[type:int]]		@0@		Index for moving through the fields with the tab key. The default is from left to right and then top to bottom.
 
 The @type@ determines what values of this field contain:
-! Type			Values contain
-| @text@		Text with markup (a [[type:tagged string]])
-| @choice@		A choice from a list
-| @multiple choice@	Zero or more choices from a list
-| @boolean@		@yes@ or @no@
-| @image@		Any image
-| @symbol@		A [[type:symbol]] edited with the symbol editor
-| @info@		An informational message, for example to group fields together.
+! Type			Values contain								Displayed as
+| @text@		Text with markup (a [[type:tagged string]])				Text
+| @choice@		A choice from a list							Text or an image
+| @multiple choice@	Zero or more choices from a list					A single image or multiple images
+| @boolean@		@yes@ or @no@								Text or an image or both
+| @color@		Any color or a restricted selection from a list				A box filled with the color
+| @image@		Any image								The image
+| @symbol@		A [[type:symbol]] edited with the symbol editor				The image
+| @info@		An informational message, for example to group fields together.		A box containing the label
 
 Additional properties are available, depending on the type of field:
 

doc/type/script.txt

@@ -0,0 +1,19 @@
+Data type: script
+
+--Overview--
+
+A script object is a piece of code written in the [[script:index|MSE scripting language]].
+
+--File syntax--
+
+A script is given in the same way as a [[type:string]].
+
+--Example--
+A simple [[type:field]] script that converts everything to upper case:
+>script: to_upper(value)
+
+A larger script, changes @"y"@s to @"x"@s and @"a"@s to @"b"@s:
+>script:
+>	new_value := replace(value, match: "x", replace: "y")
+>	new_value := replace(value, match: "a", replace: "b")
+>	new_value

doc/type/scriptable.txt

@@ -0,0 +1,34 @@
+Data type: scriptable
+
+--Overview--
+
+Many [[type:style]] properties are ''scriptable''; their value can be changed by a script.
+
+Consider for example:
+>left: 123
+This defines that the left coordinate of a field is 123 pixels.
+To script this you can write:
+>left: { if card.name == "" then 100 else 123 }
+Now the left position depends on whether or not the name is empty.
+
+--File syntax--
+A 'scriptable something' can take three forms:
+# It can be a regular 'something'
+  >something: 123
+# It can be a script that produces 'something', enclosed in curly braces:
+  >something: {100 + 23}
+# It can be a script that produces 'something', indented and preceded by @script:@:
+  >something:
+  >	script: 100 + 23
+
+Note: To use a multiline script the following does not work:
+>something: { 100 +
+>             23 }
+If the script has multiple lines, it must start on a new line, and be indented with a TAB:
+>something:
+>	{ 100 +
+>	  23 }
+or
+>something:
+>	script: 100 +
+>	        23

doc/type/style.txt

@@ -0,0 +1,128 @@
+Data type: style
+
+--Overview--
+
+A style specifies how a [[type:field]] should look,
+things like position, size, fonts, colors, etc.
+
+Styles are part of the [[file:style triangle]]:
+| Description		Looks			Data
+| [[type:Game]]		[[type:Stylesheet]]	[[type:Set]]
+| [[type:Field]]	'''Style'''		[[type:Value]]
+
+--Positioning--
+
+<img src="style-positioning.png" alt="" style="float:right;border:1px solid #ccc;"/>
+A style specifies the position of a box for the content.
+To specify the horizontal location ''two'' of @left@, @width@ and @right@ must be specified.
+
+For example:
+> left:  10
+> width: 20
+Implies that @right@ is 30 pixels if the card is 60 pixels wide.
+
+Similairly:
+> left: 10
+> right: 30
+Implies the @width@ is 20.
+
+The same holds for the vertical location and size; @top@, @height@ and @bottom@.
+
+--Rotation--
+Some types of styles allow an @angle@ to be specified.
+The angle gives a counter clockwise rotation in degrees of the ''contents'' of the box.
+
+For example, a text field with style:
+>example:
+>	width: 60
+>	height: 40
+>	alignment: top left
+Would, with different angles, look like:<br/>
+<img src="style-angle.png" alt=""/>
+
+--Properties--
+! Property		Type					Default		Description
+| @z index@		[[type:int]]				@0@		Stacking of this box, fields with a heigher @z index@ are placed on top of those with a lower index.
+| @left@		[[type:scriptable]] [[type:double]]	''Required''	Distance between left edge of the box and the left of the card in pixels.
+| @width@		[[type:scriptable]] [[type:double]]	''Required''	Width of the box in pixels.
+| @right@		[[type:scriptable]] [[type:double]]	''Required''	Distance between right edge of the box and the right of the card in pixels.
+| @top@			[[type:scriptable]] [[type:double]]	''Required''	Distance between top edge of the box and the top of the card in pixels.
+| @height@		[[type:scriptable]] [[type:double]]	''Required''	Height of the box in pixels.
+| @bottom@		[[type:scriptable]] [[type:double]]	''Required''	Distance between bottom edge of the box and the bottom of the card in pixels.
+| @visible@		[[type:scriptable]] [[type:boolean]]	@true@		Is this field visible at all?
+
+The rest of the properties depend on the type of [[type:field]] this style is for.
+! Type		Property		Type			Default		Description
+| @"text"@	@font@			[[type:font]]		''Required'' 	Font to render the text.
+| ^^^		@symbol font@		[[type:symbol font]]	 		Font to render symbols in the text (optional).
+| ^^^		@always symbol@		[[type:boolean]]	@false@		Should all text be rendered with symbols?<br/>If set, @font@ is not needed.
+| ^^^		@allow formating@	[[type:boolean]]	@true@		Is custom formating (bold, italic) allowed?
+| ^^^		@alignment@		[[type:scriptable]] [[type:alignment]]	@top left@	Alignment of the text.
+| ^^^		@angle@			[[type:scriptable]] [[type:int]]	@0@		Rotation of the text inside the box, in degrees.
+| ^^^		@direction@		[[type:direction]]	@"left to right"@	Direction in which the text flows. If set to @"vertical"@ it is as if a line break is inserted after each character.
+| ^^^		@padding left@		[[type:double]]		@0@		Padding between the text and the border of the box, in pixels.
+| ^^^		@padding right@		^^^			^^^		^^^
+| ^^^		@padding top@		^^^			^^^		^^^
+| ^^^		@padding bottom@	^^^			^^^		^^^
+| ^^^		@padding left min@	[[type:double]]		&infin;		Minimal padding around the field.<br/> When the text is scalled down the padding is scalled as well, but it becomes no smaller than this.
+| ^^^		@padding right min@	^^^			^^^		^^^
+| ^^^		@padding top min@	^^^			^^^		^^^
+| ^^^		@padding bottom min@	^^^			^^^		^^^
+| ^^^		@line height soft@	[[type:double]]		@1@		Multiplier for the line height of 'soft' line breaks. These are breaks caused by wrapping around lines that are too long.<br/>
+		 			 			 		A line height of @0@ means all lines are in the same position, @1@ is normal behaviour, @2@ skips a line, etc.
+| ^^^		@line height hard@	[[type:double]]		@1@		Multiplier for the line height of 'hard' line breaks. These are breaks caused by the enter key.
+| ^^^		@line height line@	[[type:double]]		@1@		Multiplier for the line height of 'soft' line breaks. These are breaks caused by @"<line>\n</line>"@ tags.
+| ^^^		@mask@			[[type:filename]]	''none''	A mask that indicates where in the box text can be placed.<br/>
+		 			 			 		Text is never put in black areas of the box:<br/>
+		 			 			 		<img src="style-text-mask.png" alt=""/>
+| ^^^		@content width@		[[type:double]]		''automatic''	When read from a script, gives the width of the current content in this box.
+| ^^^		@content height@	[[type:double]]		''automatic''	When read from a script, gives the height of the current content in this box.
+| ^^^		@content lines@		[[type:int]]		''automatic''	When read from a script, gives the number of lines of the current content in this box.
+	
+!	<<<	<<<	<<<	<<<
+| @"choice"@, @"multiple choice"@, @"boolean"@
+		@popup style@	@"drop down"@ or @"in place"@		@"drop down"@	Where to place the drop down box for editing the value.<br/>
+		 		 					 		@"drop down"@ places the box below the field, similair to normal combo boxes.<br/>
+		 		 					 		@"in place"@ places the box at the mouse coordinates.
+| ^^^		@render style@	[[type:choice render style]]		@"text"@	How should the field be rendered?
+| ^^^		@mask@		[[type:scriptable]] [[type:filename]]	''none''	A mask to apply to the image, black areas in the mask become transparent, similair to [[fun:set_mask]].
+| ^^^		@combine@	[[type:combine]]			@"normal"@	How to combine the image with the background? Can be overriden using the [[fun:set_combine]] function.
+| ^^^		@alignment@	[[type:alignment]]	 				Alignment of text and images in the box.
+| ^^^		@angle@		[[type:int]]				@0@		Rotation of the text and images inside the box, in degrees.
+| ^^^		@font@		[[type:font]]				 		Font to use for rendering text (depending on @render style@)
+| ^^^		@image@		[[type:image|scriptable image]]		 		Image to show (depending on @render style@).<br/>
+		 		 					 		The script will be called with @input@ set to the value to determine an image for.
+| ^^^		@choice images@	[[type:map]] of [[type:image]]s		 		An alternative way to specify what image to show.<br/>
+		 		 					 		For each [[type:choice]] a separate image is specified.
+| @"multiple choice"@
+		@direction@	[[type:direction]]		@"left to right"@	Direction the items are layed out in, only when @render style@ is @list@.
+| ^^^		@spacing@	[[type:double]]			@0@			Spacing between the items.
+	
+!	<<<	<<<	<<<	<<<
+| @"color"@	@radius@	[[type:script]]		@0@	Radius of rounded corners for the box in pixels.
+| ^^^		@left width@	[[type:double]]		&infin;	Draw only this many pixels from the side, creating a box with a hole in it, or a card border.
+| ^^^		@right width@	^^^			^^^	^^^
+| ^^^		@top width@	^^^			^^^	^^^
+| ^^^		@bottom width@	^^^			^^^	^^^
+| ^^^		@mask@	[[type:scriptable]] [[type:filename]]	''none''	A mask to apply to the box, black areas in the mask become transparent.
+	
+!	<<<	<<<	<<<	<<<
+| @"image"@	@mask@		[[type:scriptable]] [[type:filename]]	''none''	A mask to apply to the image, black areas in the mask become transparent, similair to [[fun:set_mask]].
+		@default@	[[type:image|scriptable image]]		''none''	A default image to use when the card has none.
+	
+!	<<<	<<<	<<<	<<<
+| @"symbol"@	@variations@	[[type:list]] of [[type:symbol variation]]s	 	Available variations of the symbol, a variation describes color and border size.
+|		@min aspec ratio@	[[type:double]]		@1@		Bounds for the aspect ratio, @width/height@ symbols can take. This can be used to make non-squary symbols.
+|		@max aspec ratio@	[[type:double]]		@1@		^^^
+	
+!	<<<	<<<	<<<	<<<
+| @"info"@	@font@			[[type:font]]		''Required'' 	Font to render the text.
+| ^^^		@alignment@		[[type:scriptable]] [[type:alignment]]	@top left@	Alignment of the text.
+| ^^^		@padding left@		[[type:double]]		@0@		Padding between the text and the border of the box, in pixels.
+| ^^^		@padding right@		^^^			^^^		^^^
+| ^^^		@padding top@		^^^			^^^		^^^
+| ^^^		@padding bottom@	^^^			^^^		^^^
+| ^^^		@background color@	[[type:color]]		@rgb(255,255,255)@	Background color for the box, can be used to make it stand out.
+
+--Example--
+

doc/type/symbol_variation.txt

@@ -0,0 +1,46 @@
+Data type: symbol variation
+
+--Overview--
+
+A variation of a symbol, describes color and border.
+
+--Properties--
+! Property		Type			Default		Description
+| @name@		[[type:string]]		''Required''	Name of this variation, refered to by the [[fun:symbol_variation]] function.
+| @border radius@	[[type:double]]		@0.05@		Border radius of the symbol.
+| @fill type@		@solid@ or @linear gradient@ or @radial gradient@
+			 			@"solid"@	How to fill the symbol.
+
+Depending on the @fill type@ there are additional properties:
+! Fill type		Property		Type		Description
+| @"solid"@		@fill color@		[[type:color]]	Color to use for filling the symbol.
+| ^^^			@border color@		[[type:color]]	Color to use for the border of the symbol.
+| @"linear gradient"@	@fill color 1@		[[type:color]]	Color to use for filling the symbol at the center of the gradient.
+| ^^^			@border color 1@	[[type:color]]	Color to use for the border of the symbol at the center of the gradient.
+| ^^^			@fill color 2@		[[type:color]]	Color to use for filling the symbol at the ends of the gradient.
+| ^^^			@border color 2@	[[type:color]]	Color to use for the border of the symbol at the ends of the gradient.
+| ^^^			@center x@, @center y@	[[type:double]]	Position of the center point of the gradient (in the range 0 to 1)
+| ^^^			@end x@, @end y@	[[type:double]]	Position of the end point of the gradient (in the range 0 to 1)
+| @"radial gradient"@	@fill color 1@		[[type:color]]	Color to use for filling the symbol at the center of the symbol.
+| ^^^			@border color 1@	[[type:color]]	Color to use for the border of the symbol at the center of the symbol.
+| ^^^			@fill color 2@		[[type:color]]	Color to use for filling the symbol at the edges of the symbol.
+| ^^^			@border color 2@	[[type:color]]	Color to use for the border of the symbol at the edges of the symbol.
+
+--Examples--
+'Common' and 'uncommon' magic expansion symbol styles:
+>variation:
+>	name: common
+>	border radius: 0.10
+>	# White border, black fill
+>	fill type: solid
+>	fill color:   rgb(0,0,0)
+>	border color: rgb(255,255,255)
+>variation:
+>	name: uncommon
+>	border radius: 0.05
+>	fill type: linear gradient
+>	# Black border, silver gradient fill
+>	fill color 1:   rgb(224,224,224)
+>	fill color 2:   rgb(84, 84, 84)
+>	border color 1: rgb(0,  0,  0)
+>	border color 2: rgb(0,  0,  0)