<commit_before>module.exports = function Stylebar (window) {

	// ----- Internal Properties ----- //

	var document = window.document;
	var preview = document.getElementById('preview');
	var styleBar = document.getElementById('stylebar');
	var styleSheet = document.styleSheets[1];
	var styleTools = {};

	var rules = {
		font_size: {
			type: 'class',
			classes: {
				smallest: 'smallest_font',
				small: 'small_font',
				medium: 'medium_font',
				large: 'large_font',
				largest: 'largest_font'
			}
		},
		font_colour: {
			type: 'inline',
			ruleName: 'color'
		},
		background_colour: {
			type: 'inline',
			ruleName: 'background-color'
		}
	};


	// ----- Functions ----- //

	// Listens for an event on the tool corresponding to a change.
	function action (toolName, callback) {

		var tool = styleTools[toolName];
		var eventType = tool.tagName === 'SELECT' ? 'change' : 'input';

		tool.addEventListener(eventType, function eventHandler (event) {
			callback(event.target.value);
		});

	}

	// Loads a given style into a select-element based tool.
	function loadSelect (tool, value) {

		var toolOptions = tool.options;

		for (var i = 0, length = toolOptions.length; i < length; i++) {

			if (toolOptions[i].value === value) {
				tool.selectedIndex = i;
				var changeEvent = document.createEvent("HTMLEvents");
				changeEvent.initEvent("change", false, true);
				tool.dispatchEvent(changeEvent);
			}

		}

	}

	// Loads a given style into an input-element based tool.
	function loadInput (tool, value) {

		tool.value = value;
		var inputEvent = document.createEvent("HTMLEvents");
		inputEvent.initEvent("input", false, true);
		tool.dispatchEvent(inputEvent);

	}

	// Loads up a specific style into the stylebar.
	function loadStyle (tool, value) {

		if (tool.tagName === 'SELECT') {
			loadSelect(tool, value);
		} else if (tool.tagName === 'INPUT') {
			loadInput(tool, value);
		}

	}

	// Loads a set of styles into the stylebar.
	function loadStyles (styles) {

		for (var style in styles) {

			var styleTool = styleTools[style];
			var value = styles[style];

			loadStyle(styleTool, value);

		}

	}

	// Adds a class to the preview element, removes old class.
	function setClass (style, value) {

		var classes = rules[style].classes;
		var previewClasses = preview.classList;

		for (var className in classes) {
			if (previewClasses.contains(classes[className])) {
				previewClasses.remove(classes[className]);
			}
		}

		previewClasses.add(classes[value]);

	}

	// Sets the inline style on the preview element.
	function setInline (style, value) {

		var ruleName = rules[style].ruleName;
		preview.style[ruleName] = value;

	}

	// Sets the style for a particular type of rule.
	function setStyle (style, value) {

		var ruleType = rules[style].type;<commit_msg>Fixed #6, style tools and page styles now reset for files where they have not been assigned.<commit_after>module.exports = function Stylebar (window) {

	// ----- Internal Properties ----- //

	var document = window.document;
	var preview = document.getElementById('preview');
	var styleBar = document.getElementById('stylebar');
	var styleSheet = document.styleSheets[1];
	var styleTools = {};

	var rules = {
		font_size: {
			type: 'class',
			classes: {
				smallest: 'smallest_font',
				small: 'small_font',
				medium: 'medium_font',
				large: 'large_font',
				largest: 'largest_font'
			}
		},
		font_colour: {
			type: 'inline',
			ruleName: 'color'
		},
		background_colour: {
			type: 'inline',
			ruleName: 'background-color'
		}
	};


	// ----- Functions ----- //

	// Listens for an event on the tool corresponding to a change.
	function action (toolName, callback) {

		var tool = styleTools[toolName];
		var eventType = tool.tagName === 'SELECT' ? 'change' : 'input';

		tool.addEventListener(eventType, function eventHandler (event) {
			callback(event.target.value);
		});

	}

	// Loads a given style into a select-element based tool.
	function loadSelect (tool, value) {

		var toolOptions = tool.options;

		for (var i = 0, length = toolOptions.length; i < length; i++) {

			if (toolOptions[i].value === value) {
				tool.selectedIndex = i;
				var changeEvent = document.createEvent("HTMLEvents");
				changeEvent.initEvent("change", false, true);
				tool.dispatchEvent(changeEvent);
				return;
			}

		}

	}

	// Loads a given style into an input-element based tool.
	function loadInput (tool, value) {

		tool.value = value;
		var inputEvent = document.createEvent("HTMLEvents");
		inputEvent.initEvent("input", false, true);
		tool.dispatchEvent(inputEvent);

	}

	// Loads up a specific style into the stylebar.
	function loadStyle (tool, value) {

		if (tool.tagName === 'SELECT') {
			loadSelect(tool, value);
		} else if (tool.tagName === 'INPUT') {
			loadInput(tool, value);
		}

	}

	// Converts an rgb colour to its hex equivalent.
	function rgbToHex (rgbString) {

		var rgbArray = rgbString.split('(')[1].split(')')[0].split(',');

		var hexArray = rgbArray.map(function (x) {
			return parseInt(x).toString(16);
		});

		return `#${hexArray.join('')}`;

	}

	// Resets a select element to its default value.
	function resetSelect (tool) {

		var toolOptions = tool.options;

		for (var i = 0, length = toolOptions.length; i < length; i++) {

			if (toolOptions[i].defaultSelected) {
				tool.selectedIndex = toolOptions[i].index;
				return;
			}

		}

	}

	// Resets an input element to its default value.
	function resetInput (tool, rule) {

		var value = window.getComputedStyle(preview).getPropertyValue(rule);

		if (rule === 'color' || rule === 'background-color') {
			value = rgbToHex(value);
		}

		tool.value = value;

	}

	// Resets both the style and tool to the default defined in the stylesheet.
	function resetStyle (tool, rule) {

		var ruleName = rules[rule].ruleName;

		if (rules[rule].type === 'inline') {
			preview.style.removeProperty(ruleName);
		}

		if (tool.tagName === 'SELECT') {
			resetSelect(tool);
		} else if (tool.tagName === 'INPUT') {
			resetInput(tool, ruleName);
		}

	}

	// Loads a set of styles into the stylebar.
	function loadStyles (styles) {

		for (var rule in rules) {

			var styleTool = styleTools[rule];

			if (rule in styles) {
				var value = styles[rule];
				loadStyle(styleTool, value);
			} else {
				resetStyle(styleTool, rule);
			}

		}

		// for (var style in styles) {

		// 	var styleTool = styleTools[style];
		// 	var value = styles[style];

		// 	loadStyle(styleTool, value);

		// }

	}

	// Adds a class to the preview element, removes old class.
	function setClass (style, value) {

		var classes = rules[style].classes;
		var previewClasses = preview.classList;

		for (var className in classes) {
			if (previewClasses.contains(classes[className])) {
				previewClasses.remove(classes[className]);
			}
		}

		previewClasses.add(classes[value]);

	}

	// Sets the inline style on the preview element.
	function setInline (style, value) {

		var ruleName = rules[style].ruleName;
		preview.style[ruleName] = value;

	}

	// Sets the style for a particular type of rule.
	function setStyle (style, value) {

		var ruleType = rules[style].type;
{'fraction_non_alphanumeric': 0.13767104160848925, 'fraction_numerical': 0.0013962580284836638, 'mean_word_length': 3.335956416464891, 'pattern_counts': {'":': 0, '<': 6, '<?xml version=': 0, '>': 3, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, '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': '6775634', 'n_tokens_mistral': 2587, 'n_tokens_neox': 2229, 'n_words': 632}