Browse Source

type and drag fixes

master
Milan Pässler 8 months ago
parent
commit
23a7f2a86c
2 changed files with 9 additions and 10 deletions
  1. 1
    1
      js/routes/about.js
  2. 8
    9
      js/routes/graph.js

+ 1
- 1
js/routes/about.js View File

@@ -9,7 +9,7 @@ const aboutTemplate = (error) => html`
<div>
<h3>About deepart</h3>
<p>This project was developed by <a href="https://twitter.com/fronbasal/">@fronbasal</a>, <a href="https://twitter.com/StoneLabs__">@StoneLabs__</a> and <a href="https://twitter.com/petabyteboy/">@petabyteboy</a> for the <a href="https://opencodes.io/">OpenCodes 2018 hackathon</a> and won the "Art & Technology" category. It shines a light on the beauty of abstract art by letting the user choose from a selection of pictures to create an esthetically pleasing result.</p>
<p>The source code of the implementation is available at <a href="https://git.pbb.lc/petabyteboy/deepart.ai/">https://git.pbb.lc/petabyteboy/deepart.ai/</a> under the AGPL-3.0 License.</p>
<p>The source code of the implementation is available at <a href="https://git.pbb.lc/petabyteboy/deepart.ai/">https://git.pbb.lc/petabyteboy/deepart.ai/</a> under the AGPL-3.0 license.</p>
</div>
</section>
</div>

+ 8
- 9
js/routes/graph.js View File

@@ -37,7 +37,6 @@ export const graphRoute = () => {
handleResize();

const graphData = getGraph();
console.log(graphData);
graph = {
nodes: Object.keys(graphData.nodes).map(i => {
const node = graphData.nodes[i];
@@ -130,7 +129,7 @@ window.addEventListener('wheel', function(evt) {
});

const pinchDistance = (touchEvent) => {
return Math.abs(touchEvent.touches[0].pageX - touchEvent.touches[1].pageX) + Math.abs(touchEvent.touches[0].pageY - touchEvent.touches[1].pageY);
return Math.abs(touchEvent.touches[0].offsetX - touchEvent.touches[1].offsetX) + Math.abs(touchEvent.touches[0].offsetY - touchEvent.touches[1].offsetY);
}

const mouseDownHandler = (x, y, touchEvent) => {
@@ -148,6 +147,7 @@ const mouseDownHandler = (x, y, touchEvent) => {
view.draggedNode = nodeAt(x, y);
console.log(view);
if (view.draggedNode) {
if (!view.draggedNode.originalFy) view.draggedNode.originalFy = view.draggedNode.fy;
view.dragStartOffsetX = view.draggedNode.x;
view.dragStartOffsetY = view.draggedNode.y;
simulation.restart();
@@ -168,7 +168,6 @@ const mouseMoveHandler = (x, y, touchEvent) => {

if (view.draggedNode) {
view.draggedNode.fx = view.dragStartOffsetX - (view.dragStartMouseX - x) / view.scale;
if (!view.draggedNode.originalFy) view.draggedNode.originalFy = view.draggedNode.fy;
view.draggedNode.fy = view.dragStartOffsetY - (view.dragStartMouseY - y) / view.scale;
simulation.alpha(0.5);
} else {
@@ -198,10 +197,10 @@ const mouseUpHandler = (x, y, touchEvent) => {
if (view.clicking) handleClick(x, y);
}

window.addEventListener("touchstart", (evt) => mouseDownHandler(evt.touches[0].pageX, evt.touches[0].pageY, evt));
window.addEventListener("touchmove", (evt) => mouseMoveHandler(evt.touches[0].pageX, evt.touches[0].pageY, evt));
window.addEventListener("touchend", (evt) => mouseUpHandler(evt.changedTouches[0].pageX*dpr, evt.changedTouches[0].pageY*dpr, evt));
window.addEventListener("mousedown", (evt) => mouseDownHandler(evt.pageX, evt.pageY));
window.addEventListener("mousemove", (evt) => mouseMoveHandler(evt.pageX, evt.pageY));
window.addEventListener("mouseup", (evt) => mouseUpHandler(evt.pageX, evt.pageY));
window.addEventListener("touchstart", (evt) => mouseDownHandler(evt.touches[0].offsetX, evt.touches[0].offsetY, evt));
window.addEventListener("touchmove", (evt) => mouseMoveHandler(evt.touches[0].offsetX, evt.touches[0].offsetY, evt));
window.addEventListener("touchend", (evt) => mouseUpHandler(evt.changedTouches[0].offsetX*dpr, evt.changedTouches[0].offsetY*dpr, evt));
window.addEventListener("mousedown", (evt) => mouseDownHandler(evt.offsetX, evt.offsetY));
window.addEventListener("mousemove", (evt) => mouseMoveHandler(evt.offsetX, evt.offsetY));
window.addEventListener("mouseup", (evt) => mouseUpHandler(evt.offsetX, evt.offsetY));
window.addEventListener("resize", handleResize);

Loading…
Cancel
Save