revi-archive/phorge-phorge
1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-11-10 08:52:39 +01:00
Code Issues Releases Wiki Activity

Show information about each image in the right-side gutter

Browse source 
Summary: Fixes T2646. Title and description are placeholders. Styles on this are a bit rough.

Test Plan: {F34623}

Reviewers: chad

Reviewed By: chad

CC: aran

Maniphest Tasks: T2646

Differential Revision: https://secure.phabricator.com/D5226
This commit is contained in:
epriestley 2013-03-05 12:23:17 -08:00
parent 8cceea3110
commit 035067f83c
5 changed files with 125 additions and 64 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

97
src/__celerity_resource_map__.php
View file

@ -604,15 +604,6 @@ celerity_register_resource_map(array(
),
'disk' => '/rsrc/css/aphront/attached-file-view.css',
),
'aphront-bars' =>
array(
'uri' => '/res/d7bd9032/rsrc/css/core/aphront-bars.css',
'type' => 'css',
'requires' =>
array(
),
'disk' => '/rsrc/css/core/aphront-bars.css',
),
'aphront-calendar-view-css' =>
array(
'uri' => '/res/73061a31/rsrc/css/aphront/calendar-view.css',
@ -1900,7 +1891,7 @@ celerity_register_resource_map(array(
),
'javelin-behavior-pholio-mock-view' =>
array(
'uri' => '/res/e9e31577/rsrc/js/application/pholio/behavior-pholio-mock-view.js',
'uri' => '/res/a1c0c8ae/rsrc/js/application/pholio/behavior-pholio-mock-view.js',
'type' => 'js',
'requires' =>
array(
@ -2856,7 +2847,7 @@ celerity_register_resource_map(array(
),
'phabricator-object-item-list-view-css' =>
array(
'uri' => '/res/034774f8/rsrc/css/layout/phabricator-object-item-list-view.css',
'uri' => '/res/2fb97c5c/rsrc/css/layout/phabricator-object-item-list-view.css',
'type' => 'css',
'requires' =>
array(
@ -2898,7 +2889,7 @@ celerity_register_resource_map(array(
),
'phabricator-pinboard-view-css' =>
array(
'uri' => '/res/61ecd7cf/rsrc/css/layout/phabricator-pinboard-view.css',
'uri' => '/res/c6af8d76/rsrc/css/layout/phabricator-pinboard-view.css',
'type' => 'css',
'requires' =>
array(
@ -3247,7 +3238,7 @@ celerity_register_resource_map(array(
),
'pholio-css' =>
array(
'uri' => '/res/99777600/rsrc/css/application/pholio/pholio.css',
'uri' => '/res/217df4c4/rsrc/css/application/pholio/pholio.css',
'type' => 'css',
'requires' =>
array(
@ -3256,7 +3247,7 @@ celerity_register_resource_map(array(
),
'pholio-inline-comments-css' =>
array(
'uri' => '/res/af95f0a6/rsrc/css/application/pholio/pholio-inline-comments.css',
'uri' => '/res/918836a4/rsrc/css/application/pholio/pholio-inline-comments.css',
'type' => 'css',
'requires' =>
array(
@ -3464,7 +3455,7 @@ celerity_register_resource_map(array(
), array(
'packages' =>
array(
'09aa1f68' =>
'e5fe863e' =>
array(
'name' => 'core.pkg.css',
'symbols' =>
@ -3507,7 +3498,7 @@ celerity_register_resource_map(array(
35 => 'phabricator-object-item-list-view-css',
36 => 'global-drag-and-drop-css',
),
'uri' => '/res/pkg/09aa1f68/core.pkg.css',
'uri' => '/res/pkg/e5fe863e/core.pkg.css',
'type' => 'css',
),
'f24c209c' =>
@ -3696,17 +3687,17 @@ celerity_register_resource_map(array(
'reverse' =>
array(
'aphront-attached-file-view-css' => 'e30a3fa8',
'aphront-crumbs-view-css' => '09aa1f68',
'aphront-dialog-view-css' => '09aa1f68',
'aphront-error-view-css' => '09aa1f68',
'aphront-form-view-css' => '09aa1f68',
'aphront-list-filter-view-css' => '09aa1f68',
'aphront-pager-view-css' => '09aa1f68',
'aphront-panel-view-css' => '09aa1f68',
'aphront-table-view-css' => '09aa1f68',
'aphront-tokenizer-control-css' => '09aa1f68',
'aphront-tooltip-css' => '09aa1f68',
'aphront-typeahead-control-css' => '09aa1f68',
'aphront-crumbs-view-css' => 'e5fe863e',
'aphront-dialog-view-css' => 'e5fe863e',
'aphront-error-view-css' => 'e5fe863e',
'aphront-form-view-css' => 'e5fe863e',
'aphront-list-filter-view-css' => 'e5fe863e',
'aphront-pager-view-css' => 'e5fe863e',
'aphront-panel-view-css' => 'e5fe863e',
'aphront-table-view-css' => 'e5fe863e',
'aphront-tokenizer-control-css' => 'e5fe863e',
'aphront-tooltip-css' => 'e5fe863e',
'aphront-typeahead-control-css' => 'e5fe863e',
'differential-changeset-view-css' => '8aaacd1b',
'differential-core-view-css' => '8aaacd1b',
'differential-inline-comment-editor' => 'd2447f72',
@ -3720,7 +3711,7 @@ celerity_register_resource_map(array(
'differential-table-of-contents-css' => '8aaacd1b',
'diffusion-commit-view-css' => 'c8ce2d88',
'diffusion-icons-css' => 'c8ce2d88',
'global-drag-and-drop-css' => '09aa1f68',
'global-drag-and-drop-css' => 'e5fe863e',
'inline-comment-summary-css' => '8aaacd1b',
'javelin-aphlict' => 'f24c209c',
'javelin-behavior' => 'cd1d650a',
@ -3790,48 +3781,48 @@ celerity_register_resource_map(array(
'javelin-util' => 'cd1d650a',
'javelin-vector' => 'cd1d650a',
'javelin-workflow' => 'cd1d650a',
'lightbox-attachment-css' => '09aa1f68',
'lightbox-attachment-css' => 'e5fe863e',
'maniphest-task-summary-css' => 'e30a3fa8',
'maniphest-transaction-detail-css' => 'e30a3fa8',
'phabricator-busy' => 'f24c209c',
'phabricator-content-source-view-css' => '8aaacd1b',
'phabricator-core-buttons-css' => '09aa1f68',
'phabricator-core-css' => '09aa1f68',
'phabricator-crumbs-view-css' => '09aa1f68',
'phabricator-directory-css' => '09aa1f68',
'phabricator-core-buttons-css' => 'e5fe863e',
'phabricator-core-css' => 'e5fe863e',
'phabricator-crumbs-view-css' => 'e5fe863e',
'phabricator-directory-css' => 'e5fe863e',
'phabricator-drag-and-drop-file-upload' => 'd2447f72',
'phabricator-dropdown-menu' => 'f24c209c',
'phabricator-file-upload' => 'f24c209c',
'phabricator-filetree-view-css' => '09aa1f68',
'phabricator-flag-css' => '09aa1f68',
'phabricator-form-view-css' => '09aa1f68',
'phabricator-header-view-css' => '09aa1f68',
'phabricator-jump-nav' => '09aa1f68',
'phabricator-filetree-view-css' => 'e5fe863e',
'phabricator-flag-css' => 'e5fe863e',
'phabricator-form-view-css' => 'e5fe863e',
'phabricator-header-view-css' => 'e5fe863e',
'phabricator-jump-nav' => 'e5fe863e',
'phabricator-keyboard-shortcut' => 'f24c209c',
'phabricator-keyboard-shortcut-manager' => 'f24c209c',
'phabricator-main-menu-view' => '09aa1f68',
'phabricator-main-menu-view' => 'e5fe863e',
'phabricator-menu-item' => 'f24c209c',
'phabricator-nav-view-css' => '09aa1f68',
'phabricator-nav-view-css' => 'e5fe863e',
'phabricator-notification' => 'f24c209c',
'phabricator-notification-css' => '09aa1f68',
'phabricator-notification-menu-css' => '09aa1f68',
'phabricator-object-item-list-view-css' => '09aa1f68',
'phabricator-notification-css' => 'e5fe863e',
'phabricator-notification-menu-css' => 'e5fe863e',
'phabricator-object-item-list-view-css' => 'e5fe863e',
'phabricator-object-selector-css' => '8aaacd1b',
'phabricator-paste-file-upload' => 'f24c209c',
'phabricator-prefab' => 'f24c209c',
'phabricator-project-tag-css' => 'e30a3fa8',
'phabricator-remarkup-css' => '09aa1f68',
'phabricator-remarkup-css' => 'e5fe863e',
'phabricator-shaped-request' => 'd2447f72',
'phabricator-side-menu-view-css' => '09aa1f68',
'phabricator-standard-page-view' => '09aa1f68',
'phabricator-side-menu-view-css' => 'e5fe863e',
'phabricator-standard-page-view' => 'e5fe863e',
'phabricator-textareautils' => 'f24c209c',
'phabricator-tooltip' => 'f24c209c',
'phabricator-transaction-view-css' => '09aa1f68',
'phabricator-zindex-css' => '09aa1f68',
'sprite-apps-large-css' => '09aa1f68',
'sprite-gradient-css' => '09aa1f68',
'sprite-icon-css' => '09aa1f68',
'sprite-menu-css' => '09aa1f68',
'syntax-highlighting-css' => '09aa1f68',
'phabricator-transaction-view-css' => 'e5fe863e',
'phabricator-zindex-css' => 'e5fe863e',
'sprite-apps-large-css' => 'e5fe863e',
'sprite-gradient-css' => 'e5fe863e',
'sprite-icon-css' => 'e5fe863e',
'sprite-menu-css' => 'e5fe863e',
'syntax-highlighting-css' => 'e5fe863e',
),
));

10
src/applications/pholio/view/PholioMockImagesView.php
View file

@ -40,10 +40,20 @@ final class PholioMockImagesView extends AphrontView {
}
foreach ($mock->getImages() as $image) {
$file = $image->getFile();
$metadata = $file->getMetadata();
$x = idx($metadata, PhabricatorFile::METADATA_IMAGE_WIDTH);
$y = idx($metadata, PhabricatorFile::METADATA_IMAGE_HEIGHT);
$images[] = array(
'id' => $image->getID(),
'fullURI' => $image->getFile()->getBestURI(),
'pageURI' => '/M'.$mock->getID().'/'.$image->getID().'/',
'width' => $x,
'height' => $y,
'title' => $file->getName(),
'desc' => 'Lorem ipsum dolor sit amet: there is no way to set any '.
'descriptive text yet; were there, it would appear here.',
);
}

9
webroot/rsrc/css/application/pholio/pholio-inline-comments.css
View file

@ -5,23 +5,22 @@
.pholio-inline-comment {
border: 1px solid #555555;
background: #353535;
margin: 0 0 5px 0;
margin: 0 10px 5px 10px;
padding: 8px 10px;
color: #ccc;
font-family: Verdana;
font-size: 11px;
}
.pholio-mock-inline-comments {
width: 300px;
color: #cccccc;
width: 320px;
border-left: 1px solid #101010;
border-top: 1px solid #333;
position: absolute;
top: 0;
bottom: 0;
right: 0;
padding: 10px;
background: #282828;
overflow-x: auto;
text-align: left;
@ -76,7 +75,7 @@
color: #777777;
}
.pholio-inline-head-links a {
.pholio-mock-inline-comments a {
font-weight: normal;
color: #2178db;
}

22
webroot/rsrc/css/application/pholio/pholio.css
View file

@ -88,3 +88,25 @@
.pholio-image-loading img {
opacity: 0.50;
}
.pholio-image-info {
border-bottom: 1px solid #101010;
margin-bottom: 5px;
}
.pholio-image-info-item {
padding: 0 10px;
margin: 8px 0;
}
.pholio-visible-size {
color: #ffffff;
}
.pholio-image-description {
color: #777777;
}
.pholio-image-title {
color: #ffffff;
}

51
webroot/rsrc/js/application/pholio/behavior-pholio-mock-view.js
View file

@ -108,7 +108,6 @@ JX.behavior('pholio-mock-view', function(config) {
return;
}
var idx = get_image_index(active_image.id)
JX.log(idx);
idx = (idx + delta + config.images.length) % config.images.length;
select_image(config.images[idx].id);
}
@ -291,9 +290,10 @@ JX.behavior('pholio-mock-view', function(config) {
}
var comment_holder = JX.$('mock-inline-comments');
JX.DOM.setContent(comment_holder, '');
JX.DOM.setContent(comment_holder, render_image_info(active_image));
stage.clearReticles();
var inlines = inline_comments[active_image.id];
if (!inlines || !inlines.length) {
return;
@ -414,9 +414,6 @@ JX.behavior('pholio-mock-view', function(config) {
}
function load_inline_comments() {
var comment_holder = JX.$('mock-inline-comments');
JX.DOM.setContent(comment_holder, '');
var id = active_image.id;
var inline_comments_uri = "/pholio/inline/" + id + "/";
@ -577,7 +574,7 @@ JX.behavior('pholio-mock-view', function(config) {
redraw_image();
/* -( Keyboard Shortcuts )------------------------------------------------ */
/* -( Keyboard Shortcuts )------------------------------------------------- */
new JX.KeyboardShortcut('j', 'Show next image.')
@ -591,4 +588,46 @@ JX.behavior('pholio-mock-view', function(config) {
switch_image(-1);
})
.register();
/* -( Render )------------------------------------------------------------- */
function render_image_info(image) {
var info = [];
var title = JX.$N(
'div',
{className: 'pholio-image-title'},
image.title);
info.push(title);
var desc = JX.$N(
'div',
{className: 'pholio-image-description'},
image.desc);
info.push(desc);
var visible = null;
if (image.tag) {
var area = Math.round(100 * (image.tag.width / image.width));
area = ['(' + area + '%' + ')'];
visible = [' ', JX.$N('span', {className: 'pholio-visible-size'}, area)];
}
info.push([image.width, '\u00d7', image.height, 'px', visible]);
var full_link = JX.$N(
'a',
{href: image.fullURI, target: '_blank'},
'View Full Image');
info.push(full_link);
for (var ii = 0; ii < info.length; ii++) {
info[ii] = JX.$N('div', {className: 'pholio-image-info-item'}, info[ii]);
}
info = JX.$N('div', {className: 'pholio-image-info'}, info);
return info;
}
});