Allow the Jupyter engine to elect to emit diffs, and emit Jupyter documents as blocks

Summary:
Depends on D20832. Ref T13425. Emit Jupyter notebooks as diffable blocks with block keys.

No diffing or proper inlines yet.

Test Plan: {F6888058}

Maniphest Tasks: T13425

Differential Revision: https://secure.phabricator.com/D20833

resources/celerity/map.php

@@ -9,9 +9,9 @@ return array(
   'names' => array(
     'conpherence.pkg.css' => '3c8a0668',
     'conpherence.pkg.js' => '020aebcf',
-    'core.pkg.css' => 'c69171e6',
+    'core.pkg.css' => '6a8c9533',
     'core.pkg.js' => '6e5c894f',
-    'differential.pkg.css' => 'eef74643',
+    'differential.pkg.css' => 'ce54994e',
     'differential.pkg.js' => '49515551',
     'diffusion.pkg.css' => '42c75c37',
     'diffusion.pkg.js' => 'a98c0bf7',
@@ -61,7 +61,7 @@ return array(
     'rsrc/css/application/dashboard/dashboard.css' => '5a205b9d',
     'rsrc/css/application/diff/inline-comment-summary.css' => '81eb368d',
     'rsrc/css/application/differential/add-comment.css' => '7e5900d9',
-    'rsrc/css/application/differential/changeset-view.css' => '215129ef',
+    'rsrc/css/application/differential/changeset-view.css' => 'db306b82',
     'rsrc/css/application/differential/core.css' => '7300a73e',
     'rsrc/css/application/differential/phui-inline-comment.css' => '48acce5b',
     'rsrc/css/application/differential/revision-comment.css' => '7dbc8d1d',
@@ -169,7 +169,7 @@ return array(
     'rsrc/css/phui/phui-pager.css' => 'd022c7ad',
     'rsrc/css/phui/phui-pinboard-view.css' => '1f08f5d8',
     'rsrc/css/phui/phui-policy-section-view.css' => '139fdc64',
-    'rsrc/css/phui/phui-property-list-view.css' => 'cad62236',
+    'rsrc/css/phui/phui-property-list-view.css' => '34180764',
     'rsrc/css/phui/phui-remarkup-preview.css' => '91767007',
     'rsrc/css/phui/phui-segment-bar-view.css' => '5166b370',
     'rsrc/css/phui/phui-spacing.css' => 'b05cadc3',
@@ -554,7 +554,7 @@ return array(
     'conpherence-thread-manager' => 'aec8e38c',
     'conpherence-transaction-css' => '3a3f5e7e',
     'd3' => '9d068042',
-    'differential-changeset-view-css' => '215129ef',
+    'differential-changeset-view-css' => 'db306b82',
     'differential-core-view-css' => '7300a73e',
     'differential-revision-add-comment-css' => '7e5900d9',
     'differential-revision-comment-css' => '7dbc8d1d',
@@ -865,7 +865,7 @@ return array(
     'phui-pager-css' => 'd022c7ad',
     'phui-pinboard-view-css' => '1f08f5d8',
     'phui-policy-section-view-css' => '139fdc64',
-    'phui-property-list-view-css' => 'cad62236',
+    'phui-property-list-view-css' => '34180764',
     'phui-remarkup-preview-css' => '91767007',
     'phui-segment-bar-view-css' => '5166b370',
     'phui-spacing-css' => 'b05cadc3',
@@ -1065,9 +1065,6 @@ return array(
       'javelin-behavior',
       'javelin-request',
     ),
-    '215129ef' => array(
-      'phui-inline-comment-view-css',
-    ),
     '225bbb98' => array(
       'javelin-install',
       'javelin-reactor',
@@ -2072,6 +2069,9 @@ return array(
       'javelin-uri',
       'phabricator-notification',
     ),
+    'db306b82' => array(
+      'phui-inline-comment-view-css',
+    ),
     'dfa1d313' => array(
       'javelin-behavior',
       'javelin-dom',

src/applications/differential/parser/DifferentialChangesetParser.php

@@ -1693,7 +1693,7 @@ final class DifferentialChangesetParser extends Phobject {
       $new_data = ipull($new_data, 'text');
       $new_data = implode('', $new_data);
 
-      $new_ref->setData($old_data);
+      $new_ref->setData($new_data);
     }
 
     $old_engines = PhabricatorDocumentEngine::getEnginesForRef(

src/applications/differential/render/DifferentialChangesetOneUpRenderer.php

@@ -241,7 +241,7 @@ final class DifferentialChangesetOneUpRenderer
       $primitives[] = array(
         'type' => 'old-file',
         'htype' => '',
-        'line' => 1,
+        'line' => $block->getBlockKey(),
         'render' => $block->newContentView(),
       );
     }

src/applications/differential/render/DifferentialChangesetTwoUpRenderer.php

@@ -369,53 +369,64 @@ final class DifferentialChangesetTwoUpRenderer
     $old_changeset_key,
     $new_changeset_key) {
 
-    $old_view = null;
-    $new_view = null;
+    $old_comments = $this->getOldComments();
+    $new_comments = $this->getNewComments();
 
+    $rows = array();
     foreach ($block_list->newTwoUpLayout() as $row) {
       list($old, $new) = $row;
 
       if ($old) {
-        $old_view = $old->newContentView();
+        $old_content = $old->newContentView();
+        $old_key = $old->getBlockKey();
+        $old_classes = implode(' ', $old->getClasses());
       } else {
-        $old_view = null;
+        $old_content = null;
+        $old_key = null;
+        $old_classes = null;
       }
 
       if ($new) {
-        $new_view = $new->newContentView();
+        $new_content = $new->newContentView();
+        $new_key = $new->getBlockKey();
+        $new_classes = implode(' ', $new->getClasses());
       } else {
-        $new_view = null;
-      }
+        $new_content = null;
+        $new_key = null;
+        $new_classes = null;
       }
 
-    $html_old = array();
-    $html_new = array();
-    foreach ($this->getOldComments() as $on_line => $comment_group) {
-      foreach ($comment_group as $comment) {
+      $old_inline_rows = array();
+      if ($old_key !== null) {
+        $old_inlines = idx($old_comments, $old_key, array());
+        foreach ($old_inlines as $inline) {
           $inline = $this->buildInlineComment(
-          $comment,
+            $inline,
             $on_right = false);
-        $html_old[] = $this->getRowScaffoldForInline($inline);
-      }
-    }
-    foreach ($this->getNewComments() as $lin_line => $comment_group) {
-      foreach ($comment_group as $comment) {
-        $inline = $this->buildInlineComment(
-          $comment,
-          $on_right = true);
-        $html_new[] = $this->getRowScaffoldForInline($inline);
+          $old_inline_rows[] = $this->getRowScaffoldForInline($inline);
         }
       }
 
-    if ($old_view === null) {
+      $new_inline_rows = array();
+      if ($new_key !== null) {
+        $new_inlines = idx($new_comments, $new_key, array());
+        foreach ($new_inlines as $inline) {
+          $inline = $this->buildInlineComment(
+            $inline,
+            $on_right = true);
+          $new_inline_rows[] = $this->getRowScaffoldForInline($inline);
+        }
+      }
+
+      if ($old_content === null) {
         $old_id = null;
         $old_label = null;
       } else {
-      $old_id = "C{$old_changeset_key}OL1";
-      $old_label = '1';
+        $old_id = "C{$old_changeset_key}OL{$old_key}";
+        $old_label = $old_key;
       }
 
-    $old_cell = phutil_tag(
+      $old_line_cell = phutil_tag(
         'td',
         array(
           'id' => $old_id,
@@ -423,15 +434,22 @@ final class DifferentialChangesetTwoUpRenderer
         ),
         $old_label);
 
-    if ($new_view === null) {
+      $old_content_cell = phutil_tag(
+        'td',
+        array(
+          'class' => $old_classes,
+        ),
+        $old_content);
+
+      if ($new_content === null) {
         $new_id = null;
         $new_label = null;
       } else {
-      $new_id = "C{$new_changeset_key}NL1";
-      $new_label = '1';
+        $new_id = "C{$new_changeset_key}NL{$new_key}";
+        $new_label = $new_key;
       }
 
-    $new_cell = phutil_tag(
+      $new_line_cell = phutil_tag(
         'td',
         array(
           'id' => $new_id,
@@ -439,24 +457,32 @@ final class DifferentialChangesetTwoUpRenderer
         ),
         $new_label);
 
-    $output = hsprintf(
-      '<tr class="differential-image-diff">'.
-        '%s'.
-        '<td class="differential-old-image diff-image-cell">%s</td>'.
-        '%s'.
-        '<td class="differential-new-image diff-image-cell" '.
-          'colspan="3">%s</td>'.
-      '</tr>'.
-      '%s'.
-      '%s',
-      $old_cell,
-      $old_view,
-      $new_cell,
-      $new_view,
-      phutil_implode_html('', $html_old),
-      phutil_implode_html('', $html_new));
+      $new_content_cell = phutil_tag(
+        'td',
+        array(
+          'class' => $new_classes,
+          'colspan' => '3',
+        ),
+        $new_content);
 
-    $output = $this->wrapChangeInTable($output);
+      $row_view = phutil_tag(
+        'tr',
+        array(),
+        array(
+          $old_line_cell,
+          $old_content_cell,
+          $new_line_cell,
+          $new_content_cell,
+        ));
+
+      $rows[] = array(
+        $row_view,
+        $old_inline_rows,
+        $new_inline_rows,
+      );
+    }
+
+    $output = $this->wrapChangeInTable($rows);
 
     return $this->renderChangesetTable($output);
   }

src/applications/files/diff/PhabricatorDocumentEngineBlock.php

@@ -3,7 +3,9 @@
 final class PhabricatorDocumentEngineBlock
   extends Phobject {
 
+  private $blockKey;
   private $content;
+  private $classes = array();
 
   public function setContent($content) {
     $this->content = $content;
@@ -18,4 +20,22 @@ final class PhabricatorDocumentEngineBlock
     return $this->getContent();
   }
 
+  public function setBlockKey($block_key) {
+    $this->blockKey = $block_key;
+    return $this;
+  }
+
+  public function getBlockKey() {
+    return $this->blockKey;
+  }
+
+  public function addClass($class) {
+    $this->classes[] = $class;
+    return $this;
+  }
+
+  public function getClasses() {
+    return $this->classes;
+  }
+
 }

src/applications/files/document/PhabricatorImageDocumentEngine.php

@@ -56,6 +56,8 @@ final class PhabricatorImageDocumentEngine
         )));
 
     $blocks[] = id(new PhabricatorDocumentEngineBlock())
+      ->setBlockKey('1')
+      ->addClass('diff-image-cell')
       ->setContent($image_view);
 
     return $blocks;

src/applications/files/document/PhabricatorJupyterDocumentEngine.php

@@ -35,6 +35,63 @@ final class PhabricatorJupyterDocumentEngine
     return $ref->isProbablyJSON();
   }
 
+  public function canDiffDocuments(
+    PhabricatorDocumentRef $uref,
+    PhabricatorDocumentRef $vref) {
+    return true;
+  }
+
+  public function newDiffView(
+    PhabricatorDocumentRef $uref,
+    PhabricatorDocumentRef $vref) {
+
+    $u_blocks = $this->newDiffBlocks($uref);
+    $v_blocks = $this->newDiffBlocks($vref);
+
+    return id(new PhabricatorDocumentEngineBlocks())
+      ->addBlockList($uref, $u_blocks)
+      ->addBlockList($vref, $v_blocks);
+  }
+
+  private function newDiffBlocks(PhabricatorDocumentRef $ref) {
+    $viewer = $this->getViewer();
+    $content = $ref->loadData();
+
+    $data = phutil_json_decode($content);
+    $cells = idx($data, 'cells');
+    if (!is_array($cells)) {
+      throw new Exception('Missing "cells".');
+    }
+
+    $idx = 1;
+    $blocks = array();
+    foreach ($cells as $cell) {
+      $cell_content = $this->renderJupyterCell($viewer, $cell);
+
+      $notebook_table = phutil_tag(
+        'table',
+        array(
+          'class' => 'jupyter-notebook',
+        ),
+        $cell_content);
+
+      $container = phutil_tag(
+        'div',
+        array(
+          'class' => 'document-engine-jupyter document-engine-diff',
+        ),
+        $notebook_table);
+
+      $blocks[] = id(new PhabricatorDocumentEngineBlock())
+        ->setBlockKey($idx)
+        ->setContent($container);
+
+      $idx++;
+    }
+
+    return $blocks;
+  }
+
   protected function newDocumentContent(PhabricatorDocumentRef $ref) {
     $viewer = $this->getViewer();
     $content = $ref->loadData();

webroot/rsrc/css/application/differential/changeset-view.css

@@ -284,16 +284,13 @@ td.cov-I {
 
 .differential-diff .diff-image-cell {
   background-image: url(/rsrc/image/checker_light.png);
+  padding: 8px;
 }
 
 .device-desktop .differential-diff .diff-image-cell:hover {
   background-image: url(/rsrc/image/checker_dark.png);
 }
 
-.differential-diff .differential-image-diff td {
-  padding: 8px;
-}
-
 .differential-image-stage {
   overflow: auto;
 }

webroot/rsrc/css/phui/phui-property-list-view.css

@@ -268,6 +268,10 @@ div.phui-property-list-stacked .phui-property-list-properties
   margin: 20px;
 }
 
+.document-engine-jupyter.document-engine-diff {
+  margin: 0;
+}
+
 .document-engine-in-flight {
   opacity: 0.25;
 }