add move up button to default tunes area

This commit is contained in:
Murod Khaydarov 2018-06-20 00:36:11 +03:00
commit 7945bcee30
No known key found for this signature in database
GPG key ID: C480BA53A8D274C5
8 changed files with 115 additions and 84 deletions

View file

@ -931,13 +931,11 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } /**
*
* @class MoveUpTune
* @classdesc Editor's default tune that moves up selected block
*/
/**
*
*/
var MoveUpTune = function (_BlockTune) {
_inherits(MoveUpTune, _BlockTune);
@ -947,6 +945,7 @@ var MoveUpTune = function (_BlockTune) {
return _possibleConstructorReturn(this, (MoveUpTune.__proto__ || Object.getPrototypeOf(MoveUpTune)).call(this, state));
}
/**
* Create "MoveUp" button and add click event listener
* @returns [Element}
*/
@ -958,8 +957,19 @@ var MoveUpTune = function (_BlockTune) {
textContent: 'Her'
});
moveUpButton.addEventListener('click', this.handle, false);
return moveUpButton;
}
/**
* Move current block up
* @param {Event} event
*/
}, {
key: 'handle',
value: function handle(event) {
console.log('hey');
}
}]);
return MoveUpTune;
@ -983,7 +993,7 @@ module.exports = exports['default'];
Object.defineProperty(exports, "__esModule", {
value: true
value: true
});
var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
@ -992,24 +1002,38 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
/**
* BlockTune abstract class
*
* All tunes must expand this class
*/
var BlockTune = function () {
function BlockTune(state) {
_classCallCheck(this, BlockTune);
/**
* Tune's state
* @param {Object} state
*/
function BlockTune(state) {
_classCallCheck(this, BlockTune);
this.state = state;
}
/**
* @return {Element}
*/
this.state = state;
}
/**
* @return {Element}
*/
_createClass(BlockTune, [{
key: "render",
value: function render() {}
}]);
_createClass(BlockTune, [{
key: "render",
value: function render() {}
/**
* Handle click event
* @param {Event} event
*/
return BlockTune;
}, {
key: "handle",
value: function handle(event) {}
}]);
return BlockTune;
}();
BlockTune.displayName = "BlockTune";
@ -1203,11 +1227,24 @@ var Block = function () {
return data;
}
/**
* Make an array with default settings
* Each block has default tune instance that have states
* @return {*[]}
*/
}, {
key: 'makeTunes',
value: function makeTunes() {
return [new _blockTuneMoveUp2.default(this.settings)];
}
/**
* Enumerates initialized tunes and returns fragment that can be appended to the toolbars area
* @return {DocumentFragment}
*/
}, {
key: 'renderTunes',
value: function renderTunes() {
@ -1217,7 +1254,6 @@ var Block = function () {
$.append(tunesElement, tune.render());
});
console.log(tunesElement);
return tunesElement;
}
@ -3984,10 +4020,6 @@ var BlockSettings = function (_Module) {
}, {
key: 'addToolSettings',
value: function addToolSettings() {}
// console.log('Block Settings: add settings for ',
// this.Editor.BlockManager.currentBlock
// );
/**
* Add default settings
@ -3996,33 +4028,7 @@ var BlockSettings = function (_Module) {
}, {
key: 'addDefaultSettings',
value: function addDefaultSettings() {
var _this2 = this;
this.Editor.BlockManager.currentBlock.renderTunes();
/**
* Remove Block Button
* --------------------------------------------
*/
this.nodes.buttonRemove = $.make('div', BlockSettings.CSS.button, {
textContent: 'Remove Block'
});
$.append(this.nodes.defaultSettings, this.nodes.buttonRemove);
this.Editor.Listeners.on(this.nodes.buttonRemove, 'click', function (event) {
return _this2.removeBlockButtonClicked(event);
});
}
/**
* Clicks on the Remove Block Button
*/
}, {
key: 'removeBlockButtonClicked',
value: function removeBlockButtonClicked() {
console.log('❇️ Remove Block Button clicked');
$.append(this.nodes.defaultSettings, this.Editor.BlockManager.currentBlock.renderTunes());
}
/**

File diff suppressed because one or more lines are too long

View file

@ -1,15 +1,14 @@
/**
*
* @class MoveUpTune
* @classdesc Editor's default tune that moves up selected block
*/
import BlockTune from './block-tune';
/**
*
*/
export default class MoveUpTune extends BlockTune {
constructor(state) {
super(state);
}
/**
* Create "MoveUp" button and add click event listener
* @returns [Element}
*/
render() {
@ -17,6 +16,14 @@ export default class MoveUpTune extends BlockTune {
textContent: 'Her'
});
moveUpButton.addEventListener('click', this.handle, false);
return moveUpButton;
}
/**
* Move current block up
* @param {Event} event
*/
handle(event) {
console.log('hey');
}
}

View file

@ -1,20 +1,19 @@
/**
*
* @class MoveUpTune
* @classdesc Editor's default tune that moves up selected block
*/
import BlockTune from './block-tune';
declare var $: any;
declare var _: any;
/**
*
*/
export default class MoveUpTune extends BlockTune {
constructor(state) {
super(state);
}
/**
* Create "MoveUp" button and add click event listener
* @returns [Element}
*/
render() {
@ -23,6 +22,15 @@ export default class MoveUpTune extends BlockTune {
textContent: 'Her'
});
moveUpButton.addEventListener('click', this.handle, false);
return moveUpButton;
}
/**
* Move current block up
* @param {Event} event
*/
handle(event) {
console.log("hey");
}
}

View file

@ -1,7 +1,13 @@
/**
* BlockTune abstract class
*
* All tunes must expand this class
*/
export default class BlockTune {
/**
* Tune's state
* @param {Object} state
*/
constructor(state) {
this.state = state;
}
@ -9,4 +15,9 @@ export default class BlockTune {
* @return {Element}
*/
render() { }
/**
* Handle click event
* @param {Event} event
*/
handle(event) { }
}

View file

@ -1,10 +1,16 @@
/**
* BlockTune abstract class
*
* All tunes must expand this class
*/
export default class BlockTune {
state: any;
/**
* Tune's state
* @param {Object} state
*/
constructor(state) {
this.state = state;
}
@ -13,4 +19,10 @@ export default class BlockTune {
* @return {Element}
*/
render() {}
/**
* Handle click event
* @param {Event} event
*/
handle(event) {}
}

View file

@ -168,6 +168,11 @@ export default class Block {
return data;
}
/**
* Make an array with default settings
* Each block has default tune instance that have states
* @return {*[]}
*/
makeTunes() {
return [
new MoveUpTune(this.settings),
@ -175,6 +180,10 @@ export default class Block {
];
}
/**
* Enumerates initialized tunes and returns fragment that can be appended to the toolbars area
* @return {DocumentFragment}
*/
renderTunes() {
let tunesElement = document.createDocumentFragment();
@ -182,7 +191,6 @@ export default class Block {
$.append(tunesElement, tune.render());
});
console.log(tunesElement);
return tunesElement;
}

View file

@ -57,35 +57,14 @@ export default class BlockSettings extends Module {
* Add Tool's settings
*/
addToolSettings() {
// console.log('Block Settings: add settings for ',
// this.Editor.BlockManager.currentBlock
// );
}
/**
* Add default settings
*/
addDefaultSettings() {
this.Editor.BlockManager.currentBlock.renderTunes();
/**
* Remove Block Button
* --------------------------------------------
*/
this.nodes.buttonRemove = $.make('div', BlockSettings.CSS.button, {
textContent: 'Remove Block'
});
$.append(this.nodes.defaultSettings, this.nodes.buttonRemove);
this.Editor.Listeners.on(this.nodes.buttonRemove, 'click', (event) => this.removeBlockButtonClicked(event));
}
/**
* Clicks on the Remove Block Button
*/
removeBlockButtonClicked() {
console.log('❇️ Remove Block Button clicked');
$.append(this.nodes.defaultSettings, this.Editor.BlockManager.currentBlock.renderTunes());
}
/**