@@ -204,6 +204,7 @@ Item {
204204 leftMargin: contentHolder.animatedMargin
205205 rightMargin: -contentHolder.animatedMargin
206206 }
207+ visible: opacity > 0
207208 }
208209
209210 // button bar
@@ -252,10 +253,9 @@ Item {
252253 }
253254
254255 // transitions
255−
256256 function aboutToShow(duration, direction) {
257257 startContentAnimation(duration, direction)
258− startShowing(duration)
258+ startControlsAnimation(duration)
259259 }
260260
261261 function startContentAnimation(duration, direction) {
@@ -264,12 +264,12 @@ Item {
264264 contentAnimation.restart()
265265 }
266266
267− function startShowing(showDuration) {
267+ function startControlsAnimation(showDuration) {
268268 actionsShowAnimation.showDuration = showDuration
269269 actionsShowAnimation.restart()
270270 }
271271
272− SequentialAnimation {
272+ SequentialAnimation { // animation for the button bar
273273 id: actionsShowAnimation
274274 property int showDuration: 0
275275 PropertyAction {
@@ -286,12 +286,12 @@ Item {
286286 }
287287 }
288288
289− SequentialAnimation {
289+ SequentialAnimation { // animations for the content
290290 id: contentAnimation
291291 property int animationDurationBase: UbuntuAnimation.BriskDuration
292292 readonly property int additionalDuration: 200
293293 property int direction: Qt.LeftToRight
294− ScriptAction {
294+ ScriptAction { // direction of the effect
295295 script: {
296296 if (contentAnimation.direction === Qt.LeftToRight) {
297297 titleLabel.animatedMargin = -titleRect.width;
@@ -303,14 +303,14 @@ Item {
303303 }
304304 }
305305 ParallelAnimation {
306− NumberAnimation {
306+ NumberAnimation { // the slide-in animation
307307 targets: [titleLabel, content]
308308 property: 'animatedMargin'
309309 to: 0
310310 duration: contentAnimation.animationDurationBase + contentAnimation.additionalDuration
311311 easing.type: Easing.OutCubic
312312 }
313− NumberAnimation {
313+ NumberAnimation { // opacity animation
314314 targets: [titleLabel,content]
315315 property: 'opacity'
316316 from: 0