lilypond-user
[Top][All Lists]
Advanced

[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]

Re: A Javascript test code for modifying ties and slurs with mouse


From: Stefano Troncaro
Subject: Re: A Javascript test code for modifying ties and slurs with mouse
Date: Sat, 14 Dec 2019 19:13:43 -0300

Hi Paolo,

Since Aaron's svg-script function creates an empty \markup, you can use the properties oddFooterMarkup and evenFooterMarkup of the \paper block to have your script embedded at the end of every page. Look:

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%
\version "2.19.83"

svg-script = #(define-scheme-function (body) (string?)
   (markup #:stencil (ly:make-stencil (list 'embedded-svg
     (string-join (list "<script type=\"text/_javascript_\"><![CDATA["
       body "]]></script>") "\n")) '(0 . 0) '(0 . 0))))

script-for-every-page = \svg-script
#"var flat = document.getElementById('flat');
   flat.style.color = 'red';
   function spin(what, amount) {
     let angle = 0.0;
     return function () {
       const bbox = what.getBBox();
       const xform = ['rotate(',
         (angle = (angle + amount) % 360.0),
         bbox.x + 0.5 * bbox.width,
         bbox.y + 0.75 * bbox.height, ')'];
       what.setAttribute('transform', xform.join(' '));
     }
   }
   setInterval(spin(flat, 5), 100);"

\paper {
  oddFooterMarkup = \script-for-every-page
  evenFooterMarkup = \script-for-every-page
}

{ g'4 a' \tweak Accidental.output-attributes #'((id . "flat")) bes'2 \pageBreak
  g'4 a' \tweak Accidental.output-attributes #'((id . "flat")) bes'2 }

%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%%

Love what your script is doing so far!

Hope that helps,
Stefano

El sáb., 14 dic. 2019 a las 18:39, Paolo Prete (<address@hidden>) escribió:
Thanks Aaron, it did the trick.

However, how can I make it work for multiple pages output?

On Sat, Dec 14, 2019 at 4:26 AM Aaron Hill <address@hidden> wrote:
On 2019-12-13 5:59 pm, Paolo Pr wrote:
> First of all, I need to add with Lilypond a <script>  tag to the svg
> file
> just before the ending </svg> tag  in the following way:
>
> 1)
> ....
>  <script xlink:href=""> > </svg>
>
> OR in the following way:
>
> 2)
> ....
> <script>
> <![CDATA[
>     ..._javascript_ code...
> ]]>
> </script>
> </svg>

Well, one could use (abuse?) the embedded-svg stencil command:

%%%%
\version "2.19.83"

svg-script = #(define-scheme-function (body) (string?)
   (markup #:stencil (ly:make-stencil (list 'embedded-svg
     (string-join (list "<script type=\"text/_javascript_\"><![CDATA["
       body "]]></script>") "\n")) '(0 . 0) '(0 . 0))))

{ g'4 a' \tweak Accidental.output-attributes #'((id . "flat")) bes'2 }

\svg-script
#"var flat = document.getElementById('flat');
   flat.style.color = 'red';
   function spin(what, amount) {
     let angle = 0.0;
     return function () {
       const bbox = what.getBBox();
       const xform = ['rotate(',
         (angle = (angle + amount) % 360.0),
         bbox.x + 0.5 * bbox.width,
         bbox.y + 0.75 * bbox.height, ')'];
       what.setAttribute('transform', xform.join(' '));
     }
   }
   setInterval(spin(flat, 5), 100);"
%%%%

This adds a top-level \markup that contains a stencil to instruct
output-svg.scm to write the specified string to the output.


-- Aaron Hill


reply via email to

[Prev in Thread] Current Thread [Next in Thread]