events working

This commit is contained in:
Faris Ansari 2016-12-23 12:40:17 +05:30
parent 6169f11053
commit 414ebae75a
5 changed files with 76 additions and 140 deletions

View File

@ -44,24 +44,21 @@
date_format: "YYYY-MM-DD",
bar: {
height: 20
}
// events: {
// bar_on_click: function (task) {
// console.log(task);
// },
// bar_on_date_change: function(task, start, end) {
// console.log(task, start, end);
// },
// bar_on_progress_change: function(task, progress) {
// console.log(task, progress);
// },
// on_viewmode_change: function(mode) {
// console.log(mode);
// }
// }
},
on_click: function (task) {
console.log(task);
},
on_date_change: function(task, start, end) {
console.log(task, start, end);
},
on_progress_change: function(task, progress) {
console.log(task, progress);
},
on_view_change: function(mode) {
console.log(mode);
}
});
console.log(gantt_chart);
// gantt.render();
</script>
</body>
</html>

View File

@ -114,6 +114,8 @@ return /******/ (function(modules) { // webpackBootstrap
set_scale(mode);
prepare();
render();
// fire viewmode_change event
trigger_event('view_change', [mode]);
}
function prepare() {
@ -268,7 +270,6 @@ return /******/ (function(modules) { // webpackBootstrap
make_bars();
make_arrows();
map_arrows_on_bars();
setup_events();
set_width();
set_scroll_position();
bind_grid_click();
@ -342,10 +343,6 @@ return /******/ (function(modules) { // webpackBootstrap
function set_scale(scale) {
self.config.view_mode = scale;
// fire viewmode_change event
// self.events.on_viewmode_change(scale);
// trigger("view_mode_change");
if (scale === 'Day') {
self.config.step = 24;
self.config.column_width = 38;
@ -700,14 +697,6 @@ return /******/ (function(modules) { // webpackBootstrap
}
}
function setup_events() {
// this._bars.forEach(function(bar) {
// bar.events.on_date_change = me.events.bar_on_date_change;
// bar.events.on_progress_change = me.events.bar_on_progress_change;
// bar.click(me.events.bar_on_click);
// });
}
function bind_grid_click() {
self.element_groups.grid.click(function () {
self.canvas.selectAll('.bar-wrapper').forEach(function (el) {
@ -763,6 +752,13 @@ return /******/ (function(modules) { // webpackBootstrap
}
self.get_bar = get_bar; // required in Bar
function trigger_event(event, args) {
if (self.config['on_' + event]) {
self.config['on_' + event].apply(null, args);
}
}
self.trigger_event = trigger_event;
init();
return self;
@ -1240,30 +1236,13 @@ return /******/ (function(modules) { // webpackBootstrap
}
}
// function draw_invalid_bar() {
// const x = moment().startOf('day').diff(gt.gantt_start, 'hours') /
// gt.config.step * gt.config.column_width;
// gt.canvas.rect(x, self.y,
// gt.config.column_width * 2, self.height,
// self.corner_radius, self.corner_radius)
// .addClass('bar-invalid')
// .appendTo(self.bar_group);
// gt.canvas.text(
// x + gt.config.column_width,
// self.y + self.height / 2,
// 'Dates not set')
// .addClass('bar-label big')
// .appendTo(self.bar_group);
// }
function bind() {
if (self.invalid) return;
show_details();
bind_resize();
bind_drag();
bind_resize_progress();
setup_click_event();
}
function show_details() {
@ -1478,26 +1457,26 @@ return /******/ (function(modules) { // webpackBootstrap
update_details_position();
}
// function click(callback) {
// self.group.click(function () {
// if (self.action_completed) {
// // just finished a move action, wait for a few seconds
// return;
// }
// if (self.group.hasClass('active')) {
// callback(self.task);
// }
// unselect_all();
// self.group.toggleClass('active');
// });
// }
function setup_click_event() {
self.group.click(function () {
if (self.action_completed) {
// just finished a move action, wait for a few seconds
return;
}
if (self.group.hasClass('active')) {
gt.trigger_event('click', [self.task]);
}
unselect_all();
self.group.toggleClass('active');
});
}
function date_changed() {
self.events.on_date_change && self.events.on_date_change(self.task, compute_start_date(), compute_end_date());
gt.trigger_event('date_change', [self.task, compute_start_date(), compute_end_date()]);
}
function progress_changed() {
self.events.on_progress_change && self.events.on_progress_change(self.task, compute_progress());
gt.trigger_event('progress_change', [self.task, compute_progress()]);
}
function set_action_completed() {
@ -1507,12 +1486,6 @@ return /******/ (function(modules) { // webpackBootstrap
}, 2000);
}
// function compute_date(x) {
// const shift = (x - compute_x()) / gt.config.column_width;
// const date = self.task._start.clone().add(gt.config.step * shift, 'hours');
// return date;
// }
function compute_start_date() {
var bar = self.$bar,
shift = (bar.getX() - compute_x()) / gt.config.column_width,
@ -1630,11 +1603,11 @@ return /******/ (function(modules) { // webpackBootstrap
details_box && details_box.transform('t' + pos.x + ',' + pos.y);
}
// function unselect_all() {
// gt.canvas.selectAll('.bar-wrapper').forEach(function (el) {
// el.removeClass('active');
// });
// }
function unselect_all() {
gt.canvas.selectAll('.bar-wrapper').forEach(function (el) {
el.removeClass('active');
});
}
init();

File diff suppressed because one or more lines are too long

View File

@ -128,30 +128,13 @@ export default function Bar(gt, task) {
}
}
// function draw_invalid_bar() {
// const x = moment().startOf('day').diff(gt.gantt_start, 'hours') /
// gt.config.step * gt.config.column_width;
// gt.canvas.rect(x, self.y,
// gt.config.column_width * 2, self.height,
// self.corner_radius, self.corner_radius)
// .addClass('bar-invalid')
// .appendTo(self.bar_group);
// gt.canvas.text(
// x + gt.config.column_width,
// self.y + self.height / 2,
// 'Dates not set')
// .addClass('bar-label big')
// .appendTo(self.bar_group);
// }
function bind() {
if (self.invalid) return;
show_details();
bind_resize();
bind_drag();
bind_resize_progress();
setup_click_event();
}
function show_details() {
@ -358,35 +341,28 @@ export default function Bar(gt, task) {
update_details_position();
}
// function click(callback) {
// self.group.click(function () {
// if (self.action_completed) {
// // just finished a move action, wait for a few seconds
// return;
// }
// if (self.group.hasClass('active')) {
// callback(self.task);
// }
// unselect_all();
// self.group.toggleClass('active');
// });
// }
function setup_click_event() {
self.group.click(function () {
if (self.action_completed) {
// just finished a move action, wait for a few seconds
return;
}
if (self.group.hasClass('active')) {
gt.trigger_event('click', [self.task]);
}
unselect_all();
self.group.toggleClass('active');
});
}
function date_changed() {
self.events.on_date_change &&
self.events.on_date_change(
self.task,
compute_start_date(),
compute_end_date()
);
gt.trigger_event('date_change',
[self.task, compute_start_date(), compute_end_date()]);
}
function progress_changed() {
self.events.on_progress_change &&
self.events.on_progress_change(
self.task,
compute_progress()
);
gt.trigger_event('progress_change',
[self.task, compute_progress()]);
}
function set_action_completed() {
@ -394,12 +370,6 @@ export default function Bar(gt, task) {
setTimeout(() => self.action_completed = false, 2000);
}
// function compute_date(x) {
// const shift = (x - compute_x()) / gt.config.column_width;
// const date = self.task._start.clone().add(gt.config.step * shift, 'hours');
// return date;
// }
function compute_start_date() {
const bar = self.$bar,
shift = (bar.getX() - compute_x()) / gt.config.column_width,
@ -500,11 +470,11 @@ export default function Bar(gt, task) {
details_box && details_box.transform(`t${pos.x},${pos.y}`);
}
// function unselect_all() {
// gt.canvas.selectAll('.bar-wrapper').forEach(function (el) {
// el.removeClass('active');
// });
// }
function unselect_all() {
gt.canvas.selectAll('.bar-wrapper').forEach(function (el) {
el.removeClass('active');
});
}
init();

View File

@ -58,6 +58,8 @@ export default function Gantt(element, tasks, config) {
set_scale(mode);
prepare();
render();
// fire viewmode_change event
trigger_event('view_change', [mode]);
}
function prepare() {
@ -148,7 +150,6 @@ export default function Gantt(element, tasks, config) {
make_bars();
make_arrows();
map_arrows_on_bars();
setup_events();
set_width();
set_scroll_position();
bind_grid_click();
@ -203,10 +204,6 @@ export default function Gantt(element, tasks, config) {
function set_scale(scale) {
self.config.view_mode = scale;
// fire viewmode_change event
// self.events.on_viewmode_change(scale);
// trigger("view_mode_change");
if(scale === 'Day') {
self.config.step = 24;
self.config.column_width = 38;
@ -470,14 +467,6 @@ export default function Gantt(element, tasks, config) {
}
}
function setup_events() {
// this._bars.forEach(function(bar) {
// bar.events.on_date_change = me.events.bar_on_date_change;
// bar.events.on_progress_change = me.events.bar_on_progress_change;
// bar.click(me.events.bar_on_click);
// });
}
function bind_grid_click() {
self.element_groups.grid.click(() => {
self.canvas.selectAll('.bar-wrapper').forEach(el => {
@ -511,6 +500,13 @@ export default function Gantt(element, tasks, config) {
}
self.get_bar = get_bar; // required in Bar
function trigger_event(event, args) {
if(self.config['on_' + event]) {
self.config['on_' + event].apply(null, args);
}
}
self.trigger_event = trigger_event;
init();
return self;