package water.api;

/**
 * Summary page referencing all tutorials.
 *
 * @author michal
 */
public class Tutorials extends HTMLOnlyRequest {

  @Override protected String build(Response response) {
    return "<div class='container'><div class='hero-unit' style='overflow: hidden'>"
    + "<style scoped='scoped'>"
    + "  .col { height: 330px; position: relative;}"
    + "  .col p { overflow: hidden; text-overflow: ellipsis; -o-text-overflow: ellipsis;}"
    + "  .col a { position: absolute; right: 40px; bottom: 10px; } "
    + "</style>"
    + "<h1>H<sub>2</sub>O Tutorials</h1>"
    + "<blockquote><small>A unique way to explore H<sub>2</sub>O</small></blockquote>"

    + "<div class='row'>"

    + "<div class='span3 col'>"
    + "  <h2 style='margin: 20px 0 0 0'>Random Forest</h2>"
    +   "<p>Random Forest is a classical machine learning algorithm serving for data classification. Learn how to use it with H<sub>2</sub>O.</it></p>"
    +   "<a href='/TutorialRFIris.html' class='btn btn-primary btn-large'>Try it!</a>"
    + "</div>"

    + "<div class='span3 col'>"
    +   "<h2 style='margin: 20px 0 0 0'>GLM</h2>"
    +   "<p>Generalized linear model is a generalization of linear regression. Experience its unique power on the top of H<sub>2</sub>O.</p>"
    +   "<a href='/TutorialGLMProstate.html' class='btn btn-primary btn-large'>Try it!</a>"
    + "</div>"

    + "<div class='span3 col'>"
    + "<h2 style='margin: 20px 0 0 0'>K-means</h2>"
    + "<p>Perform cluster analysis with H<sub>2</sub>O and K-means algorithm. H<sub>2</sub>O implements K-means, a highly scalable version.</p>"
    +   "<a href='/TutorialKMeans.html' class='btn btn-primary btn-large'>Try it!</a>"
    + "</div>"

    + "</div>"
    + "</div>"
    + "</div>";
  }
}

@@ -321,210 +321,62 @@
  %22  
-.col %7B height: 330px; position: relative;%7D%22%0A    + %22  .col p %7B overflow: hidden; text-overflow: ellipsis; -o-text-overflow: ellipsis;%7D%22%0A    + %22  .col a %7B position: absolute; right: 40px; bottom: 10
+h2 %7B font-size:18px; %7D%22%0A    + %22  p %7B font-size:16
 px; %7D
- 
 %22%0A  
@@ -516,24 +516,39 @@
 ockquote%3E%22%0A%0A
+    + %22%3C/div%3E%22%0A
     + %22%3Cdiv 
@@ -610,35 +610,8 @@
  %3Ch2
- style='margin: 20px 0 0 0'
 %3ERan
@@ -837,34 +837,24 @@
  btn-primary
- btn-large
 '%3ETry it!%3C/a
@@ -920,35 +920,8 @@
 %22%3Ch2
- style='margin: 20px 0 0 0'
 %3EGLM
@@ -1132,34 +1132,24 @@
  btn-primary
- btn-large
 '%3ETry it!%3C/a
@@ -1213,35 +1213,8 @@
 %22%3Ch2
- style='margin: 20px 0 0 0'
 %3EK-m
@@ -1435,30 +1435,246 @@
 mary
- btn-large'%3ETry it!%3C/a
+'%3ETry it!%3C/a%3E%22%0A    + %22%3C/div%3E%22%0A%0A    + %22%3Cdiv class='span3 col'%3E%22%0A    + %22%3Ch2%3EDeep Learning%3C/h2%3E%22%0A    + %22%3Cp%3EUse H%3Csub%3E2%3C/sub%3EO to model high-level abstractions in data by using architectures composed of multiple non-linear transformations.%3C/p
 %3E%22%0A 
@@ -1674,34 +1674,101 @@
 %3C/p%3E%22%0A    + 
-%22%3C/div
+  %22%3Ca href='/TutorialDeepLearning.html' class='btn btn-primary'%3ETry it!%3C/a
 %3E%22%0A
-%0A
     + %22%3C/div
@@ -1762,32 +1762,33 @@
 %0A    + %22%3C/div%3E%22%0A
+%0A
     + %22%3C/div%3E%22%0A 

Add Deep Learning Tutorial to the homepage.