<commit_before><!DOCTYPE HTML>
<html>

<head>
	<!-- support for mobile touch devices -->
	<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1">
	<style>
		#app {
			font-family: "Avenir", Helvetica, Arial, sans-serif;
			-webkit-font-smoothing: antialiased;
			-moz-osx-font-smoothing: grayscale;
			text-align: center;
			color: #333;
			margin-top: 60px;
		}

		.wrapper,
		.canvas {
			width: 512px;
			margin: 0 auto;
			height: 512px;
		}

		button {
			text-transform: uppercase;
			margin: 0.5em 1em;
			border: 0;
			border-bottom: 2px solid #ccc;
			background: transparent;
			outline: 0;
			cursor: pointer;
		}

		button.is-active,
		button:hover {
			border-bottom: 2px solid #4ea;
		}
	</style>
</head>

<body>
	<div id="app">
		<h1>
			Updated API Concept
		</h1>

		<div class="wrapper" oncontextmenu="return false" unselectable="on" onselectstart="return false" onmousedown="return false">
			<button data-tool="length">Length</button>
			<button data-tool="angle">Angle</button>
			<button data-tool="wwwc">WWWC</button>
			<button data-tool="zoom">Zoom</button>
			<button data-tool="zoomTouchPinch">ZoomTouchPinch</button>
			<button data-tool="zoomMouseWheel">ZoomMouseWheel</button>

			<div class="canvas" oncontextmenu="return false" />
		</div>
	</div>
</body>

<!-- include the hammer.fakemultitouch so we can test with a mouse -->
<script src="../touch-emulator.js"></script>
<script>TouchEmulator();</script>

<!-- include the hammer.js library for touch gestures-->
<script src="../hammer.min.js"></script>

<!-- include the cornerstone library -->
<script src="../cornerstone.min.js"></script>

<script src="../cornerstoneMath.min.js"></script>


<!-- include the cornerstone tools library -->
<script src="../../dist/cornerstoneTools.js"></script>
<script>window.cornerstoneTools || document.write('<script src="https://unpkg.com/cornerstone-tools">\x3C/script>')</script>

<!-- include special code for these examples which provides images -->
<script src="../exampleImageLoader.js"></script>

<script>
	const imageId = 'example://1';
	var element = document.getElementsByClassName('canvas')[0];

	cornerstone.enable(element);

	// Todo: Marry these two?
	cornerstoneTools.mouseInput.enable(element);
	cornerstoneTools.mouseToolEventDispatcher.enable(element);
	//
	cornerstoneTools.touchInput.enable(element);
	cornerstoneTools.touchToolEventDispatcher.enable(element);
	// END NEW

	cornerstone.loadImage(imageId).then(function (image) {
		cornerstone.displayImage(element, image);
	});

	function setAllToolsPassive() {
		cornerstoneTools.store.state.tools.forEach((tool) => {
			cornerstoneTools.setToolPassive(element, tool.name)
		})
	}

	// Iterate over all tool buttons
	const toolButtons = document.querySelectorAll('button');
	Array.from(toolButtons).forEach(toolBtn => {
		// Add the tool
		const toolName = toolBtn.getAttribute('data-tool');
		const apiTool = cornerstoneTools[`${toolName}Tool`];
		if (apiTool) {
			const tool = new apiTool();
			cornerstoneTools.addTool(element, tool);
		}

		// Setup button listener
		toolBtn.addEventListener('click', (evt) => {
			setAllToolsPassive();
			cornerstoneTools.setToolActive(element, toolName, { mouseButtonMask: 1 });
		});
	});

	// Activate first tool
	cornerstoneTools.setToolActive(element, cornerstoneTools.store.state.tools[0].name, { mouseButtonMask: 1 });
</script>

</html><commit_msg>Enable mousewheel input in example<commit_after><!DOCTYPE HTML>
<html>

<head>
	<!-- support for mobile touch devices -->
	<meta name="viewport" content="user-scalable=no, width=device-width, initial-scale=1, maximum-scale=1">
	<style>
		#app {
			font-family: "Avenir", Helvetica, Arial, sans-serif;
			-webkit-font-smoothing: antialiased;
			-moz-osx-font-smoothing: grayscale;
			text-align: center;
			color: #333;
			margin-top: 60px;
		}

		.wrapper,
		.canvas {
			width: 512px;
			margin: 0 auto;
			height: 512px;
		}

		button {
			text-transform: uppercase;
			margin: 0.5em 1em;
			border: 0;
			border-bottom: 2px solid #ccc;
			background: transparent;
			outline: 0;
			cursor: pointer;
		}

		button.is-active,
		button:hover {
			border-bottom: 2px solid #4ea;
		}
	</style>
</head>

<body>
	<div id="app">
		<h1>
			Updated API Concept
		</h1>

		<div class="wrapper" oncontextmenu="return false" unselectable="on" onselectstart="return false" onmousedown="return false">
			<button data-tool="length">Length</button>
			<button data-tool="angle">Angle</button>
			<button data-tool="wwwc">WWWC</button>
			<button data-tool="zoom">Zoom</button>
			<button data-tool="zoomTouchPinch">ZoomTouchPinch</button>
			<button data-tool="zoomMouseWheel">ZoomMouseWheel</button>

			<div class="canvas" oncontextmenu="return false" />
		</div>
	</div>
</body>

<!-- include the hammer.fakemultitouch so we can test with a mouse -->
<script src="../touch-emulator.js"></script>
<script>TouchEmulator();</script>

<!-- include the hammer.js library for touch gestures-->
<script src="../hammer.min.js"></script>

<!-- include the cornerstone library -->
<script src="../cornerstone.min.js"></script>

<script src="../cornerstoneMath.min.js"></script>


<!-- include the cornerstone tools library -->
<script src="../../dist/cornerstoneTools.js"></script>
<script>window.cornerstoneTools || document.write('<script src="https://unpkg.com/cornerstone-tools">\x3C/script>')</script>

<!-- include special code for these examples which provides images -->
<script src="../exampleImageLoader.js"></script>

<script>
	const imageId = 'example://1';
	var element = document.getElementsByClassName('canvas')[0];

	cornerstone.enable(element);

	// Todo: Marry these two?
	cornerstoneTools.mouseInput.enable(element);
	cornerstoneTools.mouseToolEventDispatcher.enable(element);
	//
	cornerstoneTools.touchInput.enable(element);
	cornerstoneTools.touchToolEventDispatcher.enable(element);
	//
	cornerstoneTools.mouseWheelInput.enable(element);
	// END NEW

	cornerstone.loadImage(imageId).then(function (image) {
		cornerstone.displayImage(element, image);
	});

	function setAllToolsPassive() {
		cornerstoneTools.store.state.tools.forEach((tool) => {
			cornerstoneTools.setToolPassive(element, tool.name)
		})
	}

	// Iterate over all tool buttons
	const toolButtons = document.querySelectorAll('button');
	Array.from(toolButtons).forEach(toolBtn => {
		// Add the tool
		const toolName = toolBtn.getAttribute('data-tool');
		const apiTool = cornerstoneTools[`${toolName}Tool`];
		if (apiTool) {
			const tool = new apiTool();
			cornerstoneTools.addTool(element, tool);
		}

		// Setup button listener
		toolBtn.addEventListener('click', (evt) => {
			setAllToolsPassive();
			cornerstoneTools.setToolActive(element, toolName, { mouseButtonMask: 1 });
		});
	});

	// Activate first tool
	cornerstoneTools.setToolActive(element, cornerstoneTools.store.state.tools[0].name, { mouseButtonMask: 1 });
</script>

</html>
{'fraction_non_alphanumeric': 0.16168439206668583, 'fraction_numerical': 0.00862316757688991, 'mean_word_length': 4.432474629195941, 'pattern_counts': {'":': 0, '<': 111, '<?xml version=': 0, '>': 119, 'https://': 2, 'lorem ipsum': 0, 'www.': 2, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1752571', 'n_tokens_mistral': 2530, 'n_tokens_neox': 2240, 'n_words': 456}