Remove adjusted start time

birtles · svgeesus · commit ab656ffa0740 · 2014-05-23T09:58:46.000+09:00
diff --git a/web-animations/img/pausing.svg b/web-animations/img/pausing.svg
@@ -1,7 +1,7 @@
 <!-- vim: set expandtab ts=2 sw=2 tw=80: -->
 <svg xmlns="http://www.w3.org/2000/svg"
   xmlns:xlink="http://www.w3.org/1999/xlink"
-  width="100%" height="100%" viewBox="0 0 500 585">
+  width="100%" height="100%" viewBox="0 0 500 550">
   <defs>
     <style type="text/css">
     svg {
@@ -53,12 +53,6 @@
       text-anchor: start;
       font-size: 30px;
     }
-    .startTimeLabel {
-      text-anchor: start;
-      font-size: 17px;
-      font-style: italic;
-      fill: red;
-    }
     .resultArrow {
       text-anchor: middle;
       font-size: 40px;
@@ -87,8 +81,6 @@
         fill: none;
       }
     </style>
-    <path d="M-3.5-3.5l7 7M3.5-3.5l-7 7M0-5v10M-5 0h10"
-      class="startTimeStar" id="star"/>
   </defs>
   <!-- Timeline -->
   <g transform="translate(10 15)">
@@ -108,42 +100,35 @@
   <g transform="translate(0 65)">
     <text x="5" y="1em">(a) Pause during animation</text>
     <!-- Initial state -->
-    <g transform="translate(130 70)">
+    <g transform="translate(130 60)">
       <rect width="330" height="50" class="activeSpan"/>
       <path d="M0 50l90-18.75h90l150-31.25v50z" class="animProgress"/>
-      <use xlink:href="#star"/>
-      <text x="5" y="-25" class="startTimeLabel">start<tspan x="5"
-        dy="1em">time</tspan></text>
       <text x="15" y="35" class="animationLabel">A</text>
     </g>
     <!-- Pause actions -->
-    <g transform="translate(220 70)">
+    <g transform="translate(220 60)">
       <rect width="90" height="50" class="pauseSpan"/>
       <path d="M0 0v40" class="dottedArrow"/>
       <text y="-10" class="timeLabel">pause</text>
       <path d="M90 50v-40" class="dottedArrow"/>
       <text x="90" y="70" class="timeLabel">unpause</text>
     </g>
     <!-- Result arrow -->
-    <text x="250" y="170" class="resultArrow">&#x21d3;</text>
+    <text x="250" y="160" class="resultArrow">&#x21d3;</text>
     <!-- Updated state -->
-    <g transform="translate(220 200)">
+    <g transform="translate(220 180)">
       <rect width="240" height="50" class="activeSpan"/>
       <path d="M0 50l240-50v50z" class="animProgress"/>
       <text x="15" y="35" class="animationLabel">A&#x2032;</text>
-      <use xlink:href="#star"/>
-      <text x="5" y="-10" class="startTimeLabel">adjusted start time</text>
     </g>
   </g>
   <!-- B: pause before start -->
-  <g transform="translate(0 340)">
+  <g transform="translate(0 320)">
     <text x="5" y="1em">(b) Pause before animation</text>
     <!-- Initial state -->
     <g transform="translate(130 60)">
       <rect width="240" height="50" class="activeSpan"/>
       <path d="M0 50l240-50v50z" class="animProgress"/>
-      <use xlink:href="#star"/>
-      <text x="5" y="-8" class="startTimeLabel">start time</text>
       <text x="15" y="35" class="animationLabel">B</text>
     </g>
     <!-- Pause actions -->
@@ -158,11 +143,9 @@
     <!-- Result arrow -->
     <text x="250" y="155" class="resultArrow">&#x21d3;</text>
     <!-- Updated state -->
-    <g transform="translate(190 190)">
+    <g transform="translate(190 175)">
       <rect width="240" height="50" class="activeSpan"/>
       <path d="M0 50l240-50v50z" class="animProgress"/>
-      <use xlink:href="#star"/>
-      <text x="5" y="-8" class="startTimeLabel">adjusted start time</text>
       <text x="15" y="35" class="animationLabel">B&#x2032;</text>
     </g>
   </g>
diff --git a/web-animations/img/seeking.svg b/web-animations/img/seeking.svg
@@ -1,7 +1,7 @@
 <!-- vim: set expandtab ts=2 sw=2 tw=80: -->
 <svg xmlns="http://www.w3.org/2000/svg"
   xmlns:xlink="http://www.w3.org/1999/xlink"
-  width="100%" height="100%" viewBox="0 0 500 493">
+  width="100%" height="100%" viewBox="0 0 500 473">
   <defs>
     <style type="text/css">
     svg {
@@ -56,12 +56,6 @@
       text-anchor: start;
       font-size: 15px;
     }
-    .startTimeLabel {
-      text-anchor: start;
-      font-size: 17px;
-      font-style: italic;
-      fill: red;
-    }
     </style>
 
     <!-- Arrows -->
@@ -75,18 +69,6 @@
       markerHeight="5">
       <path d="M0-5l10 5l-10 5z" class="blackArrowHead"/>
     </marker>
-
-    <!-- Star -->
-    <style type="text/css">
-      .startTimeStar {
-        stroke: red;
-        stroke-linecap: round;
-        stroke-width: 2;
-        fill: none;
-      }
-    </style>
-    <path d="M-3.5-3.5l7 7M3.5-3.5l-7 7M0-5v10M-5 0h10"
-      class="startTimeStar" id="star"/>
     <!-- Timeline -->
     <g id="timeline">
       <text y="0.1em" class="timelineLabel">Timeline</text>
@@ -106,47 +88,42 @@
   <g transform="translate(0 15)">
     <text x="5" y="0.1em">(a) Initial state</text>
     <use xlink:href="#timeline" x="10" y="25"/>
-    <g transform="translate(130 120)">
+    <g transform="translate(130 110)">
       <rect y="30" width="240" height="50" class="activeSpan"/>
       <path d="M0 0h360" class="arrowLine"/>
       <path d="M0-5v10m120-10v10m120-10v10" class="tick"/>
-      <text y="-27" class="timelineLabel">Player current time</text>
+      <text y="-17" class="timelineLabel">Player current time</text>
       <g transform="translate(0 20)" class="tickLabel">
         <text x="0">0</text>
         <text x="120">1</text>
         <text x="240">2</text>
       </g>
-      <use xlink:href="#star"/>
-      <text x="5" y="-5" class="startTimeLabel">start time = 1s</text>
       <text x="15" y="60" class="animationLabel">Source content</text>
     </g>
   </g>
   <!-- (b) Seeked result -->
-  <g transform="translate(0 275)">
+  <g transform="translate(0 265)">
     <text x="5" y="0.1em">(b) After seeking current time to 2s</text>
     <use xlink:href="#timeline" x="10" y="25"/>
-    <g transform="translate(70 120)">
+    <g transform="translate(70 110)">
       <rect y="30" width="240" height="50" class="activeSpan"/>
       <path d="M0 0h360" class="arrowLine"/>
       <path d="M0-5v10m120-10v10m120-10v10" class="tick"/>
-      <text y="-30" class="timelineLabel">Player current time&#x2032;</text>
+      <text y="-20" class="timelineLabel">Player current time&#x2032;</text>
       <g transform="translate(0 20)" class="tickLabel">
         <text x="0">0</text>
         <text x="120">1</text>
       </g>
-      <use x="0" xlink:href="#star"/>
-      <text x="5" y="-8"
-        class="startTimeLabel">adjusted start time = 0.5s</text>
       <text x="15" y="60" class="animationLabel">Source content</text>
     </g>
   </g>
   <!-- Dotted 't' line -->
   <g transform="translate(310 20)">
-    <path d="M0 0v470" class="tLine"/>
+    <path d="M0 0v450" class="tLine"/>
     <text x="5" y="5" class="tLineLabel">t</text>
     <text x="5" y="30" class="tLineNum">2.5</text>
-    <text x="5" y="135" class="tLineNum">1.5</text>
-    <text x="5" y="290" class="tLineNum">2.5</text>
-    <text x="5" y="370" class="tLineNum">2</text>
+    <text x="5" y="100" class="tLineNum">1.5</text>
+    <text x="5" y="280" class="tLineNum">2.5</text>
+    <text x="5" y="350" class="tLineNum">2</text>
   </g>
 </svg>
diff --git a/web-animations/index.html b/web-animations/index.html
