<html>
  <head>
    <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
  </head>
  <body bgcolor="#FFFFFF" text="#000000">
    On 1/3/2016 3:24 PM, Jonathan Wilkes wrote:<br>
    <blockquote
      cite="mid:313540933.6386263.1451852688700.JavaMail.yahoo@mail.yahoo.com"
      type="cite">
      <div style="color:#000; background-color:#fff;
        font-family:HelveticaNeue, Helvetica Neue, Helvetica, Arial,
        Lucida Grande, sans-serif;font-size:16px">
        <div id="yiv7491381977">
          <div id="yui_3_16_0_1_1451851974487_2654">
            <div id="yui_3_16_0_1_1451851974487_2653"
              style="color:#000;background-color:#fff;font-family:HelveticaNeue,
              Helvetica Neue, Helvetica, Arial, Lucida Grande,
              sans-serif;font-size:16px;">
              <div id="yui_3_16_0_1_1451851974487_3004">It's actually
                way more simplistic than that-- just an "animate" method
                that <br>
              </div>
              <div id="yui_3_16_0_1_1451851974487_2710" dir="ltr">wraps
                around whatever attribute is available to the drawing
                command.  All <br>
              </div>
              <div id="yui_3_16_0_1_1451851974487_2786" dir="ltr">I'll
                have is a ramp time, an optional delay time, and an
                optional easing curve. <br>
              </div>
              <div id="yui_3_16_0_1_1451851974487_2997" dir="ltr">That
                will make it a bit like a [vline~] for GUI side
                animation.</div>
              <div id="yui_3_16_0_1_1451851974487_2998" dir="ltr"><br>
              </div>
              <div id="yui_3_16_0_1_1451851974487_2999" dir="ltr">I'm
                using the web animations API because it makes things
                very simple, even <br>
              </div>
              <div id="yui_3_16_0_1_1451851974487_3000" dir="ltr">to do
                complex things like animating path data.</div>
              <div id="yui_3_16_0_1_1451851974487_3094" dir="ltr"><br>
              </div>
              <div id="yui_3_16_0_1_1451851974487_3251" dir="ltr">The
                idea is that this would open up some modest
                visualization opportunities <br>
              </div>
              <div id="yui_3_16_0_1_1451851974487_3252" dir="ltr">that
                are otherwise too cpu intensive.  For example, if you're
                animating <br>
              </div>
              <div id="yui_3_16_0_1_1451851974487_3253" dir="ltr">using
                [line] the socket messages can quickly get in the way of
                the audio.<br>
              </div>
            </div>
          </div>
        </div>
      </div>
    </blockquote>
    <br>
    Will you at some point drown the CPU? Sure, but that is no different
    than a million of other ways of doing the same. OTOH, implementing
    the animation this way helps you ensure that your animation remains
    in sync with the audio, which to me seems much better gain than a
    potential CPU/socket overhead may be a shortcoming.<br>
    <br>
    There could be some very cool ways of filtering gui messages, as
    well (short of getting rid of the socket-based communication in
    favor of a shared memory/multithreaded design). For instance, your
    animation object could be given the screen refresh rate and
    therefore it would not send out a message via a socket unless a
    desired frame-worth of time has transpired since the last message
    was sent. This would do wonders not just in terms of animation, but
    also the overall gui responsiveness, if implemented system-wide.<br>
    <br>
    Best,<br>
    <br>
    Ico<br>
    <br>
    <blockquote
      cite="mid:313540933.6386263.1451852688700.JavaMail.yahoo@mail.yahoo.com"
      type="cite">
      <div style="color:#000; background-color:#fff;
        font-family:HelveticaNeue, Helvetica Neue, Helvetica, Arial,
        Lucida Grande, sans-serif;font-size:16px">
        <div id="yiv7491381977">
          <div id="yui_3_16_0_1_1451851974487_2654">
            <div id="yui_3_16_0_1_1451851974487_2653"
              style="color:#000;background-color:#fff;font-family:HelveticaNeue,
              Helvetica Neue, Helvetica, Arial, Lucida Grande,
              sans-serif;font-size:16px;">
              <div id="yui_3_16_0_1_1451851974487_3001" dir="ltr"><br>
              </div>
              <div id="yui_3_16_0_1_1451851974487_3002" dir="ltr">-Jonathan<br>
              </div>
              <div dir="ltr"
                id="yiv7491381977yui_3_16_0_1_1451841944661_7669"><br
                  clear="none">
              </div>
              <div dir="ltr"
                id="yiv7491381977yui_3_16_0_1_1451841944661_6038"><br
                  clear="none">
              </div>
              <div dir="ltr"
                id="yiv7491381977yui_3_16_0_1_1451841944661_6497"><br
                  clear="none">
              </div>
              <div dir="ltr"
                id="yiv7491381977yui_3_16_0_1_1451841944661_6039"><br
                  clear="none">
              </div>
              <div id="yiv7491381977yui_3_16_0_1_1451841944661_6012"><span></span></div>
              <div id="yui_3_16_0_1_1451851974487_2711"
                class="yiv7491381977qtdSeparateBR"><br clear="none">
                <br clear="none">
              </div>
            </div>
          </div>
        </div>
        <div class=".yiv7491381977yahoo_quoted">
          <div style="font-family:HelveticaNeue, Helvetica Neue,
            Helvetica, Arial, Lucida Grande, sans-serif;font-size:16px;">
            <div style="font-family:HelveticaNeue, Helvetica Neue,
              Helvetica, Arial, Lucida Grande,
              sans-serif;font-size:16px;">
              <div class="qtdSeparateBR"><br>
                <br>
              </div>
              <div class="yiv7491381977yqt1236546037"
                id="yiv7491381977yqt89869">
                <div dir="ltr"><font size="2" face="Arial"> On Sunday,
                    January 3, 2016 1:08 PM, Ivica Ico Bukvic
                    <a class="moz-txt-link-rfc2396E" href="mailto:ico@vt.edu"><ico@vt.edu></a> wrote:<br clear="none">
                  </font></div>
                <br clear="none">
                <br clear="none">
                <div class="yiv7491381977y_msg_container">
                  <div id="yiv7491381977">
                    <div> I think it may make sense in addition to
                      having a one-shot-independent animations that have
                      no guarantee of staying in sync with the audio
                      (e.g. these could be useful for mouse-over button
                      animations) that your animation object can also
                      receive a decimal value between its originator and
                      destination, allowing for each keyframe to be a
                      whole number. So, 0-1 would interpolate between
                      the starting state and first keyframe, 1-2 between
                      first and second keyframes, etc., and thus allow
                      pd to use its timing mechanism to project changes
                      in animation state via a line object, a counter or
                      something similar. IIRC most (all?) HTML5-based
                      animations can be triggered as independent events
                      or can be given a specific percentage value. The
                      one-shot object could interact with independent
                      events, while the proposed object could interact
                      with the latter.<br clear="none">
                      <br clear="none">
                      That said, not knowing how you have imagined your
                      animation object, it may be tricky to implement
                      this as it would require object to keep track of
                      all the keyframed events (assuming there are more
                      than one). If you are thinking of having the
                      animation object track only one single animation
                      (e.g. something progressing from 30% to 90%), the
                      same could still prove useful except in this case
                      you would only allow for values between 0 and 1.<br
                        clear="none">
                      <br clear="none">
                      <div class="yiv7491381977yqt1831210892"
                        id="yiv7491381977yqt48349">
                        <div class="yiv7491381977moz-cite-prefix">On
                          1/2/2016 1:12 PM, Jonathan Wilkes via Pd-list
                          wrote:<br clear="none">
                        </div>
                        <blockquote type="cite">
                          <div
                            style="color:#000;background-color:#fff;font-family:HelveticaNeue,
                            Helvetica Neue, Helvetica, Arial, Lucida
                            Grande, sans-serif;font-size:16px;">
                            <div
                              id="yiv7491381977yui_3_16_0_1_1451752408813_3953">Hi
                              list,</div>
                            <div
                              id="yiv7491381977yui_3_16_0_1_1451752408813_3952">I'm
                              playing with adding a simple animation api
                              to data structure drawing commands. <br
                                clear="none">
                            </div>
                            <div
                              id="yiv7491381977yui_3_16_0_1_1451752408813_3951">The
                              parameters will be sent to the GUI, and
                              the GUI will take care of the ramp, delay,
                              etc.</div>
                            <div
                              id="yiv7491381977yui_3_16_0_1_1451752408813_3950"><br
                                clear="none">
                            </div>
                            <div
                              id="yiv7491381977yui_3_16_0_1_1451752408813_9398">I'm
                              thinking of just making it a simple "set
                              it and forget it" api.  That is, you send
                              a message <br clear="none">
                            </div>
                            <div dir="ltr"
                              id="yiv7491381977yui_3_16_0_1_1451752408813_7749">with
                              your ramp and delay times to the GUI, and
                              you just blindly trust that the GUI will
                              make <br clear="none">
                            </div>
                            <div dir="ltr"
                              id="yiv7491381977yui_3_16_0_1_1451752408813_9399">things

                              happen in the right amount of time.  The
                              alternative I can think of is to have the
                              GUI <br clear="none">
                            </div>
                            <div dir="ltr"
                              id="yiv7491381977yui_3_16_0_1_1451752408813_7739">call
                              back when an animation is finished, but
                              that would encourage mixing the two clocks
                              <br clear="none">
                            </div>
                            <div dir="ltr">(i.e., GUI and Pd clock) in
                              unpredictable <br clear="none">
                            </div>
                            <div dir="ltr"
                              id="yiv7491381977yui_3_16_0_1_1451752408813_7740">ways.</div>
                            <div dir="ltr"
                              id="yiv7491381977yui_3_16_0_1_1451752408813_9400"><br
                                clear="none">
                            </div>
                            <div dir="ltr"
                              id="yiv7491381977yui_3_16_0_1_1451752408813_9401">Does
                              this simple approach seem like a
                              reasonable design?  The biggest problem
                              would be that <br clear="none">
                            </div>
                            <div dir="ltr"
                              id="yiv7491381977yui_3_16_0_1_1451752408813_9402">a
                              long-running animation could skew.  But in
                              that case you could probably amortize the
                              cost of</div>
                            <div dir="ltr"
                              id="yiv7491381977yui_3_16_0_1_1451752408813_9431">sending
                              more messages over the longer time period.<br
                                clear="none">
                            </div>
                            <div dir="ltr"
                              id="yiv7491381977yui_3_16_0_1_1451752408813_9403"><br
                                clear="none">
                            </div>
                            <div dir="ltr">-Jonathan<br clear="none">
                            </div>
                          </div>
                          <br clear="none">
                          <fieldset
                            class="yiv7491381977mimeAttachmentHeader"></fieldset>
                          <br clear="none">
                          <pre>_______________________________________________
<a moz-do-not-send="true" rel="nofollow" shape="rect" class="yiv7491381977moz-txt-link-abbreviated" ymailto="mailto:Pd-list@lists.iem.at" target="_blank" href="mailto:Pd-list@lists.iem.at">Pd-list@lists.iem.at</a> mailing list
UNSUBSCRIBE and account-management -> <a moz-do-not-send="true" rel="nofollow" shape="rect" class="yiv7491381977moz-txt-link-freetext" target="_blank" href="http://lists.puredata.info/listinfo/pd-list">http://lists.puredata.info/listinfo/pd-list</a>
</pre>
                        </blockquote>
                      </div>
                      <br clear="none">
                    </div>
                  </div>
                  <br clear="none">
                  <div class="yiv7491381977yqt1831210892"
                    id="yiv7491381977yqt93725">_______________________________________________<br
                      clear="none">
                    <a moz-do-not-send="true" rel="nofollow"
                      shape="rect" ymailto="mailto:Pd-list@lists.iem.at"
                      target="_blank" href="mailto:Pd-list@lists.iem.at">Pd-list@lists.iem.at</a>
                    mailing list<br clear="none">
                    UNSUBSCRIBE and account-management -> <a
                      moz-do-not-send="true" rel="nofollow" shape="rect"
                      target="_blank"
                      href="http://lists.puredata.info/listinfo/pd-list"><a class="moz-txt-link-freetext" href="http://lists.puredata.info/listinfo/pd-list">http://lists.puredata.info/listinfo/pd-list</a></a><br
                      clear="none">
                  </div>
                  <br clear="none">
                  <br clear="none">
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </blockquote>
    <br>
  </body>
</html>