www/common/select_color.js

Code
Comments
Other
Rev Date Author Line
7604 25 Feb 19 nicklas 1 /* $Id $
7604 25 Feb 19 nicklas 2   ------------------------------------------------------------------
7604 25 Feb 19 nicklas 3   Copyright (C) 2012 Nicklas Nordborg
7604 25 Feb 19 nicklas 4
7604 25 Feb 19 nicklas 5   This file is part of BASE - BioArray Software Environment.
7604 25 Feb 19 nicklas 6   Available at http://base.thep.lu.se/
7604 25 Feb 19 nicklas 7
7604 25 Feb 19 nicklas 8   BASE is free software; you can redistribute it and/or
7604 25 Feb 19 nicklas 9   modify it under the terms of the GNU General Public License
7604 25 Feb 19 nicklas 10   as published by the Free Software Foundation; either version 3
7604 25 Feb 19 nicklas 11   of the License, or (at your option) any later version.
7604 25 Feb 19 nicklas 12
7604 25 Feb 19 nicklas 13   BASE is distributed in the hope that it will be useful,
7604 25 Feb 19 nicklas 14   but WITHOUT ANY WARRANTY; without even the implied warranty of
7604 25 Feb 19 nicklas 15   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
7604 25 Feb 19 nicklas 16   GNU General Public License for more details.
7604 25 Feb 19 nicklas 17
7604 25 Feb 19 nicklas 18   You should have received a copy of the GNU General Public License
7604 25 Feb 19 nicklas 19   along with BASE. If not, see <http://www.gnu.org/licenses/>.
7604 25 Feb 19 nicklas 20   ------------------------------------------------------------------
7604 25 Feb 19 nicklas 21
7604 25 Feb 19 nicklas 22   @author Nicklas
7604 25 Feb 19 nicklas 23 */
7604 25 Feb 19 nicklas 24 'use strict';
7604 25 Feb 19 nicklas 25
7604 25 Feb 19 nicklas 26 var Color = function()
7604 25 Feb 19 nicklas 27 {
7604 25 Feb 19 nicklas 28   var colorField;
7604 25 Feb 19 nicklas 29   
7604 25 Feb 19 nicklas 30   var color = {};
7604 25 Feb 19 nicklas 31
7604 25 Feb 19 nicklas 32   color.initPage = function()
7604 25 Feb 19 nicklas 33   {
7604 25 Feb 19 nicklas 34     // Get the current color from the parent window
7604 25 Feb 19 nicklas 35     colorField = window.opener.document.getElementById(Data.get('page-data', 'textarea'));
7604 25 Feb 19 nicklas 36     
7604 25 Feb 19 nicklas 37     var colorValue = colorField.value;
7604 25 Feb 19 nicklas 38     // Split into r,g,b values
7604 25 Feb 19 nicklas 39     var rgb = colorValue.match('([0-9A-Fa-f]{2})([0-9A-Fa-f]{2})([0-9A-Fa-f]{2})');
7604 25 Feb 19 nicklas 40     
7604 25 Feb 19 nicklas 41     // Put r,g,b values in input fields
7604 25 Feb 19 nicklas 42     var frm = document.forms['color'];
7604 25 Feb 19 nicklas 43     frm.red.value = rgb[1];
7604 25 Feb 19 nicklas 44     frm.green.value = rgb[2];
7604 25 Feb 19 nicklas 45     frm.blue.value = rgb[3];
7604 25 Feb 19 nicklas 46     
7604 25 Feb 19 nicklas 47     // Initialize color boxes
7604 25 Feb 19 nicklas 48     var titleToFocus = '#'+rgb[0];
7604 25 Feb 19 nicklas 49     for (var x = 0; x < 18; x++)
7604 25 Feb 19 nicklas 50     {
7604 25 Feb 19 nicklas 51       for (var y = 0; y < 12; y++)
7604 25 Feb 19 nicklas 52       {
7604 25 Feb 19 nicklas 53         var colorBox = Doc.element('x'+x+'y'+y);
7604 25 Feb 19 nicklas 54         Buttons.addClickHandler(colorBox, color.colorOnClick);
7604 25 Feb 19 nicklas 55         Events.addEventHandler(colorBox, 'keypress', color.handleArrowKeys);
7604 25 Feb 19 nicklas 56         
7604 25 Feb 19 nicklas 57         if (colorBox.title == titleToFocus)
7604 25 Feb 19 nicklas 58         {
7604 25 Feb 19 nicklas 59           colorBox.focus();
7604 25 Feb 19 nicklas 60         }
7604 25 Feb 19 nicklas 61       }
7604 25 Feb 19 nicklas 62     }
7604 25 Feb 19 nicklas 63     
7604 25 Feb 19 nicklas 64     // Dialog buttons
7604 25 Feb 19 nicklas 65     Buttons.addClickHandler('close', App.closeWindow);
7604 25 Feb 19 nicklas 66     Buttons.addClickHandler('btnSave', color.save);
7604 25 Feb 19 nicklas 67   }
7604 25 Feb 19 nicklas 68   
7604 25 Feb 19 nicklas 69   /**
7604 25 Feb 19 nicklas 70     Save the selected color back to the parent
7604 25 Feb 19 nicklas 71     form and close the window.
7604 25 Feb 19 nicklas 72   */
7604 25 Feb 19 nicklas 73   color.save = function()
7604 25 Feb 19 nicklas 74   {
7604 25 Feb 19 nicklas 75     var frm = document.forms['color'];
7604 25 Feb 19 nicklas 76     if (!color.validateColorValue(frm.red.value))
7604 25 Feb 19 nicklas 77     {
7604 25 Feb 19 nicklas 78       Forms.showNotification(frm.red, 'Invalid red color value');
7604 25 Feb 19 nicklas 79       return;
7604 25 Feb 19 nicklas 80     }
7604 25 Feb 19 nicklas 81     else if (!color.validateColorValue(frm.green.value))
7604 25 Feb 19 nicklas 82     {
7604 25 Feb 19 nicklas 83       Forms.showNotification(frm.green, 'Invalid green color value');
7604 25 Feb 19 nicklas 84       return;
7604 25 Feb 19 nicklas 85     }
7604 25 Feb 19 nicklas 86     else if (!color.validateColorValue(frm.blue.value))
7604 25 Feb 19 nicklas 87     {
7604 25 Feb 19 nicklas 88       Forms.showNotification(frm.blue, 'Invalid blue color value');
7604 25 Feb 19 nicklas 89       return;
7604 25 Feb 19 nicklas 90     }
7604 25 Feb 19 nicklas 91     // Save the value to the date field
7604 25 Feb 19 nicklas 92     colorField.value = frm.red.value + frm.green.value + frm.blue.value;
7604 25 Feb 19 nicklas 93     // Fire an 'onchange' event
7604 25 Feb 19 nicklas 94     Events.sendChangeEvent(colorField);
7604 25 Feb 19 nicklas 95
7604 25 Feb 19 nicklas 96     window.close();
7604 25 Feb 19 nicklas 97   }
7604 25 Feb 19 nicklas 98   
7604 25 Feb 19 nicklas 99   /**
7604 25 Feb 19 nicklas 100     Event handler for selecting a color among the
7604 25 Feb 19 nicklas 101     color boxes.
7604 25 Feb 19 nicklas 102   */
7604 25 Feb 19 nicklas 103   color.colorOnClick = function(event)
7604 25 Feb 19 nicklas 104   {
7604 25 Feb 19 nicklas 105     var target = event.currentTarget;
7604 25 Feb 19 nicklas 106     var frm = document.forms['color'];
7604 25 Feb 19 nicklas 107     frm.red.value = Data.get(target, 'red');
7604 25 Feb 19 nicklas 108     frm.green.value = Data.get(target, 'green');
7604 25 Feb 19 nicklas 109     frm.blue.value = Data.get(target, 'blue');
7604 25 Feb 19 nicklas 110   }
7604 25 Feb 19 nicklas 111   
7604 25 Feb 19 nicklas 112   
7604 25 Feb 19 nicklas 113   /**
7604 25 Feb 19 nicklas 114     Set focus to 'next' color when arrow keys are pressed.
7604 25 Feb 19 nicklas 115   */
7604 25 Feb 19 nicklas 116   color.handleArrowKeys = function(event)
7604 25 Feb 19 nicklas 117   {
7604 25 Feb 19 nicklas 118     var keyCode = event.keyCode;
7604 25 Feb 19 nicklas 119     if (keyCode >= 37 && keyCode <= 40)
7604 25 Feb 19 nicklas 120     {
7604 25 Feb 19 nicklas 121       var y = Data.int(event.currentTarget, 'y');
7604 25 Feb 19 nicklas 122       var x = Data.int(event.currentTarget, 'x');
7604 25 Feb 19 nicklas 123       // 37 - left, 38 - up, 39 - right, 40 - down
7604 25 Feb 19 nicklas 124       if (keyCode == 37) x--;
7604 25 Feb 19 nicklas 125       if (keyCode == 38) y--;
7604 25 Feb 19 nicklas 126       if (keyCode == 39) x++;
7604 25 Feb 19 nicklas 127       if (keyCode == 40) y++;
7604 25 Feb 19 nicklas 128       var next = Doc.element('x'+x+'y'+y);
7604 25 Feb 19 nicklas 129       if (next && next.tabIndex != -1)
7604 25 Feb 19 nicklas 130       {
7604 25 Feb 19 nicklas 131         next.focus();
7604 25 Feb 19 nicklas 132       }
7604 25 Feb 19 nicklas 133     }
7604 25 Feb 19 nicklas 134   }
7604 25 Feb 19 nicklas 135   
7604 25 Feb 19 nicklas 136   /**
7604 25 Feb 19 nicklas 137     A color value must be two characters using
7604 25 Feb 19 nicklas 138     0-9 or A-F.
7604 25 Feb 19 nicklas 139   */
7604 25 Feb 19 nicklas 140   color.validateColorValue =   function(value)
7604 25 Feb 19 nicklas 141   {
7604 25 Feb 19 nicklas 142     return value.match('[0-9A-Fa-f]{2}');
7604 25 Feb 19 nicklas 143   }
7604 25 Feb 19 nicklas 144   
7604 25 Feb 19 nicklas 145   return color;
7604 25 Feb 19 nicklas 146 }();
7604 25 Feb 19 nicklas 147
7604 25 Feb 19 nicklas 148 Doc.onLoad(Color.initPage);
7604 25 Feb 19 nicklas 149
7604 25 Feb 19 nicklas 150