topical media & game development

talk show tell print

actionscript-book-FilterWorkbench-flexapp-filterPanels-ColorMatrixPanel.mx

actionscript-book-FilterWorkbench-flexapp-filterPanels-ColorMatrixPanel.mx [swf] flex


  <?xml version="1.0" encoding="utf-8"?>
  <mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" 
          xmlns:appc="*"
          implements="actionscript_book_FilterWorkbench_com_example_programmingas3_filterWorkbench_IFilterPanel" 
          right="0" 
          top="0"
          creationComplete="setupChildren();">
          
          <mx:Script>
                  <![CDATA[
                          import mx.events.SliderEvent;
                          //import com.example.programmingas3.filterWorkbench.IFilterFactory;
                          //import com.example.programmingas3.filterWorkbench.ColorMatrixFactory;
                          
                          // ------- Private vars -------
                          private var _filterFactory:actionscript_book_FilterWorkbench_com_example_programmingas3_filterWorkbench_ColorMatrixFactory;
                          
                          // ------- Public properties -------
                          public function get filterFactory():actionscript_book_FilterWorkbench_com_example_programmingas3_filterWorkbench_IFilterFactory
                          {
                                  if (_filterFactory == null)
                                  {
                                          _filterFactory = new actionscript_book_FilterWorkbench_com_example_programmingas3_filterWorkbench_ColorMatrixFactory();
                                  }
                                  
                                  return _filterFactory;
                          }
                          
                          
                          // ------- Public methods -------
                          public function resetForm():void
                          {
                                  setMatrixForm([1, 0, 0, 0, 0,
                                                             0, 1, 0, 0, 0,
                                                             0, 0, 1, 0, 0,
                                                             0, 0, 0, 1, 0]);
                                  
                                  brightnessValue.value = 0;
                                  contrastValue.value = 0;
                                  saturationValue.value = 0;
                                  hueValue.value = 0;
                                  
                                  if (_filterFactory != null)
                                  {
                                          _filterFactory.modifyFilterCustom();
                                  }
                          }
                          
                          
                          // ------- Event handling -------
                          private function setupChildren():void
                          {
                                  // add event listeners for child controls
                                  brightnessValue.addEventListener(SliderEvent.CHANGE, changePreset);
                                  contrastValue.addEventListener(SliderEvent.CHANGE, changePreset);
                                  saturationValue.addEventListener(SliderEvent.CHANGE, changePreset);
                                  hueValue.addEventListener(SliderEvent.CHANGE, changePreset);
                                  
                                  m0.addEventListener(Event.CHANGE, changeFilterValue);
                                  m1.addEventListener(Event.CHANGE, changeFilterValue);
                                  m2.addEventListener(Event.CHANGE, changeFilterValue);
                                  m3.addEventListener(Event.CHANGE, changeFilterValue);
                                  m4.addEventListener(Event.CHANGE, changeFilterValue);
                                  m5.addEventListener(Event.CHANGE, changeFilterValue);
                                  m6.addEventListener(Event.CHANGE, changeFilterValue);
                                  m7.addEventListener(Event.CHANGE, changeFilterValue);
                                  m8.addEventListener(Event.CHANGE, changeFilterValue);
                                  m9.addEventListener(Event.CHANGE, changeFilterValue);
                                  m10.addEventListener(Event.CHANGE, changeFilterValue);
                                  m11.addEventListener(Event.CHANGE, changeFilterValue);
                                  m12.addEventListener(Event.CHANGE, changeFilterValue);
                                  m13.addEventListener(Event.CHANGE, changeFilterValue);
                                  m14.addEventListener(Event.CHANGE, changeFilterValue);
                                  m15.addEventListener(Event.CHANGE, changeFilterValue);
                                  m16.addEventListener(Event.CHANGE, changeFilterValue);
                                  m17.addEventListener(Event.CHANGE, changeFilterValue);
                                  m18.addEventListener(Event.CHANGE, changeFilterValue);
                                  m19.addEventListener(Event.CHANGE, changeFilterValue);
                                  
                                  resetButton.addEventListener(MouseEvent.CLICK, resetClick);
                          }
                          
                          
                          private function changePreset(event:Event):void
                          {
                                  // update the filter
                                  _filterFactory.modifyFilterBasic(brightnessValue.value, contrastValue.value, saturationValue.value, hueValue.value);
                                  
                                  // populate the form values with the new matrix
                                  setMatrixForm(_filterFactory.matrix);
                          }
                          
                          
                          private function changeFilterValue(event:Event):void
                          {
                                  // verify that the values are valid
                                  if (m0.text.length <= 0) { return; }
                                  if (m1.text.length <= 0) { return; }
                                  if (m2.text.length <= 0) { return; }
                                  if (m3.text.length <= 0) { return; }
                                  if (m4.text.length <= 0) { return; }
                                  if (m5.text.length <= 0) { return; }
                                  if (m6.text.length <= 0) { return; }
                                  if (m7.text.length <= 0) { return; }
                                  if (m8.text.length <= 0) { return; }
                                  if (m9.text.length <= 0) { return; }
                                  if (m10.text.length <= 0) { return; }
                                  if (m11.text.length <= 0) { return; }
                                  if (m12.text.length <= 0) { return; }
                                  if (m13.text.length <= 0) { return; }
                                  if (m14.text.length <= 0) { return; }
                                  if (m15.text.length <= 0) { return; }
                                  if (m16.text.length <= 0) { return; }
                                  if (m17.text.length <= 0) { return; }
                                  if (m18.text.length <= 0) { return; }
                                  if (m19.text.length <= 0) { return; }
                                  
                                  // reset the brightness/contrast/saturation/hue controls
                                  brightnessValue.value = 0;
                                  contrastValue.value = 0;
                                  saturationValue.value = 0;
                                  hueValue.value = 0;
                                  
                                  // update the filter
                                  var matrix:Array = [Number(m0.text), Number(m1.text), Number(m2.text), Number(m3.text), Number(m4.text),
                                                                           Number(m5.text), Number(m6.text), Number(m7.text), Number(m8.text), Number(m9.text),
                                                                           Number(m10.text), Number(m11.text), Number(m12.text), Number(m13.text), Number(m14.text),
                                                                           Number(m15.text), Number(m16.text), Number(m17.text), Number(m18.text), Number(m19.text)];
                                  
                                  _filterFactory.modifyFilterCustom(matrix);
                          }
                          
                          
                          // ------- Private methods -------
                          private function resetClick(event:MouseEvent):void
                          {
                                  resetForm();
                          }
                          
                          
                          // ------- Utility methods -------
                          private function setMatrixForm(matrix:Array):void
                          {
                                  m0.text = matrix[0].toString();
                                  m1.text = matrix[1].toString();
                                  m2.text = matrix[2].toString();
                                  m3.text = matrix[3].toString();
                                  m4.text = matrix[4].toString();
                                  m5.text = matrix[5].toString();
                                  m6.text = matrix[6].toString();
                                  m7.text = matrix[7].toString();
                                  m8.text = matrix[8].toString();
                                  m9.text = matrix[9].toString();
                                  m10.text = matrix[10].toString();
                                  m11.text = matrix[11].toString();
                                  m12.text = matrix[12].toString();
                                  m13.text = matrix[13].toString();
                                  m14.text = matrix[14].toString();
                                  m15.text = matrix[15].toString();
                                  m16.text = matrix[16].toString();
                                  m17.text = matrix[17].toString();
                                  m18.text = matrix[18].toString();
                                  m19.text = matrix[19].toString();
                          }
                  ]]>
          </mx:Script>
          
          <mx:HBox>
                  <mx:Canvas height="100%">
                          <mx:Button id="resetButton" label="Reset" width="60" verticalCenter="0"/>
                  </mx:Canvas>
                  
                  <mx:Canvas height="100%">
                          <mx:Form verticalCenter="0">
                                  <mx:FormItem label="Brightness:">
                                          <mx:HSlider id="brightnessValue" minimum="-100" maximum="100" snapInterval="1" value="0" width="120" dataTipOffset="3" dataTipPrecision="0" liveDragging="true"/>
                                  </mx:FormItem>
                                  <mx:FormItem label="Contrast:">
                                          <mx:HSlider id="contrastValue" minimum="-100" maximum="100" snapInterval="1" value="0" width="120" dataTipOffset="3" dataTipPrecision="0" liveDragging="true"/>
                                  </mx:FormItem>
                                  <mx:FormItem label="Saturation:">
                                          <mx:HSlider id="saturationValue" minimum="-100" maximum="100" snapInterval="1" value="0" width="120" dataTipOffset="3" dataTipPrecision="0" liveDragging="true"/>
                                  </mx:FormItem>
                                  <mx:FormItem label="Hue:">
                                          <mx:HSlider id="hueValue" minimum="-180" maximum="180" snapInterval="1" value="0" width="120" dataTipOffset="3" dataTipPrecision="0" liveDragging="true"/>
                                  </mx:FormItem>
                          </mx:Form>
                  </mx:Canvas>
                  
                  <mx:Canvas>
                          <mx:Label text="Source Multiplier" x="163" y="0" width="100" textAlign="center"/>
                          <mx:Label text="Output:" x="-3" y="87" width="75" textAlign="right"/>
                          <!-- Top (column) labels -->
                          <mx:Label text="Red" x="122" y="19" width="40" textAlign="center"/>
                          <mx:Label text="Green" x="169" y="19" width="40" textAlign="center"/>
                          <mx:Label text="Blue" x="216" y="19" width="40" textAlign="center"/>
                          <mx:Label text="Alpha" x="263" y="19" width="40" textAlign="center"/>
                          <mx:Label text="Offset" x="310" y="19" width="40" textAlign="center"/>
                          <!-- Left (row) labels -->
                          <mx:Label text="Red:" x="67" y="41" width="50" textAlign="right"/>
                          <mx:Label text="Green:" x="67" y="71" width="50" textAlign="right"/>
                          <mx:Label text="Blue:" x="67" y="101" width="50" textAlign="right"/>
                          <mx:Label text="Alpha:" x="67" y="131" width="50" textAlign="right"/>
                          <!-- Cells -->
                          <mx:TextInput id="m0" text="1" restrict="0-9\-\." x="122" y="41" width="40"/>
                          <mx:TextInput id="m1" text="0" restrict="0-9\-\." x="169" y="41" width="40"/>
                          <mx:TextInput id="m2" text="0" restrict="0-9\-\." x="216" y="41" width="40"/>
                          <mx:TextInput id="m3" text="0" restrict="0-9\-\." x="263" y="41" width="40"/>
                          <mx:TextInput id="m4" text="0" restrict="0-9\-\." x="310" y="41" width="40"/>
                          <mx:TextInput id="m5" text="0" restrict="0-9\-\." x="122" y="71" width="40"/>
                          <mx:TextInput id="m6" text="1" restrict="0-9\-\." x="169" y="71" width="40"/>
                          <mx:TextInput id="m7" text="0" restrict="0-9\-\." x="216" y="71" width="40"/>
                          <mx:TextInput id="m8" text="0" restrict="0-9\-\." x="263" y="71" width="40"/>
                          <mx:TextInput id="m9" text="0" restrict="0-9\-\." x="310" y="71" width="40"/>
                          <mx:TextInput id="m10" text="0" restrict="0-9\-\." x="122" y="101" width="40"/>
                          <mx:TextInput id="m11" text="0" restrict="0-9\-\." x="169" y="101" width="40"/>
                          <mx:TextInput id="m12" text="1" restrict="0-9\-\." x="216" y="101" width="40"/>
                          <mx:TextInput id="m13" text="0" restrict="0-9\-\." x="263" y="101" width="40"/>
                          <mx:TextInput id="m14" text="0" restrict="0-9\-\." x="310" y="101" width="40"/>
                          <mx:TextInput id="m15" text="0" restrict="0-9\-\." x="122" y="131" width="40"/>
                          <mx:TextInput id="m16" text="0" restrict="0-9\-\." x="169" y="131" width="40"/>
                          <mx:TextInput id="m17" text="0" restrict="0-9\-\." x="216" y="131" width="40"/>
                          <mx:TextInput id="m18" text="1" restrict="0-9\-\." x="263" y="131" width="40"/>
                          <mx:TextInput id="m19" text="0" restrict="0-9\-\." x="310" y="131" width="40"/>
                  </mx:Canvas>
          </mx:HBox>
          
  </mx:Canvas>


(C) Æliens 27/08/2009

You may not copy or print any of this material without explicit permission of the author or the publisher. In case of other copyright issues, contact the author.