From 6daf9b0cc50242fa317c659ba09ad157c3397438 Mon Sep 17 00:00:00 2001
From: Michele Locati <michele@locati.it>
Date: Fri, 30 May 2014 08:43:43 +0200
Subject: [PATCH] Allow customization of 'No Color Selected' text

...so that it can be localized
---
 spectrum.js | 18 ++++++++++++------
 1 file changed, 12 insertions(+), 6 deletions(-)

diff --git a/spectrum.js b/spectrum.js
index 17078542..b096a6b6 100644
--- a/spectrum.js
+++ b/spectrum.js
@@ -32,6 +32,7 @@
         cancelText: "cancel",
         chooseText: "choose",
         clearText: "Clear Color Selection",
+		  noColorSelectedText: "No Color Selected",
         preferredFormat: false,
         className: "", // Deprecated - use containerClassName and replacerClassName instead.
         containerClassName: "",
@@ -113,7 +114,7 @@
         ].join("");
     })();
 
-    function paletteTemplate (p, color, className, tooltipFormat) {
+    function paletteTemplate (p, color, className, opts) {
         var html = [];
         for (var i = 0; i < p.length; i++) {
             var current = p[i];
@@ -121,12 +122,17 @@
                 var tiny = tinycolor(current);
                 var c = tiny.toHsl().l < 0.5 ? "sp-thumb-el sp-thumb-dark" : "sp-thumb-el sp-thumb-light";
                 c += (tinycolor.equals(color, current)) ? " sp-thumb-active" : "";
-                var formattedString = tiny.toString(tooltipFormat || "rgb");
+                var formattedString = tiny.toString(opts.preferredFormat || "rgb");
                 var swatchStyle = rgbaSupport ? ("background-color:" + tiny.toRgbString()) : "filter:" + tiny.toFilter();
                 html.push('<span title="' + formattedString + '" data-color="' + tiny.toRgbString() + '" class="' + c + '"><span class="sp-thumb-inner" style="' + swatchStyle + ';" /></span>');
             } else {
                 var cls = 'sp-clear-display';
-                html.push('<span title="No Color Selected" data-color="" style="background-color:transparent;" class="' + cls + '"></span>');
+                html.push($('<div />')
+						.append($('<span data-color="" style="background-color:transparent;" class="' + cls + '"></span>')
+							.attr('title', opts.noColorSelectedText)
+						)
+						.html()
+					);
             }
         }
         return "<div class='sp-cf " + className + "'>" + html.join('') + "</div>";
@@ -486,13 +492,13 @@
             var currentColor = get();
 
             var html = $.map(paletteArray, function (palette, i) {
-                return paletteTemplate(palette, currentColor, "sp-palette-row sp-palette-row-" + i, opts.preferredFormat);
+                return paletteTemplate(palette, currentColor, "sp-palette-row sp-palette-row-" + i, opts);
             });
 
             updateSelectionPaletteFromStorage();
 
             if (selectionPalette) {
-                html.push(paletteTemplate(getUniqueSelectionPalette(), currentColor, "sp-palette-row sp-palette-row-selection", opts.preferredFormat));
+                html.push(paletteTemplate(getUniqueSelectionPalette(), currentColor, "sp-palette-row sp-palette-row-selection", opts));
             }
 
             paletteContainer.html(html.join(""));
@@ -502,7 +508,7 @@
             if (opts.showInitial) {
                 var initial = colorOnShow;
                 var current = get();
-                initialColorContainer.html(paletteTemplate([initial, current], current, "sp-palette-row-initial", opts.preferredFormat));
+                initialColorContainer.html(paletteTemplate([initial, current], current, "sp-palette-row-initial", opts));
             }
         }