diff --git a/resources/celerity/map.php b/resources/celerity/map.php --- a/resources/celerity/map.php +++ b/resources/celerity/map.php @@ -9,7 +9,7 @@ 'names' => array( 'conpherence.pkg.css' => '0b64e988', 'conpherence.pkg.js' => '6249a1cf', - 'core.pkg.css' => '6ae56144', + 'core.pkg.css' => 'adfb9c57', 'core.pkg.js' => '519f84e8', 'darkconsole.pkg.js' => 'e7393ebb', 'differential.pkg.css' => 'a4ba74b5', @@ -108,7 +108,7 @@ 'rsrc/css/application/tokens/tokens.css' => '3d0f239e', 'rsrc/css/application/uiexample/example.css' => '528b19de', 'rsrc/css/core/core.css' => 'd0801452', - 'rsrc/css/core/remarkup.css' => '8e3d4635', + 'rsrc/css/core/remarkup.css' => '8606d9c6', 'rsrc/css/core/syntax.css' => '769d3498', 'rsrc/css/core/z-index.css' => 'd1270942', 'rsrc/css/diviner/diviner-shared.css' => 'aa3656aa', @@ -803,7 +803,7 @@ 'phabricator-object-selector-css' => '85ee8ce6', 'phabricator-phtize' => 'd254d646', 'phabricator-prefab' => '8d40ae75', - 'phabricator-remarkup-css' => '8e3d4635', + 'phabricator-remarkup-css' => '8606d9c6', 'phabricator-search-results-css' => '7dea472c', 'phabricator-shaped-request' => '7cbe244b', 'phabricator-slowvote-css' => 'a94b7230', diff --git a/src/__phutil_library_map__.php b/src/__phutil_library_map__.php --- a/src/__phutil_library_map__.php +++ b/src/__phutil_library_map__.php @@ -1050,6 +1050,7 @@ 'FileMailReceiver' => 'applications/files/mail/FileMailReceiver.php', 'FileQueryChunksConduitAPIMethod' => 'applications/files/conduit/FileQueryChunksConduitAPIMethod.php', 'FileReplyHandler' => 'applications/files/mail/FileReplyHandler.php', + 'FileTypeIcon' => 'applications/files/constants/FileTypeIcon.php', 'FileUploadChunkConduitAPIMethod' => 'applications/files/conduit/FileUploadChunkConduitAPIMethod.php', 'FileUploadConduitAPIMethod' => 'applications/files/conduit/FileUploadConduitAPIMethod.php', 'FileUploadHashConduitAPIMethod' => 'applications/files/conduit/FileUploadHashConduitAPIMethod.php', @@ -5732,6 +5733,7 @@ 'FileMailReceiver' => 'PhabricatorObjectMailReceiver', 'FileQueryChunksConduitAPIMethod' => 'FileConduitAPIMethod', 'FileReplyHandler' => 'PhabricatorApplicationTransactionReplyHandler', + 'FileTypeIcon' => 'Phobject', 'FileUploadChunkConduitAPIMethod' => 'FileConduitAPIMethod', 'FileUploadConduitAPIMethod' => 'FileConduitAPIMethod', 'FileUploadHashConduitAPIMethod' => 'FileConduitAPIMethod', diff --git a/src/applications/differential/view/DifferentialChangesetDetailView.php b/src/applications/differential/view/DifferentialChangesetDetailView.php --- a/src/applications/differential/view/DifferentialChangesetDetailView.php +++ b/src/applications/differential/view/DifferentialChangesetDetailView.php @@ -110,67 +110,6 @@ return $this->vsChangesetID; } - public function getFileIcon($filename) { - $path_info = pathinfo($filename); - $extension = idx($path_info, 'extension'); - switch ($extension) { - case 'psd': - case 'ai': - $icon = 'fa-eye'; - break; - case 'conf': - $icon = 'fa-wrench'; - break; - case 'wav': - case 'mp3': - case 'aiff': - $icon = 'fa-file-sound-o'; - break; - case 'm4v': - case 'mov': - $icon = 'fa-file-movie-o'; - break; - case 'sql': - case 'db': - $icon = 'fa-database'; - break; - case 'xls': - case 'csv': - $icon = 'fa-file-excel-o'; - break; - case 'ics': - $icon = 'fa-calendar'; - break; - case 'zip': - case 'tar': - case 'bz': - case 'tgz': - case 'gz': - $icon = 'fa-file-archive-o'; - break; - case 'png': - case 'jpg': - case 'bmp': - case 'gif': - $icon = 'fa-file-picture-o'; - break; - case 'txt': - $icon = 'fa-file-text-o'; - break; - case 'doc': - case 'docx': - $icon = 'fa-file-word-o'; - break; - case 'pdf': - $icon = 'fa-file-pdf-o'; - break; - default: - $icon = 'fa-file-code-o'; - break; - } - return $icon; - } - public function render() { $this->requireResource('differential-changeset-view-css'); $this->requireResource('syntax-highlighting-css'); @@ -204,7 +143,7 @@ } $display_filename = $changeset->getDisplayFilename(); - $display_icon = $this->getFileIcon($display_filename); + $display_icon = FileTypeIcon::getFileIcon($display_filename); $icon = id(new PHUIIconView()) ->setIcon($display_icon); diff --git a/src/applications/files/constants/FileTypeIcon.php b/src/applications/files/constants/FileTypeIcon.php new file mode 100644 --- /dev/null +++ b/src/applications/files/constants/FileTypeIcon.php @@ -0,0 +1,66 @@ +setFileDownloadURI($file->getDownloadURI()) ->setFileViewURI($file->getBestURI()) ->setFileViewable((bool)$options['viewable']) + ->setFileSize(phutil_format_bytes($file->getByteSize())) ->setFileMonogram($file->getMonogram()); } diff --git a/src/view/layout/PhabricatorFileLinkView.php b/src/view/layout/PhabricatorFileLinkView.php --- a/src/view/layout/PhabricatorFileLinkView.php +++ b/src/view/layout/PhabricatorFileLinkView.php @@ -8,6 +8,7 @@ private $fileViewable; private $filePHID; private $fileMonogram; + private $fileSize; private $customClass; public function setCustomClass($custom_class) { @@ -73,6 +74,15 @@ return $this->fileName; } + public function setFileSize($file_size) { + $this->fileSize = $file_size; + return $this; + } + + private function getFileSize() { + return $this->fileSize; + } + public function getMetadata() { return array( 'phid' => $this->getFilePHID(), @@ -97,8 +107,35 @@ $class = $this->getCustomClass(); } + $filename = $this->getFileName(); + $type_icon = FileTypeIcon::getFileIcon($filename); + $icon = id(new PHUIIconView()) - ->setIcon('fa-file-text-o'); + ->setIcon($type_icon); + + $info = phutil_tag( + 'span', + array( + 'class' => 'phabricator-remarkup-embed-layout-info', + ), + $this->getFileSize()); + + $name = phutil_tag( + 'span', + array( + 'class' => 'phabricator-remarkup-embed-layout-name', + ), + $filename); + + $inner = phutil_tag( + 'span', + array( + 'class' => 'phabricator-remarkup-embed-layout-info-block', + ), + array( + $name, + $info, + )); return javelin_tag( 'a', @@ -111,7 +148,7 @@ ), array( $icon, - $this->getFileName(), + $inner, )); } } diff --git a/webroot/rsrc/css/core/remarkup.css b/webroot/rsrc/css/core/remarkup.css --- a/webroot/rsrc/css/core/remarkup.css +++ b/webroot/rsrc/css/core/remarkup.css @@ -370,20 +370,41 @@ } .phabricator-remarkup-embed-layout-link { - padding: 2px 0; + padding: 8px 8px 8px 32px; border-radius: 3px; - margin: 0; + margin: 0 0 4px; display: inline-block; font-weight: bold; - color: {$anchor}; -webkit-font-smoothing: antialiased; + border: 1px solid {$lightblueborder}; + border-radius: 3px; + color: #000; + min-width: 240px; + position: relative; + height: 22px; + line-height: 20px; } .phabricator-remarkup-embed-layout-link .phui-icon-view { margin-right: 8px; + font-size: 20px; + position: absolute; + top: 8px; + left: 8px; +} + +.phabricator-remarkup-embed-layout-info { + color: {$lightgreytext}; + font-size: {$smallerfontsize}; + font-weight: normal; + margin-left: 8px; +} + +.phabricator-remarkup-embed-layout-link:hover { + border-color: {$violet}; + text-decoration: none; } -.phabricator-remarkup-embed-layout-link:hover, .phabricator-remarkup-embed-layout-link:hover .phui-icon-view { color: {$violet}; }