Commit 5071a052 authored by Shashank Kumar's avatar Shashank Kumar

Tutorial Parser refactored to support uniform keys

parent c30ac502
...@@ -13,7 +13,8 @@ New Contributor Wizard v0.0.1 ...@@ -13,7 +13,8 @@ New Contributor Wizard v0.0.1
- How To Use module updated with a tutorial on how to get started with the application (Shashank Kumar - realslimshanky) - How To Use module updated with a tutorial on how to get started with the application (Shashank Kumar - realslimshanky)
- Tutorial Parser refactored to validate invalid keys and prompt error message (Shashank Kumar - realslimshanky) - Tutorial Parser refactored to validate invalid keys and prompt error message (Shashank Kumar - realslimshanky)
- Updated Tutorial Parser to support both Local and Online images (Shashank Kumar - realslimshanky) - Tutorial Parser refactored to support both Local and Online images (Shashank Kumar - realslimshanky)
- Tutorial Parser refactored to support uniform JSON object with `type` and `content` keys. (Shashank Kumar - realslimshanky)
- Minor change in Tutorial Parser by changing `content` key to `lesson` for better context (Shashank Kumar - realslimshanky) - Minor change in Tutorial Parser by changing `content` key to `lesson` for better context (Shashank Kumar - realslimshanky)
## July 30 2018 ## July 30 2018
......
...@@ -106,25 +106,25 @@ Now try to `Open` `My Awesome Tutorial` from the Tutorial Menu as seen above. Wh ...@@ -106,25 +106,25 @@ Now try to `Open` `My Awesome Tutorial` from the Tutorial Menu as seen above. Wh
## Step 5 - Updating The Tutorial JSON ## Step 5 - Updating The Tutorial JSON
Each Tutorial JSON file is a array of `{}` obejcts. And each of those object must contain one and only one key i.e. `content` and value of this key should also be a `[]` object. Each Tutorial JSON file is a array of `{}` obejcts. And each of those object must contain one and only one key i.e. `lesson` and value of this key should also be a `[]` object.
Each `{}` with a `content` represents a lesson in tutorial. Copy the code below and replace it with what you have in your Tutorial JSON file, restart the application and open your tutorial again. Each `{}` with a `lesson` represents a lesson in tutorial. Copy the code below and replace it with what you have in your Tutorial JSON file, restart the application and open your tutorial again.
```json ```json
[ [
{ {
"content": [] "lesson": []
}, },
{ {
"content": [] "lesson": []
}, },
{ {
"content": [] "lesson": []
} }
] ]
``` ```
We can see there are 3 different Lessons without any content and there's a handy navigation to switch between any of them. Cool right? Your first `content` becomes Lesson 1, second `content` becomes Lesson 2 and so on. We can see there are 3 different Lessons without any content and there's a handy navigation to switch between any of them. Cool right? Your first `lesson` becomes Lesson 1, second `lesson` becomes Lesson 2 and so on.
Now when you are creating a Tutorial, you would like to add some content inside your Lesson, that's what we define in `[]`. Now when you are creating a Tutorial, you would like to add some content inside your Lesson, that's what we define in `[]`.
...@@ -139,10 +139,10 @@ A simple Text can be added to Lesson by using the following code ...@@ -139,10 +139,10 @@ A simple Text can be added to Lesson by using the following code
```json ```json
[ [
{ {
"content": [ "lesson": [
{ {
"type": "text", "type": "text",
"text": "This is a text" "content": "This is a text"
} }
] ]
}, },
...@@ -153,7 +153,7 @@ This will result in ...@@ -153,7 +153,7 @@ This will result in
![Text Content](https://i.imgur.com/RtZECpK.png) ![Text Content](https://i.imgur.com/RtZECpK.png)
So, you have to add a `{}` object inside the `[]` of a Lesson. The compulsory key is `type` whose value should be `text`. Following this, add another key `text` whose value should contain the text you want to display in the lesson. So, you have to add a `{}` object inside the `[]` of a Lesson. The compulsory key is `type` whose value should be `text`. Following this, add another key `content` whose value should contain the text you want to display in the lesson.
### 2. ** Image ** ### 2. ** Image **
...@@ -162,10 +162,10 @@ Adding an image is just as simple like adding a text. Simply use below code to k ...@@ -162,10 +162,10 @@ Adding an image is just as simple like adding a text. Simply use below code to k
```json ```json
[ [
{ {
"content": [ "lesson": [
{ {
"type": "image", "type": "image",
"url": "https://cdn.pixabay.com/photo/2018/07/28/19/57/lunar-eclipse-3568835_960_720.jpg" "content": "https://cdn.pixabay.com/photo/2018/07/28/19/57/lunar-eclipse-3568835_960_720.jpg"
} }
] ]
}, },
...@@ -176,7 +176,7 @@ This will result in ...@@ -176,7 +176,7 @@ This will result in
![Image Content](https://i.imgur.com/kAfFA05.png) ![Image Content](https://i.imgur.com/kAfFA05.png)
So this time, `type` key has value `image` and an additional key is `url` which should contain the url of the image you want to display. If the image doesn't load, try to host the image yourself online somewhere and replace the `url`. So this time, `type` key has value `image` and an additional key is `content` which should contain the url of the image you want to display. If the image doesn't load, try to host the image yourself online somewhere and replace the url in `content`.
### 3. ** Code ** ### 3. ** Code **
...@@ -185,10 +185,10 @@ Code snippets can also be added to Lesson which can be copied easily right from ...@@ -185,10 +185,10 @@ Code snippets can also be added to Lesson which can be copied easily right from
```json ```json
[ [
{ {
"content": [ "lesson": [
{ {
"type": "code", "type": "code",
"code": "man ls" "content": "man ls"
} }
] ]
}, },
...@@ -199,7 +199,7 @@ This will result in ...@@ -199,7 +199,7 @@ This will result in
![Code Content](https://i.imgur.com/qpwdZVy.png) ![Code Content](https://i.imgur.com/qpwdZVy.png)
Now you might have guessed what `type` we are using. And similar to above convention, add additional key `code` and value should be whatever text you want the user to copy. Now you might have guessed what `type` we are using. And similar to above convention, add additional key `content` and value should be whatever text you want the user to copy.
### 4. ** Question ** ### 4. ** Question **
...@@ -208,12 +208,14 @@ Now this one is a little advance content type that the others. Let's first use t ...@@ -208,12 +208,14 @@ Now this one is a little advance content type that the others. Let's first use t
```json ```json
[ [
{ {
"content": [ "lesson": [
{ {
"type": "question", "type": "question",
"question": "Is Linux a Monolithic Kernal? Answer yes or no.", "content": {
"answer": "yes", "question": "Is Linux a Monolithic Kernal? Answer yes or no.",
"hint": "do some research online" "answer": "yes",
"hint": "do some research online"
}
} }
] ]
}, },
...@@ -233,44 +235,46 @@ Also, below is the example of how you can add multiple content to a single lesso ...@@ -233,44 +235,46 @@ Also, below is the example of how you can add multiple content to a single lesso
```json ```json
[ [
{ {
"content": [ "lesson": [
{ {
"type": "text", "type": "text",
"text": "This is my AWESOME tutorial. Checkout the image below!" "content": "This is my AWESOME tutorial. Checkout the image below!"
}, },
{ {
"type": "image", "type": "image",
"url": "https://cdn.pixabay.com/photo/2017/01/16/19/17/horses-1984977_960_720.jpg" "content": "https://cdn.pixabay.com/photo/2017/01/16/19/17/horses-1984977_960_720.jpg"
} }
] ]
}, },
{ {
"content": [ "lesson": [
{ {
"type": "text", "type": "text",
"text": "Another awesome lesson for you!" "content": "Another awesome lesson for you!"
}, },
{ {
"type": "image", "type": "image",
"url": "https://cdn.pixabay.com/photo/2014/11/29/09/56/sleigh-ride-549727_960_720.jpg" "content": "https://cdn.pixabay.com/photo/2014/11/29/09/56/sleigh-ride-549727_960_720.jpg"
} }
] ]
}, },
{ {
"content": [ "lesson": [
{ {
"type": "text", "type": "text",
"text": "WOW! You made it to the end!" "content": "WOW! You made it to the end!"
}, },
{ {
"type": "question", "type": "question",
"question": "How many horses did you see?", "content": {
"answer": "4", "question": "How many horses did you see?",
"hint": "read the tutorial from the start" "answer": "4",
"hint": "read the tutorial from the start"
}
}, },
{ {
"type": "text", "type": "text",
"text": "Thank you for visiting my tutorial - Shashank" "content": "Thank you for visiting my tutorial - Shashank"
} }
] ]
} }
......
...@@ -3,17 +3,19 @@ ...@@ -3,17 +3,19 @@
"lesson": [ "lesson": [
{ {
"type": "image", "type": "image",
"url": "ui/assets/images/encryption_101_1.jpg" "content": "ui/assets/images/encryption_101_1.jpg"
}, },
{ {
"type": "text", "type": "text",
"text": "Welcome to Encryption 101. This is just to get you started with what the term 'Encryption' means and how it is practiced in real life. Roughly speaking, encryption is the problem of how two parties can communicate in secret in the presence of an eavesdropper. The main goals of this chapter are to develop a meaningful and useful definition of what we are trying to achieve, and to take some first steps in actually achieving it. " "content": "Welcome to Encryption 101. This is just to get you started with what the term 'Encryption' means and how it is practiced in real life. Roughly speaking, encryption is the problem of how two parties can communicate in secret in the presence of an eavesdropper. The main goals of this chapter are to develop a meaningful and useful definition of what we are trying to achieve, and to take some first steps in actually achieving it. "
}, },
{ {
"type": "question", "type": "question",
"question": "So, what can you secure using Encryption?", "content": {
"answer": "Communication", "question": "So, what can you secure using Encryption?",
"hint": "Read the above paragraph for answer" "answer": "Communication",
"hint": "Read the above paragraph for answer"
}
} }
] ]
}, },
...@@ -21,17 +23,19 @@ ...@@ -21,17 +23,19 @@
"lesson": [ "lesson": [
{ {
"type": "text", "type": "text",
"text": "Now, let's take a real life example to understand where Encryption can be used." "content": "Now, let's take a real life example to understand where Encryption can be used."
}, },
{ {
"type": "text", "type": "text",
"text": "Suppose Alice and Bob share a secret key k, and Alice wants to transmit a message m to Bob over a network while maintaining the secrecy of m in the presence of an eavesdropping adversary. This tutorial begins the development of basic techniques to solve this problem. Besides transmitting a message over a network, these same techniques allow Alice to store a file on a disk so that no one else with access to the disk can read the file, but Alice herself can read the file at a later time." "content": "Suppose Alice and Bob share a secret key k, and Alice wants to transmit a message m to Bob over a network while maintaining the secrecy of m in the presence of an eavesdropping adversary. This tutorial begins the development of basic techniques to solve this problem. Besides transmitting a message over a network, these same techniques allow Alice to store a file on a disk so that no one else with access to the disk can read the file, but Alice herself can read the file at a later time."
}, },
{ {
"type": "question", "type": "question",
"question": "What Alice and Bob can use to secure message while transmission?", "content": {
"answer": "A secret key", "question": "What Alice and Bob can use to secure message while transmission?",
"hint": "Read the above paragraph for answer" "answer": "A secret key",
"hint": "Read the above paragraph for answer"
}
} }
] ]
} }
......
...@@ -182,8 +182,8 @@ def get_text_widget(content_part): ...@@ -182,8 +182,8 @@ def get_text_widget(content_part):
get_text_widget will build a widget tree to display text type content get_text_widget will build a widget tree to display text type content
of the tutorial of the tutorial
''' '''
if 'text' in content_part: if 'content' in content_part:
text = content_part['text'] text = content_part['content']
else: else:
text = '[color=d3d3d3]Empty Text Was Provided Here![/color]' text = '[color=d3d3d3]Empty Text Was Provided Here![/color]'
log_error_message('Empty Text Was Provided') log_error_message('Empty Text Was Provided')
...@@ -212,15 +212,19 @@ def get_question_widget(content_part): ...@@ -212,15 +212,19 @@ def get_question_widget(content_part):
of the tutorial of the tutorial
''' '''
question_box = LessonQuestionBox() question_box = LessonQuestionBox()
if 'question' in content_part: if 'content' in content_part:
question = content_part['question'] if 'question' in content_part['content']:
question = content_part['content']['question']
else:
question = '[color=d3d3d3]Empty Question Was Provided Here![/color]'
log_error_message('Empty Question Was Provided')
else: else:
question = '[color=d3d3d3]Empty Question Was Provided Here![/color]' question = '[color=d3d3d3]Empty Question Was Provided Here![/color]'
log_error_message('Empty Question Was Provided') log_error_message('Empty Question Was Provided')
question_box.ids['lesson_question_label'].text = question question_box.ids['lesson_question_label'].text = question
if 'hint' in content_part: if 'hint' in content_part['content']:
hint = content_part['hint'] hint = content_part['content']['hint']
question_box.ids['lesson_question_input'].hint_text = hint question_box.ids['lesson_question_input'].hint_text = hint
def on_answer_change(*_): def on_answer_change(*_):
...@@ -236,8 +240,8 @@ def get_question_widget(content_part): ...@@ -236,8 +240,8 @@ def get_question_widget(content_part):
on_submit_answer is triggered when answer is submitted with and on_submit_answer is triggered when answer is submitted with and
validated accordingly validated accordingly
''' '''
if 'answer' in content_part: if 'answer' in content_part['content']:
answer = content_part['answer'] answer = content_part['content']['answer']
else: else:
answer = '' answer = ''
question_box_object = question_box.ids['lesson_answer_validation'] question_box_object = question_box.ids['lesson_answer_validation']
...@@ -257,9 +261,9 @@ def get_image_widget(content_part): ...@@ -257,9 +261,9 @@ def get_image_widget(content_part):
get_image_widget will build a widget tree to display image type content get_image_widget will build a widget tree to display image type content
of the tutorial of the tutorial
''' '''
if 'url' in content_part: if 'content' in content_part:
if content_part['url']: if content_part['content']:
content_url = content_part['url'] content_url = content_part['content']
lesson_image_box = LessonImageBox() lesson_image_box = LessonImageBox()
if content_url.lower().startswith('http'): if content_url.lower().startswith('http'):
image_object = AsyncImage(source=content_url) image_object = AsyncImage(source=content_url)
...@@ -311,8 +315,8 @@ def get_code_widget(content_part): ...@@ -311,8 +315,8 @@ def get_code_widget(content_part):
of the tutorial of the tutorial
''' '''
lesson_code_box = LessonCodeBox() lesson_code_box = LessonCodeBox()
if 'code' in content_part: if 'content' in content_part:
code = content_part['code'] code = content_part['content']
else: else:
code = '[color=d3d3d3]Invalid Code Provided Here![/color]' code = '[color=d3d3d3]Invalid Code Provided Here![/color]'
log_error_message('Invalid Code Provided!') log_error_message('Invalid Code Provided!')
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment