dots-viewer: Add dragscroll support for better UX

Patch suggested by Rubén Gonzalez

Part-of: <https://gitlab.freedesktop.org/gstreamer/gstreamer/-/merge_requests/7999>
This commit is contained in:
Thibault Saunier 2025-02-14 10:39:24 -03:00 committed by GStreamer Marge Bot
parent fcfa668a27
commit 1f7b6fea6d

View File

@ -43,7 +43,7 @@ furnished to do so, subject to the following conditions:
<body> <body>
<h1 style="text-align: center" id="title"> {{ TITLE }}</h1> <h1 style="text-align: center" id="title"> {{ TITLE }}</h1>
<div id="graph" style="width: 100%; height: 100%; overflow: scroll;"></div> <div id="graph" class="dragscroll" style="width: 100%; height: 100%; overflow: scroll;"></div>
<div class="floating-rectangle" id="instructions"> <div class="floating-rectangle" id="instructions">
Click node to highlight<br/>Shift-Ctrl-scroll or w/s to zoom<br/>Esc to unhighlight Click node to highlight<br/>Shift-Ctrl-scroll or w/s to zoom<br/>Esc to unhighlight
</div> </div>
@ -54,6 +54,7 @@ furnished to do so, subject to the following conditions:
<script type="text/javascript" src="https://cdn.rawgit.com/jquery/jquery-mousewheel/master/jquery.mousewheel.min.js"></script> <script type="text/javascript" src="https://cdn.rawgit.com/jquery/jquery-mousewheel/master/jquery.mousewheel.min.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/jquery/jquery-color/master/jquery.color.js"></script> <script type="text/javascript" src="https://cdn.rawgit.com/jquery/jquery-color/master/jquery.color.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.4/js/bootstrap.min.js"></script> <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.4/js/bootstrap.min.js"></script>
<script type="text/javascript" src="http://asvd.github.io/dragscroll/dragscroll.js"></script>
<script type="text/javascript" src="/js/jquery.graphviz.svg.js"></script> <script type="text/javascript" src="/js/jquery.graphviz.svg.js"></script>
<script type="text/javascript"> <script type="text/javascript">
let url = new URL(window.location.href); let url = new URL(window.location.href);