百度前端技术学院2016春季班任务：听指令的小方块

阶段一

如图，实现一个类似棋盘的格子空间，每个格子用两个数字可以定位，一个红正方形的DOM在这个空间内，正方形中的蓝色边表示这是他的正面，有* 一个input输入框
在输入框中允许输入如下指令，按下按钮后，使得正方形做相应动作
GO：向蓝色边所面向的方向前进一格（一格等同于正方形的边长）
TUN LEF：向左转（逆时针旋转90度）
TUN RIG：向右转（顺时针旋转90度）
TUN BAC：向右转（旋转180度）
移动不能超出格子空间

阶段二

对于正方形的移动增加相应动画，包括移动和旋转
每个指令的执行时间是1s（可以自己调整）
增加新的指令如下：
TRA LEF：向屏幕的左侧移动一格，方向不变
TRA TOP：向屏幕的上面移动一格，方向不变
TRA RIG：向屏幕的右侧移动一格，方向不变
TRA BOT：向屏幕的下面移动一格，方向不变
MOV LEF：方向转向屏幕左侧，并向屏幕的左侧移动一格
MOV TOP：方向转向屏幕上面，向屏幕的上面移动一格
MOV RIG：方向转向屏幕右侧，向屏幕的右侧移动一格
MOV BOT：方向转向屏幕下面，向屏幕的下面移动一格

阶段三

如图，命令输入框由input变为textarea，可以允许输入多条指令，每一行一条
textarea左侧有一列可以显示当前行数的列（代码行数列），列数保持和textarea中一致
当textarea发生上下滚动时，代码行数列同步滚动
能够判断指令是否合法，不合法的指令给出提示（如图）
点击执行时，依次逐条执行所有命令
对于GO，TRA以及MOV指令增加可以移动格子数量的参数，例如
GO 3：向当前方向前进三格
TRA TOP 2：向屏幕上方平移两格
MOV RIG 4：方向转向屏幕右侧，向屏幕的右侧移动四格

阶段四

如图，新增元素“墙”，墙是正方形不可进入、越过的区域
新增修墙的指令，BIUD，执行指令时，会在当前方块面对的方向前修建一格墙壁，如果被指定修墙的地方超过边界墙或者已经有墙了，则取消修墙操作，并调用浏览器的console.log方法打印一个错误日志
新增粉刷的指令，BRU color，color是一个字符串，保持和css中颜色编码一致。执行指令时，如果当前方块蓝色边面对方向有紧相邻的墙，* 则将这个墙颜色改为参数颜色，如果没有，则通过调用浏览器的console.log方法，打印一个错误日志
尝试写一段代码，实现在空间内修建一个长长的五颜六色的墙或者有趣的图形
新增一个按钮，可以在空间内随机生成一些墙
增加一个指令：MOV TO x, y，会使得方块从当前位置移动到坐标为x，y的地方，移动过程中不能进入墙所在的地方，寻路算法请自行选择并实现，不做具体要求