Some icons moved from sprite. Ui::WidgetFadeWrap() effect added.

Telegram/Resources/basic.style

@@ -346,10 +346,10 @@ versionColor: #777;
 shadowColor: rgba(0, 0, 0, 24);
 shadowToggleDuration: 200;
 
-slideDuration: 240;
+slideDuration: 2400;
 slideShift: 100px;
 slideFadeOut: 0.3;
-slideShadow: sprite(348px, 71px, 48px, 1px);
+slideShadow: icon {{ "slide_shadow", #000000 }};
 slideFunction: transition(easeOutCirc);
 
 btnDefIconed: iconedButton {
@@ -695,24 +695,29 @@ introErrLabel: flatLabel(labelDefFlat) {
 	font: introErrFont;
 	align: align(center);
 }
+introBackButton: IconButton {
+	width: 40px;
+	height: 40px;
+
+	opacity: 0.71;
+	overOpacity: 1.;
+
+	icon: icon {
+		{ size(40px, 40px), #eeeeee },
+		{ "intro_back_button", #969696, point(12px, 12px) },
+	};
+	iconPosition: point(0px, 0px);
+	downIconPosition: point(0px, 0px);
+
+	duration: 150;
+}
+introBackPosition: point(32px, 32px);
 
 setLittleSkip: 9px;
 setScroll: flatScroll(scrollDef) {
 	bottomsh: 0px;
 	topsh: 0px;
 }
-setClose: iconedButton(btnDefIconed) {
-	icon: sprite(245px, 221px, 40px, 40px);
-	iconPos: point(0px, 0px);
-	downIcon: sprite(245px, 221px, 40px, 40px);
-	downIconPos: point(0px, 0px);
-
-	opacity: 0.71;
-
-	width: 43px;
-	height: 43px;
-}
-setClosePos: point(32px, 32px);
 setPhotoDuration: 150;
 
 setErrColor: #d84d4d;
@@ -1043,11 +1048,6 @@ msgFileOutBg: #78c67f;
 msgFileOutBgOver: #6bc272;
 msgFileOutBgSelected: #5fb389;
 
-msgFileRed: sprite(0px, 425px, 20px, 20px);
-msgFileYellow: sprite(20px, 425px, 20px, 20px);
-msgFileGreen: sprite(40px, 425px, 20px, 20px);
-msgFileBlue: sprite(60px, 425px, 20px, 20px);
-
 msgFileOverDuration: 200;
 msgFileRadialLine: 3px;
 
@@ -1393,7 +1393,7 @@ connectionPasswordInputField: InputField(defaultInputField) {
 }
 connectionIPv6Skip: 11px;
 
-aboutIcon: sprite(0px, 0px, 104px, 104px);
+aboutIcon: icon {{ "intro_logo", #008ed5 }};
 aboutWidth: 390px;
 aboutVersionTop: -3px;
 aboutVersionLink: linkButton(btnDefLink) {

Telegram/SourceFiles/boxes/contactsbox.cpp

@@ -32,7 +32,7 @@ Copyright (c) 2014-2016 John Preston, https://desktop.telegram.org
 #include "application.h"
 #include "ui/filedialog.h"
 #include "ui/widgets/multi_select.h"
-#include "ui/widgets/widget_slide_wrap.h"
+#include "ui/effects/widget_slide_wrap.h"
 #include "boxes/photocropbox.h"
 #include "boxes/confirmbox.h"
 #include "observer_peer.h"

Telegram/SourceFiles/dialogswidget.cpp

@@ -2506,7 +2506,7 @@ void DialogsWidget::paintEvent(QPaintEvent *e) {
 		}
 		p.drawPixmap(QRect(a_coordOver.current(), 0, _cacheOver.width() / retina, _cacheOver.height() / retina), _cacheOver, QRect(0, 0, _cacheOver.width(), _cacheOver.height()));
 		p.setOpacity(a_progress.current());
-		p.drawPixmap(QRect(a_coordOver.current() - st::slideShadow.pxWidth(), 0, st::slideShadow.pxWidth(), _cacheOver.height() / retina), App::sprite(), st::slideShadow.rect());
+		st::slideShadow.fill(p, QRect(a_coordOver.current() - st::slideShadow.width(), 0, st::slideShadow.width(), _cacheOver.height() / retina));
 		return;
 	}
 	QRect above(0, 0, width(), _scroll.y());

Telegram/SourceFiles/historywidget.cpp

@@ -6253,7 +6253,7 @@ void HistoryWidget::paintTopBar(Painter &p, float64 over, int32 decreaseWidth) {
 		}
 		p.drawPixmap(QRect(a_coordOver.current(), 0, _cacheOver.width() / retina, st::topBarHeight), _cacheOver, QRect(0, 0, _cacheOver.width(), st::topBarHeight * retina));
 		p.setOpacity(a_progress.current());
-		p.drawPixmap(QRect(a_coordOver.current() - st::slideShadow.pxWidth(), 0, st::slideShadow.pxWidth(), st::topBarHeight), App::sprite(), st::slideShadow.rect());
+		st::slideShadow.fill(p, QRect(a_coordOver.current() - st::slideShadow.width(), 0, st::slideShadow.width(), st::topBarHeight));
 		return;
 	}
 
@@ -8729,7 +8729,7 @@ void HistoryWidget::paintEvent(QPaintEvent *e) {
 		}
 		p.drawPixmap(QRect(a_coordOver.current(), 0, _cacheOver.width() / retina, height()), _cacheOver, QRect(0, inCacheTop * retina, _cacheOver.width(), height() * retina));
 		p.setOpacity(a_progress.current());
-		p.drawPixmap(QRect(a_coordOver.current() - st::slideShadow.pxWidth(), 0, st::slideShadow.pxWidth(), height()), App::sprite(), st::slideShadow.rect());
+		st::slideShadow.fill(p, QRect(a_coordOver.current() - st::slideShadow.width(), 0, st::slideShadow.width(), height()));
 		return;
 	}
 

Telegram/SourceFiles/intro/introstart.cpp

@@ -72,7 +72,7 @@ void IntroStart::paintEvent(QPaintEvent *e) {
 	p.setPen(st::introColor->p);
 	p.drawText((width() - _headerWidth) / 2, hy, qsl("Telegram Desktop"));
 
-	p.drawSprite(QPoint((width() - st::aboutIcon.pxWidth()) / 2, hy - st::introIconSkip - st::aboutIcon.pxHeight()), st::aboutIcon);
+	st::aboutIcon.paint(p, QPoint((width() - st::aboutIcon.width()) / 2, hy - st::introIconSkip - st::aboutIcon.height()), width());
 }
 
 void IntroStart::resizeEvent(QResizeEvent *e) {

Telegram/SourceFiles/intro/introwidget.cpp

@@ -32,22 +32,24 @@ Copyright (c) 2014-2016 John Preston, https://desktop.telegram.org
 #include "mainwindow.h"
 #include "application.h"
 #include "ui/text/text.h"
+#include "ui/buttons/icon_button.h"
+#include "ui/effects/widget_fade_wrap.h"
 
 IntroWidget::IntroWidget(QWidget *parent) : TWidget(parent)
 , _a_stage(animation(this, &IntroWidget::step_stage))
 , _a_show(animation(this, &IntroWidget::step_show))
-, _back(this, st::setClose) {
+, _back(this, new Ui::IconButton(this, st::introBackButton), base::lambda_unique<void()>(), st::introSlideDuration) {
 	setGeometry(QRect(0, st::titleHeight, App::wnd()->width(), App::wnd()->height() - st::titleHeight));
 
-	connect(&_back, SIGNAL(clicked()), this, SLOT(onBack()));
-	_back.hide();
+	_back->entity()->setClickedCallback([this] { onBack(); });
+	_back->hideFast();
 
 	_countryForReg = psCurrentCountry();
 
 	MTP::send(MTPhelp_GetNearestDc(), rpcDone(&IntroWidget::gotNearestDC));
 
 	_stepHistory.push_back(new IntroStart(this));
-	_back.raise();
+	_back->raise();
 
 	connect(parent, SIGNAL(resized(const QSize&)), this, SLOT(onParentResize(const QSize&)));
 
@@ -56,7 +58,7 @@ IntroWidget::IntroWidget(QWidget *parent) : TWidget(parent)
 
 	cSetPasswordRecovered(false);
 
-	_back.move(st::setClosePos.x(), st::setClosePos.y());
+	_back->moveToLeft(st::introBackPosition.x(), st::introBackPosition.y());
 
 #ifndef TDESKTOP_DISABLE_AUTOUPDATE
 	Sandbox::startUpdateCheck();
@@ -132,17 +134,17 @@ void IntroWidget::historyMove(MoveType type) {
 	_a_stage.start();
 
 	_a_stage.step();
-	if (_backFrom > 0 || _backTo > 0) {
-		_back.show();
+	if (_backTo) {
+		_back->fadeIn();
 	} else {
-		_back.hide();
+		_back->fadeOut();
 	}
 	step()->hide();
 }
 
 void IntroWidget::pushStep(IntroStep *step, MoveType type) {
 	_stepHistory.push_back(step);
-	_back.raise();
+	_back->raise();
 	_stepHistory.back()->hide();
 
 	historyMove(type);
@@ -170,15 +172,14 @@ void IntroWidget::animShow(const QPixmap &bgAnimCache, bool back) {
 	_a_show.stop();
 	step()->show();
 	if (step()->hasBack()) {
-		_back.setOpacity(1);
-		_back.show();
+		_back->showFast();
 	} else {
-		_back.hide();
+		_back->hideFast();
 	}
 	(back ? _cacheUnder : _cacheOver) = myGrab(this);
 
 	step()->hide();
-	_back.hide();
+	_back->hideFast();
 
 	a_coordUnder = back ? anim::ivalue(-st::slideShift, 0) : anim::ivalue(0, -st::slideShift);
 	a_coordOver = back ? anim::ivalue(0, width()) : anim::ivalue(width(), 0);
@@ -202,8 +203,7 @@ void IntroWidget::step_show(float64 ms, bool timer) {
 		setFocus();
 		step()->activate();
 		if (step()->hasBack()) {
-			_back.setOpacity(1);
-			_back.show();
+			_back->showFast();
 		}
 		if (App::app()) App::app()->mtpUnpause();
 	} else {
@@ -231,20 +231,12 @@ void IntroWidget::step_stage(float64 ms, bool timer) {
 
 		setFocus();
 		step()->activate();
-		if (!step()->hasBack()) {
-			_back.hide();
-		}
 		if (App::app()) App::app()->mtpUnpause();
 	} else {
 		a_coordShow.update(dt2, st::introShowFunc);
 		a_opacityShow.update(dt2, st::introAlphaShowFunc);
 		a_coordHide.update(dt1, st::introHideFunc);
 		a_opacityHide.update(dt1, st::introAlphaHideFunc);
-		if (_backFrom != _backTo) {
-			_back.setOpacity((_backFrom > _backTo) ? a_opacityHide.current() : a_opacityShow.current());
-		} else {
-			_back.setOpacity(1);
-		}
 	}
 	if (timer) update();
 }
@@ -267,7 +259,7 @@ void IntroWidget::paintEvent(QPaintEvent *e) {
 		}
 		p.drawPixmap(a_coordOver.current(), 0, _cacheOver);
 		p.setOpacity(a_shadow.current());
-		p.drawPixmap(QRect(a_coordOver.current() - st::slideShadow.pxWidth(), 0, st::slideShadow.pxWidth(), height()), App::sprite(), st::slideShadow.rect());
+		st::slideShadow.fill(p, QRect(a_coordOver.current() - st::slideShadow.width(), 0, st::slideShadow.width(), height()));
 	} else if (_a_stage.animating()) {
 		p.setOpacity(a_opacityHide.current());
 		p.drawPixmap(step()->x() + st::introSlideShift + a_coordHide.current(), step()->y(), _cacheHide);

Telegram/SourceFiles/intro/introwidget.h

@@ -22,12 +22,17 @@ Copyright (c) 2014-2016 John Preston, https://desktop.telegram.org
 
 #include "mtproto/rpc_sender.h"
 
+namespace Ui {
+class IconButton;
+template <typename Widget>
+class WidgetFadeWrap;
+} // namespace Ui
+
 class IntroStep;
 class IntroWidget : public TWidget, public RPCSender {
 	Q_OBJECT
 
 public:
-
 	IntroWidget(QWidget *window);
 
 	void paintEvent(QPaintEvent *e) override;
@@ -85,18 +90,15 @@ public:
 	~IntroWidget() override;
 
 public slots:
-
 	void onStepSubmit();
 	void onBack();
 	void onParentResize(const QSize &newSize);
 	void onChangeLang();
 
 signals:
-
 	void countryChanged();
 
 private:
-
 	QPixmap grabStep(int skip = 0);
 
 	int _langChangeTo = 0;
@@ -143,7 +145,8 @@ private:
 
 	QString _firstname, _lastname;
 
-	IconedButton _back;
+	ChildWidget<Ui::WidgetFadeWrap<Ui::IconButton>> _back;
+
 	float64 _backFrom = 0.;
 	float64 _backTo = 0.;
 
@@ -151,7 +154,6 @@ private:
 
 class IntroStep : public TWidget, public RPCSender {
 public:
-
 	IntroStep(IntroWidget *parent) : TWidget(parent) {
 	}
 
@@ -169,7 +171,6 @@ public:
 	virtual void onSubmit() = 0;
 
 protected:
-
 	IntroWidget *intro() {
 		IntroWidget *result = qobject_cast<IntroWidget*>(parentWidget());
 		t_assert(result != nullptr);

Telegram/SourceFiles/mainwidget.cpp

@@ -2698,7 +2698,7 @@ void MainWidget::paintEvent(QPaintEvent *e) {
 		}
 		p.drawPixmap(a_coordOver.current(), 0, _cacheOver);
 		p.setOpacity(a_shadow.current());
-		p.drawPixmap(QRect(a_coordOver.current() - st::slideShadow.pxWidth(), 0, st::slideShadow.pxWidth(), height()), App::sprite(), st::slideShadow.rect());
+		st::slideShadow.fill(p, QRect(a_coordOver.current() - st::slideShadow.width(), 0, st::slideShadow.width(), height()));
 	}
 }
 

Telegram/SourceFiles/media/view/media_clip_controller.cpp

@@ -26,7 +26,7 @@ Copyright (c) 2014-2016 John Preston, https://desktop.telegram.org
 #include "styles/style_mediaview.h"
 #include "ui/widgets/label_simple.h"
 #include "ui/widgets/media_slider.h"
-#include "ui/effects/fade_animation.h"
+#include "ui/effects/widget_fade_wrap.h"
 #include "ui/buttons/icon_button.h"
 #include "media/media_audio.h"
 

Telegram/SourceFiles/overviewwidget.cpp

@@ -1944,7 +1944,7 @@ void OverviewWidget::paintEvent(QPaintEvent *e) {
 		}
 		p.drawPixmap(QRect(a_coordOver.current(), 0, _cacheOver.width() / retina, height()), _cacheOver, QRect(0, inCacheTop * retina, _cacheOver.width(), height() * retina));
 		p.setOpacity(a_progress.current());
-		p.drawPixmap(QRect(a_coordOver.current() - st::slideShadow.pxWidth(), 0, st::slideShadow.pxWidth(), height()), App::sprite(), st::slideShadow.rect());
+		st::slideShadow.fill(p, QRect(a_coordOver.current() - st::slideShadow.width(), 0, st::slideShadow.width(), height()));
 		return;
 	}
 
@@ -1978,7 +1978,7 @@ void OverviewWidget::paintTopBar(Painter &p, float64 over, int32 decreaseWidth)
 		}
 		p.drawPixmap(QRect(a_coordOver.current(), 0, _cacheOver.width() / retina, st::topBarHeight), _cacheOver, QRect(0, 0, _cacheOver.width(), st::topBarHeight * retina));
 		p.setOpacity(a_progress.current());
-		p.drawPixmap(QRect(a_coordOver.current() - st::slideShadow.pxWidth(), 0, st::slideShadow.pxWidth(), st::topBarHeight), App::sprite(), st::slideShadow.rect());
+		st::slideShadow.fill(p, QRect(a_coordOver.current() - st::slideShadow.width(), 0, st::slideShadow.width(), st::topBarHeight));
 		return;
 	}
 	p.setOpacity(st::topBarBackAlpha + (1 - st::topBarBackAlpha) * over);

Telegram/SourceFiles/passcodewidget.cpp

@@ -186,7 +186,7 @@ void PasscodeWidget::paintEvent(QPaintEvent *e) {
 		}
 		p.drawPixmap(a_coordOver.current(), 0, _cacheOver);
 		p.setOpacity(a_shadow.current());
-		p.drawPixmap(QRect(a_coordOver.current() - st::slideShadow.pxWidth(), 0, st::slideShadow.pxWidth(), height()), App::sprite(), st::slideShadow.rect());
+		st::slideShadow.fill(p, QRect(a_coordOver.current() - st::slideShadow.width(), 0, st::slideShadow.width(), height()));
 	} else {
 		p.fillRect(rect(), st::windowBg);
 

Telegram/SourceFiles/settings/settings_background_widget.cpp

@@ -25,7 +25,7 @@ Copyright (c) 2014-2016 John Preston, https://desktop.telegram.org
 #include "lang.h"
 #include "mainwidget.h"
 #include "boxes/backgroundbox.h"
-#include "ui/widgets/widget_slide_wrap.h"
+#include "ui/effects/widget_slide_wrap.h"
 #include "localstorage.h"
 #include "mainwindow.h"
 #include "window/chat_background.h"

Telegram/SourceFiles/settings/settings_chat_settings_widget.cpp

@@ -23,7 +23,7 @@ Copyright (c) 2014-2016 John Preston, https://desktop.telegram.org
 
 #include "styles/style_settings.h"
 #include "lang.h"
-#include "ui/widgets/widget_slide_wrap.h"
+#include "ui/effects/widget_slide_wrap.h"
 #include "ui/flatlabel.h"
 #include "localstorage.h"
 #include "mainwidget.h"

Telegram/SourceFiles/settings/settings_general_widget.cpp

@@ -23,7 +23,7 @@ Copyright (c) 2014-2016 John Preston, https://desktop.telegram.org
 
 #include "styles/style_settings.h"
 #include "lang.h"
-#include "ui/widgets/widget_slide_wrap.h"
+#include "ui/effects/widget_slide_wrap.h"
 #include "ui/flatbutton.h"
 #include "ui/flatcheckbox.h"
 #include "localstorage.h"

Telegram/SourceFiles/settings/settings_info_widget.cpp

@@ -24,7 +24,7 @@ Copyright (c) 2014-2016 John Preston, https://desktop.telegram.org
 #include "styles/style_settings.h"
 #include "lang.h"
 #include "ui/flatlabel.h"
-#include "ui/widgets/widget_slide_wrap.h"
+#include "ui/effects/widget_slide_wrap.h"
 #include "boxes/usernamebox.h"
 #include "observer_peer.h"
 

Telegram/SourceFiles/settings/settings_notifications_widget.cpp

@@ -24,7 +24,7 @@ Copyright (c) 2014-2016 John Preston, https://desktop.telegram.org
 #include "styles/style_settings.h"
 #include "lang.h"
 #include "localstorage.h"
-#include "ui/widgets/widget_slide_wrap.h"
+#include "ui/effects/widget_slide_wrap.h"
 #include "ui/flatcheckbox.h"
 #include "mainwindow.h"
 #include "window/notifications_manager.h"

Telegram/SourceFiles/settings/settings_privacy_widget.cpp

@@ -21,7 +21,7 @@ Copyright (c) 2014-2016 John Preston, https://desktop.telegram.org
 #include "stdafx.h"
 #include "settings/settings_privacy_widget.h"
 
-#include "ui/widgets/widget_slide_wrap.h"
+#include "ui/effects/widget_slide_wrap.h"
 #include "styles/style_settings.h"
 #include "lang.h"
 #include "application.h"

Telegram/SourceFiles/settings/settings_widget.cpp

@@ -201,6 +201,7 @@ void Widget::paintEvent(QPaintEvent *e) {
 }
 
 void Widget::resizeEvent(QResizeEvent *e) {
+	LayerWidget::resizeEvent(e);
 	if (!width() || !height()) {
 		return;
 	}

Telegram/SourceFiles/ui/effects/widget_fade_wrap.cpp

@@ -19,7 +19,7 @@ Full license: https://github.com/telegramdesktop/tdesktop/blob/master/LICENSE
 Copyright (c) 2014-2016 John Preston, https://desktop.telegram.org
 */
 #include "stdafx.h"
-#include "ui/effects/fade_animation.h"
+#include "ui/effects/widget_fade_wrap.h"
 
 namespace Ui {
 
@@ -113,4 +113,35 @@ void FadeAnimation::updateCallback() {
 	}
 }
 
+WidgetFadeWrap<TWidget>::WidgetFadeWrap(QWidget *parent
+, TWidget *entity
+, base::lambda_unique<void()> updateCallback
+, int duration) : TWidget(parent)
+, _entity(entity)
+, _duration(duration)
+, _updateCallback(std_::move(updateCallback))
+, _animation(this) {
+	_animation.show();
+	if (_updateCallback) {
+		_animation.setFinishedCallback([this] { _updateCallback(); });
+		_animation.setUpdatedCallback([this](float64 opacity) { _updateCallback(); });
+	}
+	_entity->setParent(this);
+	_entity->moveToLeft(0, 0);
+	_entity->installEventFilter(this);
+	resize(_entity->size());
+}
+
+bool WidgetFadeWrap<TWidget>::eventFilter(QObject *object, QEvent *event) {
+	if (object == _entity && event->type() == QEvent::Resize) {
+		resize(_entity->rect().size());
+	}
+	return TWidget::eventFilter(object, event);
+}
+
+void WidgetFadeWrap<TWidget>::paintEvent(QPaintEvent *e) {
+	Painter p(this);
+	_animation.paint(p);
+}
+
 } // namespace Ui

Telegram/SourceFiles/ui/effects/widget_fade_wrap.h

@@ -22,6 +22,8 @@ Copyright (c) 2014-2016 John Preston, https://desktop.telegram.org
 
 class TWidget;
 
+#include "styles/style_widgets.h"
+
 namespace Ui {
 
 class FadeAnimation {
@@ -59,4 +61,67 @@ private:
 
 };
 
+template <typename Widget>
+class WidgetFadeWrap : public WidgetFadeWrap<TWidget> {
+public:
+	WidgetFadeWrap(QWidget *parent, Widget *entity
+		, base::lambda_unique<void()> updateCallback
+		, int duration = st::widgetFadeDuration) : WidgetFadeWrap<TWidget>(parent, entity, std_::move(updateCallback), duration) {
+	}
+	Widget *entity() {
+		return static_cast<Widget*>(WidgetFadeWrap<TWidget>::entity());
+	}
+	const Widget *entity() const {
+		return static_cast<const Widget*>(WidgetFadeWrap<TWidget>::entity());
+	}
+
+};
+
+template <>
+class WidgetFadeWrap<TWidget> : public TWidget {
+public:
+	WidgetFadeWrap(QWidget *parent, TWidget *entity
+		, base::lambda_unique<void()> updateCallback
+		, int duration = st::widgetFadeDuration);
+
+	void fadeOut() {
+		_animation.fadeOut(_duration);
+	}
+	void fadeIn() {
+		_animation.fadeIn(_duration);
+	}
+	void showFast() {
+		_animation.show();
+		if (_updateCallback) {
+			_updateCallback();
+		}
+	}
+	void hideFast() {
+		_animation.hide();
+		if (_updateCallback) {
+			_updateCallback();
+		}
+	}
+
+	TWidget *entity() {
+		return _entity;
+	}
+
+	const TWidget *entity() const {
+		return _entity;
+	}
+
+protected:
+	bool eventFilter(QObject *object, QEvent *event) override;
+	void paintEvent(QPaintEvent *e) override;
+
+private:
+	TWidget *_entity;
+	int _duration;
+	base::lambda_unique<void()> _updateCallback;
+
+	FadeAnimation _animation;
+
+};
+
 } // namespace Ui

Telegram/SourceFiles/ui/effects/widget_slide_wrap.cpp

@@ -0,0 +1,139 @@
+/*
+This file is part of Telegram Desktop,
+the official desktop version of Telegram messaging app, see https://telegram.org
+
+Telegram Desktop is free software: you can redistribute it and/or modify
+it under the terms of the GNU General Public License as published by
+the Free Software Foundation, either version 3 of the License, or
+(at your option) any later version.
+
+It is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU General Public License for more details.
+
+In addition, as a special exception, the copyright holders give permission
+to link the code of portions of this program with the OpenSSL library.
+
+Full license: https://github.com/telegramdesktop/tdesktop/blob/master/LICENSE
+Copyright (c) 2014-2016 John Preston, https://desktop.telegram.org
+*/
+#include "stdafx.h"
+#include "ui/effects/widget_slide_wrap.h"
+
+namespace Ui {
+
+WidgetSlideWrap<TWidget>::WidgetSlideWrap(QWidget *parent
+, TWidget *entity
+, style::margins entityPadding
+, base::lambda_unique<void()> updateCallback
+, int duration) : TWidget(parent)
+, _entity(entity)
+, _padding(entityPadding)
+, _duration(duration)
+, _updateCallback(std_::move(updateCallback))
+, _a_height(animation(this, &WidgetSlideWrap<TWidget>::step_height)) {
+	_entity->setParent(this);
+	_entity->moveToLeft(_padding.left(), _padding.top());
+	_realSize = _entity->rect().marginsAdded(_padding).size();
+	_entity->installEventFilter(this);
+	resize(_realSize);
+}
+
+void WidgetSlideWrap<TWidget>::slideUp() {
+	if (isHidden()) {
+		_forceHeight = 0;
+		resize(_realSize.width(), _forceHeight);
+		if (_updateCallback) _updateCallback();
+		return;
+	}
+	if (_a_height.animating()) {
+		if (_hiding) return;
+	} else {
+		a_height = anim::ivalue(_realSize.height());
+	}
+	a_height.start(0);
+	_hiding = true;
+	_a_height.start();
+}
+
+void WidgetSlideWrap<TWidget>::slideDown() {
+	if (isHidden()) {
+		show();
+	}
+	if (_forceHeight < 0) {
+		return;
+	}
+
+	if (_a_height.animating()) {
+		if (!_hiding) return;
+	}
+	a_height.start(_realSize.height());
+	_forceHeight = a_height.current();
+	_hiding = false;
+	_a_height.start();
+}
+
+void WidgetSlideWrap<TWidget>::showFast() {
+	show();
+	_a_height.stop();
+	resize(_realSize);
+	if (_updateCallback) {
+		_updateCallback();
+	}
+}
+
+void WidgetSlideWrap<TWidget>::hideFast() {
+	_a_height.stop();
+	a_height = anim::ivalue(0);
+	_forceHeight = 0;
+	resize(_realSize.width(), 0);
+	hide();
+	if (_updateCallback) {
+		_updateCallback();
+	}
+}
+
+int WidgetSlideWrap<TWidget>::naturalWidth() const {
+	auto inner = _entity->naturalWidth();
+	return (inner < 0) ? inner : (_padding.left() + inner + _padding.right());
+}
+
+bool WidgetSlideWrap<TWidget>::eventFilter(QObject *object, QEvent *event) {
+	if (object == _entity && event->type() == QEvent::Resize) {
+		_realSize = _entity->rect().marginsAdded(_padding).size();
+		if (!_inResizeToWidth) {
+			resize(_realSize.width(), (_forceHeight >= 0) ? _forceHeight : _realSize.height());
+			if (_updateCallback) {
+				_updateCallback();
+			}
+		}
+	}
+	return TWidget::eventFilter(object, event);
+}
+
+int WidgetSlideWrap<TWidget>::resizeGetHeight(int newWidth) {
+	_inResizeToWidth = true;
+	_entity->resizeToWidth(newWidth - _padding.left() - _padding.right());
+	_inResizeToWidth = false;
+	return (_forceHeight >= 0) ? _forceHeight : _realSize.height();
+}
+
+void WidgetSlideWrap<TWidget>::step_height(float64 ms, bool timer) {
+	auto dt = ms / _duration;
+	if (dt >= 1) {
+		a_height.finish();
+		_a_height.stop();
+		_forceHeight = _hiding ? 0 : -1;
+		if (_hiding) hide();
+	} else {
+		a_height.update(dt, anim::linear);
+		_forceHeight = a_height.current();
+	}
+	resize(_realSize.width(), (_forceHeight >= 0) ? _forceHeight : _realSize.height());
+	if (_updateCallback) {
+		_updateCallback();
+	}
+}
+
+} // namespace Ui

Telegram/SourceFiles/ui/effects/widget_slide_wrap.h

@@ -0,0 +1,88 @@
+/*
+This file is part of Telegram Desktop,
+the official desktop version of Telegram messaging app, see https://telegram.org
+
+Telegram Desktop is free software: you can redistribute it and/or modify
+it under the terms of the GNU General Public License as published by
+the Free Software Foundation, either version 3 of the License, or
+(at your option) any later version.
+
+It is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU General Public License for more details.
+
+In addition, as a special exception, the copyright holders give permission
+to link the code of portions of this program with the OpenSSL library.
+
+Full license: https://github.com/telegramdesktop/tdesktop/blob/master/LICENSE
+Copyright (c) 2014-2016 John Preston, https://desktop.telegram.org
+*/
+#pragma once
+
+#include "styles/style_widgets.h"
+
+namespace Ui {
+
+template <typename Widget>
+class WidgetSlideWrap : public WidgetSlideWrap<TWidget> {
+public:
+	WidgetSlideWrap(QWidget *parent, Widget *entity
+		, style::margins entityPadding
+		, base::lambda_unique<void()> updateCallback
+		, int duration = st::widgetSlideDuration) : WidgetSlideWrap<TWidget>(parent, entity, entityPadding, std_::move(updateCallback), duration) {
+	}
+	Widget *entity() {
+		return static_cast<Widget*>(WidgetSlideWrap<TWidget>::entity());
+	}
+	const Widget *entity() const {
+		return static_cast<const Widget*>(WidgetSlideWrap<TWidget>::entity());
+	}
+
+};
+
+template <>
+class WidgetSlideWrap<TWidget> : public TWidget {
+public:
+	WidgetSlideWrap(QWidget *parent, TWidget *entity
+		, style::margins entityPadding
+		, base::lambda_unique<void()> updateCallback
+		, int duration = st::widgetSlideDuration);
+
+	void slideUp();
+	void slideDown();
+	void showFast();
+	void hideFast();
+
+	TWidget *entity() {
+		return _entity;
+	}
+
+	const TWidget *entity() const {
+		return _entity;
+	}
+
+	int naturalWidth() const override;
+
+protected:
+	bool eventFilter(QObject *object, QEvent *event) override;
+	int resizeGetHeight(int newWidth) override;
+
+private:
+	void step_height(float64 ms, bool timer);
+
+	TWidget *_entity;
+	bool _inResizeToWidth = false;
+	style::margins _padding;
+	int _duration;
+	base::lambda_unique<void()> _updateCallback;
+
+	style::size _realSize;
+	int _forceHeight = -1;
+	anim::ivalue a_height;
+	Animation _a_height;
+	bool _hiding = false;
+
+};
+
+} // namespace Ui

Telegram/SourceFiles/ui/widgets/widget_slide_wrap.h

@@ -1,167 +0,0 @@
-/*
-This file is part of Telegram Desktop,
-the official desktop version of Telegram messaging app, see https://telegram.org
-
-Telegram Desktop is free software: you can redistribute it and/or modify
-it under the terms of the GNU General Public License as published by
-the Free Software Foundation, either version 3 of the License, or
-(at your option) any later version.
-
-It is distributed in the hope that it will be useful,
-but WITHOUT ANY WARRANTY; without even the implied warranty of
-MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
-GNU General Public License for more details.
-
-In addition, as a special exception, the copyright holders give permission
-to link the code of portions of this program with the OpenSSL library.
-
-Full license: https://github.com/telegramdesktop/tdesktop/blob/master/LICENSE
-Copyright (c) 2014-2016 John Preston, https://desktop.telegram.org
-*/
-#pragma once
-
-#include "styles/style_widgets.h"
-
-namespace Ui {
-
-template <typename Widget>
-class WidgetSlideWrap : public TWidget {
-public:
-	using UpdateCallback = base::lambda_unique<void()>;
-	WidgetSlideWrap(QWidget *parent, Widget *entity
-		, style::margins entityPadding
-		, UpdateCallback updateCallback
-		, int duration = st::widgetSlideDuration) : TWidget(parent)
-	, _entity(entity)
-	, _padding(entityPadding)
-	, _duration(duration)
-	, _updateCallback(std_::move(updateCallback))
-	, _a_height(animation(this, &WidgetSlideWrap<Widget>::step_height)) {
-		_entity->setParent(this);
-		_entity->moveToLeft(_padding.left(), _padding.top());
-		_realSize = _entity->rect().marginsAdded(_padding).size();
-		_entity->installEventFilter(this);
-		resize(_realSize);
-	}
-
-	bool eventFilter(QObject *object, QEvent *event) override {
-		if (object == _entity && event->type() == QEvent::Resize) {
-			_realSize = _entity->rect().marginsAdded(_padding).size();
-			if (!_inResizeToWidth) {
-				resize(_realSize.width(), (_forceHeight >= 0) ? _forceHeight : _realSize.height());
-				if (_updateCallback) {
-					_updateCallback();
-				}
-			}
-		}
-		return TWidget::eventFilter(object, event);
-	}
-
-	void slideUp() {
-		if (isHidden()) {
-			_forceHeight = 0;
-			resize(_realSize.width(), _forceHeight);
-			if (_updateCallback) _updateCallback();
-			return;
-		}
-		if (_a_height.animating()) {
-			if (_hiding) return;
-		} else {
-			a_height = anim::ivalue(_realSize.height());
-		}
-		a_height.start(0);
-		_hiding = true;
-		_a_height.start();
-	}
-
-	void slideDown() {
-		if (isHidden()) {
-			show();
-		}
-		if (_forceHeight < 0) {
-			return;
-		}
-
-		if (_a_height.animating()) {
-			if (!_hiding) return;
-		}
-		a_height.start(_realSize.height());
-		_forceHeight = a_height.current();
-		_hiding = false;
-		_a_height.start();
-	}
-
-	void showFast() {
-		show();
-		_a_height.stop();
-		resize(_realSize);
-		if (_updateCallback) {
-			_updateCallback();
-		}
-	}
-
-	void hideFast() {
-		_a_height.stop();
-		a_height = anim::ivalue(0);
-		_forceHeight = 0;
-		resize(_realSize.width(), 0);
-		hide();
-		if (_updateCallback) {
-			_updateCallback();
-		}
-	}
-
-	Widget *entity() {
-		return _entity;
-	}
-
-	const Widget *entity() const {
-		return _entity;
-	}
-
-	int naturalWidth() const override {
-		auto inner = _entity->naturalWidth();
-		return (inner < 0) ? inner : (_padding.left() + inner + _padding.right());
-	}
-
-protected:
-	int resizeGetHeight(int newWidth) override {
-		_inResizeToWidth = true;
-		_entity->resizeToWidth(newWidth - _padding.left() - _padding.right());
-		_inResizeToWidth = false;
-		return (_forceHeight >= 0) ? _forceHeight : _realSize.height();
-	}
-
-private:
-	void step_height(float64 ms, bool timer) {
-		auto dt = ms / _duration;
-		if (dt >= 1) {
-			a_height.finish();
-			_a_height.stop();
-			_forceHeight = _hiding ? 0 : -1;
-			if (_hiding) hide();
-		} else {
-			a_height.update(dt, anim::linear);
-			_forceHeight = a_height.current();
-		}
-		resize(_realSize.width(), (_forceHeight >= 0) ? _forceHeight : _realSize.height());
-		if (_updateCallback) {
-			_updateCallback();
-		}
-	}
-
-	Widget *_entity;
-	bool _inResizeToWidth = false;
-	style::margins _padding;
-	int _duration;
-	UpdateCallback _updateCallback;
-
-	style::size _realSize;
-	int _forceHeight = -1;
-	anim::ivalue a_height;
-	Animation _a_height;
-	bool _hiding = false;
-
-};
-
-} // namespace Ui

Telegram/SourceFiles/ui/widgets/widgets.style

@@ -100,6 +100,7 @@ MultiSelect {
 }
 
 widgetSlideDuration: 200;
+widgetFadeDuration: 200;
 
 discreteSliderHeight: 39px;
 discreteSliderTop: 5px;

Telegram/SourceFiles/window/player_wrap_widget.cpp

@@ -25,7 +25,7 @@ Copyright (c) 2014-2016 John Preston, https://desktop.telegram.org
 
 namespace Window {
 
-PlayerWrapWidget::PlayerWrapWidget(QWidget *parent, UpdateCallback &&updateCallback) : Parent(parent
+PlayerWrapWidget::PlayerWrapWidget(QWidget *parent, base::lambda_unique<void()> updateCallback) : Parent(parent
 	, new Media::Player::Widget(parent)
 	, style::margins(0, 0, 0, 0)
 	, std_::move(updateCallback)) {

Telegram/SourceFiles/window/player_wrap_widget.h

@@ -1,6 +1,6 @@
 #pragma once
 
-#include "ui/widgets/widget_slide_wrap.h"
+#include "ui/effects/widget_slide_wrap.h"
 #include "media/player/media_player_widget.h"
 
 namespace Ui {
@@ -13,8 +13,7 @@ class PlayerWrapWidget : public Ui::WidgetSlideWrap<Media::Player::Widget> {
 	using Parent = Ui::WidgetSlideWrap<Media::Player::Widget>;
 
 public:
-	using UpdateCallback = Parent::UpdateCallback;
-	PlayerWrapWidget(QWidget *parent, UpdateCallback &&updateCallback);
+	PlayerWrapWidget(QWidget *parent, base::lambda_unique<void()> updateCallback);
 
 	void updateAdaptiveLayout() {
 		updateShadowGeometry();

Telegram/SourceFiles/window/slide_animation.cpp

@@ -39,7 +39,7 @@ void SlideAnimation::paintContents(Painter &p, const QRect &update) const {
 	}
 	p.drawPixmap(QRect(a_coordOver.current(), 0, _cacheOver.width() / retina, _cacheOver.height() / retina), _cacheOver, QRect(0, 0, _cacheOver.width(), _cacheOver.height()));
 	p.setOpacity(a_progress.current());
-	p.drawPixmap(QRect(a_coordOver.current() - st::slideShadow.pxWidth(), 0, st::slideShadow.pxWidth(), _cacheOver.height() / retina), App::sprite(), st::slideShadow.rect());
+	st::slideShadow.fill(p, QRect(a_coordOver.current() - st::slideShadow.width(), 0, st::slideShadow.width(), _cacheOver.height() / retina));
 
 	if (_topBarShadowEnabled) {
 		p.setOpacity(1);

Telegram/gyp/Telegram.gyp

@@ -453,14 +453,16 @@
       '<(src_loc)/ui/buttons/peer_avatar_button.h',
       '<(src_loc)/ui/buttons/round_button.cpp',
       '<(src_loc)/ui/buttons/round_button.h',
-      '<(src_loc)/ui/effects/fade_animation.cpp',
-      '<(src_loc)/ui/effects/fade_animation.h',
       '<(src_loc)/ui/effects/radial_animation.cpp',
       '<(src_loc)/ui/effects/radial_animation.h',
       '<(src_loc)/ui/effects/rect_shadow.cpp',
       '<(src_loc)/ui/effects/rect_shadow.h',
       '<(src_loc)/ui/effects/round_image_checkbox.cpp',
       '<(src_loc)/ui/effects/round_image_checkbox.h',
+      '<(src_loc)/ui/effects/widget_fade_wrap.cpp',
+      '<(src_loc)/ui/effects/widget_fade_wrap.h',
+      '<(src_loc)/ui/effects/widget_slide_wrap.cpp',
+      '<(src_loc)/ui/effects/widget_slide_wrap.h',
       '<(src_loc)/ui/style/style_core.cpp',
       '<(src_loc)/ui/style/style_core.h',
       '<(src_loc)/ui/style/style_core_color.cpp',
@@ -497,7 +499,6 @@
       '<(src_loc)/ui/widgets/multi_select.h',
       '<(src_loc)/ui/widgets/shadow.cpp',
       '<(src_loc)/ui/widgets/shadow.h',
-      '<(src_loc)/ui/widgets/widget_slide_wrap.h',
       '<(src_loc)/ui/animation.cpp',
       '<(src_loc)/ui/animation.h',
       '<(src_loc)/ui/button.cpp',