Remove jquery from ToolController.js

This commit is contained in:
Julian Descottes 2018-04-08 13:00:50 +02:00
parent 0a9e7dcffb
commit a9cdf98281

View File

@ -35,7 +35,8 @@
// Set SimplePen as default selected tool: // Set SimplePen as default selected tool:
this.selectTool_(this.tools[0]); this.selectTool_(this.tools[0]);
// Activate listener on tool panel: // Activate listener on tool panel:
$('#tool-section').mousedown($.proxy(this.onToolIconClicked_, this)); var toolSection = document.querySelector('#tool-section');
toolSection.addEventListener('mousedown', this.onToolIconClicked_.bind(this));
$.subscribe(Events.SELECT_TOOL, this.onSelectToolEvent_.bind(this)); $.subscribe(Events.SELECT_TOOL, this.onSelectToolEvent_.bind(this));
$.subscribe(Events.SHORTCUTS_CHANGED, this.createToolsDom_.bind(this)); $.subscribe(Events.SHORTCUTS_CHANGED, this.createToolsDom_.bind(this));
@ -45,14 +46,14 @@
* @private * @private
*/ */
ns.ToolController.prototype.activateToolOnStage_ = function(tool) { ns.ToolController.prototype.activateToolOnStage_ = function(tool) {
var stage = $('body'); var stage = document.body;
var previousSelectedToolClass = stage.data('selected-tool-class'); var previousSelectedToolClass = stage.dataset.selectedToolClass;
if (previousSelectedToolClass) { if (previousSelectedToolClass) {
stage.removeClass(previousSelectedToolClass); stage.classList.remove(previousSelectedToolClass);
stage.removeClass(pskl.tools.drawing.Move.TOOL_ID); stage.classList.remove(pskl.tools.drawing.Move.TOOL_ID);
} }
stage.addClass(tool.toolId); stage.classList.add(tool.toolId);
stage.data('selected-tool-class', tool.toolId); stage.dataset.selectedToolClass = tool.toolId;
}; };
ns.ToolController.prototype.onSelectToolEvent_ = function(event, toolId) { ns.ToolController.prototype.onSelectToolEvent_ = function(event, toolId) {
@ -69,11 +70,13 @@
this.currentSelectedTool = tool; this.currentSelectedTool = tool;
this.activateToolOnStage_(this.currentSelectedTool); this.activateToolOnStage_(this.currentSelectedTool);
var selectedToolElement = $('#tool-section .tool-icon.selected'); var selectedToolElement = document.querySelector('#tool-section .tool-icon.selected');
var toolElement = $('[data-tool-id=' + tool.toolId + ']'); if (selectedToolElement) {
selectedToolElement.classList.remove('selected');
}
selectedToolElement.removeClass('selected'); var toolElement = document.querySelector('[data-tool-id=' + tool.toolId + ']');
toolElement.addClass('selected'); toolElement.classList.add('selected');
$.publish(Events.TOOL_SELECTED, [tool]); $.publish(Events.TOOL_SELECTED, [tool]);
}; };
@ -82,11 +85,11 @@
* @private * @private
*/ */
ns.ToolController.prototype.onToolIconClicked_ = function(evt) { ns.ToolController.prototype.onToolIconClicked_ = function(evt) {
var target = $(evt.target); var target = evt.target;
var clickedTool = target.closest('.tool-icon'); var clickedTool = pskl.utils.Dom.getParentWithData(target, 'toolId');
if (clickedTool.length) { if (clickedTool) {
var toolId = clickedTool.data().toolId; var toolId = clickedTool.dataset.toolId;
var tool = this.getToolById_(toolId); var tool = this.getToolById_(toolId);
if (tool) { if (tool) {
this.selectTool_(tool); this.selectTool_(tool);
@ -116,7 +119,7 @@
var tool = this.tools[i]; var tool = this.tools[i];
html += this.toolIconBuilder.createIcon(tool); html += this.toolIconBuilder.createIcon(tool);
} }
$('#tools-container').html(html); document.querySelector('#tools-container').innerHTML = html;
}; };
ns.ToolController.prototype.addKeyboardShortcuts_ = function () { ns.ToolController.prototype.addKeyboardShortcuts_ = function () {