IWMBrowser/iwmlib
4
0
Fork 0
Code Issues 6 Pull Requests Releases Wiki Activity

Fixed doctest problems.

Browse Source
This commit is contained in:
Uwe Oestermeier
2019-07-05 14:11:43 +02:00
parent 4009ddd422
commit 8b4c6c2014
4 changed files with 23 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/scatter.html
+11 -11
View File
@@ -13,9 +13,8 @@
debugCanvas.width = main.getBoundingClientRect().width
let context = debugCanvas.getContext('2d')
context.clearRect(0, 0, debugCanvas.width, debugCanvas.height)
let stage = scatterContainer.polygon
stage.draw(context, { stroke: '#0000FF'})
stage.draw(context, { stroke: "#0000FF"})
for(let scatter of scatterContainer.scatter.values()) {
let polygon = scatter.polygon
polygon.draw(context, { stroke: '#0000FF'})
@@ -26,6 +25,7 @@
requestAnimationFrame((dt) => {
drawPolygons()
animatePolygons()
})
}
</script>
@@ -81,6 +81,8 @@ app.run()
animatePolygons()
</script>
<h1>
Interactive Content
</h1>
@@ -91,21 +93,19 @@ elements under or nearby the event position and calls the click handler. Thus ge
can be disambiguated as moves, zooms. or taps.
</p>
<div id="main2" class="grayBorder interactive" style="position: relative; width: 100%; height: 280px;">
<!-- Note that we need to set draggable to false to avoid conflicts. The DOM elements
must also be positioned absolutely. -->
<div id="contentExample" class="grayBorder interactive" style="position: relative; width: 100%; height: 280px;">
<div id="interactiveContent">
<img draggable="false" style="position: absolute;" src="examples/women.jpeg" />
<a style="position:absolute; top: 10px; right: 10px; color:white;" href="https://www.iwm-tuebingen.de" target="_blank">A Link</a>
<div onclick="alert('clicked')" style="position:absolute; top: 30px; right: 10px; color:white;">A Div with click handler</div>
<a style="position:absolute; top: 10px; right: 10px; color:white;" href="javascript:alert('test link')">A Link</a>
<div onclick="alert('div clicked')" style="position:absolute; top: 30px; right: 10px; color:white;">A Div with click handler</div>
</div>
</div>
<script class="doctest">
let app2 = new App()
let scatterContainer2 = new DOMScatterContainer(main2)
let scatter2 = new DOMScatter(interactiveContent, scatterContainer2, {
let contentContainer = new DOMScatterContainer(contentExample)
new DOMScatter(interactiveContent, contentContainer, {
x: 44,
y: 44,
width: 274,
@@ -113,7 +113,7 @@ can be disambiguated as moves, zooms. or taps.
throwVisibility: 88,
minScale: 0.5,
maxScale: 1.5})
app2.run()
</script>
</body>
lib/scatter.js
+3 -2
View File
@@ -865,10 +865,11 @@ export class DOMScatterContainer {
* @param {String} [touchAction=none] - CSS to set touch action style, needed to prevent
* pointer cancel events. Use null if the
* the touch action should not be set.
* @param {DOM node} debugCanvas - Shows debug infos about touches if not null
*/
constructor(
element,
{ stopEvents = 'auto', claimEvents = true, useCapture = true, touchAction = 'none' } = {}
{ stopEvents = 'auto', claimEvents = true, useCapture = true, touchAction = 'none', debugCanvas = null } = {}
) {
this.onCapture = null
this.element = element
@@ -900,7 +901,7 @@ export class DOMScatterContainer {
mouseWheelElement: window
})
if (typeof debugCanvas !== 'undefined') {
if (debugCanvas !== null) {
requestAnimationFrame(dt => {
this.showTouches(dt, debugCanvas)
})