Хак: поворот фото в Фотоальбомах

+17
2.35K
Всем привет!

Давно ничего не писал, как обычно нет на все времени.

Предлагаю вашему вниманию функцию поворот фото на 90 градусов для стандартного компонента Фотоальбомы.

Иллюстрация


Компонент Фотоальбомы очень слабый по сравнению с остальным функционалом второй ветки и данной функции поворота очень не хватает.

Для себя решил следующим способом, буду рад любым подсказкам и правкам, также, очень надеюсь, что переработанное решение войдет в следующее обновление InstantCMS 2.x

1. Добавляем кнопку переворота:
файл /templates/default/controllers/photos/view.tpl.php строки:
  1.  
  2. if ($is_can_edit){
  3. $this->addToolButton(array(
  4. 'class' => 'edit',
  5. 'title' => LANG_PHOTOS_RENAME_PHOTO,
  6. 'href' => 'javascript:icms.photos.rename()'
  7. ));
  8. }
  9.  
заменить на:
  1.  
  2. if ($is_can_edit){
  3. $this->addToolButton(array(
  4. 'class' => 'edit',
  5. 'title' => LANG_PHOTOS_RENAME_PHOTO,
  6. 'href' => 'javascript:icms.photos.rename()'
  7. ));
  8. $this->addToolButton(array(
  9. 'class' => 'edit',
  10. 'title' => LANG_PHOTOS_ROTATE_PHOTO,
  11. 'href' => 'javascript:icms.photos.rotate()'
  12. ));
  13. }
  14.  
также в самом низу в <script> после строки:
  1.  
  2. var rename_url = '<?php echo $this->href_to('rename'); ?>';
  3.  
добавляем:
  1.  
  2. var rotate_url = '<?php echo $this->href_to('rotate'); ?>';
  3.  
2. Добавляем вызов функции поворота из JS
файл /templates/default/js/photos.js
после функции:
  1.  
  2. this.rename = function(){
  3. ...
  4. }
  5.  
добавляем новую функцию:
  1.  
  2. this.rotate = function(){
  3.  
  4. var id = $('#album-photo-item').data('id');
  5.  
  6. $.post(rotate_url, {id: id}, function(result){
  7. if (result.success){
  8. window.location.href='';
  9. }
  10. }, 'json');
  11.  
  12. }
  13.  
3. Создаем action функции переворота.
в директории /system/controllers/photos/actions создаем файл с названием rotate.php со следующим содержимым.
  1.  
  2. <?php
  3.  
  4. class actionPhotosRotate extends cmsAction{
  5.  
  6. public function run($photo_id = null){
  7.  
  8. if (!$this->request->isAjax()) { cmsCore::error404(); }
  9.  
  10. if (!$photo_id) {
  11. $photo_id = $this->request->get('id');
  12. if (!$photo_id) { cmsCore::error404(); }
  13. }
  14.  
  15. $photo = $this->model->getPhoto($photo_id);
  16.  
  17. $success = true;
  18.  
  19. // проверяем наличие доступа
  20. $user = cmsUser::getInstance();
  21. if (!cmsUser::isAllowed('albums', 'edit')) { $success = false; }
  22. if (!cmsUser::isAllowed('albums', 'edit', 'all') && $photo['user_id'] != $user->id) { $success = false; }
  23.  
  24. if (!$success){
  25. cmsTemplate::getInstance()->renderJSON(array(
  26. 'success' => false
  27. ));
  28. }
  29.  
  30. $this->model->rotatePhoto($photo_id);
  31.  
  32. cmsTemplate::getInstance()->renderJSON(array(
  33. 'success' => true
  34. ));
  35.  
  36. }
  37.  
  38. }
  39.  
4. Добавляем саму функцию поворота в модель
в файле /system/controllers/photos/model.php после функции:
  1.  
  2. public function renamePhoto($id, $title){
  3. ...
  4. }
  5.  
пишем новую функцию:
  1.  
  2. public function rotatePhoto($id){
  3.  
  4. $photo = $this->getPhoto($id);
  5.  
  6. if(is_array($photo['image'])){
  7.  
  8. $config = cmsConfig::getInstance();
  9.  
  10. foreach($photo['image'] as $path){
  11.  
  12. // получаем данные о картинке
  13. $size = getimagesize($config->upload_path . $path);
  14. //определяем тип (расширение) картинки
  15. $format = strtolower(substr($size['mime'], strpos($size['mime'], '/')+1));
  16. $icfunc = "imagecreatefrom" . $format; //определение функции для расширения файла
  17. //если нет такой функции, то прекращаем работу скрипта
  18. if (!function_exists($icfunc)) return false;
  19. // Загрузка изображения
  20. $source = $icfunc($config->upload_path . $path);
  21. // Поворот. Пустые углы заливаем цветом 0xffffff
  22. $rotate = imagerotate($source, 270, '0xffffff');
  23. // сохраняем картинку
  24. imagejpeg($rotate, $config->upload_path . $path, 100);
  25. // очищаем память
  26. imagedestroy($rotate);
  27. }
  28.  
  29. }
  30.  
  31. }
  32.  
5. Добавляем языковую константу
в файл /system/languages/ru/controllers/photos/photos.php (и/или в другой язык)
добавляем:
  1.  
  2. define('LANG_PHOTOS_ROTATE_PHOTO', 'Повернуть фото на 90°');
  3.  
P.S.
Этот пункт не обязателен, но мне показался крайне необходимым из-за того, что после поворота картинка показывается старая (не перевернутая из кэша).
Можно вопрос решить с переименованием файла после поворота, но мне это решение показалось более простым и универсальным.
В файле /system/libs/template.helper.php
в функции:
  1.  
  2. function html_image($image, $size_preset='small', $alt='', $attributes = array()){
  3. ...
  4. }
  5.  
меняем возвращение результата вместо:
  1.  
  2. return '<img src="'.$src.'" '.$size.' alt="'.htmlspecialchars($alt).'" '.$attr_str.$class.' />';
  3.  
прописываем:
  1.  
  2. return '<img src="'.$src.'?'.filemtime(PATH.$src).'" '.$size.' alt="'.htmlspecialchars($alt).'" '.$attr_str.$class.' />';
  3.  
P.S.S. Функция переворота работает с jpg, png, gif, но сохраняет все в формат jpg без переименования файла. Сохранить в исходном формате не получилось, появлялись ошибки, а исправлять было некогда. Пишите свои решения.

Жду тестов остальных участников сообщества, здравой критики и комментариев разработчиков.
Удачных выходных!
+2
Def Def 5 лет назад #
а для загружаемых фото через поле изображения и мультиизображения можно сделать такое же?) было бы отлично!
0
Def Def 5 лет назад #
еще в фотогалерее катастрофиески нехватает замены одной фотки на другую
0
Шадринец Шадринец 2 года назад #
Интересное решение переворота фото.
Видимо не нашлось желающих по тестировать и поправить данное предложение.
Может кто пользуется другим компонентом или дополнением? Для переворота фото.

Еще от автора

Компонент "Совместные покупки"
Всем привет! Уже как год лежит готовый компонент для организации "Совместных покупок".
Хак: добавление комментариев в ленту активности
Всем привет! Решил выложить свою мини-доработку по добавлению комментария в ленту активности.
Хак: Умное Кеширование и Версионность в Javascript/CSS (2.x)
Всем привет! Аналогично недавно выложенному хаку Хак: Умное Кеширование и Версионность в Javascript/CSS (1.x) предлагаю доработку для 2-ой ветки!
Используя этот сайт, вы соглашаетесь с тем, что мы используем файлы cookie.