From ff9f3c39539fea567e28ff1b66221297faab6c54 Mon Sep 17 00:00:00 2001
From: Craig Gidney <craig.gidney@gmail.com>
Date: Sat, 23 Mar 2019 13:41:10 -0700
Subject: [PATCH] Add magic state distillation example

---
 html/menu.partial.html |  3 ++-
 src/ui/menu.js         | 36 +++++++++++++++++++++++++++++++++++-
 2 files changed, 37 insertions(+), 2 deletions(-)

diff --git a/html/menu.partial.html b/html/menu.partial.html
index 0ebb87bc..fd1a1db3 100644
--- a/html/menu.partial.html
+++ b/html/menu.partial.html
@@ -39,7 +39,7 @@
                 </a>
             </div>
         </div>
-        <div style="display:inline-block; vertical-align:top; line-height:1.8; padding:15px 15px 15px 5px; background-color:#DDD; border:1px solid gray; margin:10px 0 0 -5px;">
+        <div style="display:inline-block; vertical-align:top; line-height:1.8; padding:15px 15px 15px 5px; background-color:#DDD; border:1px solid gray; margin:0 0 0 -5px;">
             Example Circuits<br>
             <a id="example-anchor-grover">Grover Search</a><br>
             <a id="example-anchor-shor">Shor Period Finding</a><br>
@@ -50,6 +50,7 @@
             <a id="example-symmetry-break">Symmetry Breaking</a><br>
             <a id="example-qft">Quantum Fourier Transform</a><br>
             <a id="example-addition">Reversible Addition</a><br>
+            <a id="example-anchor-distill">Magic State Distillation</a><br>
         </div>
     </div>
 </div>
diff --git a/src/ui/menu.js b/src/ui/menu.js
index a6654855..c3646ccf 100644
--- a/src/ui/menu.js
+++ b/src/ui/menu.js
@@ -236,6 +236,38 @@ const shorLink = {
         {"id":"~out","name":"out:","matrix":"{{1,0,0,0},{0,1,0,0},{0,0,1,0},{0,0,0,1}}"}
     ]
 };
+const distillLink = {
+    "cols":[
+        ["H","H","H","H","H"],
+        [1,"Z","Z","Z",1,"⊖"],
+        [1,"Z","Z",1,"Z",1,"⊖"],
+        [1,"Z",1,"Z","Z",1,1,"⊖"],
+        [1,1,"Z","Z","Z",1,1,1,"⊖"],
+        ["Z","Z","Z","Z","Z",1,1,1,1,"⊖"],
+        ["Z",1,1,"Z","Z",1,1,1,1,1,"⊖"],
+        ["Z",1,"Z",1,"Z",1,1,1,1,1,1,"⊖"],
+        ["Z","Z",1,1,"Z",1,1,1,1,1,1,1,"⊖"],
+        ["Z",1,"Z","Z",1,1,1,1,1,1,1,1,1,"⊖"],
+        ["Z","Z",1,"Z",1,1,1,1,1,1,1,1,1,1,"⊖"],
+        ["Z","Z","Z",1,1,1,1,1,1,1,1,1,1,1,1,"⊖"],
+        [1,"Z^¼","Z^¼","Z^¼","Z^¼","Z^¼","Z^¼","Z^¼","Z^¼","Z^¼","Z^¼","Z^¼","Z^¼","Z^¼","Z^¼","Z^¼"],
+        [1,"H","H","H","H","H","H","H","H","H","H","H","H","H","H","H"],
+        [1,"Measure","Measure","Measure","Measure","Measure","Measure","Measure","Measure","Measure","Measure","Measure","Measure","Measure","Measure","Measure"],
+        [1,"X","X","X",1,"•"],
+        [1,"X","X",1,"X",1,"•"],
+        [1,"X",1,"X","X",1,1,"•"],
+        [1,1,"X","X","X",1,1,1,"•"],
+        ["Z","X","X","X","X",1,1,1,1,"•"],
+        ["Z",1,1,"X","X",1,1,1,1,1,"•"],
+        ["Z",1,"X",1,"X",1,1,1,1,1,1,"•"],
+        ["Z","X",1,1,"X",1,1,1,1,1,1,1,"•"],
+        ["Z",1,"X","X",1,1,1,1,1,1,1,1,1,"•"],
+        ["Z","X",1,"X",1,1,1,1,1,1,1,1,1,1,"•"],
+        ["Z","X","X",1,1,1,1,1,1,1,1,1,1,1,1,"•"],
+        ["X","Chance4"],
+        ["Amps1","|0⟩⟨0|","|0⟩⟨0|","|0⟩⟨0|","|0⟩⟨0|"]
+    ]
+};
 
 /**
  * @param {!Revision} revision
@@ -275,6 +307,7 @@ function initMenu(revision, obsIsAnyOverlayShowing) {
     const chshTestAnchor = /** @type {!HTMLAnchorElement} */ document.getElementById('example-chsh-test');
     const qftAnchor = /** @type {!HTMLAnchorElement} */ document.getElementById('example-qft');
     const shorAnchor = /** @type {!HTMLAnchorElement} */ document.getElementById('example-anchor-shor');
+    const distillAnchor = /** @type {!HTMLAnchorElement} */ document.getElementById('example-anchor-distill');
 
     for (let [a, t] of [[groverAnchor, groverLink],
                         [shorAnchor, shorLink],
@@ -284,7 +317,8 @@ function initMenu(revision, obsIsAnyOverlayShowing) {
                         [superdenseCodeAnchor, superdenseCodingLink],
                         [symmetryBreakAnchor, symmetryBreakingLink],
                         [chshTestAnchor, chshTestLink],
-                        [qftAnchor, qftLink]]) {
+                        [qftAnchor, qftLink],
+                        [distillAnchor, distillLink]]) {
         let text = JSON.stringify(t);
         a.href = "#circuit=" + text;
         a.onclick = ev => {