Skip to content
This repository has been archived by the owner on Jul 29, 2019. It is now read-only.

Flicking a timeline element off of screen unable to drag other element #4294

Open
fras2560 opened this issue May 22, 2019 · 0 comments
Open

Comments

@fras2560
Copy link

fras2560 commented May 22, 2019

I created a simple example to demonstrate it. I was unable to produce the issue on code pen but probably since I cannot drag an element of the screen. The issue I have is while on Windows 10 and opening the below page in Google Chrome. I have two monitors and I open the browser in one page. I then select one of the elements and drag if quickly all the way until my cursor is off the screen. I then proceed to select the other element and drag it. It will move the timeline window instead of the element. Only after moving the window and re-selecting the element will I be able to drag it. This is currently an issue for a project I am working on. Is this an known issue, intended behavior or am I just missing an setting?

<html>
<head>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/vis/4.21.0/vis.js"></script>
	<link href="https://cdnjs.cloudflare.com/ajax/libs/vis/4.21.0/vis.css" rel="stylesheet" type="text/css"/>
</head>
<body>
	<div id="visualization"></div>
</body>
<script type="text/javascript">
	function getDayFromNow(days){
		const result = new Date();
		return result.setDate(result.getDate() + days);
	}

	function getRow(start, end, name, group){
		return {id: name,
        subgroup: group,
        start: start,
        end: end,
        title: name,
        content: name,
        orderId: group,
 		};
	}

	window.onload = function () {
		var container = document.getElementById("visualization")
		var items = new vis.DataSet([
			getRow(getDayFromNow(0), getDayFromNow(2), "A1", 1),
			getRow(getDayFromNow(4), getDayFromNow(6), "A2", 2),
		]);

		var options = {
			groupEditable: true,
			stackSubgroups:true,
			multiselect:true,
			stack: false,
			editable: {
				add: false,
				updateTime: true,
				updateGroup: false,
				remove: false,
				overrideItems: false,
			},
			groupOrder: 'weight',
			start: getDayFromNow(-10),
			end: getDayFromNow(10),
		};

		var timline = new vis.Timeline(container, items, options);
	}
</script>
</html>
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant