View and play the waveform from right to left?

[Binah-CS]

When working with RTL languages, it would be very helpful to play a voice wave from right to left.
How can this be implemented with wavesurfer - with all the methods working correctly (regions, timeline, minimap, etc)?

[katspaugh]

Unfortunately, v7 doesn't support this. V6 did – https://wavesurfer.xyz/example/rtl/. Not sure about plugins though.

It's easy enough to fip the waveform with CSS (transform: scaleX(-1)) but mouse interactions probably assume left-to-right.

[Binah-CS]

So... if I use V6 - it will work?

…

On Tue, Mar 5, 2024 at 10:33 PM katspaugh ***@***.***> wrote: Unfortunately, v7 doesn't support this. V6 did – https://wavesurfer.xyz/example/rtl/. Not sure about plugins though. It's easy enough to fip the waveform with CSS (transform: scaleX(-1)) but mouse interactions probably assume left-to-right. — Reply to this email directly, view it on GitHub <#3579 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AZ5HZBKWU4U2IXYZ52GEN6TYWYT2FAVCNFSM6AAAAABEHW6PDOVHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM4DMOBVGI3TS> . You are receiving this because you authored the thread.Message ID: ***@***.*** com>

[omerman]

Is an RTL support planned on v7? 😢

[entonbiba]

@Binah-CS @omerman for now you can try using the css method by doing the following. It would probably need a bit of tweaking for markers and stuff but works great.

<style>
        #waveform {
            transform: scaleX(-1);
        }
        #waveform-controls {
            transform: scaleX(-1);
        }
        .marker-label {
            transform: scaleX(-1);
        }
</style>

[entonbiba]

#3729

[Binah-CS]

I'll try. We do have markers, time stamps and markups, so we need to make sure it all flips accordingly. We also have long files, so we need the scrolling to work correctly as well.

…

On Sun, Jul 7, 2024 at 11:44 PM Enton Biba ***@***.***> wrote: @Binah-CS <https://github.com/Binah-CS> @omerman <https://github.com/omerman> for now you can try using the css method by doing the following. It would probably need a bit of tweaking for markers and stuff but works great. <style> #waveform { transform: scaleX(-1); } #waveform-controls { transform: scaleX(-1); } .marker-label { transform: scaleX(-1); } </style> — Reply to this email directly, view it on GitHub <#3579 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AZ5HZBOCIY5TKEDZG7AP36TZLGSENAVCNFSM6AAAAABEHW6PDOVHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM4TSOBRGE2DK> . You are receiving this because you were mentioned.Message ID: ***@***.*** com>