Why Is Image Uploading Sideways in Drupal 7
While working on new Qwintry.com tasks nosotros needed to provide our operators the interface to rotate uploaded images (and I wanted to rotate the original paradigm file). Surprisingly, I could not notice anything similar that among d.org modules then I have to come up up with my ain solution. I was expecting to finish this task by 1 hour, but, as it oft happens, the way to correct solution took a chip longer.
For the terminal code scroll downwardly to the end of the post, since now I volition be showing some ugly lawmaking that you don't really demand :)
These links are created in the node--[type].tpl.php in my theme:
<a href="<?= url('admin/rotate/' . $node->field_photo[LANGUAGE_NONE][0]['fid'] . '/cw/field_photo') ?>">↻ Rotate CW</a> <a href="<?= url('admin/rotate/' . $node->field_photo[LANGUAGE_NONE][0]['fid'] . '/ccw/field_photo') ?>">↺ Rotate CCW</a> the kickoff version of the function:
<?php function bdr_warehouse_rotate_image($fid, $direction, $field_name) { $file = file_load($fid); $img = image_load($file->uri); image_rotate($img, $direction == 'cw' ? xc : -90); image_path_flush($file->uri); $result = image_save($img); if ($upshot) { $nid = db_query("SELECT entity_id FROM {field_data_{$field_name}} WHERE {$field_name}_fid=:fid", assortment(':fid' => $fid))->fetchField(); db_query("UPDATE {file_managed} SET filesize=:size WHERE fid=:fid", array(':size' => $img->info['file_size'], ':fid' => $fid)); db_query("UPDATE {field_data_{$field_name}} Prepare {$field_name}_width=:width, {$field_name}_height=:height WHERE {$field_name}_fid=:fid LIMIT 1", assortment(':width' => $img->info['width'], ':peak' => $img->info['pinnacle'], ':fid' => $fid)); db_query("UPDATE {field_revision_{$field_name}} Set {$field_name}_width=:width, {$field_name}_height=:height WHERE {$field_name}_fid=:fid LIMIT 1", array(':width' => $img->info['width'], ':height' => $img->info['acme'], ':fid' => $fid)); cache_clear_all("field:node:$nid", 'cache_field'); drupal_set_message('Image rotated! Use ctrl+f5 if the paradigm preview is not rotated - information technology is your browser enshroud.'); } if (!empty($_SERVER['HTTP_REFERER'])) { $mark = strpos($_SERVER['HTTP_REFERER'], '?') === faux ? '?' : '&'; drupal_goto($_SERVER['HTTP_REFERER'] . $mark . 'refresh=1'); } } ?> Take notation that we flush image presets cache, node field cache, and also update the sizes of the movie in iii places - in filemanaged table, in fieldinformation{fieldname} tabular array, and in fieldrevision{field_name} tabular array.
But it turned out that it is not enough so I had to come up with some manner to force chrome to reload picture, then nosotros laissez passer ?refresh=1 to the url and we had this in our init hook:
<?php function bdr_warehouse_init() { if (!empty($_REQUEST['refresh'])) { drupal_add_js(drupal_get_path('module', 'bdr_warehouse') . '/scripts/img_refresh.js'); } } ?> and the contents of the javascript file were like:
function updateQueryStringParameter(uri, primal, value) { var re = new RegExp("([?&])" + key + "=.*?(&|$)", "i"); var separator = uri.indexOf('?') !== -ane ? "&" : "?"; if (uri.match(re)) { return uri.replace(re, '$one' + key + "=" + value + '$2'); } else { return uri + separator + key + "=" + value; } } setTimeout(function() { // force image refresh in browsers afterwards rotation var x = document.querySelectorAll(".field-type-epitome a, .prototype-widget-data a"); var i; for (i = 0; i < x.length; i++) { x[i].href = updateQueryStringParameter(x[i].href, 'rand', new Engagement().getTime()); } var x = certificate.querySelectorAll(".field-blazon-epitome img, .image-widget img"); var i; for (i = 0; i < ten.length; i++) { x[i].src = updateQueryStringParameter(x[i].src, 'rand', new Engagement().getTime()); } }, 300); I had to enclose the prototype refresh function to setTimeout because Drupal was throwing 503 errors if the image was reloaded too quickly (it is the epitome.module locking mechanism at work). BTW, don't use this updateQueryStringParameter since awesome jquery.bbq is included in drupal 7 cadre :) (just you dont demand this js piece of code at all in the final version and then read further)
I likewise realized that I desire to show the rotate buttons in the node edit, in the image file widget, too.
Here comes the second version of the function which renames the epitome file by calculation some symbols at the end of the file (and information technology forces chrome to reload the original file and all the paradigm presets, a lot more reliably than the javascript refreshing mechanism to a higher place). Finally, it works! And we can get rid of all javascript mentioned to a higher place.
Hither is the
Final code:
the main office:
<?php function bdr_rotate_image($fid, $direction, $field_name) { $file = file_load($fid); $img = image_load($file->uri); image_rotate($img, $management == 'cw' ? xc : -xc); $consequence = image_save($img); if ($result) { $uri = $file->uri; $ext = substr($uri, -3); // Change this if you look some weird extensions like .jpeg ! $new_uri = substr($uri, 0, -iv) . '_1' . '.' . $ext; file_move($file, $new_uri); // it is not completely ok to pass php variables into sql merely like that, only we do information technology here since the input is always safe in my instance $nid = db_query("SELECT entity_id FROM {field_data_{$field_name}} WHERE {$field_name}_fid=:fid", assortment(':fid' => $fid))->fetchField(); db_query("UPDATE {file_managed} Fix filesize=:size WHERE fid=:fid", array(':size' => $img->info['file_size'], ':fid' => $fid)); db_query("UPDATE {field_data_{$field_name}} Set up {$field_name}_width=:width, {$field_name}_height=:height WHERE {$field_name}_fid=:fid LIMIT i", array(':width' => $img->info['width'], ':height' => $img->info['superlative'], ':fid' => $fid)); cache_clear_all("field:node:$nid", 'cache_field'); drupal_set_message('Paradigm rotated!'); } if (!empty($_SERVER['HTTP_REFERER'])) { drupal_goto($_SERVER['HTTP_REFERER']); } } ?> the node edit field widget override with rotation links (put in your theme template.php):
<?php function YOURTHEMENAME_image_widget($variables) { $element = $variables['chemical element']; $output = ''; $output .= '<div class="paradigm-widget course-managed-file clearfix">'; if (isset($element['preview'])) { $output .= '<div class="image-preview">'; $output .= drupal_render($element['preview']); if (user_access('create folio content')) { $output .= "<br> <a href='" . url('admin/rotate/' . $chemical element['#file']->fid . '/cw/' . $element['#field_name']) . "'>↻ Rotate CW</a>"; $output .= " <a href='" . url('admin/rotate/' . $element['#file']->fid . '/ccw/' . $element['#field_name']) . "'>Rotate CCW ↺</a>"; } $output .= '</div>'; } $output .= '<div grade="prototype-widget-data">'; if ($element['fid']['#value'] != 0) { $element['filename']['#markup'] .= ' <span class="file-size">(' . format_size($element['#file']->filesize) . ')</span> '; } $output .= drupal_render_children($element); $output .= '</div>'; $output .= '</div>'; return $output; } ?> The registered path in YOURMODULE_menu hook:
<?php $items['admin/rotate'] = array( 'title' => 'Rotate', 'folio callback' => 'bdr_rotate_image', 'page arguments' => array(2, 3, 4), 'admission arguments' => array('create folio content'), ); ?> Comments
nicholsofigaill1988.blogspot.com
Source: https://pixeljets.com/blog/rotating-original-file-image-field-drupal-7-and-dealing-browser-cache/
0 Response to "Why Is Image Uploading Sideways in Drupal 7"
Post a Comment