Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(162)

Side by Side Diff: lib/components/carousel.dart

Issue 14295009: Fix widget.dart to work with the latest web_ui library. Specifically, query selectors need to use "… (Closed) Base URL: https://github.com/kevmoo/widget.dart.git@master
Patch Set: ptal Created 7 years, 8 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
« no previous file with comments | « lib/components/alert.html ('k') | lib/components/carousel.html » ('j') | no next file with comments »
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 import 'dart:async'; 1 import 'dart:async';
2 import 'dart:html'; 2 import 'dart:html';
3 import 'package:web_ui/web_ui.dart'; 3 import 'package:web_ui/web_ui.dart';
4 import 'package:bot/bot.dart'; 4 import 'package:bot/bot.dart';
5 import 'package:widget/effects.dart'; 5 import 'package:widget/effects.dart';
6 import 'package:widget/widget.dart'; 6 import 'package:widget/widget.dart';
7 7
8 // TODO: option to enable/disable wrapping. Disable buttons if the end is hit... 8 // TODO: option to enable/disable wrapping. Disable buttons if the end is hit...
9 9
10 /** 10 /**
11 * [Carousel] allows moving back and forth through a set of child elements. 11 * [Carousel] allows moving back and forth through a set of child elements.
12 * 12 *
13 * It is based on a [similar component](http://twitter.github.com/bootstrap/java script.html#carousel) 13 * It is based on a [similar component](http://twitter.github.com/bootstrap/java script.html#carousel)
14 * in Bootstrap. 14 * in Bootstrap.
15 * 15 *
16 * [Carousel] leverages the [Swap] component to render the transition between it ems. 16 * [Carousel] leverages the [Swap] component to render the transition between it ems.
17 */ 17 */
18 class Carousel extends WebComponent { 18 class Carousel extends WebComponent {
19 final ShowHideEffect _fromTheLeft = new SlideEffect(xStart: HorizontalAlignmen t.LEFT); 19 final ShowHideEffect _fromTheLeft = new SlideEffect(xStart: HorizontalAlignmen t.LEFT);
20 final ShowHideEffect _fromTheRight = new SlideEffect(xStart: HorizontalAlignme nt.RIGHT); 20 final ShowHideEffect _fromTheRight = new SlideEffect(xStart: HorizontalAlignme nt.RIGHT);
21 21
22 static const _duration = 2000; 22 static const _duration = 2000;
23 23
24 Future<bool> next() => _moveDelta(true); 24 Future<bool> next() => _moveDelta(true);
25 25
26 Future<bool> previous() => _moveDelta(false); 26 Future<bool> previous() => _moveDelta(false);
27 27
28 SwapComponent get _swap => this.query('x-carousel > .carousel > x-swap').xtag; 28 SwapComponent get _swap =>
29 this.query('[is=x-carousel] > .carousel > [is=x-swap]').xtag;
29 30
30 Future<bool> _moveDelta(bool doNext) { 31 Future<bool> _moveDelta(bool doNext) {
31 final swap = _swap; 32 final swap = _swap;
32 assert(swap != null); 33 assert(swap != null);
33 if(swap.items.length == 0) { 34 if (swap.items.length == 0) {
34 return new Future.immediate(false); 35 return new Future.value(false);
35 } 36 }
36 37
37 assert(doNext != null); 38 assert(doNext != null);
38 final delta = doNext ? 1 : -1; 39 final delta = doNext ? 1 : -1;
39 40
40 ShowHideEffect showEffect, hideEffect; 41 ShowHideEffect showEffect, hideEffect;
41 if(doNext) { 42 if (doNext) {
42 showEffect = _fromTheRight; 43 showEffect = _fromTheRight;
43 hideEffect = _fromTheLeft; 44 hideEffect = _fromTheLeft;
44 } else { 45 } else {
45 showEffect = _fromTheLeft; 46 showEffect = _fromTheLeft;
46 hideEffect = _fromTheRight; 47 hideEffect = _fromTheRight;
47 } 48 }
48 49
49 final activeIndex = _swap.activeItemIndex; 50 final activeIndex = _swap.activeItemIndex;
50 51
51 final newIndex = (activeIndex + delta) % _swap.items.length; 52 final newIndex = (activeIndex + delta) % _swap.items.length;
52 53
53 return _swap.showItemAtIndex(newIndex, effect: showEffect, hideEffect: hideE ffect, duration: _duration); 54 return _swap.showItemAtIndex(newIndex, effect: showEffect,
55 hideEffect: hideEffect, duration: _duration);
54 } 56 }
55 } 57 }
OLDNEW
« no previous file with comments | « lib/components/alert.html ('k') | lib/components/carousel.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698