<!DOCTYPE HTML>
<!-- <copyright>
 This file contains proprietary software owned by Motorola Mobility, Inc.<br/>
 No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/>
 (c) Copyright 2011 Motorola Mobility, Inc.  All Rights Reserved.
 </copyright> -->
<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=utf-8" />
        <link rel="stylesheet" type="text/css" href="shape-properties.css">

        <script type="text/montage-serialization">
        {

            "ovalProperties1": {
                "prototype": "js/components/tools-properties/oval-properties.reel",
                "properties": {
                    "element": {"#": "ovalProperties"},
                    "base": {"@": "owner"}
                }
            },

            "rectProperties1": {
                "prototype": "js/components/tools-properties/rect-properties.reel",
                "properties": {
                    "element": {"#": "rectProperties"},
                    "base": {"@": "owner"}
                }
            },

            "lineProperties1": {
                "prototype": "js/components/tools-properties/line-properties.reel",
                "properties": {
                    "element": {"#": "lineProperties"},
                    "base": {"@": "owner"}
                }
            },

            "_strokeSize1": {
                "prototype": "js/components/hottextunit.reel[HotTextUnit]",
                "properties": {
                    "element": {"#": "strokeControl"},
                    "minValue": 1,
                    "maxValue": 100,
                    "value": 1,
                    "decimalPlace": 10,
                    "acceptableUnits": ["px", "pt"]
                    
                }
            },

            "_strokeMaterial1": {
                "prototype": "js/components/combobox.reel",
                "properties": {
                    "element": {"#": "strokeMaterialCB"},
                    "labelField": "_name",
                    "dataField": "_name"
                }
            },

            "_fillMaterial1": {
                "prototype": "js/components/combobox.reel",
                "properties": {
                    "element": {"#": "fillMaterialCB"},
                    "labelField": "_name",
                    "dataField": "_name"
                }
            },

            "toolbutton1": {
                "prototype": "js/components/layout/subtool-button.reel[SubToolButton]",
                "properties": {
                    "element": {"#": "toolbutton"}
                },
                "bindings": {
                    "data": {
                        "boundObject": {"@": "repetition1"},
                        "boundObjectPropertyPath": "objectAtCurrentIteration",
                        "oneway": true
                    }
                }
            },

            "repetition1": {
                "prototype": "montage/ui/repetition.reel",
                "properties": {
                    "element": {"#": "shapeToolsList"}
                },
                "bindings": {
                    "objects": {
                        "boundObject": {"@": "owner"},
                        "boundObjectPropertyPath": "toolsData.defaultSubToolsData",
                        "oneway": true
                    }
                }
            },


            "owner": {
                "prototype": "js/components/tools-properties/shape-properties.reel",
                "properties": {
                    "element": {"#": "shapeProperties"},
                    "_strokeMaterial": {"@": "_strokeMaterial1"},
                    "_fillIcon": {"#": "fillIcon"},
                    "_fillMaterial": {"@": "_fillMaterial1"},

                    "_useWebGL": {"#": "useWebGLCH"},
                    "_materialLabel": {"#": "materialLabel"},
                    "_strokeIcon": {"#": "strokeIcon"},

                    "_strokeSize": {"@": "_strokeSize1"},
                    "ovalProperties": {"@": "ovalProperties1"},
                    "rectProperties": {"@": "rectProperties1"},
                    "lineProperties": {"@": "lineProperties1"},

                    "components": [
                        {"@": "repetition1"}
                    ]

                }

            }
    	}
	    </script>

     
    </head>

    <body>
        <div data-montage-id="shapeProperties" class="subToolHolderPanel">
            <div data-montage-id="shapeToolsList">
                <div data-montage-id="toolbutton"></div>
            </div>

            <label class="label">Stroke:</label>
            <div data-montage-id="strokeControl" class="label"></div>

            <div id="customProperties">
                <div data-montage-id="ovalProperties" class="label"></div>
                <div data-montage-id="rectProperties" class="label"></div>
                <div data-montage-id="lineProperties" class="label"></div>
            </div>

            <label class="label subOption optionLabel"><input data-montage-id="useWebGLCH" type="checkbox" name="useWebGLControl" class="checkBoxAlign"/>Use WebGL</label>

            <label data-montage-id="materialLabel" class="label">Material:</label>
            <div data-montage-id="strokeIcon" class="pencilToolUp" style="float: left;"></div>

            <select class="selectBox" data-montage-id="strokeMaterialCB">
            </select>

            <div data-montage-id="fillIcon" class="bucketToolUp" style="float: left;"></div>
            <select class="selectBox" data-montage-id="fillMaterialCB">
            </select>
            
            
        </div>
    </body>

</html>