diff --git a/imagefield_focus.css b/imagefield_focus.css index 7de3fe6..dbb9050 100644 --- a/imagefield_focus.css +++ b/imagefield_focus.css @@ -1,14 +1,11 @@ -.form-text.imagefield-focus -{ +.form-text.imagefield-focus { max-width: 13em; } -.form-text.imagefield-focus.active -{ +.form-text.imagefield-focus.active { border: 2px solid #999; } -.imagefield-focus.focus-box -{ +.imagefield-focus.focus-box { min-width: 500px; } diff --git a/imagefield_focus.js b/imagefield_focus.js index 31fafb2..6dcab0c 100644 --- a/imagefield_focus.js +++ b/imagefield_focus.js @@ -42,8 +42,8 @@ var $this = $(this); var img = $('> img', $this); var inputs = $('input.imagefield-focus', $this.parent()); - var fieldName = inputs.attr('name').replace(/^([a-z0-9_]+)\[.+$/, '$1'); - var settings = Drupal.settings.imagefield_focus[fieldName]; + var key = inputs.attr('data-key'); + var settings = Drupal.settings.imagefield_focus[key]; var minSize, ratio; if (settings.min_width && settings.min_height) { diff --git a/imagefield_focus.module b/imagefield_focus.module index ec05312..81916b2 100644 --- a/imagefield_focus.module +++ b/imagefield_focus.module @@ -8,8 +8,6 @@ require_once dirname(__FILE__) .'/imagefield_focus.effects.inc'; - - /** * Implementation of hook_field_info_alter(). */ @@ -21,102 +19,102 @@ function imagefield_focus_field_info_alter(&$info) { ); } - - /** - * Implementation of hook_form_FORM_ID_alter(); alter field_ui_field_edit_form. + * Implementation of hook_form_FORM_ID_alter(). */ function imagefield_focus_form_field_ui_field_edit_form_alter(&$form, &$form_state, $form_id) { + // Add imagefield_focus settings to the field settings form if the field is an + // image and has a "process" function. if (($form['#field']['type'] == 'image') && imagefield_focus_widget_support($form['#instance']['widget']['type'])) { - $settings = $form['#instance']['settings']; - - $additions['focus_settings'] = array( - '#type' => 'fieldset', - '#title' => t('Focus settings'), - '#collapsible' => TRUE, - '#collapsed' => empty($settings['focus']), - '#parents' => array('instance', 'settings'), - '#weight' => 17, - ); + $fields = imagefield_focus_settings_form_fields($form, $form_state, $form['#instance']['settings']); + $form['instance']['settings'] += $fields; + } +} - $additions['focus_settings']['focus'] = array( - '#type' => 'checkbox', - '#title' => t('Enable focus'), - '#default_value' => (!empty($settings['focus'])) ? $settings['focus'] : 0, - '#description' => t('Enable user-defined focus and crop rectangles for images.'), - ); +/** + * Element #process callback function; process widget type image_image. + */ +function imagefield_focus_widget_image_image_process($element, &$form_state, $form) { + $added = &drupal_static(__FUNCTION__); - $focus_min_size = explode('x', $settings['focus_min_size']) + array('', ''); - $additions['focus_settings']['focus_min_size'] = array( - '#type' => 'item', - '#title' => t('Minimum size'), - '#element_validate' => array('_image_field_resolution_validate', '_imagefield_focus_focus_min_size_validate'), - '#field_prefix' => '
', - '#field_suffix' => '
', - '#description' => t('The minimum allowed focus rectangle size expressed as WIDTHxHEIGHT (e.g. 100x75). Leave empty for no restriction.'), - ); - $additions['focus_settings']['focus_min_size']['x'] = array( - '#type' => 'textfield', - '#title' => t('Minimum width'), - '#title_display' => 'invisible', - '#default_value' => $focus_min_size[0], - '#size' => 5, - '#maxlength' => 5, - '#field_suffix' => ' x ', - ); - $additions['focus_settings']['focus_min_size']['y'] = array( - '#type' => 'textfield', - '#title' => t('Minimum height'), - '#title_display' => 'invisible', - '#default_value' => $focus_min_size[1], - '#size' => 5, - '#maxlength' => 5, - '#field_suffix' => ' '. t('pixels'), - ); + $item = $element['#value']; + $item['key'] = $element['#field_name']; + $field_name = $element['#field_name']; + $instance = field_widget_instance($element, $form_state); - $additions['focus_settings']['focus_lock_ratio'] = array( - '#type' => 'checkbox', - '#title' => t('Lock ratio'), - '#default_value' => (!empty($settings['focus_lock_ratio'])) ? $settings['focus_lock_ratio'] : 0, - '#description' => 'Whether focus rectangle aspect ratio should be maintained based on the minimum size specified above. Checking this box has no effect if no minimum size is specified.', - ); + if ($element['#file']) { + // Add JS and CSS. + $settings = _imagefield_focus_build_js_settings($field_name, $instance['settings']); + _imagefield_focus_attach_files($settings); - $form['instance']['settings'] += $additions; + $crop_focus_form = imagefield_focus_crop_focus_form_fields($element['#file']->uri, $item); + $element += $crop_focus_form; + $element['#element_validate'][] = 'imagefield_focus_widget_validate'; } + + return $element; +} + +/** + * Implementation of hook_form_FORM_ID_alter(). + */ +function imagefield_focus_form_media_admin_config_browser_alter(&$form, &$form_state) { + // Add imagefield_focus settings to the media browser settings form. + $fields = imagefield_focus_settings_form_fields($form, $form_state, variable_get('imagefield_focus_media_settings', array())); + $form += $fields; + $form['#submit'][] = 'imagefield_focus_settings_media_configuration_form_submit'; +} + +/** + * Form submit function that handles focus settings for the media module. + */ +function imagefield_focus_settings_media_configuration_form_submit($form, $form_state) { + // Create an array of all focus settings and save them as a variable. + if ($form_state['values']['focus']) { + $focus_settings = array( + 'focus' => $form_state['values']['focus'], + 'focus_lock_ratio' => $form_state['values']['focus_lock_ratio'], + 'focus_min_size' => $form_state['values']['focus_min_size'], + ); + } + else { + $focus_settings = array(); + } + + variable_set('imagefield_focus_media_settings', $focus_settings); } /** * Element validation function; validate focus_min_size. */ -function _imagefield_focus_focus_min_size_validate($element, &$form_state, $form) { - $min_resolution_element = $form['instance']['settings']['min_resolution']; - if (!form_get_error($element['x']) && !form_get_error($element['y']) - && !form_get_error($min_resolution_element['x']) && !form_get_error($min_resolution_element['y'])) { - $value = $form_state['values']['instance']['settings']['focus_min_size']; - if (!empty($value)) { - $dimensions = explode('x', $value); - $min_resolution_value = $form_state['values']['instance']['settings']['min_resolution']; - if (empty($min_resolution_value)) { - $error_element = $min_resolution_element['x']; - } - else { - $min_resolution_dimensions = explode('x', $min_resolution_value); - if ($min_resolution_dimensions[0] < $dimensions[0]) { +function imagefield_focus_focus_min_size_validate($element, &$form_state, $form) { + if (isset($form['instance']['settings']['min_resolution'])) { + $min_resolution_element = $form['instance']['settings']['min_resolution']; + if (!form_get_error($element['x']) && !form_get_error($element['y']) && !form_get_error($min_resolution_element['x']) && !form_get_error($min_resolution_element['y'])) { + $value = $form_state['values']['instance']['settings']['focus_min_size']; + if (!empty($value)) { + $dimensions = explode('x', $value); + $min_resolution_value = $form_state['values']['instance']['settings']['min_resolution']; + if (empty($min_resolution_value)) { $error_element = $min_resolution_element['x']; } - elseif ($min_resolution_dimensions[1] < $dimensions[1]) { - $error_element = $min_resolution_element['y']; + else { + $min_resolution_dimensions = explode('x', $min_resolution_value); + if ($min_resolution_dimensions[0] < $dimensions[0]) { + $error_element = $min_resolution_element['x']; + } + elseif ($min_resolution_dimensions[1] < $dimensions[1]) { + $error_element = $min_resolution_element['y']; + } + } + if (isset($error_element)) { + form_error($error_element, t('Minimum resolution must be set and be greater or equal to focus minimum size, i.e. %focus_min_size.', array('%focus_min_size' => $value))); } - } - if (isset($error_element)) { - form_error($error_element, t('Minimum resolution must be set and be greater or equal to focus minimum size, i.e. %focus_min_size.', array('%focus_min_size' => $value))); } } } } - - /** * Implementation of hook_field_widget_form_alter(). */ @@ -130,73 +128,145 @@ function imagefield_focus_field_widget_form_alter(&$element, &$form_state, $cont } /** - * Element #process callback function; process widget type image_image. + * Implements hook_form_FORM_ID_alter(). + * Adds the crop and focus form to the file/%fid/edit form. */ -function imagefield_focus_widget_image_image_process($element, &$form_state, $form) { - static $added; +function imagefield_focus_form_file_entity_edit_alter(&$form, &$form_state) { + $settings = variable_get('imagefield_focus_media_settings', array()); + if ($form['type']['#value'] == 'image' && $settings['focus']) { + $file = file_load($form['fid']['#value']); + $file->key = 'media'; + $item = (array) $file; + + $form['imagefield_focus'] = array( + '#prefix' => '

' . t('Image Focus Settings') . '

', + ) + imagefield_focus_crop_focus_form_fields($file->uri, $item); + + $form['#validate'][] = 'imagefield_focus_crop_focus_form_validate'; + $form['#submit'][] = 'imagefield_focus_crop_focus_form_submit'; + + // Attach css and js used by imagefield_focus. + $settings = _imagefield_focus_build_js_settings('media', $settings); + _imagefield_focus_attach_files($settings, $form); + } +} - $item = $element['#value']; - $field_name = $element['#field_name']; - $instance = field_widget_instance($element, $form_state); - $settings = $instance['settings']; +/** + * Returns the fields used by the focus settings form. + */ +function imagefield_focus_settings_form_fields($form, $form_state, $values) { + $values += array( + 'focus' => 0, + 'focus_min_size' => '', + 'focus_lock_ratio' => 0, + ); - // Add JS and CSS. - $path = drupal_get_path('module', 'imagefield_focus'); - drupal_add_js( $path .'/imgfocus/jquery.imgfocus.min.js'); - drupal_add_js( $path .'/imagefield_focus.js'); - drupal_add_css($path .'/imgfocus/jquery.imgfocus.css'); - drupal_add_css($path .'/imagefield_focus.css'); - - // Add settings. - if (!isset($added[$field_name])) { - list($w, $h) = explode('x', $settings['focus_min_size']) + array('', ''); - drupal_add_js(array( - 'imagefield_focus' => array( - $field_name => array( - 'min_width' => intval($w), - 'min_height' => intval($h), - 'lock_ratio' => !empty($settings['focus_lock_ratio']), - ), - ), - ), 'setting'); - $added[$field_name] = TRUE; - } + $fields['focus_settings'] = array( + '#type' => 'fieldset', + '#title' => t('Focus settings'), + '#collapsible' => TRUE, + '#collapsed' => empty($values['focus']), + '#parents' => array('instance', 'settings'), + '#weight' => 17, + ); + + $fields['focus_settings']['focus'] = array( + '#type' => 'checkbox', + '#title' => t('Enable focus'), + '#default_value' => (!empty($values['focus'])) ? $values['focus'] : 0, + '#description' => t('Enable user-defined focus and crop rectangles for images.'), + ); - // Add focus fields. - $element['focus_rect'] = array( + $focus_min_size = explode('x', $values['focus_min_size']) + array('', ''); + $fields['focus_settings']['focus_min_size'] = array( + '#type' => 'item', + '#title' => t('Minimum size'), + '#element_validate' => array('_image_field_resolution_validate', 'imagefield_focus_focus_min_size_validate'), + '#field_prefix' => '
', + '#field_suffix' => '
', + '#description' => t('The minimum allowed focus rectangle size expressed as WIDTHxHEIGHT (e.g. 100x75). Leave empty for no restriction.'), + ); + $fields['focus_settings']['focus_min_size']['x'] = array( + '#type' => 'textfield', + '#title' => t('Minimum width'), + '#title_display' => 'invisible', + '#default_value' => $focus_min_size[0], + '#size' => 5, + '#maxlength' => 5, + '#field_suffix' => ' x ', + ); + $fields['focus_settings']['focus_min_size']['y'] = array( + '#type' => 'textfield', + '#title' => t('Minimum height'), + '#title_display' => 'invisible', + '#default_value' => $focus_min_size[1], + '#size' => 5, + '#maxlength' => 5, + '#field_suffix' => ' '. t('pixels'), + ); + + $fields['focus_settings']['focus_lock_ratio'] = array( + '#type' => 'checkbox', + '#title' => t('Lock ratio'), + '#default_value' => (!empty($values['focus_lock_ratio'])) ? $values['focus_lock_ratio'] : 0, + '#description' => t('Whether focus rectangle aspect ratio should be maintained based on the minimum size specified above. Checking this box has no effect if no minimum size is specified.'), + ); + + return $fields; +} + +/** + * Build the focus and crop form. + */ +function imagefield_focus_crop_focus_form_fields($uri, $item) { + $info = image_get_info($uri); + $form['focus_rect'] = array( '#type' => 'textfield', '#title' => t('Focus rectangle'), '#default_value' => isset($item['focus_rect']) ? $item['focus_rect'] : '', '#description' => t('The important portion of the image to set focus to and that should never be cut. It is recommended to keep it as small as possible for best results.'), - '#attributes' => array('class' => array('imagefield-focus', 'focus-rect')), + '#attributes' => array( + 'class' => array('imagefield-focus', 'focus-rect'), + 'data-key' => isset($item['key']) ? $item['key'] : '', + ), '#access' => (bool) $item['fid'], ); - $element['crop_rect'] = array( + $form['crop_rect'] = array( '#type' => 'textfield', '#title' => t('Crop rectangle'), '#default_value' => isset($item['crop_rect']) ? $item['crop_rect'] : '', '#description' => t('When set, the portions of the image outside this area will always be cut out.'), - '#attributes' => array('class' => array('imagefield-focus', 'crop-rect')), + '#attributes' => array( + 'class' => array('imagefield-focus', 'crop-rect'), + 'data-key' => isset($item['key']) ? $item['key'] : '', + ), '#access' => (bool) $item['fid'], ); - // Add focus box. - if ($element['#file']) { - $uri = $element['#file']->uri; - $info = (isset($element['#value']['width']) && isset($element['#value']['height'])) ? array( - 'width' => $element['#value']['width'], - 'height' => $element['#value']['height'], - ) : image_get_info($uri); - - if (is_array($info)) { - $element['focus_box'] = array( - '#markup' => '
'. $info['width'] .'x'. $info['height'] .'
', - ); - } + if (is_array($info)) { + $form['focus_box'] = array( + '#markup' => '
'. $info['width'] .'x'. $info['height'] .'
', + ); } - $element['#element_validate'][] = 'imagefield_focus_widget_validate'; - return $element; + return $form; +} + +/** + * Submit function for the file entity upload form. + */ +function imagefield_focus_file_entity_add_upload_submit($form, &$form_state) { + if ($form_state['clicked_button']['#value'] == t('Upload and Set Focus')) { + if (!empty($form_state['#media_browser'])) { + $form_state['redirect'] = array('media/browser', array('fragment' => 'media-tab-library', 'query' => array( + 'render' => 'media-popup', + 'imagefield_focus_fid' => $form_state['file']->fid, + ))); + } + else { + $form_state['redirect'] = array('file/' . $form_state['file']->fid . '/edit'); + } + } } /** @@ -204,16 +274,33 @@ function imagefield_focus_widget_image_image_process($element, &$form_state, $fo */ function imagefield_focus_widget_validate($element, &$form_state, $form) { foreach (array('focus_rect', 'crop_rect') as $key) { - if (isset($element['#value'][$key])) { - $value = trim($element['#value'][$key]); - if ((strlen($value) > 0) && !imagefield_focus_parse($value)) { - form_error($element[$key], t('The specified rectangle value is invalid.')); - } + if (isset($element['#value'][$key]) && !imagefield_focus_validate_crop_focus_rect($element['#value'][$key])) { + form_error($element[$key], t('The specified rectangle value is invalid.')); } } } +/** + * Form validation function. + */ +function imagefield_focus_crop_focus_form_validate($form, &$form_state) { + foreach (array('focus_rect', 'crop_rect') as $key) { + if (isset($form_state['values'][$key]) && !imagefield_focus_validate_crop_focus_rect($form_state['values'][$key])) { + form_error($key, t('The specified rectangle value is invalid.')); + } + } +} +/** + * Form submit function. + */ +function imagefield_focus_crop_focus_form_submit($form, &$form_state) { + $file = file_load($form['fid']['#value']); + $file->focus_rect = $form_state['values']['focus_rect']; + $file->crop_rect = $form_state['values']['crop_rect']; + + _imagefield_focus_file_save($file); +} /** * Implementation of hook_field_attach_insert(). @@ -247,7 +334,69 @@ function imagefield_focus_field_attach_update($entity_type, $entity) { imagefield_focus_field_attach_insert($entity_type, $entity); } +/** + * Implementation of hook_query_TAG_alter(). + * Alter queries tagged with file_load_multiple. + */ +function imagefield_focus_query_file_load_multiple_alter(QueryAlterableInterface $query) { + $query->fields('iff', array('focus_rect', 'crop_rect')); + $query->leftJoin('imagefield_focus_file', 'iff', 'iff.fid = base.fid'); +} + +/** + * Parse a rectangle from a given string. + * + * @return + * A rectangle array or FALSE. + */ +function imagefield_focus_parse($rect) { + $values = explode(',', $rect); + if (count($values) != 4) { + return FALSE; + } + + $keys = array('x', 'y', 'width', 'height'); + $rect = array(); + for ($i = 0; $i < 4; $i++) { + $value = $values[$i]; + if (!is_numeric($value)) { + return FALSE; + } + $rect[$keys[$i]] = round($value); + } + if (($rect['x'] < 0) || ($rect['y'] < 0) || ($rect['width'] <= 0) || ($rect['height'] <= 0)) { + return FALSE; + } + + $rect['xoffset'] = $rect['x']; + $rect['yoffset'] = $rect['y']; + $rect['anchor'] = $rect['x'] .'-'. $rect['y']; + + return $rect; +} + +/** + * Return whether ImageField Focus has support for the given widget. + */ +function imagefield_focus_widget_support($type) { + return function_exists('imagefield_focus_widget_'. $type .'_process'); +} + +/** + * Checks a string to see if it's a valid rect. + * + * @param string $value + * + * @return bool + */ +function imagefield_focus_validate_crop_focus_rect($value) { + $value = trim($value); + $length = strlen($value); + + $valid = ($length == 0) || ($length > 0 && imagefield_focus_parse($value)); + return $valid; +} /** * Implementation of hook_file_insert(). @@ -270,18 +419,6 @@ function imagefield_focus_file_delete($file) { _imagefield_focus_file_delete($file); } - - -/** - * Implementation of hook_query_TAG_alter(); alter queries tagged with file_load_multiple. - */ -function imagefield_focus_query_file_load_multiple_alter(QueryAlterableInterface $query) { - $query->fields('iff', array('focus_rect', 'crop_rect')); - $query->leftJoin('imagefield_focus_file', 'iff', 'iff.fid = base.fid'); -} - - - /** * Save focus data. */ @@ -305,8 +442,6 @@ function _imagefield_focus_file_save($file) { } } - - /** * Delete focus data. */ @@ -314,46 +449,88 @@ function _imagefield_focus_file_delete($file) { return db_delete('imagefield_focus_file')->condition('fid', $file->fid)->execute(); } - - /** - * Parse a rectangle from a given string. - * - * @return - * A rectangle array or FALSE. + * Helper function used to attach the required by javascript and css files. + * + * @param array $settings + * An associative array of js settings to include on the page. + * + * @param array $render_array + * A render array to which the js and/or css files should be attached. If no + * value is given then the standard druapl_add_css/js functions are used. */ -function imagefield_focus_parse($rect) { - $values = explode(',', $rect); - if (count($values) != 4) { - return FALSE; - } - - $keys = array('x', 'y', 'width', 'height'); - $rect = array(); - for ($i = 0; $i < 4; $i++) { - $value = $values[$i]; - if (!is_numeric($value)) { - return FALSE; +function _imagefield_focus_attach_files($settings = array(), &$render_array = NULL) { + $path = drupal_get_path('module', 'imagefield_focus'); + if (is_null($render_array)) { + drupal_add_css($path . '/imgfocus/jquery.imgfocus.css'); + drupal_add_css($path . '/imagefield_focus.css'); + drupal_add_js( $path . '/imgfocus/jquery.imgfocus.min.js'); + drupal_add_js( $path . '/imagefield_focus.js'); + if (!empty($settings)) { + drupal_add_js($settings, 'setting'); } - $rect[$keys[$i]] = round($value); } - - if (($rect['x'] < 0) || ($rect['y'] < 0) || ($rect['width'] <= 0) || ($rect['height'] <= 0)) { - return FALSE; + else { + $render_array['#attached']['css'][] = $path . '/imgfocus/jquery.imgfocus.css'; + $render_array['#attached']['css'][] = $path . '/imagefield_focus.css'; + $render_array['#attached']['js'][] = $path . '/imgfocus/jquery.imgfocus.min.js'; + $render_array['#attached']['js'][] = $path . '/imagefield_focus.js'; + if (!empty($settings)) { + $render_array['#attached']['js'][] = array( + 'data' => $settings, + 'type' => 'setting', + ); + } } - - $rect['xoffset'] = $rect['x']; - $rect['yoffset'] = $rect['y']; - $rect['anchor'] = $rect['x'] .'-'. $rect['y']; - - return $rect; } - - /** - * Return whether ImageField Focus has support for the given widget. + * Helper function to build a javascript settings array. The array returned has + * two keys: 'new' and 'settings'. 'New' is true if this is settings array has + * not previously been built. + * + * @param string $key + * The unique string identifiying this settings array. + * + * @param array $focus_settings + * The raw settings array including the following keys: 'focus_lock_ratio' and + * 'focus_min_size'. + * + * @param boolean $force_return + * If true, the settings array will be returned wether or not it is new. If + * false, it will only be returned if it is new. + * + * @return array + * If this is a newly added array, the settings array is returned. Otherwise + * an emprt array is returned */ -function imagefield_focus_widget_support($type) { - return function_exists('imagefield_focus_widget_'. $type .'_process'); +function _imagefield_focus_build_js_settings($key, $focus_settings, $force_return = FALSE) { + $settings = &drupal_static(__FUNCTION__); + + if (!isset($settings[$key])) { + if (!empty($focus_settings)) { + list($w, $h) = explode('x', $focus_settings['focus_min_size']) + array('', ''); + $settings[$key] = array( + 'min_width' => intval($w), + 'min_height' => intval($h), + 'lock_ratio' => !empty($focus_settings['focus_lock_ratio']), + ); + } + else { + $settings[$key] = array(); + } + } + else { + if (!$force_return) { + return array(); + } + } + + $return = array( + 'imagefield_focus' => array( + $key => $settings[$key] + ), + ); + + return $return; }