1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-11-10 00:42:41 +01:00

Add printable support to CSS

Summary:
Fixes T2146. This is a really simple approach, you just do:

  !print .rule {
    whatever: blah;
  }

And it transforms it into:

  .printable .rule {
    whatever: blah;
  }

  @media print {
    .rule {
      whatever: blah;
    }
  }

So we end up with these rules twice, but they should compress well and we shouldn't need that many of them, and this fix is way way simpler than all the nonsense I discussed in T2146.

Test Plan:
  - Added a unit test.
  - Added a simple rule to throw away the menubar when printing.
  - Checked the latter with `/?__print__=1`.

Reviewers: chad, btrahan

Reviewed By: chad

CC: chad, aran

Maniphest Tasks: T2146

Differential Revision: https://secure.phabricator.com/D7363
This commit is contained in:
epriestley 2013-10-19 14:23:19 -07:00
parent 3643fe1498
commit 87ccca32b6
6 changed files with 92 additions and 51 deletions

View file

@ -3342,7 +3342,7 @@ celerity_register_resource_map(array(
), ),
'phabricator-main-menu-view' => 'phabricator-main-menu-view' =>
array( array(
'uri' => '/res/ef11f2fc/rsrc/css/application/base/main-menu-view.css', 'uri' => '/res/95ff522a/rsrc/css/application/base/main-menu-view.css',
'type' => 'css', 'type' => 'css',
'requires' => 'requires' =>
array( array(
@ -4309,7 +4309,7 @@ celerity_register_resource_map(array(
), array( ), array(
'packages' => 'packages' =>
array( array(
'71e32b00' => 'c35f1eca' =>
array( array(
'name' => 'core.pkg.css', 'name' => 'core.pkg.css',
'symbols' => 'symbols' =>
@ -4358,7 +4358,7 @@ celerity_register_resource_map(array(
41 => 'phabricator-tag-view-css', 41 => 'phabricator-tag-view-css',
42 => 'phui-list-view-css', 42 => 'phui-list-view-css',
), ),
'uri' => '/res/pkg/71e32b00/core.pkg.css', 'uri' => '/res/pkg/c35f1eca/core.pkg.css',
'type' => 'css', 'type' => 'css',
), ),
'2c1dba03' => '2c1dba03' =>
@ -4550,15 +4550,15 @@ celerity_register_resource_map(array(
), ),
'reverse' => 'reverse' =>
array( array(
'aphront-dialog-view-css' => '71e32b00', 'aphront-dialog-view-css' => 'c35f1eca',
'aphront-error-view-css' => '71e32b00', 'aphront-error-view-css' => 'c35f1eca',
'aphront-list-filter-view-css' => '71e32b00', 'aphront-list-filter-view-css' => 'c35f1eca',
'aphront-pager-view-css' => '71e32b00', 'aphront-pager-view-css' => 'c35f1eca',
'aphront-panel-view-css' => '71e32b00', 'aphront-panel-view-css' => 'c35f1eca',
'aphront-table-view-css' => '71e32b00', 'aphront-table-view-css' => 'c35f1eca',
'aphront-tokenizer-control-css' => '71e32b00', 'aphront-tokenizer-control-css' => 'c35f1eca',
'aphront-tooltip-css' => '71e32b00', 'aphront-tooltip-css' => 'c35f1eca',
'aphront-typeahead-control-css' => '71e32b00', 'aphront-typeahead-control-css' => 'c35f1eca',
'differential-changeset-view-css' => '7cd7e387', 'differential-changeset-view-css' => '7cd7e387',
'differential-core-view-css' => '7cd7e387', 'differential-core-view-css' => '7cd7e387',
'differential-inline-comment-editor' => '5e9e5c4e', 'differential-inline-comment-editor' => '5e9e5c4e',
@ -4572,7 +4572,7 @@ celerity_register_resource_map(array(
'differential-table-of-contents-css' => '7cd7e387', 'differential-table-of-contents-css' => '7cd7e387',
'diffusion-commit-view-css' => '270f4eb4', 'diffusion-commit-view-css' => '270f4eb4',
'diffusion-icons-css' => '270f4eb4', 'diffusion-icons-css' => '270f4eb4',
'global-drag-and-drop-css' => '71e32b00', 'global-drag-and-drop-css' => 'c35f1eca',
'inline-comment-summary-css' => '7cd7e387', 'inline-comment-summary-css' => '7cd7e387',
'javelin-aphlict' => '2c1dba03', 'javelin-aphlict' => '2c1dba03',
'javelin-behavior' => '3e3be199', 'javelin-behavior' => '3e3be199',
@ -4647,56 +4647,56 @@ celerity_register_resource_map(array(
'javelin-util' => '3e3be199', 'javelin-util' => '3e3be199',
'javelin-vector' => '3e3be199', 'javelin-vector' => '3e3be199',
'javelin-workflow' => '3e3be199', 'javelin-workflow' => '3e3be199',
'lightbox-attachment-css' => '71e32b00', 'lightbox-attachment-css' => 'c35f1eca',
'maniphest-task-summary-css' => '49898640', 'maniphest-task-summary-css' => '49898640',
'phabricator-action-list-view-css' => '71e32b00', 'phabricator-action-list-view-css' => 'c35f1eca',
'phabricator-application-launch-view-css' => '71e32b00', 'phabricator-application-launch-view-css' => 'c35f1eca',
'phabricator-busy' => '2c1dba03', 'phabricator-busy' => '2c1dba03',
'phabricator-content-source-view-css' => '7cd7e387', 'phabricator-content-source-view-css' => '7cd7e387',
'phabricator-core-css' => '71e32b00', 'phabricator-core-css' => 'c35f1eca',
'phabricator-crumbs-view-css' => '71e32b00', 'phabricator-crumbs-view-css' => 'c35f1eca',
'phabricator-drag-and-drop-file-upload' => '5e9e5c4e', 'phabricator-drag-and-drop-file-upload' => '5e9e5c4e',
'phabricator-dropdown-menu' => '2c1dba03', 'phabricator-dropdown-menu' => '2c1dba03',
'phabricator-file-upload' => '2c1dba03', 'phabricator-file-upload' => '2c1dba03',
'phabricator-filetree-view-css' => '71e32b00', 'phabricator-filetree-view-css' => 'c35f1eca',
'phabricator-flag-css' => '71e32b00', 'phabricator-flag-css' => 'c35f1eca',
'phabricator-hovercard' => '2c1dba03', 'phabricator-hovercard' => '2c1dba03',
'phabricator-jump-nav' => '71e32b00', 'phabricator-jump-nav' => 'c35f1eca',
'phabricator-keyboard-shortcut' => '2c1dba03', 'phabricator-keyboard-shortcut' => '2c1dba03',
'phabricator-keyboard-shortcut-manager' => '2c1dba03', 'phabricator-keyboard-shortcut-manager' => '2c1dba03',
'phabricator-main-menu-view' => '71e32b00', 'phabricator-main-menu-view' => 'c35f1eca',
'phabricator-menu-item' => '2c1dba03', 'phabricator-menu-item' => '2c1dba03',
'phabricator-nav-view-css' => '71e32b00', 'phabricator-nav-view-css' => 'c35f1eca',
'phabricator-notification' => '2c1dba03', 'phabricator-notification' => '2c1dba03',
'phabricator-notification-css' => '71e32b00', 'phabricator-notification-css' => 'c35f1eca',
'phabricator-notification-menu-css' => '71e32b00', 'phabricator-notification-menu-css' => 'c35f1eca',
'phabricator-object-selector-css' => '7cd7e387', 'phabricator-object-selector-css' => '7cd7e387',
'phabricator-phtize' => '2c1dba03', 'phabricator-phtize' => '2c1dba03',
'phabricator-prefab' => '2c1dba03', 'phabricator-prefab' => '2c1dba03',
'phabricator-project-tag-css' => '49898640', 'phabricator-project-tag-css' => '49898640',
'phabricator-remarkup-css' => '71e32b00', 'phabricator-remarkup-css' => 'c35f1eca',
'phabricator-shaped-request' => '5e9e5c4e', 'phabricator-shaped-request' => '5e9e5c4e',
'phabricator-side-menu-view-css' => '71e32b00', 'phabricator-side-menu-view-css' => 'c35f1eca',
'phabricator-standard-page-view' => '71e32b00', 'phabricator-standard-page-view' => 'c35f1eca',
'phabricator-tag-view-css' => '71e32b00', 'phabricator-tag-view-css' => 'c35f1eca',
'phabricator-textareautils' => '2c1dba03', 'phabricator-textareautils' => '2c1dba03',
'phabricator-tooltip' => '2c1dba03', 'phabricator-tooltip' => '2c1dba03',
'phabricator-transaction-view-css' => '71e32b00', 'phabricator-transaction-view-css' => 'c35f1eca',
'phabricator-zindex-css' => '71e32b00', 'phabricator-zindex-css' => 'c35f1eca',
'phui-button-css' => '71e32b00', 'phui-button-css' => 'c35f1eca',
'phui-form-css' => '71e32b00', 'phui-form-css' => 'c35f1eca',
'phui-form-view-css' => '71e32b00', 'phui-form-view-css' => 'c35f1eca',
'phui-header-view-css' => '71e32b00', 'phui-header-view-css' => 'c35f1eca',
'phui-icon-view-css' => '71e32b00', 'phui-icon-view-css' => 'c35f1eca',
'phui-list-view-css' => '71e32b00', 'phui-list-view-css' => 'c35f1eca',
'phui-object-item-list-view-css' => '71e32b00', 'phui-object-item-list-view-css' => 'c35f1eca',
'phui-property-list-view-css' => '71e32b00', 'phui-property-list-view-css' => 'c35f1eca',
'phui-spacing-css' => '71e32b00', 'phui-spacing-css' => 'c35f1eca',
'sprite-apps-large-css' => '71e32b00', 'sprite-apps-large-css' => 'c35f1eca',
'sprite-gradient-css' => '71e32b00', 'sprite-gradient-css' => 'c35f1eca',
'sprite-icons-css' => '71e32b00', 'sprite-icons-css' => 'c35f1eca',
'sprite-menu-css' => '71e32b00', 'sprite-menu-css' => 'c35f1eca',
'sprite-status-css' => '71e32b00', 'sprite-status-css' => 'c35f1eca',
'syntax-highlighting-css' => '71e32b00', 'syntax-highlighting-css' => 'c35f1eca',
), ),
)); ));

View file

@ -2497,11 +2497,7 @@ phutil_register_library_map(array(
'DifferentialHunk' => 'DifferentialDAO', 'DifferentialHunk' => 'DifferentialDAO',
'DifferentialHunkParserTestCase' => 'PhabricatorTestCase', 'DifferentialHunkParserTestCase' => 'PhabricatorTestCase',
'DifferentialHunkTestCase' => 'ArcanistPhutilTestCase', 'DifferentialHunkTestCase' => 'ArcanistPhutilTestCase',
'DifferentialInlineComment' => 'DifferentialInlineComment' => 'PhabricatorInlineCommentInterface',
array(
0 => 'DifferentialDAO',
1 => 'PhabricatorInlineCommentInterface',
),
'DifferentialInlineCommentEditController' => 'PhabricatorInlineCommentController', 'DifferentialInlineCommentEditController' => 'PhabricatorInlineCommentController',
'DifferentialInlineCommentEditView' => 'AphrontView', 'DifferentialInlineCommentEditView' => 'AphrontView',
'DifferentialInlineCommentPreviewController' => 'PhabricatorInlineCommentPreviewController', 'DifferentialInlineCommentPreviewController' => 'PhabricatorInlineCommentPreviewController',

View file

@ -39,6 +39,7 @@ final class CelerityResourceTransformer {
switch ($type) { switch ($type) {
case 'css': case 'css':
$data = $this->replaceCSSPrintRules($path, $data);
$data = $this->replaceCSSVariables($path, $data); $data = $this->replaceCSSVariables($path, $data);
$data = preg_replace_callback( $data = preg_replace_callback(
'@url\s*\((\s*[\'"]?.*?)\)@s', '@url\s*\((\s*[\'"]?.*?)\)@s',
@ -129,6 +130,14 @@ final class CelerityResourceTransformer {
$data); $data);
} }
private function replaceCSSPrintRules($path, $data) {
$this->currentPath = $path;
return preg_replace_callback(
'/!print\s+(.+?{.+?})/s',
array($this, 'replaceCSSPrintRule'),
$data);
}
public static function getCSSVariableMap() { public static function getCSSVariableMap() {
return array( return array(
// Base Colors // Base Colors
@ -174,6 +183,7 @@ final class CelerityResourceTransformer {
); );
} }
public function replaceCSSVariable($matches) { public function replaceCSSVariable($matches) {
static $map; static $map;
if (!$map) { if (!$map) {
@ -190,4 +200,13 @@ final class CelerityResourceTransformer {
return $map[$var_name]; return $map[$var_name];
} }
public function replaceCSSPrintRule($matches) {
$rule = $matches[1];
$rules = array();
$rules[] = '.printable '.$rule;
$rules[] = "@media print {\n ".str_replace("\n", "\n ", $rule)."\n}\n";
return implode("\n\n", $rules);
}
} }

View file

@ -0,0 +1,14 @@
~~~~~~
!print .example {
background: #ffffff;
}
~~~~~~
.printable .example {
background: #ffffff;
}
@media print {
.example {
background: #ffffff;
}
}

View file

@ -424,6 +424,10 @@ final class PhabricatorStandardPageView extends PhabricatorBarePageView {
$classes[] = 'platform-linux'; $classes[] = 'platform-linux';
} }
if ($this->getRequest()->getStr('__print__')) {
$classes[] = 'printable';
}
return implode(' ', $classes); return implode(' ', $classes);
} }

View file

@ -400,3 +400,11 @@
.phabricator-application-menu .phui-list-item-name { .phabricator-application-menu .phui-list-item-name {
padding-left: 12px; padding-left: 12px;
} }
/* - Print ---------------------------------------------------------------------
*/
!print .phabricator-main-menu {
display: none;
}