array( 'title' => t('Administer jQuery colorpicker'), 'description' => t('Allows users to administer the settings for the jQuery colorpicker'), ), ); } /** * API function to validate colors. This function is used anywhere the * value of a jquery_colorpicker element is used, to ensure consistency * in checking and in language. * * @param string $color * The color to be validated. * * @return array * The return value will be an array with one or two keys: * - color (always returned): contains the validated color. This is returned * as color values prefixed with the # symbol are allowed, but the symbol * will be removed to ensure consistency in saving. * - error (only returned if there is an error): Contains the error for the color. */ function jquery_colorpicker_validate_color($color) { $results = array('color' => $color); if (strlen($color)) { if (preg_match('/^#/', $color)) { $color = substr($color, 1); } $results['color'] = $color; // All values must be 6 characters in length (will probably add support for 3 character definitions and predifined colors in version 2 if (strlen($color) != 6) { $results['error'] = t('Color values must be exactly six characters in length'); } // All values must be hexadecimal values. elseif (!preg_match('/^[0-9a-f]{6}$/i', $color)) { $results['error'] = t("You entered an invalid value for the color. Colors must be hexadecimal, and can only contain the characters '0' to '9' and 'a' to 'f'."); } } return $results; } /** * Implements hook_elements(). */ function jquery_colorpicker_element_info() { // This is the definition for the new form API element. return array( 'jquery_colorpicker' => array( '#input' => TRUE, '#element_validate' => array('jquery_colorpicker_validate'), '#jquery_colorpicker_background' => 'select.png', '#process' => array('ajax_process_form', 'jquery_colorpicker_process_element'), '#theme' => 'jquery_colorpicker', '#theme_wrappers' => array('form_element'), ), ); } /** * Callback function to process jquery_colorpicker elements * * @see jquery_colorpicker_element_info() */ function jquery_colorpicker_process_element($element, &$form_state) { $element['#id'] = drupal_html_id('edit-' . implode('-', $element['#parents'])); $library_path = libraries_get_path('colorpicker'); // Decide what background to use to render the element. In order to ensure the background exists, we create an array of // the two possibilities, that we will use to compare the value submitted in the Form API definition. $backgrounds = array('select.png', 'select2.png'); // Now we check to see if the value in the Form API definition is valid. If it is, we use it, if it's not, we use a default value. $background = (in_array($element['#jquery_colorpicker_background'], $backgrounds)) ? $element['#jquery_colorpicker_background'] : 'select.png'; // Since we know the background, we can then get the URL of it to pass to the javascript function. $background_url = file_create_url($library_path . '/images/' . $background); // Attach the 3rd party CSS and JS files, and attach the module's JS files. $element['#attached'] = array( 'css' => array( // Add the 3rd party CSS files required for the form elmeent. $library_path . '/css/colorpicker.css', ), 'js' => array( // Add the 3rd party JS files required for the form element. $library_path . '/js/colorpicker.js', // Add the module js files. drupal_get_path('module', 'jquery_colorpicker') . '/js/jquery_colorpicker.js', ), ); // And we pass the settings in a namespace to the Javascript. $element['#attached']['js'][] = array( 'data' => array('jqueryColorpicker' => array($element['#id'] => $background_url)), 'type' => 'setting', ); return $element; } /** * Implements hook_theme(). */ function jquery_colorpicker_theme() { return array( 'jquery_colorpicker' => array( 'render element' => 'element', ), 'jquery_colorpicker_color_display' => array( 'variables' => array( 'entity_id' => NULL, 'instance_id' => NULL, 'entity_delta' => NULL, 'item' => NULL, ), ), 'jquery_colorpicker_text_display' => array( 'variables' => array('item' => NULL), ), ); } /** * callback theme for the new form element */ function theme_jquery_colorpicker($variables) { $element = $variables['element']; $class = array('form-colorpicker'); $output = ''; unset($element['#prefix']); unset($element['#suffix']); // Determine the default color for the form element $default_color = "#ffffff"; if (isset($element['#value']) && strlen($element['#value'])) { $default_color = '#' . $element['#value']; } elseif (isset($element['#default_value']) && strlen($element['#default_value']) == 6 && preg_match('/^[0-9a-f]{6}$/i', $element['#default_value'])) { $default_color = '#' . strtolower($element['#default_value']); } // Over the next few lines we build the output of the element in HTML and to send to the browser. _form_set_class($element, $class); $name = isset($element['#name']) ? $element['#name'] : $element['#id']; $value = isset($element['#value']) ? check_plain($element['#value']) : ''; if (preg_match('/^#/', $value)) { $value = substr($value, 1); } $output .= '