add gridbfs topic, and restructure course-page

Author: exoji2e

_compprogcourse/01_intro.html

@@ -0,0 +1,20 @@
+---
+layout: panel
+title: Intro
+---
+
+## Intro
+
+### Problems
+- [Daydreaming Stockbroker](https://open.kattis.com/problems/stockbroker)
+- [Billiard](https://open.kattis.com/problems/billiard)
+- [Pairing Socks](https://open.kattis.com/problems/pairingsocks)
+- [Boiling Vegetables](https://open.kattis.com/problems/vegetables)
+- [Opening Ceremony](https://open.kattis.com/problems/ceremony)
+- [Fractal](https://open.kattis.com/problems/fractal2)
+
+Here are a couple of problems where each solution demonstrates some concept that is quite common at programming competitions. For an experienced competitve programmare, who has seen all these techniques before most of these problems would be classified as easy. They are however chosen so that they become a challange for someone who is new to competitive programming. Please move on to the next topic when you've solved a few of these!
+
+Note that your program is tested on secret inputs. Your program has to produce the correct output for all secrets inputs. You can however be sure that the secret inputs follow the input format given in the problem statement.
+
+When your program is not accepted, there can be some different errors, which are described with error codes. I plan to add some tips about the error codes in the future.

_compprogcourse/01_intro.md

@@ -0,0 +1,39 @@
+---
+layout: panel
+title: Grid BFS
+---
+
+## BFS in Grids
+
+### Problems
+- [Grid](https://open.kattis.com/problems/grid)
+- [Coast Length](https://open.kattis.com/problems/coast)
+- [Terraces](https://open.kattis.com/problems/terraces)
+- [Dacey the Dice](https://open.kattis.com/problems/daceydice)
+- [Wet Tiles](https://open.kattis.com/problems/wettiles)
+- [Fire](https://open.kattis.com/problems/fire2)
+- [10 Kinds of People](https://open.kattis.com/problems/10kindsofpeople)
+- [Horror List](https://open.kattis.com/problems/horror)
+- [Lava](https://open.kattis.com/problems/lava)
+- [Zoning](https://open.kattis.com/problems/zoning)
+- [Pokémon Ice Maze](https://open.kattis.com/problems/pokemon)
+
+Breath First Search is a technique to find shortest paths in unweighted graphs. All nodes are preccessed in order of how far away they are from the starting node. Todo this, commonly we use a FIFO-queue. In python deque is a double ended queue and can be used as a FIFO-queue. This week we will focus on grids, and view them as graphs. All the neighbours of a grid cell is easy to find, there are at most 4, all the adjacent cells. The following code performs a BFS from the cell `(startx, starty)`, in an `N` by `M` grid.
+
+```python
+from collections import deque
+def BFS(startx, starty):
+    q = deque([(startx, starty)])
+    dist = {(startx, starty): 0}
+    while q:
+        x, y = q.popleft()
+        for nx, ny in [(x + 1, y), (x - 1, y), (x, y + 1), (x, y - 1)]:
+            if 0 <= nx < N and 0 <= ny < M:
+                coord = nx, ny
+                if coord not in dist:
+                    dist[coord] = dist[x, y] + 1
+                    q.append(coord)
+    return dist
+```
+
+However, this is not of any use yet, since the manhattan distance can be calculated directly. This code is however of use if the grid has cells that are forbidden to visit. Then those cells can be filtered out at the same place as cells outside the grid are filtered out now. Then we can find the shortest distance in a maze.

_compprogcourse/02_grid_bfs.md

@@ -12,38 +12,35 @@ <h2>Competitive Programming Course</h2>
   </div>
 </div>
 <div class="row">
-  <div class="col-md-6">
+  <div class="col-lg-6" style="margin-bottom:2%">
     <p>
       This course aims to help you train for upcoming programming competitions. Please don't feel the urge to not compete before finish this course, or before you solve all the problems linked. The best practice is to participate.
     </p>
   </div>
 </div>
 <div class="row">
   <div class="col-md-6">
+    <h3>Topics</h3>
+    <ul>
+      {% for topic in site.compprogcourse %}
+        <li><a href="{{ topic.url | prepend: site.baseurl }}">{{ topic.title }}</a></li>
+      {% endfor %}
+    </ul>
+  </div>
+  <div class="col-md-6" style="margin-top:2%">
 
-    <p> This course focuses on a subset of competitions with the following restrictions:</p>
+    <p> Focuses on competitions with the following restrictions:</p>
 
     <ul>
       <li>The output of your algorithm is either correct or not correct, there are no problems that you can solve partially.</li>
-      <li>Your code for a problem is submitted to a judge server that runs your code with a time limit on some hidder testcases.</li>
+      <li>Your code for a problem is submitted to a judge server that runs your code with a time limit on some hidden testcases.</li>
       <li>You use a <a href="https://open.kattis.com/help">language supported by Kattis</a>, since the problems we will use are hosted at Kattis.</li>
     </ul>
-  </div>
-  <div class="col-md-6">  
-    <p> Preliminaries </p>
+    <p> Preliminaries: </p>
     <ul>
       <li>Reading from stdin, printing to stdout. You can find information on how to do this in your prefered language on <a href="https://open.kattis.com/help">Kattis helppage</a> </li>
       <li>Basic data structures like Queue, Set, Map, Heap. Take the course <a href="http://cs.lth.se/edaa01/">EDAA01</a>, or read about these data structures on <a href="https://en.wikipedia.org/wiki/List_of_data_structures">wikipedia</a>.</li>
       <li>A Kattis-account, create one <a href="https://open.kattis.com/register">here</a>.</li>
     </ul>
   </div>
 </div>
-<div class="row">
-  <div class="col-md-6">
-    <ul>
-      {% for topic in site.compprogcourse %}
-        <li><a href="{{ topic.url | prepend: site.baseurl }}">{{ topic.title }}</a></li>
-      {% endfor %}
-    </ul>
-  </div>
-</div>