diff --git a/bg_image.module b/bg_image.module index cdd28ea..88213dd 100644 --- a/bg_image.module +++ b/bg_image.module @@ -22,12 +22,6 @@ function bg_image_menu() { 'access arguments' => array('administer background image'), ); - $items['bg-image/js'] = array( - 'page callback' => 'bg_image_node_type_ajax_callback', - 'access arguments' => array('access content'), - 'type' => MENU_CALLBACK - ); - return $items; } @@ -49,51 +43,42 @@ function bg_image_settings_form(&$form_state) { $node_types = array('' => 'choose...'); $node_fields = array('' => 'Choose a node type first...'); // Options for repeating the image - $repeat_options = array( - 'no-repeat' => t('No Repeat'), - 'repeat' => t('Tiled (repeat)'), - 'repeat-x' => t('Repeat Horizontally (repeat-x)'), - 'repeat-y' => t('Repeat Vertically (repeat-y)'), - ); + $repeat_options = bg_image_css_repeat_options(); // Make an option list of node types foreach (node_get_types('types', NULL, TRUE) as $id => $node_type) { $node_types[$id] = $node_type->name; } - // If this is a page rebuild for AJAX callback we need // create the field list for the specified node type // Only fields of the type 'media' and 'image' will be accepted - if (isset($form_state['values']['bg_image_node_type'])) { - $node_fields = bg_image_get_fields_for_node_type($form_state['values']['bg_image_node_type']); + if (isset($form_state['values']['bg_image_node_type']) && $form_state['values']['bg_image_node_type']) { + $node_fields = bg_image_get_fields_for_node_type($form_state['values']['bg_image_node_type']); } elseif (variable_get('bg_image_node_type', '')) { - $node_fields = bg_image_get_fields_for_node_type(variable_get('bg_image_node_type', '')); + $node_fields = bg_image_get_fields_for_node_type(variable_get('bg_image_node_type', '')); } - + // The fieldset for node settings $form['node'] = array( '#type' => 'fieldset', '#title' => t('Node Settings'), - '#description' => t('The background image is applied by referencing a specific field on a particular node. You will need to create a content type that has an image or media field and then specify the type and the field name below. Then, in the context reaction, you can reference the node that has the image to use for the background.'), + '#description' => t('The background images can be added using nodes as the interface to upload and manage the images. In order to use this feature you need to specify the node type and field name here. Some modules may require this to be done before they will work.'), ); - + // Select a node type // AJAX will replace the field list once selected $form['node']['bg_image_node_type'] = array( '#type' => 'select', '#title' => t('Node Type'), - '#description' => t('The node type that holds the image for the background. Only nodes of this type will be available in the context reaction.'), + '#description' => t('The node type that holds the image for use with background image.'), '#options' => $node_types, '#default_value' => variable_get('bg_image_node_type', ''), - '#required' => TRUE, - '#ahah' => array( - 'path' => 'bg-image/js', + '#ajax' => array( + 'callback' => 'bg_image_node_type_ajax_callback', 'wrapper' => 'bg-image-node-field', - 'method' => 'replace', - 'effect' => 'fade', ), ); - + // The actual field to use as the bg image $form['node']['bg_image_node_field'] = array( '#type' => 'select', @@ -101,32 +86,51 @@ function bg_image_settings_form(&$form_state) { '#description' => t('The field within the node type specified above to use as the image'), '#options' => $node_fields, '#default_value' => variable_get('bg_image_node_field', ''), - '#required' => TRUE, '#prefix' => '
', '#suffix' => '
', ); - - + + // The fieldset for exlusions $form['exclusions'] = array( '#type' => 'fieldset', '#title' => t('Global Exclusions'), '#description' => t('Choose specific pages/sections to exclude the background image from appearing on. This will apply to all background images'), ); - + $form['exclusions']['bg_image_exclude_admin'] = array( '#type' => 'checkbox', '#title' => t('Exclude from Admin Pages'), '#description' => t('Background Images will be ignored on admin pages.'), '#default_value' => variable_get('bg_image_exclude_admin', 0), ); - - + + if (module_exists('imagecache')) { + // Apply an image style? + $form['image_style'] = array( + '#type' => 'fieldset', + '#title' => t('Image Manipulation'), + '#description' => t('Manipulate the image before outputting as a background image'), + ); + $imagecache_presets = array('' => ''); + foreach (imagecache_presets() as $preset) { + $imagecache_presets[$preset['presetname']] = $preset['presetname']; + } + $form['image_style']['bg_image_style'] = array( + '#type' => 'select', + '#title' => t('Image Style'), + '#description' => t('Apply an image style to the image'), + '#options' => $imagecache_presets, + '#default_value' => variable_get('bg_image_style', ''), + ); + } + + // Fieldset for css settings $form['css_settings'] = array( '#type' => 'fieldset', '#title' => t('Default CSS Settings'), - '#description' => t('Default Basic CSS settings for outputting the background properties. For more information on css background properties see http://www.w3schools.com/css/css_background.asp"'), + '#description' => t('Default CSS settings for outputting the background property. These settings will be concatenated to form a complete css statement that uses the "background" property. For more information on the css background property see http://www.w3schools.com/css/css_background.asp"'), ); // The selector for the background property $form['css_settings']['bg_image_selector'] = array( @@ -170,36 +174,44 @@ function bg_image_settings_form(&$form_state) { '#title' => t('Background Repeat'), '#description' => t('Define the repeat settings for the background image. [css property: background-repeat]'), '#options' => $repeat_options, - '#default_value' => variable_get('bg_image_repeat', 0), + '#default_value' => variable_get('bg_image_repeat', 'no-repeat'), ); - + // The background-size property + $form['css_settings']['bg_image_background_size'] = array( + '#type' => 'textfield', + '#title' => t('Background Size'), + '#description' => t('The size of the background (NOTE: CSS3 only. Useful for responsive designs) [css property: background-size]'), + '#default_value' => variable_get('bg_image_background_size', ''), + ); + // background-size:cover suppor for IE8 + $form['css_settings']['bg_image_background_size_ie8'] = array( + '#type' => 'checkbox', + '#title' => t('Add background-size:cover support for ie8'), + '#description' => t('The background-size css property is only supported on browsers that support CSS3. However, there is a workaround for IE using Internet Explorer\'s built-in filters (http://msdn.microsoft.com/en-us/library/ms532969%28v=vs.85%29.aspx). Check this box to add the filters to the css. Sometimes it works well, sometimes it doesn\'t. Use at your own risk'), + '#default_value' => variable_get('bg_image_background_size_ie8', 0), + ); + // The media query specifics + $form['css_settings']['bg_image_media_query'] = array( + '#type' => 'textfield', + '#title' => t('Media Query'), + '#description' => t('Apply this background image css using a media query. CSS3 Only. Useful for responsive designs. example: only screen and (min-width:481px) and (max-width:768px) [Read about media queries]'), + '#default_value' => variable_get('bg_image_media_query', 'all'), + ); + $form['css_settings']['bg_image_important'] = array( + '#type' => 'checkbox', + '#title' => t('Add "!important" to the background property.'), + '#description' => t('This can be helpful to override any existing background image or color properties added by the theme.'), + '#default_value' => variable_get('bg_image_important', 1), + ); + return system_settings_form($form); } /** - * AHAH Callback after Node Type has been chosen. + * AJAX Callback after Node Type has been chosen. */ -function bg_image_node_type_ajax_callback() { - $form_state = array('storage' => NULL, 'rebuild' => TRUE); - $form_build_id = $_POST['form_build_id']; - $form = form_get_cache($form_build_id, $form_state); - $args = $form['#parameters']; - $form_id = array_shift($args); - $form_state['post'] = $form['#post'] = $_POST; - $form['#programmed'] = $form['#redirect'] = FALSE; - // Trickery to avoid the required field errors on AHAH replacement - $form['node']['bg_image_node_type']['#required'] = FALSE; - $form['node']['bg_image_node_field']['#required'] = FALSE; - drupal_process_form($form_id, $form, $form_state); - $form = drupal_rebuild_form($form_id, $form_state, $args, $form_build_id); - - // Render the field element - $element = $form['node']['bg_image_node_field']; - unset($element['#prefix'], $element['#suffix']); - $output = theme('status_messages') . drupal_render($element); - - // Final rendering callback. - drupal_json(array('status' => TRUE, 'data' => $output)); +function bg_image_node_type_ajax_callback($form, $form_state) { + return $form['node']['bg_image_node_field']; } /** @@ -295,51 +307,196 @@ function bg_image_context_page_reaction() { *****************************************************************************/ /** -* Changes the background image for the page using the nid -* passed in as well as the settings defined on the settings -* page to format the css -* -* @param $nid +* Adds a background image to the page using the +* css 'background' property. +* +* @param $image_path +* The path of the image to use +* +* @param $css_settings +* An array of css settings to use. Possible values are: +* - bg_image_selector: The css selector to use +* - bg_image_color: The background color +* - bg_image_x: The x offset +* - bg_image_y: The y offset +* - bg_image_attachment: The attachment property (scroll or fixed) +* - bg_image_repeat: The repeat settings +* - bg_image_background_size: The background size property if necessary +* Default settings will be used for any values not provided. +* +* @param $image_style +* Optionally add an image style to the image before applying it to the +* background +* +* @return +* Returns TRUE if successful or FALSE otherwise */ -function bg_image_change_background_image($nid, $css_settings = array()) { - - $node = node_load($nid); - - // All our parts of the background property - $selector = $css_settings['bg_image_selector']; - $bg_color = $css_settings['bg_image_color']; - $bg_x = $css_settings['bg_image_x']; - $bg_y = $css_settings['bg_image_y']; - $attachment = $css_settings['bg_image_attachment']; - $repeat = $css_settings['bg_image_repeat']; - +function bg_image_add_background_image($image_path, $css_settings = array(), $image_style = NULL, $bg_image_id = 'global') { + $css_filename = 'bg_image_' . $bg_image_id . '.css'; + + // Pull the default css setting if not provided. + $selector = isset($css_settings['bg_image_selector']) ? $css_settings['bg_image_selector'] : variable_get('bg_image_selector', ''); + $bg_color = isset($css_settings['bg_image_color']) ? $css_settings['bg_image_color'] : variable_get('bg_image_color', '#FFFFFF'); + $bg_x = isset($css_settings['bg_image_x']) ? $css_settings['bg_image_x'] : variable_get('bg_image_x', 'left'); + $bg_y = isset($css_settings['bg_image_y']) ? $css_settings['bg_image_y'] : variable_get('bg_image_y', 'top'); + $attachment = isset($css_settings['bg_image_attachment']) ? $css_settings['bg_image_attachment'] : variable_get('bg_image_attachment', 'scroll'); + $repeat = isset($css_settings['bg_image_repeat']) ? $css_settings['bg_image_repeat'] : variable_get('bg_image_repeat', 'no-repeat'); + $important = isset($css_settings['bg_image_important']) ? $css_settings['bg_image_important'] : variable_get('bg_image_important', 1); + $background_size = isset($css_settings['bg_image_background_size']) ? $css_settings['bg_image_background_size'] : variable_get('bg_image_background_size', ''); + $media_query = isset($css_settings['bg_image_media_query']) ? $css_settings['bg_image_media_query'] : variable_get('bg_image_media_query', 'all'); + + // Apply an Image Style? + $image_style = $image_style ? $image_style : variable_get('bg_image_style', ''); + + // If important is true, we turn it into a string for css output + if ($important) { + $important = '!important'; + } + else { + $important = ''; + } + + // Handle the background size property + $bg_size = ''; + $ie_bg_size = ''; + if ($background_size) { + // CSS3 + $bg_size = " background-size: $background_size $important;\n"; + // Let's cover ourselves for other browsers as well... + $bg_size .= " -webkit-background-size: $background_size $important;\n"; + $bg_size .= " -moz-background-size: $background_size $important;\n"; + $bg_size .= " -o-background-size: $background_size $important;\n"; + // IE filters to apply the cover effect + if ($background_size == 'cover' && variable_get('bg_image_background_size_ie8', 0)) { + $bg_size .= 'filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'.' . $image_path . '\', sizingMethod=\'scale\'); + -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=\'' .$image_path . '\', sizingMethod=\'scale\')";'. "\n"; + } + } + + // See if admin pages are excluded from bg images + $admin = variable_get('bg_image_exclude_admin', 0) ? !path_is_admin($_GET['q']) : TRUE; + + // Check if we need to run this through an image style + if ($image_style) { + $image_path = imagecache_create_url($image_style, _bg_image_path_to_uri($image_path)); + } + + // Add the css if we have everything we need. + if ($selector && $image_path && $admin) { + $style = "@media $media_query {\n"; + $style .= " $selector {\n"; + $style .= " background-color: $bg_color $important;\n"; + $style .= " background-image: url('$image_path') $important;\n"; + $style .= " background-repeat: $repeat $important;\n"; + $style .= " background-attachment: $attachment $important;\n"; + $style .= " background-position: $bg_x $bg_y $important;\n"; + $style .= $bg_size; + $style .= " }\n"; + $style .= "}\n"; + + $name = file_save_data($style, $css_filename, FILE_EXISTS_REPLACE); + drupal_add_css($name); + // drupal_add_css($style, array('type' => 'inline', 'media' => $media_query, 'group' => CSS_THEME)); + return TRUE; + } + else { + return FALSE; + } +} + +/** + * Determines the path of an image on the configured image + * field on a node and returns it. + * + * @param $nid + * The nid of the node to check for an image + * + * @param $build_url + * Optional parameter to return the full URL + * of the image rather than just the uri + * + * @return + * The path of the image if the node has it, or FALSE. + */ +function bg_image_get_image_path_from_node($nid, $build_url = TRUE) { + $fields = content_fields(NULL, $node->type); $field_name = variable_get('bg_image_node_field', ''); - $admin = variable_get('bg_image_exclude_admin', 0) ? !path_is_admin() : TRUE; - - $image_path = ''; - - if ($node && $selector && $field_name && $admin) { - $fields = content_fields(NULL, $node->type); + $node = node_load($nid); + $image_path = FALSE; + if ($node && $field_name) { if (isset($fields[$field_name]) && $fields[$field_name]['widget']['module'] == 'imagefield') { if ($node->{$field_name}) { $image_path = $node->{$field_name}[0]['filepath']; } } - if (!empty($image_path)) { - $css_filename = 'bg_image_' . $nid . '.css'; - $style = $selector . '{background: ' . $bg_color . ' url("/' . $image_path . '") ' . $repeat . ' ' . $attachment . ' ' . $bg_x . ' ' . $bg_y . ' !important;}'; - $name = file_save_data($style, $css_filename, FILE_EXISTS_REPLACE); - drupal_add_css($name); + } + if ($image_path && $build_url) { + $image_path = file_create_url($image_path); + } + return $image_path; +} + +/** +* Adds a background image to the page using an image from +* a node. The node must have an image (or media) field and +* the field must be configured on the bg_image configuration +* page for this to work. +* +* @param $nid +* The nid of the node that has the image to use for the +* background. Use 0 to generate a random image from the +* configured node type. +* +* @param $css_settings +* An array of css settings to use. See bg_image_add_background_image() +* for more detailed description of possible values. +* +* @param $image_style +* Optionally add an image style to the image before applying it to the +* background +*/ +function bg_image_add_background_image_from_node($nid, $css_settings = array(), $image_style = NULL) { + + // We need to generate a random nid if 0 is passed in + if ($nid == 0) { + $type = variable_get('bg_image_node_type', ''); + if ($type) { + // Generate a random nid of the configured node type + $nid = db_select('node') + ->fields('node', array('nid')) + ->condition('node.type', $type) + ->orderRandom() + ->addTag('node_access') + ->execute() + ->fetchField(); + } + else { + return FALSE; + } + } + elseif (is_numeric($nid)) { + // Load the node so we can check it's status + $node = node_load($nid); + // Check node access permissions + if (node_access('view', $node)) { + // Get the path of the image on the node + $image_path = bg_image_get_image_path_from_node($nid); + // Add the background image + return bg_image_add_background_image($image_path, $css_settings, NULL, $nid); } } + + // If all else fails + return FALSE; + } /** * Check if a node has an image set on the configured field - * + * * @param $nid * The nid of the node to check - * + * * @return * If the node has an image set for the field * returns TRUE, otherwise returns FALSE @@ -347,7 +504,7 @@ function bg_image_change_background_image($nid, $css_settings = array()) { function bg_image_field_has_image($nid) { $node = node_load($nid); $field_name = variable_get('bg_image_node_field', ''); - if ($node->{$field_name}) { + if ($node && $node->{$field_name}) { return TRUE; } else { @@ -355,13 +512,54 @@ function bg_image_field_has_image($nid) { } } +/** + * Returns an array of nids to node titles for the + * configured node type. Useful for select lists. + * + * @param $include_nid + * Include the nid as text after the title. TRUE + * or FALSE. e.g.: array(1 => 'node title [nid: 1]') + */ +function bg_image_node_options($include_nid = TRUE, $include_random = TRUE) { + $node_type = variable_get('bg_image_node_type', ''); + // Our query + $sql = "SELECT nid, title FROM {node} WHERE type = :node_type"; + $result = db_query($sql, array(':node_type' => $node_type)); + $node_options = array(); + foreach ($result as $record) { + if ($include_nid) { + $node_options[$record->nid] = $record->title . ' [nid:' . $record->nid. ']'; + } + else { + $node_options[$record->nid] = $record->title; + } + } + if (!$node_options) { + $node_type_path = str_replace('_', '-', $node_type); + drupal_set_message("You don't have any $node_type nodes created yet. You must create at least one $node_type node before you can assign background images to pages.",'warning'); + return FALSE; + } + else { + if ($include_random) { + return array(0 => '- Random -') + $node_options;; + } + else { + return $node_options; + } + } +} - - -/***************************************************************************** -* HELPER FUNCTIONS -*****************************************************************************/ - +/** + * Checks if a node (and field) is configured. + */ +function bg_image_node_is_configured() { + if (variable_get('bg_image_node_type', '') && variable_get('bg_image_node_field', '')) { + return TRUE; + } + else { + return FALSE; + } +} /** * Returns an options list of css repeat options @@ -375,14 +573,34 @@ function bg_image_css_repeat_options() { ); } +/*********************************************************************** + * HELPER FUNCTIONS - Private + ***********************************************************************/ + /** - * Returns true if the current page is an 'admin' page + * Converts a path to a uri relative to the public files directory + * + * @param $path + * The path to convert. Can be an absolute or relative path. If the path + * contains the public files directory in it, it will be stripped before + * building the uri, since we're building a public:// uri + * + * @return + * The path to the file as a uri. */ -function path_is_admin() { - if (arg(0) == 'admin') { - return TRUE; +function _bg_image_path_to_uri($path) { + dpm($path); + // Strip off the protocol and domain + $relative_path = parse_url($path, PHP_URL_PATH); + // The public files directory (as configured) + $file_public_path = '/' . variable_get('file_public_path', 'sites/default/files'); + // Remove the public path if the path starts with it + if (strpos($relative_path, $file_public_path) === 0) { + $relative_path = str_replace($file_public_path, '', $relative_path); + return file_create_url($relative_path); } else { - return FALSE; + // If the public files directory isn't in the path, just return it as a uri + return file_create_url($relative_path); } -} \ No newline at end of file +} diff --git a/plugins/bg_image_context_reaction_bg_image.inc b/plugins/bg_image_context_reaction_bg_image.inc index 03aa093..cbb0d2f 100644 --- a/plugins/bg_image_context_reaction_bg_image.inc +++ b/plugins/bg_image_context_reaction_bg_image.inc @@ -53,28 +53,28 @@ class bg_image_context_reaction_bg_image extends context_reaction { '#type' => 'textfield', '#title' => t('Selector'), '#description' => t('A valid CSS selector that will be used to apply the background image.'), - '#default_value' => isset($values['css_settings']['bg_image_selector']) ? $values['css_settings']['bg_image_selector'] : variable_get('bg_image_selector', ''), + '#default_value' => variable_get('bg_image_selector', ''), ); // The selector for the background property $form['css_settings']['bg_image_color'] = array( '#type' => 'textfield', '#title' => t('Color'), '#description' => t('The background color formatted as any valid css color format (e.g. hex, rgb, text, hsl) [css property: background-color]'), - '#default_value' => isset($values['css_settings']['bg_image_color']) ? $values['css_settings']['bg_image_color'] : variable_get('bg_image_color', '#FFFFFF'), + '#default_value' => variable_get('bg_image_color', '#FFFFFF'), ); // The selector for the background property $form['css_settings']['bg_image_x'] = array( '#type' => 'textfield', '#title' => t('Horizontal Alignment'), '#description' => t('The horizontal alignment of the background image formatted as any valid css alignment. [css property: background-position]'), - '#default_value' => isset($values['css_settings']['bg_image_x']) ? $values['css_settings']['bg_image_x'] : variable_get('bg_image_x', 'left'), + '#default_value' => variable_get('bg_image_x', 'left'), ); // The selector for the background property $form['css_settings']['bg_image_y'] = array( '#type' => 'textfield', '#title' => t('Vertical Alignment'), '#description' => t('The vertical alignment of the background image formatted as any valid css alignment. [css property: background-position]'), - '#default_value' => isset($values['css_settings']['bg_image_y']) ? $values['css_settings']['bg_image_y'] : variable_get('bg_image_y', 'top'), + '#default_value' => variable_get('bg_image_y', 'top'), ); // The selector for the background property $form['css_settings']['bg_image_attachment'] = array( @@ -82,15 +82,42 @@ class bg_image_context_reaction_bg_image extends context_reaction { '#title' => t('Background Attachment'), '#description' => t('The attachment setting for the background image. [css property: background-attachment]'), '#options' => array('scroll' => 'Scroll', 'fixed' => 'Fixed'), - '#default_value' => isset($values['css_settings']['bg_image_attachment']) ? $values['css_settings']['bg_image_attachment'] : variable_get('bg_image_attachment', 'scroll'), + '#default_value' => variable_get('bg_image_attachment', 'scroll'), ); // The background-repeat property $form['css_settings']['bg_image_repeat'] = array( '#type' => 'radios', '#title' => t('Background Repeat'), '#description' => t('Define the repeat settings for the background image. [css property: background-repeat]'), - '#options' => bg_image_css_repeat_options(), - '#default_value' => isset($values['css_settings']['bg_image_repeat']) ? $values['css_settings']['bg_image_repeat'] : variable_get('bg_image_repeat', 0), + '#options' => $repeat_options, + '#default_value' => variable_get('bg_image_repeat', 'no-repeat'), + ); + // The background-size property + $form['css_settings']['bg_image_background_size'] = array( + '#type' => 'textfield', + '#title' => t('Background Size'), + '#description' => t('The size of the background (NOTE: CSS3 only. Useful for responsive designs) [css property: background-size]'), + '#default_value' => variable_get('bg_image_background_size', ''), + ); + // background-size:cover suppor for IE8 + $form['css_settings']['bg_image_background_size_ie8'] = array( + '#type' => 'checkbox', + '#title' => t('Add background-size:cover support for ie8'), + '#description' => t('The background-size css property is only supported on browsers that support CSS3. However, there is a workaround for IE using Internet Explorer\'s built-in filters (http://msdn.microsoft.com/en-us/library/ms532969%28v=vs.85%29.aspx). Check this box to add the filters to the css. Sometimes it works well, sometimes it doesn\'t. Use at your own risk'), + '#default_value' => variable_get('bg_image_background_size_ie8', 0), + ); + // The media query specifics + $form['css_settings']['bg_image_media_query'] = array( + '#type' => 'textfield', + '#title' => t('Media Query'), + '#description' => t('Apply this background image css using a media query. CSS3 Only. Useful for responsive designs. example: only screen and (min-width:481px) and (max-width:768px) [Read about media queries]'), + '#default_value' => variable_get('bg_image_media_query', 'all'), + ); + $form['css_settings']['bg_image_important'] = array( + '#type' => 'checkbox', + '#title' => t('Add "!important" to the background property.'), + '#description' => t('This can be helpful to override any existing background image or color properties added by the theme.'), + '#default_value' => variable_get('bg_image_important', 1), ); } else { @@ -124,7 +151,7 @@ class bg_image_context_reaction_bg_image extends context_reaction { foreach($bg_image_nodes as $selector => $values) { ksort($values); $bg_image_node = end($values); - bg_image_change_background_image($bg_image_node['nid'], $bg_image_node['css_settings']); + bg_image_add_background_image_from_node($bg_image_node['nid'], $bg_image_node['css_settings']); } } }