From 1a759361b82127f9d5c1428dc889fffdf2daaf86 Mon Sep 17 00:00:00 2001 From: John Mayhew Date: Thu, 3 May 2012 15:11:56 -0700 Subject: First round of moving color chips into the sub tools. Shape and Pen tool now have chips in the sub tool bar. Still need to complete adding chips to the Brush tool and finalizing the subtool bar layout to our spec for all of the subtools. --- .../shape-properties.reel/shape-properties.html | 14 +++++++++++--- 1 file changed, 11 insertions(+), 3 deletions(-) (limited to 'js/components/tools-properties/shape-properties.reel/shape-properties.html') diff --git a/js/components/tools-properties/shape-properties.reel/shape-properties.html b/js/components/tools-properties/shape-properties.reel/shape-properties.html index 117664a3..d3faab75 100755 --- a/js/components/tools-properties/shape-properties.reel/shape-properties.html +++ b/js/components/tools-properties/shape-properties.reel/shape-properties.html @@ -36,6 +36,7 @@ } }, + "_strokeSize1": { "prototype": "js/components/hottextunit.reel[HotTextUnit]", "properties": { @@ -108,6 +109,10 @@ "_materialLabel": {"#": "materialLabel"}, "_strokeIcon": {"#": "strokeIcon"}, + "_fillColorCtrlIcon": {"#": "fillColorCtrlIcon"}, + "_fillColorCtrl": {"#": "fillColorCtrl"}, + "_strokeColorCtrl": {"#": "strokeColorCtrl"}, + "_strokeSize": {"@": "_strokeSize1"}, "ovalProperties": {"@": "ovalProperties1"}, "rectProperties": {"@": "rectProperties1"}, @@ -121,20 +126,23 @@ } } - </script> + </script> </head> <body> - <div id="shapeProperties" class="subToolHolderPanel"> + <div id="shapeProperties" class="subToolHolderPanel optionsShapeTool"> <div id="shapeToolsList"> <div id="toolbutton"></div> </div> + <div data-montage-id="fillColorCtrlIcon" class="colorCtrlIcon FillTool"></div> + <div data-montage-id="fillColorCtrl" class="fillColorCtrl"></div> + <div class="colorCtrlIcon PencilTool"></div> + <div data-montage-id="strokeColorCtrl" class="strokeColorCtrl"></div> <label class="label">Stroke:</label> <div id="strokeControl" class="label"></div> - <div id="customProperties"> <div id="ovalProperties" class="label"></div> <div id="rectProperties" class="label"></div> -- cgit v1.2.3 From 29ad6355ef60cfb3b3fc7f780504f3ed30845883 Mon Sep 17 00:00:00 2001 From: John Mayhew Date: Mon, 7 May 2012 14:30:47 -0700 Subject: More implementation of moving color chips to the individual subtools. Removed the tool color bar Added new icons for inkbottle Removed Pencil tool Removed Inkbottle tool Added chips to the pen, brush and tag tools Aligned controls in several subtools --- .../tools-properties/shape-properties.reel/shape-properties.html | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) (limited to 'js/components/tools-properties/shape-properties.reel/shape-properties.html') diff --git a/js/components/tools-properties/shape-properties.reel/shape-properties.html b/js/components/tools-properties/shape-properties.reel/shape-properties.html index d3faab75..3c492e6e 100755 --- a/js/components/tools-properties/shape-properties.reel/shape-properties.html +++ b/js/components/tools-properties/shape-properties.reel/shape-properties.html @@ -136,11 +136,11 @@ <div id="shapeToolsList"> <div id="toolbutton"></div> </div> - <div data-montage-id="fillColorCtrlIcon" class="colorCtrlIcon FillTool"></div> - <div data-montage-id="fillColorCtrl" class="fillColorCtrl"></div> <div class="colorCtrlIcon PencilTool"></div> <div data-montage-id="strokeColorCtrl" class="strokeColorCtrl"></div> - + <div data-montage-id="fillColorCtrlIcon" class="colorCtrlIcon FillTool"></div> + <div data-montage-id="fillColorCtrl" class="fillColorCtrl"></div> + <div class="nj-divider divider-vertical"> </div> <label class="label">Stroke:</label> <div id="strokeControl" class="label"></div> <div id="customProperties"> @@ -149,7 +149,7 @@ <div id="lineProperties" class="label"></div> </div> - <label class="label subOption optionLabel"><input id="useWebGLCH" type="checkbox" name="useWebGLControl" class="checkBoxAlign"/>Use WebGL</label> + <label class="label subOption optionLabel"><input id="useWebGLCH" type="checkbox" name="useWebGLControl" class="nj-skinned"/>Use WebGL</label> <label id="materialLabel" class="label">Material:</label> <div id="strokeIcon" class="pencilToolUp" style="float: left;"></div> -- cgit v1.2.3 From 33bb9b7e97e9ec3bd664b3e1c3e7297ba8d07ede Mon Sep 17 00:00:00 2001 From: John Mayhew Date: Mon, 7 May 2012 15:44:18 -0700 Subject: more work on making subtool styling/layout consistent --- .../tools-properties/shape-properties.reel/shape-properties.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'js/components/tools-properties/shape-properties.reel/shape-properties.html') diff --git a/js/components/tools-properties/shape-properties.reel/shape-properties.html b/js/components/tools-properties/shape-properties.reel/shape-properties.html index 3c492e6e..cc3534f2 100755 --- a/js/components/tools-properties/shape-properties.reel/shape-properties.html +++ b/js/components/tools-properties/shape-properties.reel/shape-properties.html @@ -149,7 +149,7 @@ <div id="lineProperties" class="label"></div> </div> - <label class="label subOption optionLabel"><input id="useWebGLCH" type="checkbox" name="useWebGLControl" class="nj-skinned"/>Use WebGL</label> + <input id="useWebGLCH" type="checkbox" name="useWebGLControl" class="nj-skinned"/><label class="label">Use WebGL</label> <label id="materialLabel" class="label">Material:</label> <div id="strokeIcon" class="pencilToolUp" style="float: left;"></div> -- cgit v1.2.3 From 9f0754eb0c619e9e33df707f24eed1dd6ae95096 Mon Sep 17 00:00:00 2001 From: John Mayhew Date: Tue, 8 May 2012 14:48:28 -0700 Subject: implemented proper styling for shape, inkbottle and fill tools make all icons for fill and stroke use the proper classes/images --- .../tools-properties/shape-properties.reel/shape-properties.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) (limited to 'js/components/tools-properties/shape-properties.reel/shape-properties.html') diff --git a/js/components/tools-properties/shape-properties.reel/shape-properties.html b/js/components/tools-properties/shape-properties.reel/shape-properties.html index e84f8092..9363365e 100755 --- a/js/components/tools-properties/shape-properties.reel/shape-properties.html +++ b/js/components/tools-properties/shape-properties.reel/shape-properties.html @@ -152,12 +152,12 @@ <input data-montage-id="useWebGLCH" type="checkbox" name="useWebGLControl" class="nj-skinned"/><label class="label">Use WebGL</label> <label data-montage-id="materialLabel" class="label">Material:</label> - <div data-montage-id="strokeIcon" class="pencilToolUp" style="float: left;"></div> + <div data-montage-id="strokeIcon" class="colorCtrlIcon PencilTool"></div> <select class="selectBox" data-montage-id="strokeMaterialCB"> </select> - <div data-montage-id="fillIcon" class="bucketToolUp" style="float: left;"></div> + <div data-montage-id="fillIcon" class="colorCtrlIcon FillTool"></div> <select class="selectBox" data-montage-id="fillMaterialCB"> </select> -- cgit v1.2.3 From 7dd942b6e19d2d7a779bc50e7bf4c8f8780b8f3a Mon Sep 17 00:00:00 2001 From: John Mayhew Date: Wed, 9 May 2012 14:19:14 -0700 Subject: Correct layout and styling for the shape tool and its sub tools --- .../tools-properties/shape-properties.reel/shape-properties.html | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) (limited to 'js/components/tools-properties/shape-properties.reel/shape-properties.html') diff --git a/js/components/tools-properties/shape-properties.reel/shape-properties.html b/js/components/tools-properties/shape-properties.reel/shape-properties.html index 9363365e..c54f8b25 100755 --- a/js/components/tools-properties/shape-properties.reel/shape-properties.html +++ b/js/components/tools-properties/shape-properties.reel/shape-properties.html @@ -136,6 +136,7 @@ <div data-montage-id="shapeToolsList"> <div data-montage-id="toolbutton"></div> </div> + <div class="nj-divider divider-vertical toolOptionsSpacer"> </div> <div class="colorCtrlIcon PencilTool"></div> <div data-montage-id="strokeColorCtrl" class="strokeColorCtrl"></div> <div data-montage-id="fillColorCtrlIcon" class="colorCtrlIcon FillTool"></div> @@ -143,7 +144,7 @@ <div class="nj-divider divider-vertical"> </div> <label class="label">Stroke:</label> <div data-montage-id="strokeControl" class="label"></div> - <div id="customProperties"> + <div id="customProperties" class="shapeCustomProps"> <div data-montage-id="ovalProperties" class="label"></div> <div data-montage-id="rectProperties" class="label"></div> <div data-montage-id="lineProperties" class="label"></div> -- cgit v1.2.3 From 18370abcf406c6ab36d5c5f2613cb79e756ff6d2 Mon Sep 17 00:00:00 2001 From: John Mayhew Date: Wed, 9 May 2012 18:07:32 -0700 Subject: -Consolidated many redundant css classes used in the tool options bars --- .../shape-properties.reel/shape-properties.html | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) (limited to 'js/components/tools-properties/shape-properties.reel/shape-properties.html') diff --git a/js/components/tools-properties/shape-properties.reel/shape-properties.html b/js/components/tools-properties/shape-properties.reel/shape-properties.html index c54f8b25..c6aa0c94 100755 --- a/js/components/tools-properties/shape-properties.reel/shape-properties.html +++ b/js/components/tools-properties/shape-properties.reel/shape-properties.html @@ -132,15 +132,15 @@ </head> <body> - <div data-montage-id="shapeProperties" class="subToolHolderPanel optionsShapeTool"> + <div data-montage-id="shapeProperties" class="subToolHolderPanel optionsShapeTool toolOptionsFloatChildren"> <div data-montage-id="shapeToolsList"> <div data-montage-id="toolbutton"></div> </div> <div class="nj-divider divider-vertical toolOptionsSpacer"> </div> - <div class="colorCtrlIcon PencilTool"></div> - <div data-montage-id="strokeColorCtrl" class="strokeColorCtrl"></div> - <div data-montage-id="fillColorCtrlIcon" class="colorCtrlIcon FillTool"></div> - <div data-montage-id="fillColorCtrl" class="fillColorCtrl"></div> + <div class="toolColorChipIcon PencilTool"></div> + <div data-montage-id="strokeColorCtrl" class="toolColorChipCtrl"></div> + <div data-montage-id="fillColorCtrlIcon" class="toolColorChipIcon FillTool"></div> + <div data-montage-id="fillColorCtrl" class="toolColorChipCtrl"></div> <div class="nj-divider divider-vertical"> </div> <label class="label">Stroke:</label> <div data-montage-id="strokeControl" class="label"></div> @@ -153,12 +153,12 @@ <input data-montage-id="useWebGLCH" type="checkbox" name="useWebGLControl" class="nj-skinned"/><label class="label">Use WebGL</label> <label data-montage-id="materialLabel" class="label">Material:</label> - <div data-montage-id="strokeIcon" class="colorCtrlIcon PencilTool"></div> + <div data-montage-id="strokeIcon" class="toolColorChipIcon PencilTool"></div> <select class="selectBox" data-montage-id="strokeMaterialCB"> </select> - <div data-montage-id="fillIcon" class="colorCtrlIcon FillTool"></div> + <div data-montage-id="fillIcon" class="toolColorChipIcon FillTool"></div> <select class="selectBox" data-montage-id="fillMaterialCB"> </select> -- cgit v1.2.3 From 3be15e2076f2d3d46862bbc0ea078b9bf2e161fe Mon Sep 17 00:00:00 2001 From: John Mayhew Date: Thu, 10 May 2012 11:17:42 -0700 Subject: -moved sel tool images to proper folder -finished styling shape tool options -added new icons for shape tool --- .../shape-properties.reel/shape-properties.html | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) (limited to 'js/components/tools-properties/shape-properties.reel/shape-properties.html') diff --git a/js/components/tools-properties/shape-properties.reel/shape-properties.html b/js/components/tools-properties/shape-properties.reel/shape-properties.html index c6aa0c94..9b523a3f 100755 --- a/js/components/tools-properties/shape-properties.reel/shape-properties.html +++ b/js/components/tools-properties/shape-properties.reel/shape-properties.html @@ -118,6 +118,8 @@ "rectProperties": {"@": "rectProperties1"}, "lineProperties": {"@": "lineProperties1"}, + "endDivider": {"#": "endDivider"}, + "components": [ {"@": "repetition1"} ] @@ -144,14 +146,14 @@ <div class="nj-divider divider-vertical"> </div> <label class="label">Stroke:</label> <div data-montage-id="strokeControl" class="label"></div> + <div class="nj-divider divider-vertical"> </div> <div id="customProperties" class="shapeCustomProps"> <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> - + <div data-montage-id="endDivider" class="nj-divider divider-vertical toolOptionsSpacer"> </div> <input data-montage-id="useWebGLCH" type="checkbox" name="useWebGLControl" class="nj-skinned"/><label class="label">Use WebGL</label> - <label data-montage-id="materialLabel" class="label">Material:</label> <div data-montage-id="strokeIcon" class="toolColorChipIcon PencilTool"></div> @@ -160,9 +162,7 @@ <div data-montage-id="fillIcon" class="toolColorChipIcon FillTool"></div> <select class="selectBox" data-montage-id="fillMaterialCB"> - </select> - - + </select> </div> </body> -- cgit v1.2.3