mirror of
https://github.com/pcottle/learnGitBranching.git
synced 2025-06-29 01:10:04 +02:00
nice, node highlighting now
This commit is contained in:
parent
1d59152931
commit
8534bdad2c
4 changed files with 57 additions and 19 deletions
|
@ -72,15 +72,13 @@ AnimationFactory.prototype.overrideOpacityDepth3 = function(snapShot, opacity) {
|
|||
AnimationFactory.prototype.genCommitBirthClosureFromSnapshot = function(step) {
|
||||
|
||||
var time = GRAPHICS.defaultAnimationTime * 1.0;
|
||||
var bounceTime = time * 2.0;
|
||||
var bounceTime = time * 1.5;
|
||||
|
||||
var visNode = step.newCommit.get('visNode');
|
||||
var afterAttrWithOpacity = this.overrideOpacityDepth2(step.afterSnapshot[visNode.getID()]);
|
||||
var afterSnapWithOpacity = this.overrideOpacityDepth3(step.afterSnapshot);
|
||||
|
||||
var animation = function() {
|
||||
// TODO -- unhighlight old commit visnode here
|
||||
|
||||
visNode.setBirthFromSnapshot(step.beforeSnapshot);
|
||||
visNode.parentInFront();
|
||||
gitVisuals.visBranchesFront();
|
||||
|
@ -102,8 +100,34 @@ AnimationFactory.prototype.refreshTree = function(animationQueue) {
|
|||
};
|
||||
|
||||
AnimationFactory.prototype.rebaseAnimation = function(animationQueue, rebaseResponse, gitEngine) {
|
||||
this.rebaseHighlightPart(animationQueue, rebaseResponse, gitEngine);
|
||||
this.rebaseBirthPart(animationQueue, rebaseResponse, gitEngine);
|
||||
};
|
||||
|
||||
AnimationFactory.prototype.rebaseHighlightPart = function(animationQueue, rebaseResponse, gitEngine) {
|
||||
var fullTime = GRAPHICS.defaultAnimationTime * 0.66;
|
||||
var slowTime = fullTime * 2.0;
|
||||
|
||||
// we want to highlight all the old commits
|
||||
var oldCommits = rebaseResponse.toRebaseArray;//.reverse();
|
||||
var visBranch = rebaseResponse.destinationBranch.get('visBranch');
|
||||
|
||||
_.each(oldCommits, function(oldCommit) {
|
||||
var visNode = oldCommit.get('visNode');
|
||||
animationQueue.add(new Animation({
|
||||
closure: function() {
|
||||
visNode.highlightTo(visBranch, slowTime, 'easeInOut');
|
||||
},
|
||||
duration: fullTime * 1.5
|
||||
}));
|
||||
|
||||
}, this);
|
||||
|
||||
this.delay(animationQueue, fullTime * 2);
|
||||
};
|
||||
|
||||
AnimationFactory.prototype.rebaseBirthPart = function(animationQueue, rebaseResponse, gitEngine) {
|
||||
var rebaseSteps = rebaseResponse.rebaseSteps;
|
||||
// HIGHLIGHTING PART!!!!
|
||||
|
||||
var newVisNodes = [];
|
||||
_.each(rebaseSteps, function(step) {
|
||||
|
@ -133,14 +157,9 @@ AnimationFactory.prototype.rebaseAnimation = function(animationQueue, rebaseResp
|
|||
|
||||
animationQueue.add(new Animation({
|
||||
closure: animation,
|
||||
duration: GRAPHICS.defaultAnimationTime * 2
|
||||
duration: GRAPHICS.defaultAnimationTime * 1.5
|
||||
}));
|
||||
|
||||
/*
|
||||
rebaseStep.oldCommit
|
||||
rebaseStep.newCommit
|
||||
rebaseStep.beforeSnapshot
|
||||
rebaseStep.afterSnapshot*/
|
||||
previousVisNodes.push(rebaseStep.newCommit.get('visNode'));
|
||||
}, this);
|
||||
|
||||
|
|
15
src/git.js
15
src/git.js
|
@ -274,7 +274,7 @@ GitEngine.prototype.commit = function() {
|
|||
var targetCommit = this.getCommitFromRef(this.HEAD);
|
||||
// if we want to ammend, go one above
|
||||
if (this.commandOptions['--amend']) {
|
||||
targetCommit = this.resolveId('HEAD~1');
|
||||
targetCommit = this.resolveID('HEAD~1');
|
||||
}
|
||||
|
||||
var newCommit = this.makeCommit([targetCommit]);
|
||||
|
@ -288,7 +288,7 @@ GitEngine.prototype.commit = function() {
|
|||
return newCommit;
|
||||
};
|
||||
|
||||
GitEngine.prototype.resolveId = function(idOrTarget) {
|
||||
GitEngine.prototype.resolveID = function(idOrTarget) {
|
||||
if (typeof idOrTarget !== 'string') {
|
||||
return idOrTarget;
|
||||
}
|
||||
|
@ -338,7 +338,7 @@ GitEngine.prototype.resolveStringRef = function(ref) {
|
|||
};
|
||||
|
||||
GitEngine.prototype.getCommitFromRef = function(ref) {
|
||||
var start = this.resolveId(ref);
|
||||
var start = this.resolveID(ref);
|
||||
// works for both HEAD and just a single layer. aka branch
|
||||
while (start.get('type') !== 'commit') {
|
||||
start = start.get('target');
|
||||
|
@ -410,7 +410,7 @@ GitEngine.prototype.getOneBeforeCommit = function(ref) {
|
|||
// you can call this command on HEAD in detached, HEAD, or on a branch
|
||||
// and it will return the ref that is one above a commit. aka
|
||||
// it resolves HEAD to something that we can move the ref with
|
||||
var start = this.resolveId(ref);
|
||||
var start = this.resolveID(ref);
|
||||
if (start === this.HEAD && !this.getDetachedHead()) {
|
||||
start = start.get('target');
|
||||
}
|
||||
|
@ -620,6 +620,7 @@ GitEngine.prototype.rebase = function(targetSource, currentLocation) {
|
|||
}
|
||||
|
||||
var animationResponse = {};
|
||||
animationResponse.destinationBranch = this.resolveID(targetSource);
|
||||
|
||||
// now the part of actually rebasing.
|
||||
// We need to get the downstream set of targetSource first.
|
||||
|
@ -715,7 +716,7 @@ GitEngine.prototype.mergeStarter = function() {
|
|||
|
||||
// also can't merge commits directly, even though it makes sense
|
||||
_.each(this.generalArgs, function(ref) {
|
||||
if (this.resolveId(ref).get('type') == 'commit') {
|
||||
if (this.resolveID(ref).get('type') == 'commit') {
|
||||
throw new GitError({
|
||||
msg: "Can't merge a commit!"
|
||||
});
|
||||
|
@ -784,7 +785,7 @@ GitEngine.prototype.checkoutStarter = function() {
|
|||
};
|
||||
|
||||
GitEngine.prototype.checkout = function(idOrTarget) {
|
||||
var target = this.resolveId(idOrTarget);
|
||||
var target = this.resolveID(idOrTarget);
|
||||
if (target.get('id') === 'HEAD') {
|
||||
// git checkout HEAD is a
|
||||
// meaningless command but i used to do this back in the day
|
||||
|
@ -845,7 +846,7 @@ GitEngine.prototype.branch = function(name, ref) {
|
|||
|
||||
GitEngine.prototype.deleteBranch = function(name) {
|
||||
// trying to delete, lets check our refs
|
||||
var target = this.resolveId(name);
|
||||
var target = this.resolveID(name);
|
||||
if (target.get('type') !== 'branch') {
|
||||
throw new GitError({
|
||||
msg: "You can't delete things that arent branches with branch command"
|
||||
|
|
|
@ -57,9 +57,11 @@ $(document).ready(function(){
|
|||
windowResize();
|
||||
setTimeout(windowResize, 50);
|
||||
|
||||
|
||||
/*
|
||||
setTimeout(function() {
|
||||
events.trigger('submitCommandValueFromEvent', "gc; git checkout HEAD~1; git commit; git checkout -b bugFix; gc; gc; git rebase master; git checkout master; gc; gc; git merge bugFix");
|
||||
}, 500);
|
||||
}, 500);*/
|
||||
|
||||
});
|
||||
|
||||
|
|
18
src/tree.js
18
src/tree.js
|
@ -488,7 +488,7 @@ var VisNode = Backbone.Model.extend({
|
|||
r: this.getRadius(),
|
||||
fill: this.getFill(),
|
||||
'stroke-width': this.get('stroke-width'),
|
||||
'stroke': this.get('stroke')
|
||||
stroke: this.get('stroke')
|
||||
},
|
||||
text: {
|
||||
x: textPos.x,
|
||||
|
@ -498,6 +498,22 @@ var VisNode = Backbone.Model.extend({
|
|||
};
|
||||
},
|
||||
|
||||
highlightTo: function(branch, speed, easing) {
|
||||
// a small function to highlight the color of a node for demonstration purposes
|
||||
var color = branch.get('fill');
|
||||
|
||||
var attr = {
|
||||
circle: {
|
||||
fill: color,
|
||||
stroke: color,
|
||||
'stroke-width': this.get('stroke-width') * 5
|
||||
},
|
||||
text: {}
|
||||
};
|
||||
|
||||
this.animateToAttr(attr, speed, easing);
|
||||
},
|
||||
|
||||
animateUpdatedPosition: function(speed, easing) {
|
||||
var attr = this.getAttributes();
|
||||
this.animateToAttr(attr, speed, easing);
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue