<?xml version="1.0" encoding="UTF-8" standalone="yes" ?>
<!DOCTYPE bugzilla SYSTEM "https://bugs.webkit.org/page.cgi?id=bugzilla.dtd">

<bugzilla version="5.0.4.1"
          urlbase="https://bugs.webkit.org/"
          
          maintainer="admin@webkit.org"
>

    <bug>
          <bug_id>154738</bug_id>
          
          <creation_ts>2016-02-26 10:55:52 -0800</creation_ts>
          <short_desc>Web Inspector: Custom transition bezier curve editor preview should loop when not editing curve</short_desc>
          <delta_ts>2016-02-28 22:23:03 -0800</delta_ts>
          <reporter_accessible>1</reporter_accessible>
          <cclist_accessible>1</cclist_accessible>
          <classification_id>1</classification_id>
          <classification>Unclassified</classification>
          <product>WebKit</product>
          <component>Web Inspector</component>
          <version>WebKit Local Build</version>
          <rep_platform>All</rep_platform>
          <op_sys>All</op_sys>
          <bug_status>RESOLVED</bug_status>
          <resolution>FIXED</resolution>
          
          
          <bug_file_loc></bug_file_loc>
          <status_whiteboard></status_whiteboard>
          <keywords>InRadar</keywords>
          <priority>P2</priority>
          <bug_severity>Normal</bug_severity>
          <target_milestone>---</target_milestone>
          
          
          <everconfirmed>1</everconfirmed>
          <reporter name="Timothy Hatcher">timothy</reporter>
          <assigned_to name="Devin Rousso">hi</assigned_to>
          <cc>bburg</cc>
    
    <cc>commit-queue</cc>
    
    <cc>graouts</cc>
    
    <cc>hi</cc>
    
    <cc>joepeck</cc>
    
    <cc>mattbaker</cc>
    
    <cc>nvasilyev</cc>
    
    <cc>timothy</cc>
    
    <cc>webkit-bug-importer</cc>
          

      

      

      

          <comment_sort_order>oldest_to_newest</comment_sort_order>  
          <long_desc isprivate="0" >
    <commentid>1168581</commentid>
    <comment_count>0</comment_count>
    <who name="Timothy Hatcher">timothy</who>
    <bug_when>2016-02-26 10:55:52 -0800</bug_when>
    <thetext>Right now the only way I can see to preview the animation is to edit the curve or click on the animation itself.

It would be nice if it looped when editing was inactive. Clicking could toggle the animation looping?

&lt;rdar://problem/24861563&gt;</thetext>
  </long_desc><long_desc isprivate="0" >
    <commentid>1168651</commentid>
    <comment_count>1</comment_count>
    <who name="Devin Rousso">hi</who>
    <bug_when>2016-02-26 13:18:18 -0800</bug_when>
    <thetext>(In reply to comment #0)
&gt; Right now the only way I can see to preview the animation is to edit the
&gt; curve or click on the animation itself.

I may be misunderstanding what you mean by &quot;animation itself&quot;, but clicking on the preview area will restart the animation (regardless of its current progress).

&gt; It would be nice if it looped when editing was inactive. Clicking could
&gt; toggle the animation looping?

So instead of clicking to restart, make clicking toggle looping? Why not just make it loop by default and allow clicking to restart?</thetext>
  </long_desc><long_desc isprivate="0" >
    <commentid>1168683</commentid>
    <comment_count>2</comment_count>
    <who name="Timothy Hatcher">timothy</who>
    <bug_when>2016-02-26 14:14:22 -0800</bug_when>
    <thetext>(In reply to comment #1)
&gt; (In reply to comment #0)
&gt; &gt; Right now the only way I can see to preview the animation is to edit the
&gt; &gt; curve or click on the animation itself.
&gt; 
&gt; I may be misunderstanding what you mean by &quot;animation itself&quot;, but clicking
&gt; on the preview area will restart the animation (regardless of its current
&gt; progress).
&gt; 
&gt; &gt; It would be nice if it looped when editing was inactive. Clicking could
&gt; &gt; toggle the animation looping?
&gt; 
&gt; So instead of clicking to restart, make clicking toggle looping? Why not
&gt; just make it loop by default and allow clicking to restart?

Looping by default would likely be fine.</thetext>
  </long_desc><long_desc isprivate="0" >
    <commentid>1168784</commentid>
    <comment_count>3</comment_count>
      <attachid>272391</attachid>
    <who name="Devin Rousso">hi</who>
    <bug_when>2016-02-26 19:09:26 -0800</bug_when>
    <thetext>Created attachment 272391
Patch</thetext>
  </long_desc><long_desc isprivate="0" >
    <commentid>1168806</commentid>
    <comment_count>4</comment_count>
      <attachid>272391</attachid>
    <who name="Joseph Pecoraro">joepeck</who>
    <bug_when>2016-02-26 21:07:50 -0800</bug_when>
    <thetext>Comment on attachment 272391
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=272391&amp;action=review

Yay! I wanted this the last time I used it.

&gt; Source/WebInspectorUI/UserInterface/Views/BezierEditor.js:41
&gt; -        this._bezierPreviewAnimationStyleText = &quot;bezierPreview 2s 250ms forwards &quot;;
&gt; +        this._bezierPreviewAnimationStyleText = &quot;bezierPreview 2.5s 250ms infinite &quot;;

Is this member necessary?

It seems to be used here:

        this._bezierPreview.style.animation = this._bezierPreviewAnimationStyleText + this._bezier.toString();

But perhaps we can just use the CSS version and set the bezier.toString on the more specific property:

        this._bezierPreview.style.animationTimingFunction = this._bezier.toString();

Would this work? It would avoid the duplication, and better match the actual intention.</thetext>
  </long_desc><long_desc isprivate="0" >
    <commentid>1168817</commentid>
    <comment_count>5</comment_count>
      <attachid>272391</attachid>
    <who name="WebKit Commit Bot">commit-queue</who>
    <bug_when>2016-02-26 21:40:45 -0800</bug_when>
    <thetext>Comment on attachment 272391
Patch

Clearing flags on attachment: 272391

Committed r197235: &lt;http://trac.webkit.org/changeset/197235&gt;</thetext>
  </long_desc><long_desc isprivate="0" >
    <commentid>1168818</commentid>
    <comment_count>6</comment_count>
    <who name="WebKit Commit Bot">commit-queue</who>
    <bug_when>2016-02-26 21:40:48 -0800</bug_when>
    <thetext>All reviewed patches have been landed.  Closing bug.</thetext>
  </long_desc><long_desc isprivate="0" >
    <commentid>1169081</commentid>
    <comment_count>7</comment_count>
    <who name="Devin Rousso">hi</who>
    <bug_when>2016-02-28 22:23:03 -0800</bug_when>
    <thetext>(In reply to comment #4)
&gt; Comment on attachment 272391 [details]
&gt; Patch
&gt; 
&gt; View in context:
&gt; https://bugs.webkit.org/attachment.cgi?id=272391&amp;action=review
&gt; 
&gt; Yay! I wanted this the last time I used it.
&gt; 
&gt; &gt; Source/WebInspectorUI/UserInterface/Views/BezierEditor.js:41
&gt; &gt; -        this._bezierPreviewAnimationStyleText = &quot;bezierPreview 2s 250ms forwards &quot;;
&gt; &gt; +        this._bezierPreviewAnimationStyleText = &quot;bezierPreview 2.5s 250ms infinite &quot;;
&gt; 
&gt; Is this member necessary?
&gt; 
&gt; It seems to be used here:
&gt; 
&gt;         this._bezierPreview.style.animation =
&gt; this._bezierPreviewAnimationStyleText + this._bezier.toString();
&gt; 
&gt; But perhaps we can just use the CSS version and set the bezier.toString on
&gt; the more specific property:
&gt; 
&gt;         this._bezierPreview.style.animationTimingFunction =
&gt; this._bezier.toString();
&gt; 
&gt; Would this work? It would avoid the duplication, and better match the actual
&gt; intention.

Nice catch! Not really sure why I didn&apos;t do this in the first place :P
Addressed in &lt;https://bugs.webkit.org/show_bug.cgi?id=154809&gt;</thetext>
  </long_desc>
      
          <attachment
              isobsolete="0"
              ispatch="1"
              isprivate="0"
          >
            <attachid>272391</attachid>
            <date>2016-02-26 19:09:26 -0800</date>
            <delta_ts>2016-02-26 21:40:45 -0800</delta_ts>
            <desc>Patch</desc>
            <filename>bug-154738-20160226200908.patch</filename>
            <type>text/plain</type>
            <size>2843</size>
            <attacher name="Devin Rousso">hi</attacher>
            
              <data encoding="base64">ZGlmZiAtLWdpdCBhL1NvdXJjZS9XZWJJbnNwZWN0b3JVSS9DaGFuZ2VMb2cgYi9Tb3VyY2UvV2Vi
SW5zcGVjdG9yVUkvQ2hhbmdlTG9nCmluZGV4IDhmNjhlMWRmYWVkYzUxN2VhYjE3NWU4NGY5ZWEx
N2NjZWEzZmQzNTUuLmEwYjZjMzc3NGY1NjJlY2NhYjljZWExNDVjN2QwZDE5Y2U2ZmU4NDMgMTAw
NjQ0Ci0tLSBhL1NvdXJjZS9XZWJJbnNwZWN0b3JVSS9DaGFuZ2VMb2cKKysrIGIvU291cmNlL1dl
Ykluc3BlY3RvclVJL0NoYW5nZUxvZwpAQCAtMSw1ICsxLDIxIEBACiAyMDE2LTAyLTI2ICBEZXZp
biBSb3Vzc28gIDxkY3JvdXNzbyt3ZWJraXRAZ21haWwuY29tPgogCisgICAgICAgIFdlYiBJbnNw
ZWN0b3I6IEN1c3RvbSB0cmFuc2l0aW9uIGJlemllciBjdXJ2ZSBlZGl0b3IgcHJldmlldyBzaG91
bGQgbG9vcCB3aGVuIG5vdCBlZGl0aW5nIGN1cnZlCisgICAgICAgIGh0dHBzOi8vYnVncy53ZWJr
aXQub3JnL3Nob3dfYnVnLmNnaT9pZD0xNTQ3MzgKKyAgICAgICAgPHJkYXI6Ly9wcm9ibGVtLzI0
ODYxNTYzPgorCisgICAgICAgIFJldmlld2VkIGJ5IE5PQk9EWSAoT09QUyEpLgorCisgICAgICAg
IEFkZGVkIGV4dHJhIGZyYW1lcyB0byBiZXppZXIgcHJldmlldyBhbmltYXRpb24gdG8gYWxsb3cg
aXQgdG8gaW5maW5pdGVseQorICAgICAgICByZXBlYXQgd2l0aG91dCBiZWluZyBqYXJyaW5nIHRv
IHdhdGNoLgorCisgICAgICAgICogVXNlckludGVyZmFjZS9WaWV3cy9CZXppZXJFZGl0b3IuY3Nz
OgorICAgICAgICAoLmJlemllci1lZGl0b3IgPiAuYmV6aWVyLXByZXZpZXctdGltaW5nLmFuaW1h
dGUpOgorICAgICAgICAoQGtleWZyYW1lcyBiZXppZXJQcmV2aWV3KToKKyAgICAgICAgKiBVc2Vy
SW50ZXJmYWNlL1ZpZXdzL0JlemllckVkaXRvci5qczoKKworMjAxNi0wMi0yNiAgRGV2aW4gUm91
c3NvICA8ZGNyb3Vzc28rd2Via2l0QGdtYWlsLmNvbT4KKwogICAgICAgICBXZWIgSW5zcGVjdG9y
OiBPcHRpb24tY2xpY2tpbmcgb24gdGhlIGEgQ1NTIHByb3BlcnR5IHNvbWV0aW1lcyBkb2Vzbid0
IHdvcmsKICAgICAgICAgaHR0cHM6Ly9idWdzLndlYmtpdC5vcmcvc2hvd19idWcuY2dpP2lkPTE1
NDM4NAogICAgICAgICA8cmRhcjovL3Byb2JsZW0vMjQ3MTQ3NTU+CmRpZmYgLS1naXQgYS9Tb3Vy
Y2UvV2ViSW5zcGVjdG9yVUkvVXNlckludGVyZmFjZS9WaWV3cy9CZXppZXJFZGl0b3IuY3NzIGIv
U291cmNlL1dlYkluc3BlY3RvclVJL1VzZXJJbnRlcmZhY2UvVmlld3MvQmV6aWVyRWRpdG9yLmNz
cwppbmRleCA3MzkzOGJiZWUyMzg4NDcxN2RjNjI4NjY4MmE3NTUwMjk3NTc1YTZmLi5mMzdlNWIy
MjBjMGVlMTU0OWY3OTQxN2JjNDY1YTVmMDg4NDllOTU1IDEwMDY0NAotLS0gYS9Tb3VyY2UvV2Vi
SW5zcGVjdG9yVUkvVXNlckludGVyZmFjZS9WaWV3cy9CZXppZXJFZGl0b3IuY3NzCisrKyBiL1Nv
dXJjZS9XZWJJbnNwZWN0b3JVSS9Vc2VySW50ZXJmYWNlL1ZpZXdzL0JlemllckVkaXRvci5jc3MK
QEAgLTUyLDExICs1MiwxMyBAQAogfQogCiAuYmV6aWVyLWVkaXRvciA+IC5iZXppZXItcHJldmll
dy10aW1pbmcuYW5pbWF0ZSB7Ci0gICAgYW5pbWF0aW9uOiBiZXppZXJQcmV2aWV3IDJzIGxpbmVh
ciAyNTBtcyBmb3J3YXJkczsKKyAgICBhbmltYXRpb246IGJlemllclByZXZpZXcgMi41cyBsaW5l
YXIgMjUwbXMgaW5maW5pdGU7CiB9CiAKIEBrZXlmcmFtZXMgYmV6aWVyUHJldmlldyB7CiAgICAg
ZnJvbSB7IHRyYW5zZm9ybTogdHJhbnNsYXRlKDAsIDApOyB9CisgICAgMTAlIHsgdHJhbnNmb3Jt
OiB0cmFuc2xhdGUoMCwgMCk7IH0KKyAgICA5MCUgeyB0cmFuc2Zvcm06IHRyYW5zbGF0ZSgxNzBw
eCwgMCk7IH0KICAgICB0byB7IHRyYW5zZm9ybTogdHJhbnNsYXRlKDE3MHB4LCAwKTsgfQogfQog
CmRpZmYgLS1naXQgYS9Tb3VyY2UvV2ViSW5zcGVjdG9yVUkvVXNlckludGVyZmFjZS9WaWV3cy9C
ZXppZXJFZGl0b3IuanMgYi9Tb3VyY2UvV2ViSW5zcGVjdG9yVUkvVXNlckludGVyZmFjZS9WaWV3
cy9CZXppZXJFZGl0b3IuanMKaW5kZXggYmUzNGQyZDFjMzZhZGQ3YTAwNTEyMDIzYjViZjdhZWEw
YjI5ZWQ5OS4uZDFiYzFmNzQzNzUxZDJlNjZhYTk4MzYyZGRlOGVjNTk1MTIyNzNjMCAxMDA2NDQK
LS0tIGEvU291cmNlL1dlYkluc3BlY3RvclVJL1VzZXJJbnRlcmZhY2UvVmlld3MvQmV6aWVyRWRp
dG9yLmpzCisrKyBiL1NvdXJjZS9XZWJJbnNwZWN0b3JVSS9Vc2VySW50ZXJmYWNlL1ZpZXdzL0Jl
emllckVkaXRvci5qcwpAQCAtMzgsNyArMzgsNyBAQCBXZWJJbnNwZWN0b3IuQmV6aWVyRWRpdG9y
ID0gY2xhc3MgQmV6aWVyRWRpdG9yIGV4dGVuZHMgV2ViSW5zcGVjdG9yLk9iamVjdAogICAgICAg
ICB0aGlzLl9jb250cm9sSGFuZGxlUmFkaXVzID0gNzsKICAgICAgICAgdGhpcy5fYmV6aWVyV2lk
dGggPSBlZGl0b3JXaWR0aCAtICh0aGlzLl9jb250cm9sSGFuZGxlUmFkaXVzICogMik7CiAgICAg
ICAgIHRoaXMuX2JlemllckhlaWdodCA9IGVkaXRvckhlaWdodCAtICh0aGlzLl9jb250cm9sSGFu
ZGxlUmFkaXVzICogMikgLSAodGhpcy5fcGFkZGluZyAqIDIpOwotICAgICAgICB0aGlzLl9iZXpp
ZXJQcmV2aWV3QW5pbWF0aW9uU3R5bGVUZXh0ID0gImJlemllclByZXZpZXcgMnMgMjUwbXMgZm9y
d2FyZHMgIjsKKyAgICAgICAgdGhpcy5fYmV6aWVyUHJldmlld0FuaW1hdGlvblN0eWxlVGV4dCA9
ICJiZXppZXJQcmV2aWV3IDIuNXMgMjUwbXMgaW5maW5pdGUgIjsKIAogICAgICAgICB2YXIgYmV6
aWVyUHJldmlld0NvbnRhaW5lciA9IGRvY3VtZW50LmNyZWF0ZUVsZW1lbnQoImRpdiIpOwogICAg
ICAgICBiZXppZXJQcmV2aWV3Q29udGFpbmVyLmlkID0gImJlemllclByZXZpZXciOwo=
</data>

          </attachment>
      

    </bug>

</bugzilla>