Landing : Athabascau University

Unit 5 - Ideas for Javascript on my site

  • Public
By Daniel Escobar March 23, 2016 - 3:46pm

Hello,

For this unit, I have tried to remain within the margin of 200-300 lines of code needed to complete this unit. I have a question on the following line found on : http://scis.lms.athabascau.ca/mod/book/view.php?id=13067&chapterid=336 

“We are looking for a fairly substantial amount of code, in the order of 200–300 lines (potentially in multiple smaller chunks), so think beyond a simple component or interface tweak.”

Do these “lines of code” take into account code from HTML, CSS, AND JavaScript? Or are these “lines” only taking into account JavaScript code? I would love some clarification on this point from my peers and my instructors.

The code ideas I have listed below are taking into account the required amount of JavaScript code only; not any HTML, or CSS code needed to make the scripts work on my site.

If the lines of code mentioned in the ‘choosing a project’ area of unit 5 also take into account HTML, and CSS then the javascript ideas below far exceed the requirements of this unit.

Feedback on the question above, and the ideas listed below would be very appreciated, thanks in advance.

Code ideas based on personas / scenarios chosen in Unit 1:

-          Page:

  • General (all pages):
    • Testimonials:
      • Revolving testimonials, at least 3 testimonials that have both a time delay, and navigation arrows.
    • Page pre-loader:
      • Create a script that displays a container with a simple gif animation until the site loads all content.
    • Slow-Scroller:
      • Create a script, that slows down scrolling on all pages.
        • Optional: If not complex enough, scrolls to anchors, and slows at each anchor point. For all pages.  
  • Home:
    • Specializing in area:
      • Each button, when clicked will expand the “specialization” container, with an animation.
        • Optional, if not complex enough, each of the 3 specializing in containers could be navigated as a ‘slide show’ with navigation arrows to either side of the user’s screen.
    • Recent work Area:
      • Same idea as the portfolio area, except with vertical animations, instead of horizontal.
        • Optional, again if not complex enough, each workpiece title will be a ‘slideshow’ item that can be navigated with arrows.
  • Portfolio:
    • Sidebar / Content area:
      • Make the sidebar expandable / constricted.
      • Content fills 95% of width, sidebar hides when constricted.
        • When expanded, the sidebar sits exactly the way it does right now, with sidebar items.
  • About:
    • Qualification:
      • Each qualification ‘button’ clicked will bring up a different qualification on the left.
        • Optional: If not complex enough, add a fade animation.
  • Blog:
    • Each ‘view next post’ button animates the next blog post, in tile fashion.
      • View Previous Post button shows at top instead of at bottom for users.
  • Contact:
    • Forms:
      • Two forms with validation messages for both the business inquiries, and the non-business inquiries.
        • Success message.
        • Required field message.
        • Validation error message.
        • Email message to admin.
          • Optional:
            • If not complex enough, will add a user confirmation email as well.

 

Thank you all for looking at these, you can find the most recent iteration of my portfolio here: http://student.athabascau.ca/~danieles2/project-iterations-unit4/unit-4-iterations/top-secret-laboratory-2016.3.03-v0.028/