← Back to team overview

openerp-community team mailing list archive

[Merge] lp:~openerp-community/web-addons/7.0-web_color into lp:~webaddons-core-editors/web-addons/7.0

 

Maxime Chambreuil (http://www.savoirfairelinux.com) has proposed merging lp:~openerp-community/web-addons/7.0-web_color into lp:~webaddons-core-editors/web-addons/7.0.

Requested reviews:
  Web-Addons Core Editors (webaddons-core-editors)

For more details, see:
https://code.launchpad.net/~openerp-community/web-addons/7.0-web_color/+merge/136214

[ADD] web_color
-- 
https://code.launchpad.net/~openerp-community/web-addons/7.0-web_color/+merge/136214
Your team OpenERP Community is subscribed to branch lp:~openerp-community/web-addons/7.0-web_color.
=== added directory 'web_color'
=== added file 'web_color/__init__.py'
--- web_color/__init__.py	1970-01-01 00:00:00 +0000
+++ web_color/__init__.py	2012-11-26 16:25:33 +0000
@@ -0,0 +1,22 @@
+# -*- encoding: utf-8 -*-
+############################################################################
+#    
+#    OpenERP, Open Source Web Color
+#    Copyright (C) 2012 Savoir-faire Linux (<http://www.savoirfairelinux.com>).
+#
+#    This program is free software: you can redistribute it and/or modify
+#    it under the terms of the GNU General Public License as
+#    published by the Free Software Foundation, either version 3 of the
+#    License, or (at your option) any later version.
+#
+#    This program is distributed in the hope that it will be useful,
+#    but WITHOUT ANY WARRANTY; without even the implied warranty of
+#    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+#    GNU General Public License for more details.
+#
+#    You should have received a copy of the GNU General Public License
+#    along with this program.  If not, see <http://www.gnu.org/licenses/>. 
+#  
+#    @author Étienne Beaudry Auger <etienne.b.auger@xxxxxxxxxxxxxxxxxxxx>
+#
+##############################################################################
\ No newline at end of file

=== added file 'web_color/__openerp__.py'
--- web_color/__openerp__.py	1970-01-01 00:00:00 +0000
+++ web_color/__openerp__.py	2012-11-26 16:25:33 +0000
@@ -0,0 +1,45 @@
+# -*- encoding: utf-8 -*-
+############################################################################
+#    
+#    OpenERP, Open Source Web Color
+#    Copyright (C) 2012 Savoir-faire Linux (<http://www.savoirfairelinux.com>).
+#
+#    This program is free software: you can redistribute it and/or modify
+#    it under the terms of the GNU General Public License as
+#    published by the Free Software Foundation, either version 3 of the
+#    License, or (at your option) any later version.
+#
+#    This program is distributed in the hope that it will be useful,
+#    but WITHOUT ANY WARRANTY; without even the implied warranty of
+#    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+#    GNU General Public License for more details.
+#
+#    You should have received a copy of the GNU General Public License
+#    along with this program.  If not, see <http://www.gnu.org/licenses/>. 
+#  
+#    @author Étienne Beaudry Auger <etienne.b.auger@xxxxxxxxxxxxxxxxxxxx>
+#
+##############################################################################
+{
+    'name': "Web Color",
+    'author': "Savoir-faire Linux",
+    'category' : "Hidden",
+    'description': """
+    This module provides a color widget to display the color from
+    the hexadecimal value of your field.
+    """,
+    'version': "1.0",
+    'depends': ['web'],
+    'js': [
+        'static/src/js/lib.js', 
+        'static/lib/really-simple-color-picker/jquery.colorPicker.js',
+    ],
+    'css': [
+        'static/src/css/color.css',
+        'static/lib/really-simple-color-picker/colorPicker.css',
+     ],
+    'qweb' : ['static/src/xml/lib.xml'],
+    'installable': True,
+    'auto_install': True,
+    'web_preload': False,
+}

=== added directory 'web_color/i18n'
=== added file 'web_color/i18n/fr_CA.po'
--- web_color/i18n/fr_CA.po	1970-01-01 00:00:00 +0000
+++ web_color/i18n/fr_CA.po	2012-11-26 16:25:33 +0000
@@ -0,0 +1,10 @@
+# French (Canada) translation for openerp-web
+# Copyright (c) 2012 Rosetta Contributors and Canonical Ltd 2012
+# This file is distributed under the same license as the openerp-web package.
+# Etienne Beaudry Auger <etienne.b.auger@xxxxxxxxxxxxxxxxxxxx>, 2012.
+#
+
+#. openerp-web
+#: addons/web_color/static/src/xml/lib.xml
+msgid "Select color"
+msgstr "Choix de couleur"

=== added directory 'web_color/static'
=== added directory 'web_color/static/lib'
=== added directory 'web_color/static/lib/really-simple-color-picker'
=== added file 'web_color/static/lib/really-simple-color-picker/LICENSE'
--- web_color/static/lib/really-simple-color-picker/LICENSE	1970-01-01 00:00:00 +0000
+++ web_color/static/lib/really-simple-color-picker/LICENSE	2012-11-26 16:25:33 +0000
@@ -0,0 +1,22 @@
+Copyright (c) 2012 Lakshan Perera
+
+Permission is hereby granted, free of charge, to any person
+obtaining a copy of this software and associated documentation
+files (the "Software"), to deal in the Software without
+restriction, including without limitation the rights to use,
+copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the
+Software is furnished to do so, subject to the following
+conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES
+OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT
+HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
+OTHER DEALINGS IN THE SOFTWARE.

=== added file 'web_color/static/lib/really-simple-color-picker/README.md'
--- web_color/static/lib/really-simple-color-picker/README.md	1970-01-01 00:00:00 +0000
+++ web_color/static/lib/really-simple-color-picker/README.md	2012-11-26 16:25:33 +0000
@@ -0,0 +1,98 @@
+## Really Simple Color Picker 
+
+This is a very minimal, yet robust Color Picker based on jQuery.
+
+For more details check the introductory blog post - http://laktek.com/2008/10/27/really-simple-color-picker-in-jquery/
+
+### Usage 
+
+You can either clone [this repo](https://github.com/laktek/really-simple-color-picker) or download the latest build as a zip from here - http://github.com/laktek/really-simple-color-picker/zipball/master
+
+Color Picker requires jQuery 1.2.6 or higher. Make sure to load it before Color Picker (there's no other dependencies!). 
+For default styles of the color picker load the CSS file that comes with the plugin.
+
+  ```html
+    <script language="javascript" type="text/javascript" src=jquery.min.js"></script>
+    <script language="javascript" type="text/javascript" src="jquery.colorPicker.min.js"/></script>
+
+    <link rel="stylesheet" href="colorPicker.css" type="text/css" />
+  ```
+
+Add a text field to take the color input.
+
+  ```html
+    <div><label for="color1">Color 1</label> <input id="color1" type="text" name="color1" value="#333399" /></div>
+  ```
+
+Then call 'colorPicker' method on the text field when document loads.
+
+  ```html
+    <script language="javascript">
+      jQuery(document).ready(function($) {
+        $('#color1').colorPicker();
+      }
+    </script>
+  ```
+
+### Options
+
+There are several options you can set at the time of binding. 
+
+**Selected color**
+
+Color Picker will use the value of the input field, which the picker is attached to as the selected color. If not, it will use the color passed with `pickerDefault` property.
+
+  ```javascript
+    $('#color1').colorPicker({pickerDefault: "ffffff"});
+  ```
+
+**Color Palette**
+
+Overrides the default color palette by passing an array of color values.
+
+  ```javascript
+    $('#color1').colorPicker({colors: ["333333", "111111"]});
+  ```
+
+**Transparency**
+
+Enable transparency value as an option.
+
+  ```javascript
+    $('#color1').colorPicker({transparency: true});
+  ```
+
+**Color Change Callback**
+
+Registers a callback that can be used to notify the calling code of a color change.
+
+  ```javascript
+    $('#color1').colorPicker( { onColorChange : function(id, newValue) { console.log("ID: " + id + " has been changed to " + newValue); } } );
+  ```
+
+If you want to set an option gloablly (to apply for all color pickers), use:
+
+  ```javascript
+    $.fn.colorPicker.defaults.colors = ['151337', '111111']
+  ```
+### Demo
+
+Demo can be found at http://laktek.github.com/really-simple-color-picker/demo.html
+
+### Real-world Examples
+
+* [CurdBee](http://demo.curdbee.com/settings/branding)
+* [Readability](https://www.readability.com/publishers/tools)
+
+Let us know how you are using Really Simple Color Picker...
+
+### Contributors
+
+* Lakshan Perera - http://laktek.com
+* Daniel Lacy  - http://daniellacy.com
+
+### Issues & Suggestions
+
+Please report any bugs or feature requests here:
+https://github.com/laktek/really-simple-color-picker/issues
+

=== added file 'web_color/static/lib/really-simple-color-picker/arrow.gif'
Binary files web_color/static/lib/really-simple-color-picker/arrow.gif	1970-01-01 00:00:00 +0000 and web_color/static/lib/really-simple-color-picker/arrow.gif	2012-11-26 16:25:33 +0000 differ
=== added file 'web_color/static/lib/really-simple-color-picker/arrow.png'
Binary files web_color/static/lib/really-simple-color-picker/arrow.png	1970-01-01 00:00:00 +0000 and web_color/static/lib/really-simple-color-picker/arrow.png	2012-11-26 16:25:33 +0000 differ
=== added file 'web_color/static/lib/really-simple-color-picker/colorPicker.css'
--- web_color/static/lib/really-simple-color-picker/colorPicker.css	1970-01-01 00:00:00 +0000
+++ web_color/static/lib/really-simple-color-picker/colorPicker.css	2012-11-26 16:25:33 +0000
@@ -0,0 +1,34 @@
+div.colorPicker-picker {
+  height: 16px;
+  width: 16px;
+  padding: 0 !important;
+  border: 1px solid #ccc;
+  background: url(arrow.gif) no-repeat top right;
+  cursor: pointer;
+  line-height: 16px;
+}
+
+div.colorPicker-palette {
+  width: 110px;
+  position: absolute;
+  border: 1px solid #ccc;
+  background-color: #FFFFFF;
+  padding: 5px;
+  z-index: 9999;
+  -moz-border-radius: 3px;
+  -webkit-border-radius: 3px;
+  border-radius: 3px;
+}
+  div.colorPicker_hexWrap {width: 100%; float:left }
+  div.colorPicker_hexWrap label {font-size: 95%; color: #2F2F2F; margin: 5px 2px; width: 25%}
+  div.colorPicker_hexWrap input {margin: 5px 2px; padding: 0; font-size: 95%; border: 1px solid #000; width: 65%; }
+
+div.colorPicker-swatch {
+  height: 12px;
+  width: 12px;
+  border: 1px solid #000;
+  margin: 2px;
+  float: left;
+  cursor: pointer;
+  line-height: 12px;
+}

=== added file 'web_color/static/lib/really-simple-color-picker/demo.html'
--- web_color/static/lib/really-simple-color-picker/demo.html	1970-01-01 00:00:00 +0000
+++ web_color/static/lib/really-simple-color-picker/demo.html	2012-11-26 16:25:33 +0000
@@ -0,0 +1,93 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";>
+<html xmlns="http://www.w3.org/1999/xhtml"; xml:lang="en" lang="en">
+
+<head>
+<title>Really Simple Color Picker</title>
+
+<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
+<script language="javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js";></script>
+<script language="javascript" type="text/javascript" src="jquery.colorPicker.js"/></script>
+
+<script type="text/javascript">
+  //Run the code when document ready
+  $(function() {    
+   //use this method to add new colors to pallete
+   //$.fn.colorPicker.addColors(['000', '000', 'fff', 'fff']);
+   
+   $('#color1').colorPicker();
+
+   $('#color2').colorPicker();
+
+   $('#color3').colorPicker({pickerDefault: "ffffff", colors: ["ffffff", "000000", "111FFF", "C0C0C0", "FFF000"], transparency: true}); 
+   
+   //fires an event when the color is changed
+   //$('#color1').change(function(){
+    //alert("color changed");
+   //});
+
+   $("#button1").click(function(){
+    $("#color1").val("#ffffff");   
+    $("#color1").change();
+   });
+
+   $("#button2").click(function(){
+    $("#color2").val("#000000");   
+    $("#color2").change();
+   });
+
+  });
+</script>
+
+<style type="text/css">
+/* styles adopted from Nidahas - Forms markup and CSS (http://nidahas.com/2006/12/06/forms-markup-and-css-revisited/) */
+/* General styles */
+body { margin: 0; padding: 0; font: 80%/1.5 Arial,Helvetica,sans-serif; color: #111; background-color: #FFF; }
+h2 { margin: 0px; padding: 10px; font-family: Georgia, "Times New Roman", Times, serif; font-size: 200%; font-weight: normal; color: #FFF; background-color: #CCC; border-bottom: #BBB 2px solid; }
+p#copyright { margin: 20px 10px; font-size: 90%; color: #999; }
+
+/* Form styles */
+div.form-container { margin: 10px; padding: 5px; background-color: #FFF; }
+
+p.legend { margin-bottom: 1em; }
+p.legend em { color: #C00; font-style: normal; }
+
+div.form-container div.controlset {display: block; float:left; width: 100%; padding: 0.25em 0;}
+
+div.form-container div.controlset label, 
+div.form-container div.controlset input,
+div.form-container div.controlset div { display: inline; float: left; }
+
+div.form-container div.controlset label { width: 100px;}
+</style>
+<link rel="stylesheet" href="colorPicker.css" type="text/css" />
+</head>
+
+<body>
+
+<div id="wrapper">
+
+	<h2>Really Simple Color Picker (jQuery)</h2>
+
+	<p>More information about this can be found in <a href="http://laktek.com/2008/10/27/really-simple-color-picker-in-jquery/"; title="Really Simple Color Picker in jQuery">this blog article</a>.</p>
+	<div class="form-container">
+	<form action="#" method="post">
+		<fieldset>
+			<div class="controlset"><label for="color1">Color 1</label> <input id="color1" type="text" name="color1" value="#333399" /></div>
+			<div class="controlset"><label for="color2">Color 2</label> <input id="color2" type="text" name="color2" value="#FF0000" /></div>
+			<div class="controlset"><label for="color3">Color 3 (customized with options)</label> <input id="color3" type="text" name="color3" value="#99cc00" /></div>
+
+		</fieldset>
+  
+    <div class="buttonrow">
+      <div><button type="button" id="button1">Set Color 1 to #FFF</button></div>
+      <div><button type="button" id="button2">Set Color 2 to #000</button></div>
+    </div>
+
+	</form>
+</div>
+
+</body>
+
+</html>
+

=== added file 'web_color/static/lib/really-simple-color-picker/jquery.colorPicker.js'
--- web_color/static/lib/really-simple-color-picker/jquery.colorPicker.js	1970-01-01 00:00:00 +0000
+++ web_color/static/lib/really-simple-color-picker/jquery.colorPicker.js	2012-11-26 16:25:33 +0000
@@ -0,0 +1,328 @@
+/**
+ * Really Simple Color Picker in jQuery
+ *
+ * Licensed under the MIT (MIT-LICENSE.txt) licenses.
+ *
+ * Copyright (c) 2008-2012
+ * Lakshan Perera (www.laktek.com) & Daniel Lacy (daniellacy.com)
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to
+ * deal in the Software without restriction, including without limitation the
+ * rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
+ * sell copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+ * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
+ * IN THE SOFTWARE.
+ */
+
+(function ($) {
+    /**
+     * Create a couple private variables.
+    **/
+    var selectorOwner,
+        activePalette,
+        cItterate       = 0,
+        templates       = {
+            control : $('<div class="colorPicker-picker">&nbsp;</div>'),
+            palette : $('<div id="colorPicker_palette" class="colorPicker-palette" />'),
+            swatch  : $('<div class="colorPicker-swatch">&nbsp;</div>'),
+            hexLabel: $('<label for="colorPicker_hex">Hex</label>'),
+            hexField: $('<input type="text" id="colorPicker_hex" />')
+        },
+        transparent     = "transparent",
+        lastColor;
+
+    /**
+     * Create our colorPicker function
+    **/
+    $.fn.colorPicker = function (options) {
+
+        return this.each(function () {
+            // Setup time. Clone new elements from our templates, set some IDs, make shortcuts, jazzercise.
+            var element      = $(this),
+                opts         = $.extend({}, $.fn.colorPicker.defaults, options),
+                defaultColor = $.fn.colorPicker.toHex(
+                        (element.val().length > 0) ? element.val() : opts.pickerDefault
+                    ),
+                newControl   = templates.control.clone(),
+                newPalette   = templates.palette.clone().attr('id', 'colorPicker_palette-' + cItterate),
+                newHexLabel  = templates.hexLabel.clone(),
+                newHexField  = templates.hexField.clone(),
+                paletteId    = newPalette[0].id,
+                swatch;
+
+
+            /**
+             * Build a color palette.
+            **/
+            $.each(opts.colors, function (i) {
+                swatch = templates.swatch.clone();
+
+                if (opts.colors[i] === transparent) {
+                    swatch.addClass(transparent).text('X');
+                    $.fn.colorPicker.bindPalette(newHexField, swatch, transparent);
+                } else {
+                    swatch.css("background-color", "#" + this);
+                    $.fn.colorPicker.bindPalette(newHexField, swatch);
+                }
+                swatch.appendTo(newPalette);
+            });
+
+            newHexLabel.attr('for', 'colorPicker_hex-' + cItterate);
+
+            newHexField.attr({
+                'id'    : 'colorPicker_hex-' + cItterate,
+                'value' : defaultColor
+            });
+
+            newHexField.bind("keydown", function (event) {
+                if (event.keyCode === 13) {
+                    var hexColor = $.fn.colorPicker.toHex($(this).val());
+                    $.fn.colorPicker.changeColor(hexColor ? hexColor : element.val());
+                }
+                if (event.keyCode === 27) {
+                    $.fn.colorPicker.hidePalette();
+                }
+            });
+
+            newHexField.bind("keyup", function (event) {
+              var hexColor = $.fn.colorPicker.toHex($(event.target).val());
+              $.fn.colorPicker.previewColor(hexColor ? hexColor : element.val());
+            });
+
+            $('<div class="colorPicker_hexWrap" />').append(newHexLabel).appendTo(newPalette);
+
+            newPalette.find('.colorPicker_hexWrap').append(newHexField);
+
+            $("body").append(newPalette);
+
+            newPalette.hide();
+
+
+            /**
+             * Build replacement interface for original color input.
+            **/
+            newControl.css("background-color", defaultColor);
+
+            newControl.bind("click", function () {
+                $.fn.colorPicker.togglePalette($('#' + paletteId), $(this));
+            });
+
+            if( options && options.onColorChange ) {
+              newControl.data('onColorChange', options.onColorChange);
+            } else {
+              newControl.data('onColorChange', function() {} );
+            }
+            element.after(newControl);
+
+            element.bind("change", function () {
+                element.next(".colorPicker-picker").css(
+                    "background-color", $.fn.colorPicker.toHex($(this).val())
+                );
+            });
+
+            // Hide the original input.
+            element.val(defaultColor).hide();
+
+            cItterate++;
+        });
+    };
+
+    /**
+     * Extend colorPicker with... all our functionality.
+    **/
+    $.extend(true, $.fn.colorPicker, {
+        /**
+         * Return a Hex color, convert an RGB value and return Hex, or return false.
+         *
+         * Inspired by http://code.google.com/p/jquery-color-utils
+        **/
+        toHex : function (color) {
+            // If we have a standard or shorthand Hex color, return that value.
+            if (color.match(/[0-9A-F]{6}|[0-9A-F]{3}$/i)) {
+                return (color.charAt(0) === "#") ? color : ("#" + color);
+
+            // Alternatively, check for RGB color, then convert and return it as Hex.
+            } else if (color.match(/^rgb\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*\)$/)) {
+                var c = ([parseInt(RegExp.$1, 10), parseInt(RegExp.$2, 10), parseInt(RegExp.$3, 10)]),
+                    pad = function (str) {
+                        if (str.length < 2) {
+                            for (var i = 0, len = 2 - str.length; i < len; i++) {
+                                str = '0' + str;
+                            }
+                        }
+
+                        return str;
+                    };
+
+                if (c.length === 3) {
+                    var r = pad(c[0].toString(16)),
+                        g = pad(c[1].toString(16)),
+                        b = pad(c[2].toString(16));
+
+                    return '#' + r + g + b;
+                }
+
+            // Otherwise we wont do anything.
+            } else {
+                return false;
+
+            }
+        },
+
+        /**
+         * Check whether user clicked on the selector or owner.
+        **/
+        checkMouse : function (event, paletteId) {
+            var selector = activePalette,
+                selectorParent = $(event.target).parents("#" + selector.attr('id')).length;
+
+            if (event.target === $(selector)[0] || event.target === selectorOwner[0] || selectorParent > 0) {
+                return;
+            }
+
+            $.fn.colorPicker.hidePalette();
+        },
+
+        /**
+         * Hide the color palette modal.
+        **/
+        hidePalette : function () {
+            $(document).unbind("mousedown", $.fn.colorPicker.checkMouse);
+
+            $('.colorPicker-palette').hide();
+        },
+
+        /**
+         * Show the color palette modal.
+        **/
+        showPalette : function (palette) {
+            var hexColor = selectorOwner.prev("input").val();
+
+            palette.css({
+                top: selectorOwner.offset().top + (selectorOwner.outerHeight()),
+                left: selectorOwner.offset().left
+            });
+
+            $("#color_value").val(hexColor);
+
+            palette.show();
+
+            $(document).bind("mousedown", $.fn.colorPicker.checkMouse);
+        },
+
+        /**
+         * Toggle visibility of the colorPicker palette.
+        **/
+        togglePalette : function (palette, origin) {
+            // selectorOwner is the clicked .colorPicker-picker.
+            if (origin) {
+                selectorOwner = origin;
+            }
+
+            activePalette = palette;
+
+            if (activePalette.is(':visible')) {
+                $.fn.colorPicker.hidePalette();
+
+            } else {
+                $.fn.colorPicker.showPalette(palette);
+
+            }
+        },
+
+        /**
+         * Update the input with a newly selected color.
+        **/
+        changeColor : function (value) {
+            selectorOwner.css("background-color", value);
+            selectorOwner.prev("input").val(value).change();
+
+            $.fn.colorPicker.hidePalette();
+
+            selectorOwner.data('onColorChange').call(selectorOwner, $(selectorOwner).prev("input").attr("id"), value);
+        },
+
+
+        /**
+         * Preview the input with a newly selected color.
+        **/
+        previewColor : function (value) {
+            selectorOwner.css("background-color", value);
+        },
+
+        /**
+         * Bind events to the color palette swatches.
+        */
+        bindPalette : function (paletteInput, element, color) {
+            color = color ? color : $.fn.colorPicker.toHex(element.css("background-color"));
+
+            element.bind({
+                click : function (ev) {
+                    lastColor = color;
+
+                    $.fn.colorPicker.changeColor(color);
+                },
+                mouseover : function (ev) {
+                    lastColor = paletteInput.val();
+
+                    $(this).css("border-color", "#598FEF");
+
+                    paletteInput.val(color);
+
+                    $.fn.colorPicker.previewColor(color);
+                },
+                mouseout : function (ev) {
+                    $(this).css("border-color", "#000");
+
+                    paletteInput.val(selectorOwner.css("background-color"));
+
+                    paletteInput.val(lastColor);
+
+                    $.fn.colorPicker.previewColor(lastColor);
+                }
+            });
+        }
+    });
+
+    /**
+     * Default colorPicker options.
+     *
+     * These are publibly available for global modification using a setting such as:
+     *
+     * $.fn.colorPicker.defaults.colors = ['151337', '111111']
+     *
+     * They can also be applied on a per-bound element basis like so:
+     *
+     * $('#element1').colorPicker({pickerDefault: 'efefef', transparency: true});
+     * $('#element2').colorPicker({pickerDefault: '333333', colors: ['333333', '111111']});
+     *
+    **/
+    $.fn.colorPicker.defaults = {
+        // colorPicker default selected color.
+        pickerDefault : "FFFFFF",
+
+        // Default color set.
+        colors : [
+            '000000', '993300', '333300', '000080', '333399', '333333', '800000', 'FF6600',
+            '808000', '008000', '008080', '0000FF', '666699', '808080', 'FF0000', 'FF9900',
+            '99CC00', '339966', '33CCCC', '3366FF', '800080', '999999', 'FF00FF', 'FFCC00',
+            'FFFF00', '00FF00', '00FFFF', '00CCFF', '993366', 'C0C0C0', 'FF99CC', 'FFCC99',
+            'FFFF99', 'CCFFFF', '99CCFF', 'FFFFFF'
+        ],
+
+        // If we want to simply add more colors to the default set, use addColors.
+        addColors : []
+    };
+
+})(jQuery);

=== added file 'web_color/static/lib/really-simple-color-picker/jquery.colorPicker.min.js'
--- web_color/static/lib/really-simple-color-picker/jquery.colorPicker.min.js	1970-01-01 00:00:00 +0000
+++ web_color/static/lib/really-simple-color-picker/jquery.colorPicker.min.js	2012-11-26 16:25:33 +0000
@@ -0,0 +1,26 @@
+/**
+ * Really Simple Color Picker in jQuery
+ * 
+ * Licensed under the MIT (MIT-LICENSE.txt) licenses.
+ *
+ * Copyright (c) 2008-2012 
+ * Lakshan Perera (www.laktek.com) & Daniel Lacy (daniellacy.com)
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to
+ * deal in the Software without restriction, including without limitation the
+ * rights to use, copy, modify, merge, publish, distribute, sublicense, and/or
+ * sell copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+ * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS
+ * IN THE SOFTWARE.
+ */(function(a){var b,c,d=0,e={control:a('<div class="colorPicker-picker">&nbsp;</div>'),palette:a('<div id="colorPicker_palette" class="colorPicker-palette" />'),swatch:a('<div class="colorPicker-swatch">&nbsp;</div>'),hexLabel:a('<label for="colorPicker_hex">Hex</label>'),hexField:a('<input type="text" id="colorPicker_hex" />')},f="transparent",g;a.fn.colorPicker=function(b){return this.each(function(){var c=a(this),g=a.extend({},a.fn.colorPicker.defaults,b),h=a.fn.colorPicker.toHex(c.val().length>0?c.val():g.pickerDefault),i=e.control.clone(),j=e.palette.clone().attr("id","colorPicker_palette-"+d),k=e.hexLabel.clone(),l=e.hexField.clone(),m=j[0].id,n;a.each(g.colors,function(b){n=e.swatch.clone(),g.colors[b]===f?(n.addClass(f).text("X"),a.fn.colorPicker.bindPalette(l,n,f)):(n.css("background-color","#"+this),a.fn.colorPicker.bindPalette(l,n)),n.appendTo(j)}),k.attr("for","colorPicker_hex-"+d),l.attr({id:"colorPicker_hex-"+d,value:h}),l.bind("keydown",function(b){if(b.keyCode===13){var d=a.fn.colorPicker.toHex(a(this).val());a.fn.colorPicker.changeColor(d?d:c.val())}b.keyCode===27&&a.fn.colorPicker.hidePalette()}),l.bind("keyup",function(b){var d=a.fn.colorPicker.toHex(a(b.target).val());a.fn.colorPicker.previewColor(d?d:c.val())}),a('<div class="colorPicker_hexWrap" />').append(k).appendTo(j),j.find(".colorPicker_hexWrap").append(l),a("body").append(j),j.hide(),i.css("background-color",h),i.bind("click",function(){a.fn.colorPicker.togglePalette(a("#"+m),a(this))}),b&&b.onColorChange?i.data("onColorChange",b.onColorChange):i.data("onColorChange",function(){}),c.after(i),c.bind("change",function(){c.next(".colorPicker-picker").css("background-color",a.fn.colorPicker.toHex(a(this).val()))}),c.val(h).hide(),d++})},a.extend(!0,a.fn.colorPicker,{toHex:function(a){if(a.match(/[0-9A-F]{6}|[0-9A-F]{3}$/i))return a.charAt(0)==="#"?a:"#"+a;if(!a.match(/^rgb\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*\)$/))return!1;var b=[parseInt(RegExp.$1,10),parseInt(RegExp.$2,10),parseInt(RegExp.$3,10)],c=function(a){if(a.length<2)for(var b=0,c=2-a.length;b<c;b++)a="0"+a;return a};if(b.length===3){var d=c(b[0].toString(16)),e=c(b[1].toString(16)),f=c(b[2].toString(16));return"#"+d+e+f}},checkMouse:function(d,e){var f=c,g=a(d.target).parents("#"+f.attr("id")).length;if(d.target===a(f)[0]||d.target===b[0]||g>0)return;a.fn.colorPicker.hidePalette()},hidePalette:function(){a(document).unbind("mousedown",a.fn.colorPicker.checkMouse),a(".colorPicker-palette").hide()},showPalette:function(c){var d=b.prev("input").val();c.css({top:b.offset().top+b.outerHeight(),left:b.offset().left}),a("#color_value").val(d),c.show(),a(document).bind("mousedown",a.fn.colorPicker.checkMouse)},togglePalette:function(d,e){e&&(b=e),c=d,c.is(":visible")?a.fn.colorPicker.hidePalette():a.fn.colorPicker.showPalette(d)},changeColor:function(c){b.css("background-color",c),b.prev("input").val(c).change(),a.fn.colorPicker.hidePalette(),b.data("onColorChange").call(b,a(b).prev("input").attr("id"),c)},previewColor:function(a){b.css("background-color",a)},bindPalette:function(c,d,e){e=e?e:a.fn.colorPicker.toHex(d.css("background-color")),d.bind({click:function(b){g=e,a.fn.colorPicker.changeColor(e)},mouseover:function(b){g=c.val(),a(this).css("border-color","#598FEF"),c.val(e),a.fn.colorPicker.previewColor(e)},mouseout:function(d){a(this).css("border-color","#000"),c.val(b.css("background-color")),c.val(g),a.fn.colorPicker.previewColor(g)}})}}),a.fn.colorPicker.defaults={pickerDefault:"FFFFFF",colors:["000000","993300","333300","000080","333399","333333","800000","FF6600","808000","008000","008080","0000FF","666699","808080","FF0000","FF9900","99CC00","339966","33CCCC","3366FF","800080","999999","FF00FF","FFCC00","FFFF00","00FF00","00FFFF","00CCFF","993366","C0C0C0","FF99CC","FFCC99","FFFF99","CCFFFF","99CCFF","FFFFFF"],addColors:[]}})(jQuery)
\ No newline at end of file

=== added file 'web_color/static/lib/really-simple-color-picker/screenshot.png'
Binary files web_color/static/lib/really-simple-color-picker/screenshot.png	1970-01-01 00:00:00 +0000 and web_color/static/lib/really-simple-color-picker/screenshot.png	2012-11-26 16:25:33 +0000 differ
=== added file 'web_color/static/lib/really-simple-color-picker/test.html'
--- web_color/static/lib/really-simple-color-picker/test.html	1970-01-01 00:00:00 +0000
+++ web_color/static/lib/really-simple-color-picker/test.html	2012-11-26 16:25:33 +0000
@@ -0,0 +1,85 @@
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
+        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";>
+<html xmlns="http://www.w3.org/1999/xhtml"; xml:lang="en" lang="en">
+
+<head>
+<title>Really Simple Color Picker</title>
+
+<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
+<script language="javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js";></script>
+<script language="javascript" type="text/javascript" src="jquery.colorPicker.js"/></script>
+
+<script type="text/javascript">
+  //Run the code when document ready
+  $(function() {    
+   //use this method to add new colors to pallete
+   //$.fn.colorPicker.addColors(['000', '000', 'fff', 'fff']);
+   
+   $('#color1').colorPicker();
+
+   $('#color2').colorPicker();
+
+   $('#color3').colorPicker({pickerDefault: "ffffff", colors: ["ffffff", "000000", "111FFF", "C0C0C0", "FFF000"], transparency: true}); 
+   
+   //fires an event when the color is changed
+   $('#color1').change(function(){
+    alert("color changed");
+   });
+
+   $("#button1").click(function(){
+    $("#color1").val("#ffffff");   
+    $("#color1").change();
+   });
+
+   $("#button2").click(function(){
+    $("#color2").val("#000000");   
+    $("#color2").change();
+   });
+
+  });
+</script>
+
+<style type="text/css">
+/* styles adopted from Nidahas - Forms markup and CSS (http://nidahas.com/2006/12/06/forms-markup-and-css-revisited/) */
+/* General styles */
+body { margin: 0; padding: 0; font: 80%/1.5 Arial,Helvetica,sans-serif; color: #111; background-color: #FFF; }
+h2 { margin: 0px; padding: 10px; font-family: Georgia, "Times New Roman", Times, serif; font-size: 200%; font-weight: normal; color: #FFF; background-color: #CCC; border-bottom: #BBB 2px solid; }
+p#copyright { margin: 20px 10px; font-size: 90%; color: #999; }
+
+/* Form styles */
+div.form-container { margin: 10px; padding: 5px; background-color: #FFF; }
+
+p.legend { margin-bottom: 1em; }
+p.legend em { color: #C00; font-style: normal; }
+
+div.form-container div.controlset {display: block; float:left; width: 100%; padding: 0.25em 0;}
+
+div.form-container div.controlset label, 
+div.form-container div.controlset input,
+div.form-container div.controlset div { display: inline; float: left; }
+
+div.form-container div.controlset label { width: 100px;}
+</style>
+<link rel="stylesheet" href="colorPicker.css" type="text/css" />
+</head>
+
+<body>
+
+<div id="wrapper">
+
+	<h2>Test Really Simple Color Picker (jQuery)</h2>
+
+	<p>More information about this can be found in <a href="http://laktek.com/2008/10/27/really-simple-color-picker-in-jquery/"; title="Really Simple Color Picker in jQuery">this blog article</a>.</p>
+	<div class="form-container">
+	<form action="#" method="post">
+		<fieldset>
+			<div class="controlset"><label for="color1">Color 1</label> <input id="color1" type="text" name="color1" value="#333399" /></div>
+
+		</fieldset>
+	</form>
+</div>
+
+</body>
+
+</html>
+

=== added directory 'web_color/static/src'
=== added directory 'web_color/static/src/css'
=== added file 'web_color/static/src/css/color.css'
--- web_color/static/src/css/color.css	1970-01-01 00:00:00 +0000
+++ web_color/static/src/css/color.css	2012-11-26 16:25:33 +0000
@@ -0,0 +1,9 @@
+div.colorviewer {
+	display: inline;
+	float: left;
+  	height: 16px;
+  	width: 16px;
+  	padding: 0 !important;
+  	border: 1px solid #ccc;
+  	line-height: 16px;
+}
\ No newline at end of file

=== added directory 'web_color/static/src/img'
=== added file 'web_color/static/src/img/icon.png'
Binary files web_color/static/src/img/icon.png	1970-01-01 00:00:00 +0000 and web_color/static/src/img/icon.png	2012-11-26 16:25:33 +0000 differ
=== added directory 'web_color/static/src/js'
=== added file 'web_color/static/src/js/lib.js'
--- web_color/static/src/js/lib.js	1970-01-01 00:00:00 +0000
+++ web_color/static/src/js/lib.js	2012-11-26 16:25:33 +0000
@@ -0,0 +1,49 @@
+/*############################################################################
+#    
+#    OpenERP, Open Source Web Color
+#    Copyright (C) 2012 Savoir-faire Linux (<http://www.savoirfairelinux.com>).
+#
+#    This program is free software: you can redistribute it and/or modify
+#    it under the terms of the GNU General Public License as
+#    published by the Free Software Foundation, either version 3 of the
+#    License, or (at your option) any later version.
+#
+#    This program is distributed in the hope that it will be useful,
+#    but WITHOUT ANY WARRANTY; without even the implied warranty of
+#    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+#    GNU General Public License for more details.
+#
+#    You should have received a copy of the GNU General Public License
+#    along with this program.  If not, see <http://www.gnu.org/licenses/>. 
+#  
+#    @author Étienne Beaudry Auger <etienne.b.auger@xxxxxxxxxxxxxxxxxxxx>
+#
+##############################################################################*/
+
+openerp.web_color = function(instance) {
+    var _t = openerp.web._t;
+    var QWeb = openerp.web.qweb;
+    
+    widget_name = 'color';
+    //Add in the widgets list
+    instance.web.form.widgets.add(widget_name, 'openerp.web_color'); 
+    //Add object in the column list
+    instance.web.list.columns.add('field.color', 'instance.web.list.Color'); 
+    //instance of the widget itself
+    instance.web.list.Color = instance.web.list.Column.extend({
+        /**
+         * Return a formatted div colored and display the hexa color code
+         * from row_data
+         *
+         * @private
+         */
+        _format: function (row_data, options) {
+            return _.template(
+                '<div class="colorviewer" style="background-color: <%-colorCode%>"></div>\
+                <label style="padding-left: 5px"><%-colorCode%></label>', {
+                    colorCode: row_data[this.id].value
+                });
+
+        }
+    });
+}
\ No newline at end of file

=== added directory 'web_color/static/src/xml'
=== added file 'web_color/static/src/xml/lib.xml'
--- web_color/static/src/xml/lib.xml	1970-01-01 00:00:00 +0000
+++ web_color/static/src/xml/lib.xml	2012-11-26 16:25:33 +0000
@@ -0,0 +1,18 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<templates id="template" xml:space="preserve">
+	<t t-name="FieldColor">
+    	<span class="oe_form_field oe_colorpicker_root oe_form_field_color" t-att-style="widget.node.attrs.style"/>
+	</t>
+	<t t-name="web.colorpicker">
+	    <span>
+	        <t t-set="placeholder" t-value="widget.getParent().node and widget.getParent().node.attrs.placeholder"/>
+	        <input type="text" class="oe_colorpicker_container" disabled="disabled" style="display: none;"/>
+	        <input type="text"
+	            t-att-name="widget.name"
+	            t-att-placeholder="placeholder"
+	            class="oe_colorpicker_master"
+	        /><img class="oe_input_icon oe_colorpicker_trigger" t-att-src='_s + "/web/static/src/img/icons/color-picker.png"'
+	             title="Select color value" width="16" height="16" border="0"/>
+	    </span>
+	</t>
+</templates>
\ No newline at end of file


Follow ups