/bower_components/drawingboard.js/js/controls/navigation.js |
@@ -0,0 +1,63 @@ |
DrawingBoard.Control.Navigation = DrawingBoard.Control.extend({ |
|
name: 'navigation', |
|
defaults: { |
back: true, |
forward: true, |
reset: true |
}, |
|
initialize: function() { |
var el = ''; |
if (this.opts.back) el += '<button class="drawing-board-control-navigation-back">←</button>'; |
if (this.opts.forward) el += '<button class="drawing-board-control-navigation-forward">→</button>'; |
if (this.opts.reset) el += '<button class="drawing-board-control-navigation-reset">×</button>'; |
this.$el.append(el); |
|
if (this.opts.back) { |
var $back = this.$el.find('.drawing-board-control-navigation-back'); |
this.board.ev.bind('historyNavigation', $.proxy(this.updateBack, this, $back)); |
this.$el.on('click', '.drawing-board-control-navigation-back', $.proxy(function(e) { |
this.board.goBackInHistory(); |
e.preventDefault(); |
}, this)); |
|
this.updateBack($back); |
} |
|
if (this.opts.forward) { |
var $forward = this.$el.find('.drawing-board-control-navigation-forward'); |
this.board.ev.bind('historyNavigation', $.proxy(this.updateForward, this, $forward)); |
this.$el.on('click', '.drawing-board-control-navigation-forward', $.proxy(function(e) { |
this.board.goForthInHistory(); |
e.preventDefault(); |
}, this)); |
|
this.updateForward($forward); |
} |
|
if (this.opts.reset) { |
this.$el.on('click', '.drawing-board-control-navigation-reset', $.proxy(function(e) { |
this.board.reset({ background: true }); |
e.preventDefault(); |
}, this)); |
} |
}, |
|
updateBack: function($back) { |
if (this.board.history.canUndo()) { |
$back.removeAttr('disabled'); |
} else { |
$back.attr('disabled', 'disabled'); |
} |
}, |
|
updateForward: function($forward) { |
if (this.board.history.canRedo()) { |
$forward.removeAttr('disabled'); |
} else { |
$forward.attr('disabled', 'disabled'); |
} |
} |
}); |