Skip to content

Commit

Permalink
Added a new Stack animation, and did some performance oriented change…
Browse files Browse the repository at this point in the history 
…s. I believe the windows are animating more smoothly now. Also added in some fixes for the Deck animation. I didn't like how it looked before. Added support for Cinnamon 2.8
  • Loading branch information
@ConnerHansen
ConnerHansen committed Dec 12, 2015
1 parent 8a2ef26 commit 303b336
Show file tree
Hide file tree
Showing 5 changed files with 232 additions and 16 deletions.
3 changes: 2 additions & 1 deletion README.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,5 +5,6 @@ This project is for a set of workspace transitions for the Cinnamon desktop envi
- **Deck** - a card-deck like transition where the new workspace either flys in from the left or pops off to the left.
- **Flip** - a basic flipping transition, where the current workspace flips over to the new workspace.
- **Rolodex** - a rolodex style flip, hinged on the left side of the screen.
- **Slide** basic slide transition from one workspace to the next, similar to the native Cinnamon transition.
- **Slide** - basic slide transition from one workspace to the next, similar to the native Cinnamon transition.
In addition to the transition style, the easing, timing, transition fade amount, and zoom amount can all be adjusted as well.
- **Stack** - a stack-like animation that slides windows in and out based on their z-index
232 changes: 222 additions & 10 deletions extension.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -72,7 +72,9 @@ Flipper.prototype = {
imports.ui.appSwitcher.appSwitcher.primaryModifier(mask);
global.window_group.hide();

Main.getPanels().forEach(function(panel){panel.actor.opacity = 0;});
Main.getPanels().forEach(function(panel){
panel.actor.hide();
});

if (binding_type == "move" &&
window.get_window_type() !== Meta.WindowType.DESKTOP)
Expand All @@ -83,6 +85,8 @@ Flipper.prototype = {
},

const: {
STACK_DISTANCE: 400,
STACK_ANGLE: 25,
CUBE_HALF_ANGLE: 20,
CUBE_FULL_ANGLE: 50,
CUBE_START_ANGLE: 25,
Expand Down Expand Up @@ -264,6 +268,8 @@ Flipper.prototype = {
cloneMetaWindow: function(metaWindow) {
let texture =
metaWindow.get_compositor_private().get_texture();
let actor = metaWindow.get_compositor_private();

let rect = metaWindow.get_input_rect();
let windowClone = new Clutter.Clone(
{source: texture,
Expand All @@ -288,8 +294,9 @@ Flipper.prototype = {
}
}

workspaceWindows.sort(Lang.bind(this, this._sortWindow));
// workspaceWindows.sort(Lang.bind(this, this._sortWindow));
return workspaceWindows;
// return workspaceWindows.reverse();
},

_sortWindow : function(window1, window2) {
Expand Down Expand Up @@ -361,7 +368,16 @@ Flipper.prototype = {
}
this.actor.add_actor(to_workspace);
} else {
to_workspace = this.from;
// to_workspace = this.from;
to_workspace = this.get_workspace_clone
(new_workspace.index(), direction);

if (this.from) {
this.actor.remove_actor(this.from);
this.from.destroy();
}

this.actor.add_actor(to_workspace);
}


Expand Down Expand Up @@ -419,7 +435,9 @@ Flipper.prototype = {
to.set_scale(1,1);
from.set_scale(1,1);

if(settings.transitionEffect == "Flip") {
if(settings.transitionEffect == "Stack") {
this.stack_start(from, to, direction);
} else if(settings.transitionEffect == "Flip") {
this.flip_start(from, to, direction);
} else if(settings.transitionEffect == "Cube"){
this.cube_start(from, to, direction);
Expand All @@ -432,6 +450,163 @@ Flipper.prototype = {
}
},

///////////////////////////////////////////
// STACK
///////////////////////////////////////////
stack_end: function(from, to, direction) {
let angle_from;
let angle_to;
let x_pos;
let tween = {
scale_x: 1.0,
scale_y: 1.0,
transition: this.getEasing(false),
onComplete: this.unsetIsAnimating,
onCompleteScope: this
}

from.hide();
to.show();
to.raise_top();
this.new_workspace.activate(global.get_current_time());
Main.wm.showWorkspaceOSD();

if (to.workspaceWindowActors.length > 0) {

let range = this.getTime();
let startTime = this.getTime();
let delay = 0;
let step = range / to.workspaceWindowActors.length;

for(let i=0; i<to.workspaceWindowActors.length; ++i) {
let actor = to.workspaceWindowActors[i];
let to_x = actor.x;

actor.set_opacity(0);
actor.scale_center_x = actor.width / 2;
actor.scale_center_y = actor.height / 2;
actor.set_scale(settings.pullaway, settings.pullaway);

if (direction == Meta.MotionDirection.LEFT) {
actor.move_anchor_point(0, 0);
// actor.set_position(actor.x - this.const.STACK_DISTANCE, actor.y);
actor.set_position(actor.x - this.monitor.width/2, actor.y);
actor.rotation_angle_y = -this.const.STACK_ANGLE;
} else {
actor.move_anchor_point(actor.width, 0);
// actor.set_position(actor.x + this.const.STACK_DISTANCE, actor.y);
actor.set_position(actor.x + this.monitor.width/2, actor.y);
actor.rotation_angle_y = this.const.STACK_ANGLE;
to_x += actor.width;
}

tween.x = to_x;
tween.delay = delay;
tween.time = startTime;
tween.opacity = 255;
tween.rotation_angle_y = 0;

// is this the last entry?
if (i == to.workspaceWindowActors.length-1) {
tween.onComplete = this.unsetIsAnimating;
tween.onCompleteScope = this;
} else {
delete tween.onComplete;
delete tween.onCompleteScope;
}

Tweener.addTween(actor, tween);
delay += step;
}
} else {
Tweener.addTween(to, tween);
}
},

stack_start: function(from, to, direction) {
let angle_from;
let angle_to;
let x_pos;

to.hide();

if (direction == Meta.MotionDirection.LEFT) {
angle_from = this.const.FLIP_ANGLE;
angle_to = 0;
} else {
angle_from = -this.const.FLIP_ANGLE;
angle_to = 0;
}


if (from.workspaceWindowActors.length > 0) {

let range = this.getTime();
let startTime = this.getTime();
let delay = 0;
let step = range / from.workspaceWindowActors.length;

for(let i=from.workspaceWindowActors.length-1; i>=0; --i) {
let actor = from.workspaceWindowActors[i];

if (direction == Meta.MotionDirection.LEFT) {
actor.move_anchor_point(actor.width, 0);
// x_pos = actor.x + this.const.STACK_DISTANCE;
x_pos = actor.x + this.monitor.width/2;
angle_to = this.const.STACK_ANGLE;

actor.scale_center_x = actor.width / 2;
actor.scale_center_y = actor.height / 2;
} else {
actor.move_anchor_point(0, 0);
// x_pos = actor.x - this.const.STACK_DISTANCE;
x_pos = actor.x - this.monitor.width/2;
angle_to = -this.const.STACK_ANGLE;

actor.scale_center_x = actor.width / 2;
actor.scale_center_y = actor.height / 2;
}

if (i == 0) {
Tweener.addTween(actor, {
x: x_pos,
scale_x: settings.pullaway,
scale_y: settings.pullaway,
delay: delay,
rotation_angle_y: angle_to,
opacity: 0,
transition: this.getEasing(true),
time: startTime,
onCompleteParams: [from, to, direction],
onComplete: this.stack_end,
onCompleteScope: this
});
} else {
Tweener.addTween(actor, {
x: x_pos,
scale_x: settings.pullaway,
scale_y: settings.pullaway,
delay: delay,
rotation_angle_y: angle_to,
opacity: 0,
transition: this.getEasing(true),
time: startTime
});
}

// startTime -= step;
delay += step;
}
} else {
Tweener.addTween(to, {
time: this.getTime(),
onCompleteParams: [from, to, direction],
onComplete: this.stack_end,
onCompleteScope: this
});
}
},

///////////////////////////////////////////
// FLIP
///////////////////////////////////////////
Expand Down Expand Up @@ -620,6 +795,7 @@ Flipper.prototype = {
let toTransition;
let fromTransition;
this.new_workspace.activate(global.get_current_time());
to.show();

if (direction == Meta.MotionDirection.LEFT) {
Tweener.addTween(to, {
Expand All @@ -635,12 +811,20 @@ Flipper.prototype = {
onCompleteScope: this
});
} else {
Tweener.addTween(to, {
opacity: 255,
scale_x: 1.0,
scale_y: 1.0,
transition: this.getEasing(false),
time: this.getTime()
});

Tweener.addTween(from, {
x: -this.monitor.width,
brightness: 1.0,
scale_x: this.getScale(),
scale_y: this.getScale(),
opacity: 255 * (1.0 - settings.fade),
opacity: 0,
transition: this.getEasing(false),
time: this.getTime(),
onComplete: this.unsetIsAnimating,
Expand All @@ -662,6 +846,8 @@ Flipper.prototype = {
to.raise_top();
from.set_position(0, this.monitor.height/2 );
from.rotation_angle_y = 0;
from.scale_center_y = 0;
from.scale_center_x = this.monitor.width/2;

to.set_position(-this.monitor.width, this.monitor.height/2 - this.const.DECK_HEIGHT);
to.rotation_angle_y = -this.const.DECK_ANGLE;
Expand All @@ -670,9 +856,17 @@ Flipper.prototype = {
to.set_scale(this.getScale(), this.getScale());
to.set_opacity(0);

Tweener.addTween(from, {
opacity: 0,
scale_x: this.getHalfScale(),
scale_y: this.getHalfScale(),
transition: this.getEasing(true),
time: this.getTime()
})

Tweener.addTween(to, {
x: toTransition,
opacity: 255 * (1.0 - settings.fade),
opacity: 255,
scale_x: this.getHalfScale(),
scale_y: this.getHalfScale(),
transition: this.getEasing(true),
Expand All @@ -682,13 +876,27 @@ Flipper.prototype = {
onCompleteScope: this
});
} else {
from.raise_top();
from.set_position(0, this.monitor.height/2);
from.rotation_angle_y = 0
from.rotation_angle_y = 0;

to.set_position(0, this.monitor.height/2);
to.rotation_angle_y = 0

fromTransition = -this.monitor.width/2;
to.set_opacity(0);
to.set_scale(this.getScale(), this.getScale());
to.scale_center_y = 0;
to.scale_center_x = this.monitor.width/2;

Tweener.addTween(to, {
opacity: 255,
scale_x: this.getHalfScale(),
scale_y: this.getHalfScale(),
transition: this.getEasing(true),
time: this.getTime()
});

Tweener.addTween(from, {
x: fromTransition,
y: this.monitor.height/2 - this.const.DECK_HEIGHT,
Expand Down Expand Up @@ -927,15 +1135,15 @@ Flipper.prototype = {
///////////////////////////////////////////

unsetIsAnimating: function() {
this.from.hide();
// this.from.hide();
this.is_animating = false;


if( this.queued_action ){
let action = this.queued_action;
this.queued_action = null;
this.processKeypress( action );
} else if( this.destroy_requested ) {
global.log("destroy");
this.onDestroy();
}
},
Expand Down Expand Up @@ -970,6 +1178,7 @@ Flipper.prototype = {
this.startAnimate(this.direction);
break;
}

},

_keyPressEvent: function(actor, event) {
Expand Down Expand Up @@ -1052,7 +1261,10 @@ Flipper.prototype = {
Main.uiGroup.remove_actor(this._backgroundGroup);
Main.uiGroup.remove_actor(this.actor);

Main.getPanels().forEach(function(panel){panel.actor.opacity = 255;});
Main.getPanels().forEach(function(panel){
panel.actor.show();
});

global.window_group.show();
this.actor.destroy();
global.log("destroy done");
Expand Down
3 changes: 2 additions & 1 deletion metadata.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,8 @@
"2.2",
"2.3",
"2.4",
"2.6"
"2.6",
"2.8"
],
"url": "https://github.com/ConnerHansen/Flipper",
"uuid": "Flipper@connerdev",
Expand Down
1 change: 1 addition & 0 deletions release.rb
View file
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
# Usage: ruby release.rb 0.xx
version = ARGV.first
Dir.chdir "../"
puts `zip -r Flipper@connerdev_#{version}.zip Flipper@connerdev/extension.js Flipper@connerdev/metadata.json Flipper@connerdev/settings-schema.json`
Loading

0 comments on commit 303b336

Please sign in to comment.