Can you also please do the other changes (files that shouldn't be updated, typos...)?

Thank you

Can you try using "AnswerButton.qml" to select the choices? It is used in leftright activity if you need some example.

I have "qrc:/gcompris/src/core/Tutorial.qml:136: TypeError: Cannot read property 'length' of undefined" when starting planegame or alphabet-sequence activity.

Please check them everytime before commiting, the 3 activities share the same code and there shouldn't be side effects.

I have many small changes to request, could you document the changes refering to their number each time one of the item is done? Otherwise it will be difficult to me to see what has been done.
I will describe the changes refering to tutorial pages.
1- tutorial page n2
Can you insert the following page before the page 2 in order to explain what a remainder is
https://snag.gy/tDoGi8.jpg
2- tutorial page n2
Even numbers are numbers which leave remainder 0 when divisible by 2. -> Even numbers are numbers which leave remainder 0 when divided by 2.
For example: 12, 38, 52, 68, 102, 118, 168, 188, 502, 532, 700, 798, 842, 892 ,1000. All of these numbers are even numbers as they leave remainder 0 when divisible by 2. -> For example: 12, 38, 52, 68, 102, 118, 168, 188, 502, 532, 700, 798, 842, 892 ,1000. All of these numbers are even numbers as they leave remainder 0 when divided by 2.
3- tutorial page n3
Even numbers are numbers which leave remainder 0 when divisible by 2 -> Even numbers are numbers which leave remainder 0 when divisided by 2
4- tutorial page n3
For example: 15, 19, 51, 65, 103, 119, 169, 185, 505, 533, 701, 799, 845, 897, 1001. All of these numbers are odd numbers as they do not leave remainder 0 when divisible by 2. -> For example: 15, 19, 51, 65, 103, 119, 169, 185, 505, 533, 701, 799, 845, 897, 1001. All of these numbers are odd numbers as they do not leave remainder 0 when divided by 2.
5- tutorial page 4
Under choose an even number
Please center the number in the box
6- tutorial page 4
Replace "No, this is a wrong anwer by: Your made an error: When divided by 2, 13 is equal to 6 and the remainder is 1. Therefore this is an odd number.
All this must fit int he box.
7- tutorial page 4
Please center the great in the box.
8- tutorial page 5
Same comments that for points 6 and 7.
9- NumbersOddEven.qml content should be moved to directory ressources
10- NumbersOddEven.qml tutorialInstructions should be dispatched in tutorialsx.qml files.

@echarruau Yaa sure, I would update the diff by making the requested changes and document them too :)

In D17945#412138, @echarruau wrote:

6- tutorial page 4
Replace "No, this is a wrong anwer by: Your made an error: When divided by 2, 13 is equal to 6 and the remainder is 1. Therefore this is an odd number.
All this must fit in the box.

What do you think about using AnswerButton (the same as readingh/readingv/leftright/missing-letter activities) and avoid adding the text: "Great" or "Error"?

7- tutorial page 4
Please center the great in the box.
8- tutorial page 5
Same comments that for points 6 and 7.
9- NumbersOddEven.qml content should be moved to directory ressources
10- NumbersOddEven.qml tutorialInstructions should be dispatched in tutorialsx.qml files.

I would let them in the NumbersOddEven file as they are directly inherited from the parent Item, else it would mean add more variables to get the path of the instructions for not a big gain.

What do you think about using AnswerButton (the same as readingh/readingv/leftright/missing-letter activities) and avoid adding the text: "Great" or "Error"?

7- tutorial page 4

This would be a nice way. Less stressfull than getting a "NO" :)
I would still like to have a message explaining why the answer is wrong, this would be a nice way to help the notion to be acquired.

What do you think?

This would close points 6 7 and 8.

I have made all the changes as requested by @echarruau @jjazeix
Requested changes:

1. Can you insert the following page before the page 2 in order to explain what a remainder is
   
   I have added the tutorial page for remainder https://pasteboard.co/I1JCGBr.png

2. Requested changes made to the definition of odd and even numbers

For even number - https://pasteboard.co/I1JDfjO.png
For odd number - https://pasteboard.co/I1JDUVT.png

3. The message text "Great" centered in the message box - https://pasteboard.co/I1JESzH.png

4.Error message changed - https://pasteboard.co/I1JFm7O.png

I have also tested it for vertical and horizontal screens
https://pasteboard.co/I1JFLtC.png
https://pasteboard.co/I1JG0Dy.png
https://pasteboard.co/I1JGduW.png
https://pasteboard.co/I1JGKBZ.png
https://pasteboard.co/I1JGVSt.png
https://pasteboard.co/I1JH6CR.png

Great job. I haven't looked at the code yet but the behaviour is what I was looking for.
Can you do some small adjustments?
We need to add an other tutorial page before to explain what is a remainder.
Adding a first page with the question of this page: https://pasteboard.co/I1JDfjO.png
But not the example, this will lead to the remainder explanation which is at the moment in page 1 but will be moved to page 2.

Can you slighly reduce the size of the font in the error message so that the message can fit?
https://pasteboard.co/I1JG0Dy.png

Can you put a space between the : and the when and replace the capital W by a w?

Thanks,

In https://pasteboard.co/I1JH6CR.png, there should be some margin so the text do not override with the border.
In https://pasteboard.co/I1JGVSt.png, can you center the "Great" text?
In https://pasteboard.co/I1JGKBZ.png, it should be a generic definition of "remainder", not division by 2.

Thanks

I have made the following changes:

1. Centered the great text https://pasteboard.co/I2sXluZ.png

2. Fix the issue of error message which were overriding the border https://pasteboard.co/I2sZ6aJ.png

3.Added the general definition of remainder https://pasteboard.co/I2sZjqq.png

I have changed the condition to check to be symmetrical in the same way as suggested in the comments.

@jjazeix Regarding the error "Cannot defined property of length defined" on running the Alphabet Sequence.The line 136 of src/core/Tutorial.qml is set to some condition to check the visibility of the tutorial.I think that removing that line would resolves the error and would have no effect on tutorial.qml

In D17945#423637, @dekumar wrote:

@jjazeix Regarding the error "Cannot defined property of length defined" on running the Alphabet Sequence.The line 136 of src/core/Tutorial.qml is set to some condition to check the visibility of the tutorial.I think that removing that line would resolves the error and would have no effect on tutorial.qml

Please read better to which component the visible property would affect and on which usecase, make a few test to get to this case on another activity that has a tutorial and see why it's needed :)

@jjazeix I tried using loader to resolve the error " Cannot read property of length undefined" but I couldn't resolve it. I think the visibilty of the "next" in core should be set to some other parameters instead of tutorialDetails.

@dekumar, @echarruau: Please take a look at these changes: https://pastebin.com/1TMefRZ9 and check if it still works and what's expected.
On code side, the last change that could be required would be to use a Repeater for handling the AnswerButton more cleanly but it's not mandatory...

@jjazeix Yes, I have applied the changes. It produces the same behavior as before.

@jjazeix @echarruau I have updated the diff by making all the changes. Please have a look and let me know if there's still any changes to be done.

Thanks!

I finally managed to run openssl and could review your diff.
This is what I was looking for.
Code is ok for me, I find it generic enough to be reused in other programs.
One thing thought. The identation of brackets { and } is broken.
For example in TutorialBase.qml.

GCText {

 id: message
 anchors {
     centerIn: parent
     margins: parent.border.width+1
 }
 text: ""
 fontSizeMode: Text.Fit
 ........
    }
}

Closing brackets should be at the level of the first character of the element it belongs too.
Could you have a look through your code and tidy the indentation?
Emmanuel

In D17945#452251, @echarruau wrote:

I finally managed to run openssl and could review your diff.
This is what I was looking for.
Code is ok for me, I find it generic enough to be reused in other programs.
One thing thought. The identation of brackets { and } is broken.
For example in TutorialBase.qml.

GCText {

 id: message
 anchors {
     centerIn: parent
     margins: parent.border.width+1
 }
 text: ""
 fontSizeMode: Text.Fit
 ........
    }
}

Closing brackets should be at the level of the first character of the element it belongs too.
Could you have a look through your code and tidy the indentation?
Emmanuel

Thanks for the review!
Sure, I would update the diff by fixing the indentation issues.
Thanks!

We shouldn't allow changing the level in the bar when the tutorial is going on.
On UI side, there are some improvements to be made: https://pasteboard.co/IaJRr7Y.png

@echarruau @amankumargupta I have made the requested changes.

Thanks!