jquery_colorpicker.module 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377
  1. <?php
  2. /**
  3. * Implementation of hook_perm()
  4. */
  5. function jquery_colorpicker_permission()
  6. {
  7. return array
  8. (
  9. 'administer jquery colorpicker' => array
  10. (
  11. 'title' => t('Administer jQuery colorpicker'),
  12. 'description' => t('Allows users to administer the settings for the jQuery colorpicker'),
  13. )
  14. );
  15. }
  16. /**
  17. * Implementation of hook_menu()
  18. */
  19. function jquery_colorpicker_menu()
  20. {
  21. // This creates the URL for the settings page.
  22. $menu['admin/config/development/jquery_colorpicker'] = array
  23. (
  24. 'title' => 'Jquery Colorpicker',
  25. 'description' => 'Settings page for jquery colorpicker',
  26. 'page callback' => 'drupal_get_form',
  27. 'page arguments' => array('jquery_colorpicker_settings'),
  28. 'access arguments' => array('administer jquery colorpicker'),
  29. );
  30. return $menu;
  31. }
  32. /**
  33. * Implementation of hook_elements()
  34. */
  35. function jquery_colorpicker_element_info()
  36. {
  37. // this is the definition for the new form API element
  38. return array
  39. (
  40. 'jquery_colorpicker' => array
  41. (
  42. '#input' => TRUE,
  43. '#element_validate' => array('jquery_colorpicker_validate'),
  44. '#jquery_colorpicker_background' => 'select.png',
  45. '#theme' => 'jquery_colorpicker',
  46. ),
  47. );
  48. }
  49. /**
  50. * Implementation of hook_theme()
  51. */
  52. function jquery_colorpicker_theme()
  53. {
  54. return array
  55. (
  56. 'jquery_colorpicker' => array
  57. (
  58. 'render element' => 'element'
  59. ),
  60. );
  61. }
  62. /**
  63. * callback theme for the new form element
  64. */
  65. function theme_jquery_colorpicker($variables)
  66. {
  67. $element = $variables['element'];
  68. $class = array('form-colorpicker');
  69. $output = '';
  70. $path = module_exists('libraries') && in_array('colorpicker', array_keys(libraries_get_libraries()))
  71. ? libraries_get_path('colorpicker')
  72. : drupal_get_path('module', 'jquery_colorpicker') . '/colorpicker';
  73. // Decide what background to use to render the element. In order to ensure the background exists, we create an array of
  74. // the two possibilities, that we will use to compare the value submitted in the Form API definition
  75. $backgrounds = array('select.png', 'select2.png');
  76. // 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
  77. $background = (in_array($element['#jquery_colorpicker_background'], $backgrounds)) ? $element['#jquery_colorpicker_background'] : 'select.png';
  78. // Since we know the background, we can then get the URL of it to pass to the javascript function
  79. $background_url = base_path() . $path . '/images/' . $background;
  80. // next we determine what the default value for the form element is. This will also be passed to the javascript function.
  81. if(isset($element['#value']) && strlen($element['#value']))
  82. {
  83. $default_color = '#' . $element['#value'];
  84. }
  85. elseif(isset($element['#default_value']) && strlen($element['#default_value']) == 6 && preg_match('/^[0-9a-f]{6}$/i', $element['#default_value']))
  86. {
  87. $default_color = '#' . strtolower($element['#default_value']);
  88. }
  89. else
  90. {
  91. $default_color = "#ffffff";
  92. }
  93. // Build an array of all the settings to be used by the javascript function
  94. $settings = array('ids' => array($element['#id']), 'backgrounds' => array($background_url), 'backgroundColors' => array($default_color), $element['#id'] . '-defaultColor' => $default_color);
  95. // Attach the 3rd party CSS and JS files, and attach the module's JS files.
  96. $element['#attached'] = array
  97. (
  98. 'css' => array
  99. (
  100. // Add the 3rd party CSS files required for the form elmeent
  101. $path . '/css/colorpicker.css',
  102. ),
  103. 'js' => array
  104. (
  105. // Add the 3rd party JS files required for the form element
  106. $path . '/js/colorpicker.js',
  107. // Add the module js files
  108. drupal_get_path('module', 'jquery_colorpicker') . '/js/jquery_colorpicker.js',
  109. // Add the settings
  110. array
  111. (
  112. 'data' => $settings,
  113. 'type' => 'setting',
  114. ),
  115. ),
  116. );
  117. // If IE6 support is enabled, attach the inline CSS and JS that will reside in conditional comments
  118. if(variable_get('jquery_colorpicker_ie6_support', 0))
  119. {
  120. $ie6_path = base_path() . drupal_get_path('module', 'jquery_colorpicker') . '/twin_helix/';
  121. $path_to_pngfix = $ie6_path . 'iepngfix.htc';
  122. $path_to_tilebg = $ie6_path . 'iepngfix_tilebg.js';
  123. $css = '<!--[if lt IE 7]>' .
  124. '.inner_wrapper, .color_picker, .colorpicker_color div, .colorpicker_color div div { behavior: url("' . $path_to_pngfix . '") } ' .
  125. '<![endif]-->';
  126. $element['#attached']['css'][] = array
  127. (
  128. 'data' => $css,
  129. 'type' => 'inline',
  130. );
  131. $js = 'var script = document.createElement("script"); script.type = "text/javascript";';
  132. $js .= 'script.src = "' . $path_to_tilebg . '";';
  133. $js .= 'document.getElementsByTagName("head")[0].appendChild(script);';
  134. $element['#attached']['js'][] = array
  135. (
  136. 'data' => $js,
  137. 'type' => 'inline',
  138. );
  139. }
  140. // And we pass the settings in a namespace to the Javascript
  141. drupal_add_js(array('jqueryColorpicker' => $settings), 'setting');
  142. // Over the next few lines we build the output of the element in HTML and to send to the browser
  143. _form_set_class($element, $class);
  144. if (isset($element['#field_prefix']))
  145. {
  146. $output .= '<span class="field-prefix">'. $element['#field_prefix'] .'</span> ';
  147. }
  148. $output .= '<div id="' . $element['#id'] . '" class="jquery_colorpicker">';
  149. $output .= '<div id="' . $element['#id'] . '-inner_wrapper" class="inner_wrapper">';
  150. $output .= '<div class="color_picker" style="background-color:' . $default_color . '">';
  151. $output .= '<span class="hash">#</span>';
  152. $name = isset($element['#name']) ? $element['#name'] : $element['#id'];
  153. $output .= '<input type="text"'. ' maxlength="6"' .' name="'. $name .'" id="'. $element['#id'] .'"'. ' size="7"' .' value="'. check_plain($element['#value']) .'"'. drupal_attributes($element['#attributes']) .' />';
  154. $output .= '<div class="description">' . t('Enter a hexidecimal color value. Enabling javascript will replace this input with a graphical color selector.') . '</div>';
  155. $output .= '</div>';
  156. $output .= '</div>';
  157. $output .= '</div>';
  158. if (isset($element['#field_suffix']))
  159. {
  160. $output .= '<span class="field-suffix">'. $element['#field_suffix'] .'</span>';
  161. }
  162. $element['#children'] = $output;
  163. $element['#theme'] = 'form_element';
  164. return drupal_render($element);
  165. }
  166. /**
  167. * Validation function for the new form element
  168. */
  169. function jquery_colorpicker_validate($element, &$form_state)
  170. {
  171. // All values must be 6 characters in length (will probably add support for 3 character definitions and predifined colors in version 2
  172. if($element['#value'] != '' && strlen($element['#value']) != 6)
  173. {
  174. form_error($element, t('Color values must be exactly six characters in length'));
  175. }
  176. // All values must not include the hash symbol
  177. elseif($element['#value'] != '' && preg_match('/^#/', $element['#value']))
  178. {
  179. form_error($element, t('Do not include the hash symbol (#) when entering colors'));
  180. }
  181. // All values must be hexadecimal values
  182. elseif($element['#value'] != '' && !preg_match('/^[0-9a-f]{6}$/i', $element['#value']))
  183. {
  184. form_error($element, 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'."));
  185. }
  186. }
  187. /**
  188. * Callback function for the URL admin/settings/jquery_colorpicker
  189. * This function creates the settings page for the module
  190. */
  191. function jquery_colorpicker_settings()
  192. {
  193. // First we create a fieldset to make it all look nice. If ever other settings are enabled, this will keep the page looking nice
  194. $form['ie6'] = array
  195. (
  196. '#type' => 'fieldset',
  197. '#title' => t('Internet Explorer 6'),
  198. );
  199. // Next we add a description of the necessary steps to enable IE6 support
  200. $form['ie6']['description'] = array
  201. (
  202. '#value' => '<p>' . t('Internet Explorer 6 does not support transparencies in .png files. They are rendered with a non-transparent blue glow anywhere where there should be transparency. Since jquery colorpicker relies on transparent .png files to work, this means that out of the box, the jquery colorpicker will not work with IE6. You can solve this using the following steps:') . '</p><ol><li>' . t('Inside the jquery colorpicker module folder (generally located at sites/all/modules), create a new folder named "twin_helix". If the jquery colorpicker module is in the standard location, this means you will have the folder sites/all/modules/jquery_colorpicker/twin_helix') . '</li><li>' . t('Download the iepngfix.zip from !twin_helix', array('!twin_helix' => l('Twin Helix', 'http://www.twinhelix.com/css/iepngfix/', array('absolute' => TRUE)))) . '</li><li>' . t('Unpack the zip file, and place the following three files into the twin_helix folder you created in step 1:') . '<ul><li>iepngfix.htc</li><li>blank.gif</li><li>iepngfix_tilebg.js</li></ul></li><li>' . t('Check the box below, and save this page') . '</li></ol>',
  203. );
  204. // And finally we add a checkbox so the user can indicate that IE6 should be supported
  205. $form['ie6']['jquery_colorpicker_ie6_support'] = array
  206. (
  207. '#type' => 'checkbox',
  208. '#title' => t('Support IE6'),
  209. '#default_value' => variable_get('jquery_colorpicker_ie6_support', 0),
  210. );
  211. return system_settings_form($form);
  212. }
  213. /**
  214. * Implementation of hook_field_info()
  215. */
  216. function jquery_colorpicker_field_info()
  217. {
  218. return array
  219. (
  220. 'jquery_colorpicker' => array
  221. (
  222. 'label' => t('jQuery Colorpicker'),
  223. 'description' => t('A colorpicker pop that uses the jQuery Colorpicker'),
  224. 'default_widget' => 'jquery_colorpicker',
  225. 'default_formatter' => 'jquery_colorpicker_color_display',
  226. ),
  227. );
  228. }
  229. /**
  230. * Implementation of hook_field_validate()
  231. */
  232. function jquery_colorpicker_field_validate($entity_type, $entity, $field, $instance, $langcode, $items, &$errors)
  233. {
  234. foreach($items as $delta => $item)
  235. {
  236. if(!empty($item['jquery_colorpicker']))
  237. {
  238. // All values must be 6 characters in length (will probably add support for 3 character definitions and predifined colors in version 2
  239. if(strlen($item['jquery_colorpicker']) != 6)
  240. {
  241. $errors[$field['field_name']][$langcode][$delta][] = array
  242. (
  243. 'error' => 'jquery_colorpicker_color_not_long_enough',
  244. 'message' => t('Color values must be exactly six characters in length'),
  245. );
  246. }
  247. // All values must not include the hash symbol
  248. elseif(preg_match('/^#/', $item['jquery_colorpicker']))
  249. {
  250. $errors[$field['field_name']][$langcode][$delta][] = array
  251. (
  252. 'error' => 'jquery_colorpicker_starts_with_hash',
  253. 'message' => t('Do not include the hash symbol (#) when entering colors'),
  254. );
  255. }
  256. // All values must be hexadecimal values
  257. elseif(!preg_match('/^[0-9a-fA-F]{6}$/i', $item['jquery_colorpicker']))
  258. {
  259. $errors[$field['field_name']][$langcode][$delta][] = array
  260. (
  261. 'error' => 'jquery_colorpicker_not_jquery_colorpicker',
  262. 'message' => t("You entered an invalid value for the color. Colors must be hexadecimal, and can only contain the characters '0-9', 'a-f' and/or 'A-F'."),
  263. );
  264. }
  265. }
  266. }
  267. }
  268. /**
  269. * Implementation of hook_field_is_empty
  270. */
  271. function jquery_colorpicker_field_is_empty($item, $field)
  272. {
  273. return empty($item['jquery_colorpicker']);
  274. }
  275. /**
  276. * Implementation of hook_field_formatter_info()
  277. */
  278. function jquery_colorpicker_field_formatter_info()
  279. {
  280. return array
  281. (
  282. 'jquery_colorpicker_color_display' => array
  283. (
  284. 'label' => t('Colored block'),
  285. 'field types' => array('jquery_colorpicker'),
  286. ),
  287. 'jquery_colorpicker_text_display' => array
  288. (
  289. 'label' => t('Text'),
  290. 'field types' => array('jquery_colorpicker'),
  291. ),
  292. );
  293. }
  294. /**
  295. * Implementation of hook_field_formatter_view()
  296. */
  297. function jquery_colorpicker_field_formatter_view($entity_type, $entity, $field, $instance, $langcode, $items, $display)
  298. {
  299. $element = array();
  300. foreach($items as $delta => $item)
  301. {
  302. if($display['type'] == 'jquery_colorpicker_color_display')
  303. {
  304. $element[$delta]['#markup'] = '<div id="jquery_colorpicker_color_display_' . $instance['id'] . '_' . $delta . '_' . $item['jquery_colorpicker'] . '">&nbsp;</div>';
  305. $element[$delta]['#attached']['css'][] = array
  306. (
  307. 'type' => 'inline',
  308. 'data' => '#jquery_colorpicker_color_display_' . $instance['id'] . '_' . $delta . '_' . $item['jquery_colorpicker'] . '{background-color:#' . $item['jquery_colorpicker'] . ';}',
  309. );
  310. }
  311. elseif($display['type'] == 'jquery_colorpicker_text_display')
  312. {
  313. $element[$delta]['#markup'] = '<div class="jquery_colorpicker_text_display"><span class="jquery_colorpicker_hash_mark">#</span>' . $item['jquery_colorpicker'] . '</div>';
  314. }
  315. }
  316. return $element;
  317. }
  318. /**
  319. * Implementation of hook_field_widget_info()
  320. */
  321. function jquery_colorpicker_field_widget_info()
  322. {
  323. return array
  324. (
  325. 'jquery_colorpicker' => array
  326. (
  327. 'label' => t('jQuery Colorpicker'),
  328. 'field types' => array('jquery_colorpicker'),
  329. ),
  330. );
  331. }
  332. /**
  333. * Implementation of hook_widget_form()
  334. */
  335. function jquery_colorpicker_field_widget_form(&$form, &$form_state, $field, $instance, $langcode, $items, $delta, $element)
  336. {
  337. $value = '';
  338. if (isset($instance['default_value'][$delta]['jquery_colorpicker'])) $value = $instance['default_value'][$delta]['jquery_colorpicker'];
  339. if (isset($items[$delta]['jquery_colorpicker'])) $value = $items[$delta]['jquery_colorpicker'];
  340. $element += array
  341. (
  342. '#delta' => $delta,
  343. );
  344. $element['jquery_colorpicker'] = array();
  345. if($instance['widget']['type'] == 'jquery_colorpicker')
  346. {
  347. $element['jquery_colorpicker'] += array
  348. (
  349. '#title' => $instance['label'],
  350. '#type' => 'jquery_colorpicker',
  351. '#default_value' => $value,
  352. );
  353. }
  354. return $element;
  355. }