On Friday, I had my second pull request merged into our master repo. As I explained before, I am in charge of the views in our project (You can read this post for more information). As such, I have maintained the views and make sure the all view follow along with the rest of the project. The last few weeks we are being merging features into the project and thus, I have been integrating the features very step of the way. Sorry, I have not been blogging but it been a busy semester at Berea College. Below, I am going to explain the progress that we have had so far, we almost were done.
The following pictures below are the current version of our the project.
Linking the Q&A Forum to main CodeWorkout project
As you see above we made a link to the Q&A Forum in the form of a button on the navbar. This was pretty simple.
The _navbar file is located in the app/views/layouts directory. This file in a partial meaning that it is used to be called as part of a view. Plus the _navbar is a html.haml file means that it use the HAML markup to encode HTML. This is the same for all the files involving views.
Here is a link to the file on our Master on Github: _navbar file
If you want to read more about the navbar read this post by myself.
Above you see that you can’t just access the Q&A Forum unless you a have authorization. In order to get authorization, the user has to do is log in as shown below. The authorization was done was Jacob, who used cancan which is a software that authorized users.
Now, that the user has logged in they can now process to the Q&A forum. Which bring us to the next part.
At this moment, we have logged on and are now in the Q&A Forum as shown by the breadcrumb bar shown below the navbar.
This is the Breadcrumb bar – > Home / Q&A Forum
You can find the _breadcrumb file in the app/views/layouts directory just like the _navibar file. Just like the _navibar file, the _breadcrumb file is a partial layout which means that it is used to be called as part of a view.
You can find the index view in the app/views/questions/ directory. This file is a view means the is the template that is shown to the user through the browser.
Now, that we are identified where we are as a user in the project. Let discuss what new and different about the index view. Now the index view has a new question button that leads the user to another view to where they can make a question. Shown below:
New Question View:
You can find the new question view in the app/views/questions/ directory. This file is a view means the is the template that is shown to the user through the browser.
Here is a link to the file on our Master on Github: New Question View file
The new question, now allows the user to type in a title, text, and tags where is be added to the database.
You can find the search is located in the app/views/questions/ directory. This file is a view means the is the template that is shown to the user through the browser.
Here is a link to the file on our Master on Github: Search file
Our newest feature the search allows the user to select and search for exercises as seen above and to select and search tags. Both these two features will update the index view.
Last but not least a user can type a keyword(s) into a the search bar and that will also update the page with questions surrounding the given keyword. This seen below.
The show is a the still being updated but this is the most updated version of the view. As you see the new version has a breadcrumb bar, like button, dislike button, edit button, delete button, flag dropdown menu with a submit button, exercise listing, user listing, posted listing and tags listing then the rest is the expect for the new respond button. I will explain that and why the Buttons for this page below.
You can find the show view is located in the app/views/questions/ directory. This file is a view means the is the template that is shown to the user through the browser.
Here is a link to the file on our Master on Github: Show View file
To start off, both like and dislike button add the number of users picked these buttons.
The Search was done was . To read more about the search read his blog post.
Next is the flag drop-down menu and submit button. The purse for this button is to flag inappropriate question. This category includes Flag, Duplicate, Off Topic, and Contains inappropriate language. We believe this will allow the users the opportune to notify the admin of these issues.
Next is the New Response button. This button allows the user to create a response to the question by a pop-up text box (Shown Below). Which will update the show view as shown below along with the text box
Going back to the index lets look at the edit view and delete action.
Edit Question View:
The new edit question view has a the breadcrumb that shows the question and the prefilled in the text box from the question selected. Plus, it now updates with the changes in the text box when to submit is clicked.
You can find the edit view is located in the app/views/questions/ directory. This file is a view means the is the template that is shown to the user through the browser.
Here is a link to the file on our Master on Github: Edit View file
Now, this action show a pop-up box question the user “are you sure?” which allow the user to give a second to the action and then deletes the question from the view, not the database.
This is the first of many to posts to follow this week explain very us part of this project, now that I have time to write posts. Plus, I will be making a portfolio page for this project. The next two posts will be explaining the different part of my portfolio and a reflection of my work working with my team using this post along with my group’s contract.