1
00:00:00,150 --> 00:00:05,580
Amazing work, we're almost done with this project, the last piece of functionality that we're missing

2
00:00:06,030 --> 00:00:10,410
is the ability to move around our less.

3
00:00:10,710 --> 00:00:14,550
So what I would want is to add reave and buttons.

4
00:00:14,910 --> 00:00:21,780
And then, of course, I'm going to display the next or pref page in my list.

5
00:00:21,930 --> 00:00:25,080
So I'm going to navigate back to my project, scroll down a bit.

6
00:00:25,080 --> 00:00:33,120
And in a B10 container, I don't want to add them here in there or want to add it before and after.

7
00:00:33,420 --> 00:00:35,790
So start with pretty button.

8
00:00:36,120 --> 00:00:42,410
So we just hardcourt the button, will add a class name and the class name will be brief beaten and

9
00:00:42,410 --> 00:00:45,150
then as far as the value we're just going to go with.

10
00:00:45,810 --> 00:00:52,050
Now eventually there's going to be a function that we invoke on Kleck and the name will be Prešov page.

11
00:00:52,500 --> 00:01:01,800
And of course I just need to grab the button that I just created and then scroll past the data and copy

12
00:01:01,800 --> 00:01:02,340
and paste.

13
00:01:02,370 --> 00:01:08,820
Now, of course, we're looking for the values of next and this is going to be the next button as far

14
00:01:08,820 --> 00:01:13,110
as a class and function also will be called next page.

15
00:01:13,530 --> 00:01:20,580
We scroll up and this is going to be very similar to the slider we're setting up where again, I would

16
00:01:20,580 --> 00:01:24,480
want to increase the value by one or decrease the value by one.

17
00:01:24,840 --> 00:01:28,560
But then I also would want to check, well, what is the index?

18
00:01:29,070 --> 00:01:35,400
Because if the index is bigger than my last index, then of course I would want to go back to zero.

19
00:01:35,610 --> 00:01:43,440
And if it's less than zero, then of course I would want to set it up equal to the last index in.

20
00:01:43,680 --> 00:01:43,900
Right.

21
00:01:44,280 --> 00:01:51,090
Otherwise I can keep on clicking Max and Breve and then I'm just going to be showing some gibberish.

22
00:01:51,480 --> 00:01:53,250
So we're going to go to the next page first.

23
00:01:53,250 --> 00:02:02,460
I guess so consed next page and then in here we're going to set the page and I'll pass in my function.

24
00:02:02,460 --> 00:02:05,850
Remember as a value we're getting that old state value.

25
00:02:05,880 --> 00:02:11,520
So this is going to be the current page that I have in state and we're going to set up a new variable

26
00:02:11,910 --> 00:02:16,920
called this next page and that one is equal to the old page plus one.

27
00:02:17,320 --> 00:02:23,460
And before I return anything from my callback function, because I would want to check what is that

28
00:02:23,460 --> 00:02:23,760
value.

29
00:02:23,970 --> 00:02:31,440
So if the next page is bigger than data, then that is important data and then the length minus one.

30
00:02:31,660 --> 00:02:32,220
Awesome.

31
00:02:32,460 --> 00:02:36,420
Then the next page will be equal to zero.

32
00:02:36,630 --> 00:02:41,350
And then remember, whatever, we're returning from the function because that is going to be the value.

33
00:02:41,610 --> 00:02:43,650
So that's why our turn the next page.

34
00:02:43,950 --> 00:02:51,160
Of course I have a big fat complaint because we didn't set up the other function, the prevalence of

35
00:02:51,180 --> 00:02:58,260
go with prev page, still the old page, but will change this value around Prešov page minus one.

36
00:02:58,900 --> 00:03:04,170
And we'll check whether the print page is less than zero.

37
00:03:04,410 --> 00:03:15,000
If every page is less than zero, then of course the value will be equal to the length minus one.

38
00:03:15,120 --> 00:03:23,220
So the last index of the items and we're going to go with Prepackage is equal to data and length and

39
00:03:23,220 --> 00:03:24,120
then minus one.

40
00:03:24,270 --> 00:03:30,840
And then, of course, as far as return go breve, um, on page, we set this up.

41
00:03:31,750 --> 00:03:38,500
And we should also see the brief and next buttons, so I'm going to go to pagination, these are my

42
00:03:38,500 --> 00:03:38,940
pages.

43
00:03:38,950 --> 00:03:42,510
I can probably zoom out a little bit just so I can see a bit better.

44
00:03:42,910 --> 00:03:50,490
And there is now we can go all the way to the end of the era and also the other way as well.

45
00:03:50,800 --> 00:03:55,330
And if we click course, we display that specific page.

46
00:03:55,690 --> 00:03:58,930
Hopefully everyone enjoy the project and I hope the next one.