From 88ba0c0953395e18dbdd871e96831d885f59740c Mon Sep 17 00:00:00 2001 From: BlueTeck Date: Mon, 2 Mar 2015 22:40:09 +0100 Subject: preview images in taskview --- assets/css/app.css | 32 ++++++++++++++++++++++++++++++++ assets/css/src/task.css | 32 ++++++++++++++++++++++++++++++++ 2 files changed, 64 insertions(+) (limited to 'assets') diff --git a/assets/css/app.css b/assets/css/app.css index f0446f30..a304d27f 100644 --- a/assets/css/app.css +++ b/assets/css/app.css @@ -1551,3 +1551,35 @@ td li.dropit-trigger { .task-board .dropit-submenu a:hover { text-decoration: none; } +.task-show-images { + list-style-type: none; +} +.task-show-images li img { + width: 100%; +} +.task-show-images li .img_container { + width: 250px; + height: 100px; + overflow: hidden; +} +.task-show-images li { + padding: 10px; + overflow: auto; + width: 250px; + min-height: 120px; + display: inline-block; + vertical-align: top; +} +.task-show-images li p{ + padding: 5px; + font-weight: bold; +} +.task-show-images li:hover { + background: #eee; +} +.task-show-image-actions { + margin-left: 5px; +} +.task-show-images li .img_container:hover { + height: 100%; +} \ No newline at end of file diff --git a/assets/css/src/task.css b/assets/css/src/task.css index b7a5cb9c..5cb7b969 100644 --- a/assets/css/src/task.css +++ b/assets/css/src/task.css @@ -245,3 +245,35 @@ span.task-board-date-overdue { .task-link-closed { text-decoration: line-through; } +.task-show-images { + list-style-type: none; +} +.task-show-images li img { + width: 100%; +} +.task-show-images li .img_container { + width: 250px; + height: 100px; + overflow: hidden; +} +.task-show-images li { + padding: 10px; + overflow: auto; + width: 250px; + min-height: 120px; + display: inline-block; + vertical-align: top; +} +.task-show-images li p{ + padding: 5px; + font-weight: bold; +} +.task-show-images li:hover { + background: #eee; +} +.task-show-image-actions { + margin-left: 5px; +} +.task-show-images li .img_container:hover { + height: 100%; +} -- cgit v1.2.3 From 5e5af86638d301658d3910b94c68e8a35f676c00 Mon Sep 17 00:00:00 2001 From: BlueTeck Date: Sat, 7 Mar 2015 11:31:53 +0100 Subject: add image thumbnail to task detail view, add icons to common file extensions, better layout in task attachments --- app/Controller/Board.php | 3 +- app/Controller/File.php | 75 ++++++++++++++++++++++++++++++++++++++++---- app/Model/File.php | 71 +++++++++++++++++++++++++++++++++++++++-- app/Template/board/files.php | 43 ++++++++++++++++++------- app/Template/file/show.php | 27 +++++++++------- assets/css/app.css | 3 ++ assets/css/src/task.css | 3 ++ 7 files changed, 192 insertions(+), 33 deletions(-) (limited to 'assets') diff --git a/app/Controller/Board.php b/app/Controller/Board.php index a6e002f2..17170317 100644 --- a/app/Controller/Board.php +++ b/app/Controller/Board.php @@ -441,7 +441,8 @@ class Board extends Base $task = $this->getTask(); $this->response->html($this->template->render('board/files', array( - 'files' => $this->file->getAll($task['id']), + 'files' => $this->file->getAllDocuments($task['id']), + 'images' => $this->file->getAllImages($task['id']), 'task' => $task, ))); } diff --git a/app/Controller/File.php b/app/Controller/File.php index 3255fe84..1e719d2f 100644 --- a/app/Controller/File.php +++ b/app/Controller/File.php @@ -20,8 +20,8 @@ class File extends Base $task = $this->getTask(); $this->response->html($this->taskLayout('file/new', array( - 'task' => $task, - 'max_size' => ini_get('upload_max_filesize'), + 'task' => $task, + 'max_size' => ini_get('upload_max_filesize'), ))); } @@ -74,8 +74,8 @@ class File extends Base if ($file['task_id'] == $task['id']) { $this->response->html($this->template->render('file/open', array( - 'file' => $file, - 'task' => $task, + 'file' => $file, + 'task' => $task, ))); } } @@ -101,6 +101,69 @@ class File extends Base } } + /** + * Return the file content (work only for images) resized + * + * @access public + */ + public function imageThumbnail() { + $task = $this->getTask(); + $file = $this->file->getById($this->request->getIntegerParam('file_id')); + $width_param = $this->request->getIntegerParam('width'); + $height_param = $this->request->getIntegerParam('height'); + $filename = FILES_DIR . $file['path']; + + if ($file['task_id'] == $task['id'] && file_exists($filename)) { + + // Get new sizes + list($width, $height) = getimagesize($filename); + if ($width_param == 0 && $height_param == 0) { + $newwidth = 100; + $newheight = 100; + } elseif ($width_param > 0 && $height_param == 0) { + $newwidth = $width_param; + $newheight = floor($height * ( $width_param / $width )); + } elseif ($width_param == 0 && $height_param > 0) { + $newwidth = floor($width * ( $height_param / $height )); + $newheight = $height_param; + } else { + $newwidth = $width_param; + $newheight = $height_param; + } + + // Load + $thumb = imagecreatetruecolor($newwidth, $newheight); + + $info = pathinfo($file['name']); + $extension = strtolower($info['extension']); + + switch ($extension) { + case 'jpeg': + case 'jpg': + $source = imagecreatefromjpeg($filename); + break; + case 'png': + $source = imagecreatefrompng($filename); + break; + case 'gif': + $source = imagecreatefromgif($filename); + break; + default: + die('File "' . $filename . '" is not valid jpg, png or gif image.'); + break; + } + + // Resize + imagecopyresampled($thumb, $source, 0, 0, 0, 0, $newwidth, $newheight, $width, $height); + + $metadata = getimagesize($filename); + if (isset($metadata['mime'])) { + $this->response->contentType($metadata['mime']); + imagejpeg($thumb); + } + } + } + /** * Remove a file * @@ -132,8 +195,8 @@ class File extends Base $file = $this->file->getById($this->request->getIntegerParam('file_id')); $this->response->html($this->taskLayout('file/remove', array( - 'task' => $task, - 'file' => $file, + 'task' => $task, + 'file' => $file, ))); } } diff --git a/app/Model/File.php b/app/Model/File.php index 46710658..3c2f2b68 100644 --- a/app/Model/File.php +++ b/app/Model/File.php @@ -153,9 +153,76 @@ class File extends Base */ public function isImage($filename) { - return getimagesize($filename) !== false; + $info = pathinfo($filename); + $extension = strtolower($info['extension']); + + switch ($extension) { + case 'jpeg': + case 'jpg': + case 'png': + case 'gif': + return true; + break; + default: + return false; + break; + } } + /** + * get Font-Awesome Icon for file extension + * + * @access public + * @param string $filename Filename + * @return string Font-Awesome-Icon-Name + */ + public function get_icon($filename){ + $info = pathinfo($filename); + $extension = strtolower($info['extension']); + switch ($extension) { + case 'jpeg': + case 'jpg': + case 'png': + case 'gif': + $icon = 'fa-file-image-o'; + break; + case 'xls': + case 'xlsx': + $icon = 'fa-file-excel-o'; + break; + case 'doc': + case 'docx': + $icon = 'fa-file-word-o'; + break; + case 'ppt': + case 'pptx': + $icon = 'fa-file-powerpoint-o'; + break; + case 'zip': + case 'rar': + $icon = 'fa-archive-o'; + break; + case 'mp3': + $icon = 'fa-audio-o'; + break; + case 'avi': + $icon = 'fa-video-o'; + break; + case 'php': + case 'html': + case 'css': + $icon = 'fa-code-o'; + break; + case 'pdf': + $icon = 'fa-file-pdf-o'; + break; + default: + $icon = 'fa-file-o'; + break; + } + return $icon; + } + /** * Generate the path for a new filename * @@ -220,7 +287,7 @@ class File extends Base $task_id, $original_filename, $destination_filename, - $this->isImage(FILES_DIR.$destination_filename) + $this->isImage($original_filename) ); } } diff --git a/app/Template/board/files.php b/app/Template/board/files.php index 278b906b..61529434 100644 --- a/app/Template/board/files.php +++ b/app/Template/board/files.php @@ -1,14 +1,33 @@
- - - - a( - $this->e($file['name']), - 'file', - 'download', - array('file_id' => $file['id'], 'task_id' => $file['task_id'], 'project_id' => $task['project_id']) - ) ?> - -
- + + + + + + + + + + + + + + + + + +
+ e($file['name']) + ?> + + a(t('download'), 'file', 'download', array('task_id' => $task['id'], 'project_id' => $task['project_id'], 'file_id' => $file['id'])) ?> + a(t('open'), 'file', 'open', array('task_id' => $task['id'], 'project_id' => $task['project_id'], 'file_id' => $file['id']), false, 'popover') ?> +
+ e($file['name']) + ?> + + a(t('download'), 'file', 'download', array('task_id' => $task['id'], 'project_id' => $task['project_id'], 'file_id' => $file['id'])) ?> +
diff --git a/app/Template/file/show.php b/app/Template/file/show.php index 2af5a7aa..0f5bd4ee 100644 --- a/app/Template/file/show.php +++ b/app/Template/file/show.php @@ -12,7 +12,7 @@
  • - <?= $this->e($file['name']) ?> + <?= $this->e($file['name']) ?>

    e($file['name']) ?> @@ -31,17 +31,20 @@

    -
      - -
    • - a($this->e($file['name']), 'file', 'download', array('task_id' => $task['id'], 'project_id' => $task['project_id'], 'file_id' => $file['id'])) ?> - - a(t('remove'), 'file', 'confirm', array('task_id' => $task['id'], 'project_id' => $task['project_id'], 'file_id' => $file['id'])) ?> - -
      • - -
    - + + + + + + +
    + e($file['name']) ?> + + + a(t('remove'), 'file', 'confirm', array('task_id' => $task['id'], 'project_id' => $task['project_id'], 'file_id' => $file['id'])) ?> + a(t('download'), 'file', 'download', array('task_id' => $task['id'], 'project_id' => $task['project_id'], 'file_id' => $file['id'])) ?> + +
    diff --git a/assets/css/app.css b/assets/css/app.css index a304d27f..57ec7f9c 100644 --- a/assets/css/app.css +++ b/assets/css/app.css @@ -1582,4 +1582,7 @@ td li.dropit-trigger { } .task-show-images li .img_container:hover { height: 100%; +} +.task-show-file-table { + width: auto; } \ No newline at end of file diff --git a/assets/css/src/task.css b/assets/css/src/task.css index 5cb7b969..39cda76a 100644 --- a/assets/css/src/task.css +++ b/assets/css/src/task.css @@ -277,3 +277,6 @@ span.task-board-date-overdue { .task-show-images li .img_container:hover { height: 100%; } +.task-show-file-table { + width: auto; +} -- cgit v1.2.3