How coders helped Mario?

xxCode kickstarted their community with an exciting challenge Help Mario Coding Challenge on Skillenza platform from 28th July to 6th August 2017. We witnessed a whooping 280+ participations. (Woohoo!)

xxCode team announced the winners on 7th August
* Shubhangi Bharti — Rs.1000 winner
* Swapnil Agarwal — Rs. 500 winner

Let us see what the challenges were and how to solve them

Puzzle 1

Mario has crossed most of the levels on his own except this one. However, there is a tiny little twist. There is no dragon. But there is no bridge either. Mario has to traverse from point A to B, as shown in the image. He has only T no. of bricks. Each brick is 1 m long. And the distance between A and B is given as N metres.

Mario must use only T bricks to cross the given distance. He is allowed to pick up bricks and place after another.

Problem : Create a linked list of T nodes. (Each node is equivalent to one brick). Number the nodes from 1 to T in numerical order. Using T nodes, traverse distance of N metres. On reaching the destination, print the new order of the nodes.

Input Format :
First line of input takes in T, which is the no. of bricks Mario has.
Second line of input takes N, which is the distance from A to B.

Constraints : 1<=T<N

Output Format : The new order of the linked list is printed with value of each node printed in a new line

Sample Input :
3
7

Sample Output:
2
3
1

Explanation
So if T=3, N=7. Create your linked list of 3 nodes and number it like 1 →2 →3. To traverse a distance of 7 nodes with only 3 nodes, you can pick up node 1 and place it after node 3, now the order of nodes are 2->3->1. This way, you covered a distance of 4 nodes. Pick up 2 and place it after 1 which makes the new order 3->1->2. Keep doing this till you have covered a distance of 7 nodes. At the end of 7m, the order of the nodes will be 2->3->1

Solution
This is just one of the ways we can solve this problem in C. You can take some hint from this and implement it in your preferred language.

Puzzle 2

Puzzle was loosely based upon cryptography. It was a Mario themed webpage hosted on Heroku. On login, user is taken to the challenge screen where a captcha is displayed.

We witnessed 2 categories of people here :
One — The kind of people who immediately typed in the letters of the captcha in the input box, because they guessed that’s how the nature of most captchas are. People in this category solved the challenge faster than others, because they got the hint as soon as they typed in the captcha in the question which was obviously not the solution.

Two — This category of people were trying to find the hint from the moment they got the captcha. They tried to find clues in the source code (and there was one), tried to apply patterns on the captcha code, and many other intuitive ways that we can probably never think of. This category of people did take more time, but I appreciate the way they approached the problem.

Solution

Once you get the hint, the captcha becomes super easy for most of you.

Hint : The quick brown fox jumps over the lazy dog
VNOUNL UHEVJPZQWZ RIIWARFJTF PGARMX SKEVYOLYXC ARBANLIW VNOUNL HSKECDQM GTARDB.

If anyone knows the significance of the above sentence, then most of your work is done.

Wikipedia says,
The quick brown fox jumps over the lazy dog” is an English-language pangram — a sentence that contains all of the letters of the alphabet.

The first word of the encrypted code — VNOUNL is a 6 letter word, which when decrypted becomes THE as mentioned in the hint. So can we say, every English letter is represented by two letters of the alphabet?
VN →T
OU →H
NL →E

If you continue doing this for the rest of the words, you will have a new set of alphabet that you can now use to decrypt your captcha.

Puzzle 3

This was the debugging challenge. Participants were taken to a webpage where they were requested to sign up and on signing up, they have to login again with their sign up credentials. But login will never work because there are multiple bugs(errors) in the webpage that restricts the user from logging in.

Before we begin discussing the bugs, let’s discuss how a webpage is edited in various browsers

Chrome → “Ctrl + Shift + I” opens the Developer Tools. You will be able to see different tabs on top such as — Elements, Console, Sources, etc.
HTML pages can be easily edited on the Elements Tab. You can choose to right click on an element and add an attribute or simply double click on an element to add attributes.
To edit JS files, you must go to the Sources tab, edit the source code, and do not forget to save (Ctrl+S)

Mozilla → “Ctrl+Shift+K”
Look for Inspector tab and start editing your HTML code right away. To know more about how to edit your JS files, look at this video

Solution

There are 4 bugs that you needed to fix for the code to run. Before we tell you the bugs, you must understand how to find a bug. It’s impossible to read through the entire code and find bugs. You must realize that since the error popped up when you went on to submit the login form, the bug MUST be somewhere in the form or the functions dealing with the form.

Let’s list out the errors/bugs :

1. No ID in username and password fields. Without ID, you can’t reference them from JS function.

<form id="myForm">

   username:<input type="text" id="username" name="username"   /> password:
   <input type="password" id="password" name="password"  />
   <input type="button" value="submit" onclick="showError() " />
</form>

2. Change the function for onclick

<form id="myForm">

   username:<input type="text" id="username" name="username"   /> password:
   <input type="password" id="password" name="password"  />
   <input type="button" value="submit" onclick="sendDataLogin() " />
</form>

3. In credentials.js, the following code is missing the val() method. The val() method returns the value attribute of the selected elements.

var username = $('#username').val();
var password = $('#password').val();

4. The above code returns the values of the username and password fields set by the user. But in the original code, it is called outside the sendDataLogin() function, which means these lines of code are executed before the submit is even called. So the values of username and password is basically null.
To solve this issue, these lines of code must be put inside the sendDataLogin() function.

function sendDataLogin() {
     var username = $('#username').val();
     var password = $('#password').val();
}

After removing the bugs, typing in your password and username would take you to the end of the challenge where you are given a SUCCESS CODE

And that’s all for the Mario challenge.

Thank you all for playing. Mario is super happy!

If you are a female coder, developer, designer or simply just aspiring to become one of those, join our community xxCode. Let’s work together, learn, collaborate, build each other’s skills. All we want from you is a little bit of participation and a lot of enthusiasm.

Like us on facebook
Join our Facebook group for female developers & designers
Email us at xxcodecommunity@gmail.com