Site changes p2

bower.json

@@ -2,16 +2,17 @@
   "name": "Codio Site",
   "version": "1.0.0",
   "devDependencies": {
+    "animate.css": "~3.3.0",
+    "blueimp-md5": "~1.1.0",
     "cookie-monster": "~0.3.0",
     "html5shiv": "~3.7.2",
-    "blueimp-md5": "~1.1.0",
-    "animate.css": "~3.3.0",
     "jquery": "~2.1.4",
-    "wow.js": "~1.1.2",
-    "swiftype-jquery": "*",
-    "numeral": "~1.5.3",
     "jquery-ui-slider-pips": "~1.10.5",
+    "lodash": "~4.2.0",
     "magnific-popup": "~1.0.0",
-    "lodash": "~4.2.0"
+    "numeral": "~1.5.3",
+    "sass-flex-mixin": "^1.0.3",
+    "swiftype-jquery": "*",
+    "wow.js": "~1.1.2"
   }
 }

source/index.html.erb

@@ -7,20 +7,172 @@ description: The cloud infrastructure and learning management platform for compu
 priority: 1.0
 ---
 
+<!-- another header -->
 <section class="section-scroll">
-  <div class="header-block">
-    <div class="vertical">
-      <div class="header-content">
-        <div class="quote">Higher performance Computer Science Programs</div>
-        <div class="text">
-          Save time. Reduce costs. Boost engagement. Gain better learning insights.
-        </div>
+  <div class="higher-performance">
+    <div class="higher-performance-top">
+      <div class="higher-performance-top-title">
+        Higher Performance Computer Science Programming
+      </div>
+      <div class="higher-performance-top-sub-title">
+        Save instructor time. Cut program costs. Boost student engagement. Gain rich learning insights.
+      </div>
+      <div class="higher-performance-top-action">
+        <div>Learn more</div>
+        <div class="higher-performance-top-action-icon"></div>
       </div>
     </div>
-    <div class="button-block">
-      <%= link_to 'Explore', '/cloudcs', class: 'button button-main button-rounded' %>
+    <div class="higher-performance-bottom">
+      <div class="higher-performance-bottom-two-text two-text">
+        <div class="two-text-left">
+          CS departments save more than $50,000 per year
+        </div>
+        <div class="two-text-line"></div>
+        <div class="two-text-right">
+          Instructors recover more than 20% of their time
+        </div>
+      </div>
+      <div class="higher-performance-bottom-gray-text">
+        *Based on a single one-year CS course with 300 students.
+      </div>
     </div>
   </div>
+  <%= partial "topic-text-check-action-quote",
+      locals: {
+          topic: {
+              title: "Instructor Time",
+              text: "Instructors waste gours setting up and sharing a programming environment,\
+                running studen code, and keeping theis course in sync with a general LMS."
+          },
+          text: [
+              "For each instructor, redirect $15,000+ worth of admin time to high-value tasks.",
+              "Cut time wasted on admin and IT tasks by an 20% or more."
+          ],
+          check: [
+              "Configure and template programming projects and share it with the class in seconds.",
+              "Access and run student code from any connected device in one click.",
+              "Automatically keep your course and grades in sync with Blackboard, Canvas, Moodle, and more."
+          ],
+          action: {
+              text: "schedule a call",
+              link: "/start-edu-trial"
+          },
+          quote: {
+              topic: "Get your Sundays back",
+              text: "Click on a student's project and five seconds later I can compile, run and \
+                debug without having to unzip or copy and paste it into my own environment. The time\
+                I save with this feature alone justifies the Codio platform and gives me back my Sundays.",
+              author: {
+                  name: "Dr. Gordon Fraser",
+                  occupation: "Senior Lecturer at Sheffield University",
+                  avatar: "img/assets/school/white-young-man.png"
+              }
+          }
+      }
+  %>
+  <%= partial "topic-text-check-action-quote",
+              locals: {
+                  topic: {
+                      title: "Grading Costs",
+                      text: "Grading is a tedious, low-value task, which costs most CS departments tens of \
+                        thousands of dollars in instructor time each year."
+                  },
+                  text: [
+                      "Save tens of thousands of dollars in grading costs each year.",
+                      "Grade 20-40% faster to automate up to 85% of your intro CS course grading."
+                  ],
+                  check: [
+                      "Auto-grade argument-based and stdin inputs without writing a single line of test code.",
+                      "Speed up manual grading by clicking your way through customizable rubrics.",
+                      "Write custom code in any language to instantly assess almost any testable case."
+                  ],
+                  action: {
+                      text: "schedule a call",
+                      link: "/start-edu-trial"
+                  },
+                  quote: {
+                      topic: "Convert manually graded assignments to auto-graded ones",
+                      text: "We spend a siz-figure sum each year in grading assignments. We will now convert many \
+                        of our manually graded assignments into auto-graded coding assessments. We fully expect to \
+                        be able to make cost savings in the tens of thousands of dollars by using Codio's \
+                        auto-grading functionality.",
+                      author: {
+                          name: "Mateen Rizki",
+                          occupation: "Chair of the Department of Computer Science & Engeneering at Wright State University",
+                          avatar: "img/assets/school/older_man_with_glasses.svg"
+                      }
+                  }
+              }
+  %>
+  <%= partial "topic-text-check-action-quote",
+              locals: {
+                  topic: {
+                      title: "Student Satisfaction",
+                      text: "When instructors lack the time and tools needed to provide today's CS student with \
+                        the learning expirience they expect, student performance and satisfaction suffer."
+                  },
+                  text: [
+                      "Reduce student attrition and rescue $10,000+ in fees per semester.",
+                      "Boost student satisfaction with an engaging learning expirience and more 1-on-1 help."
+                  ],
+                  check: [
+                      "Instant access to student code makes easy to critique and compare solutions during labs.",
+                      "Time-based insight into each student's programming helps them to correct course before it's too late.",
+                      "Students can access their Codio IDE, GUI options, coursework, and assessments in one place — from any device."
+                  ],
+                  action: {
+                      text: "schedule a call",
+                      link: "/start-edu-trial"
+                  },
+                  quote: {
+                      topic: "Make labs collaborative with instant access to student code",
+                      text: "We show student assignments alongside the lecturer's own solution on the \
+                        classroom projector. This lets us demonstrate that there are many valid solutions \
+                        to the same problem, occasionally superior to the teacher's! We also discuss and \
+                        diagnose problems collaboratively during class and being able to boot up projects \
+                        in seconds means we can do it seamlessly.",
+                      author: {
+                          name: "Mateen Rizki",
+                          occupation: "Chair of the Department of Computer Science & Engeneering at Wright State University",
+                          avatar: "img/assets/school/older_man_with_glasses.svg"
+                      }
+                  }
+              }
+  %>
+  <%= partial "topic-text-check-action-quote",
+              locals: {
+                  topic: {
+                      title: "Easy Setup",
+                      text: "Many colleges and universities want to upgrade to a cloud infrastructure \
+                        and LMS made for CS programs, but the cost, bth in time and money, prevents them."
+                  },
+                  text: [
+                      "Save thousands of dollars in trainig fees — we train facility for free.",
+                      "Start delivering courses in Codio within days of getting started."
+                  ],
+                  check: [
+                      "Facility, IT, and leadership receive free 1-on-1 an 1-to-many trainig.",
+                      "All licenses come with unlimited phone and email support.",
+                      "Large schools like Columbia are up and running in weeks, not months."
+                  ],
+                  action: {
+                      text: "schedule a call",
+                      link: "/start-edu-trial"
+                  },
+                  quote: {
+                      topic: "Columbia fully implemented Codio in only 2 weeks",
+                      text: "After 2-months of trying (and failing) to set up another platform, \
+                        we then discovered Codio, fully implemented our solution in 2 weeks with \
+                        no product customisations needed. We have since been running our edX \
+                        courses and internal courses very successfully.",
+                      author: {
+                          name: "Professor Eitan Grinspun",
+                          occupation: "Associate Professor of Computer Science at Columbia",
+                          avatar: "img/assets/school/white-young-man-black-hair.png"
+                      }
+                  }
+              }
+  %>
   <div class="row">
     <div class="span12">
       <div class="cell-wrapper">
@@ -105,4 +257,19 @@ priority: 1.0
       </div>
     </div>
   </div>
+  <%= partial "schedule-logos",
+      locals: {
+          title: "Schedule a demo today and get Codio for the Fall 2018 Semester — free",
+          actions: [
+              {
+                  title: "Schedule a call",
+                  link: "start-edu-trial"
+              },
+              {
+                  title: "See the codio platform",
+                  link: "http://news.codio.com/contact-us"
+              }
+          ]
+      }
+  %>
 </section>

source/javascripts/all.js

@@ -2,10 +2,10 @@
 //= require bootstrap-sprockets
 //= require cookie-monster
 //= require blueimp-md5
-//= require jquery-ui/ui/core.js
+//= require jquery-ui/jquery-ui.js
 //= require jquery-ui/ui/widget.js
-//= require jquery-ui/ui/mouse.js
-//= require jquery-ui/ui/slider.js
+//= require jquery-ui/ui/widgets/mouse.js
+//= require jquery-ui/ui/widgets/slider.js
 //= require jquery-ui-slider-pips/dist/jquery-ui-slider-pips.js
 //= require wow.js/dist/wow.js
 //= require swiftype-jquery/jquery.ba-hashchange.min.js

source/javascripts/partials/_header.es6

@@ -22,22 +22,8 @@ $(() => {
     $dropdownMenu.addClass('opaque-background');
   }
 
-  var setHeaderStyle = () => {
+  $(() => {
     setOpaque();
-  }
-
-  if ($('body').innerWidth() <= 783) {
-    setOpaque();
-  } else {
-    setHeaderStyle();
-  }
-
-  $(window).resize(() => {
-    if ($('body').innerWidth() > 783) {
-      setHeaderStyle();
-    } else {
-      setOpaque();
-    }
   });
 
   // Responsive Menu

source/javascripts/partials/_index.es6

@@ -3,6 +3,13 @@
 $(() => {
   const headerHeight = $('header').height()
   const eventType = ((document.ontouchstart !== null) ? 'click' : 'touchstart')
+  const higherPerformanceHeight = $('.higher-performance').height()
+
+  $('.higher-performance-top-action-icon').click(function() {
+    $('html, body').animate({
+      scrollTop: higherPerformanceHeight
+    }, 500);
+  });
 
   $('.scrollto').on(eventType, function (event) {
     event.preventDefault()

source/partials/_header.erb

@@ -4,7 +4,7 @@
 <div class="mobile-nav">
   <%= partial "nav" %>
 </div>
-<header class="fixed transparent-background <% if current_resource.data.transparent %>should-be-transparent<% end %>">
+<header class="navigation-header fixed transparent-background <% if current_resource.data.transparent %>should-be-transparent<% end %>">
   <div class="container animated fadeInDown">
   	<div class="logo">
 	    <a href="/" class="logo-link"><%= image_tag 'logo-dark.svg', alt: 'Codio', class: 'img-logo' %></a>

source/partials/_nav.erb

@@ -9,7 +9,7 @@
     <%= link_to 'Log in', '/p/login' %>
   </li>
   <li class='highspot'>
-    <%= link_to 'Free trial', (defined?(surl) && !surl.nil? ? surl : '/start-edu-trial'), class: 'button button-rounded-small' %>
+    <%= link_to 'Schedule a call', (defined?(surl) && !surl.nil? ? surl : '/start-edu-trial'), class: 'button button-rounded-small' %>
   </li>
   <li>
     <%= link_to 'Join Class', '/p/join-class' %>

source/partials/_schedule-logos.erb

@@ -0,0 +1,27 @@
+<div class="schedule">
+  <div class="schedule-title">
+    <%= title %>
+  </div>
+  <div class="schedule-actions">
+    <% if defined?(actions) %>
+      <% actions.each_with_index do |action, index| %>
+        <%
+          startRow = ((index % 5) == 2 || (index % 5) == 0)
+          endRow = ((index % 5) == 4 || (index % 5) == 1)
+        %>
+        <% if startRow %>
+          <div class="schedule-actions-row <%= index %>">
+        <% end %>
+        <div class="action-button">
+          <a class="button action-button-link <%= index %> button-rounded button-main" href="<%= action[:link] %>">
+            <%= action[:title] %>
+          </a>
+        </div>
+        <% if endRow %>
+          </div>
+        <% end %>
+      <% end %>
+    <% end %>
+
+  </div>
+</div>

source/partials/_schools-grid.erb

@@ -0,0 +1,46 @@
+<div class="school-grid">
+  <div class="school-grid-left">
+    <% if defined? schools %>
+      <div class="school-title">
+        <%= schools[0][:title] %>
+      </div>
+      <div class="school-desription">
+        <%= schools[0][:description] %>
+      </div>
+    <% end %>
+  </div>
+  <div class="school-grid-right">
+    <div class="school-grid-right-top">
+      <% if defined? schools %>
+        <div class="school-title">
+          <%= schools[1][:title] %>
+        </div>
+        <div class="school-desription">
+          <%= schools[1][:description] %>
+        </div>
+      <% end %>
+    </div>
+    <div class="school-grid-right-bottom">
+      <div class="school-grid-right-bottom-left">
+        <% if defined? schools %>
+          <div class="school-title">
+            <%= schools[2][:title] %>
+          </div>
+          <div class="school-desription">
+            <%= schools[2][:description] %>
+          </div>
+        <% end %>
+      </div>
+      <div class="school-grid-right-bottom-right">
+        <% if defined? schools %>
+          <div class="school-title">
+            <%= schools[3][:title] %>
+          </div>
+          <div class="school-desription">
+            <%= schools[3][:description] %>
+          </div>
+        <% end %>
+      </div>
+    </div>
+  </div>
+</div>