feat: Search added.

2018-06-13 16:14:22 +03:00 · 2018-06-13 16:14:22 +03:00 · 7e9f08d10c
--- a/.gitignore
+++ b/.gitignore
@ -7,15 +7,12 @@ _data/components/*.yml
 _assets/js/module-directives.js

 .tmp
-components/*
-documentation/*
 npm/*

 cacert.pem

 /*.log
 /*.md
-/*.html
 /*.svg

 bin/
--- a/_assets/css/_styles.scss
+++ b/_assets/css/_styles.scss
@ -1392,6 +1392,158 @@ $border-color: #d9d9d9;
  height: 175px;
 }

+
+/* Search */
+
+#page-search {
+  margin: 0;
+  position: absolute;
+  top: 23px;
+  background-color: transparent;
+  padding: 0;
+  right: 435px;
+  text-align: right;
+  left: 18%;
+  margin-left: 85px;
+  max-width: 930px;
+
+  > div {
+    text-align: left;
+    display: inline-block;
+    width: 100%;
+  }
+
+  form {
+    margin-bottom: 0;
+    box-shadow: 3px 3px 19px rgba(0, 0, 0, 0.1);
+  }
+
+  table {
+    margin: 0;
+    padding: 0;
+    border: none;
+
+    td {
+      border: none;
+    }
+  }
+
+  input {
+    width: 100%;
+    height: 39px;
+    padding-left: 40px;
+    padding-right: 15px;
+    border: 0;
+    font-size: 19px;
+    font-family: $font-light;
+    outline: none;
+    background-image: url(image_path('search.svg'));
+    background-repeat: no-repeat;
+    background-position: 10px 50%;
+    background-size: 16px;
+    background-color: transparent;
+  }
+  
+  /* Google CSE styles */
+
+  .gsc-input-box {
+    box-shadow: none;
+    border: 0;
+    height: auto;
+  }
+
+  .gsc-input {
+    background-image: none !important;
+    text-indent: 0 !important;
+    height: 39px;
+    &::placeholder {
+      opacity: 0 !important;
+    }
+
+    td + td {
+      display: none;
+    }
+  }
+  table.gsc-search-box td{
+    background-color: #fff;
+    padding: 0;
+   &.gsc-input {
+      background-color: #fff;
+      padding: 0 5px 0 10px;
+    } 
+  }
+  .gsc-control-cse {
+    background: none;
+    border: 0;
+    padding: 0;
+  }
+
+  td.gsc-search-button {
+    background: transparent url(../images/search.png) no-repeat 50% 50%;
+    cursor: pointer;
+    width: 32px !important;
+  }
+
+  input.gsc-search-button {
+    border-radius: 0;
+    margin: 0;
+    border: 0;
+    background: none;
+    opacity: 0;
+    padding: 8px 7px 7px;
+  }
+
+  button.gsc-search-button, #page-search .gcsc-branding {
+    display: none !important;
+  }
+
+  &.search-visibility {
+    display: block;
+  }
+}
+
+.toggle-nav,
+.show-search {
+  display: none;
+  cursor: pointer;
+}
+
+.nav.nav-visibility {
+  display: block;
+}
+
+.k-tabstrip {
+  border: 1px solid #ccc;
+
+  .k-link {
+    padding: 0;
+  }
+  .k-content,
+  .k-loading {
+    border: 0;
+  }
+  .k-tabstrip-items {
+    padding: 0;
+    border-bottom: 1px solid;
+  }
+  .k-item {
+    border-width: 0 1px 0 0;
+    border-style: solid;
+    font-weight: bold;
+    font-size: 14px;
+    padding: .72em 1.5em;
+    cursor: pointer;
+    transition-property: background-color, color;
+    transition-duration: 0.2s;
+    transition-timing-function: ease;
+  }
+  .k-content pre {
+    border: 0;
+    padding: 0;
+    margin: 1em 0;
+  }
+}
+
 /* Reading Status */

 .reading-status {
@ -2012,15 +2164,9 @@ $callout-bg: #d7dfe3;
  }
 }

-/* Community & Support styles */
-
-.community-and-support {
-
-}
-
 /* Global Search */

-.global-search {
+#page-search, .global-search {
  background-color: #fff;
  border-bottom: 1px solid #d2d5d7;
  display: block;
@ -2149,113 +2295,6 @@ $callout-bg: #d7dfe3;
  }
 }

-/* Roadmap Styles */
-
-.milestone h2 {
-  float: left;
-  margin: 0;
-  max-width: 100%;
-}
-
-.milestone p {
-  float: right;
-  margin: 16px 0 0;
-  font-size: 14px;
-  font-family: $font-medium;
-}
-
-.milestone-open,
-.milestone-closed {
-  display: inline-block;
-  padding-left: 15px;
-}
-
-.milestone p path {
-  fill: #929ba4;
-}
-
-.milestone-gh {
-  display: inline-block;
-  margin-left: 5px;
-  font-size: 14px;
-  font-family: $font-regular;
-}
-
-.milestone svg {
-  width: 16px;
-  height: 16px;
-  vertical-align: middle;
-  margin-top: -3px;
-}
-
-.issue-number svg {
-  width: 12px;
-  height: 12px;
-  vertical-align: middle;
-  margin-top: -1px;
-}
-
-.milestone-gh svg,
-.issue-number svg {
-  margin-right: 3px;
-}
-
-.milestone-gh path {
-  fill: $link-color;
-}
-
-.issue-number path {
-  fill: #c1c1c1;
-}
-
-.milestone-gh:hover path,
-.issue-number:hover path {
-  fill: $link-hover-color;
-}
-
-ul.issues,
-ul.labels {
-  padding: 0;
-  list-style-type: none;
-}
-
-ul.issues > li {
-  padding-bottom: 7px;
-  padding-top: 7px;
-  padding-left: 20px;
-  font-size: 14px;
-  line-height: 21px;
-  background: url(image_path('issue.svg')) no-repeat 0 8px;
-  background-color: transparent;
-  border-bottom: 1px solid #e4e4e4;
-}
-
-ul.issues > li.state-closed {
-  background-image: url(image_path('checkmark.svg'));
-}
-
-ul.labels {
-  display: inline-block;
-
-  li {
-    display: inline-block;
-    font-size: 12px;
-    line-height: 18px;
-    vertical-align: top;
-    padding: 1px 5px;
-    border-radius: 2px;
-  }
-}
-
-.issue-number {
-  display: block;
-  float: right;
-  font-size: 12px;
-  line-height: 21px;
-  color: #c1c1c1;
-}
-
-
 /* Pager Styles */

 .site-pager {
--- a/_assets/js/search-results.js
+++ b/_assets/js/search-results.js
@ -8,76 +8,4 @@ $(function() {
    var params = location.search.replace(/(^\?)/,'').split("&").map(toKV.bind({}))[0];

    $("[name=q]").val(params.q);
-
-    var ds = new kendo.data.DataSource({
-        transport: {
-            parameterMap: function(data) {
-                return {
-                    num: data.pageSize,
-                    start: data.skip,
-                    site: gsaCollection,
-                    q: params.q,
-                    filter: 0
-                }
-            },
-            read: {
-                url: window.searchApplianceUrl // ?q=test&site=documentation_progress_openedge&num=130
-            }
-        },
-        change: function() {
-            var resultsPresent = this.data().length > 0;
-            $("#search-container").toggle(resultsPresent)
-            $("#no-results").toggle(!resultsPresent)
-        },
-        serverPaging: true,
-        pageSize: 10,
-        schema: {
-            type: "xml",
-            data: function(data) {
-                var results = (data.GSP.RES && data.GSP.RES.R) || [];
-
-                if (!$.isArray(results)) {
-                    results = [results];
-                }
-
-                return results.map(function(item) {
-                    return {
-                        title: item.T["#text"],
-                        url: item.U["#text"],
-                        excerpt: item.S["#text"]
-                    }
-                });
-            },
-            total: "/GSP/RES/M/text()"
-        }
-    })
-
-    $("#results").kendoListView({
-        dataSource: ds,
-        template: $("#results-template").html(),
-        dataBound: function() {
-            window.scrollTo(0, 0)
-        }
-    });
-
-    $(".site-pager").kendoPager({
-        dataSource: ds,
-        buttonCount: 5,
-        messages: {
-         previous: "Previous",
-         next: "Next",
-         display: "",
-         empty: ""
-       }
-    });
-
-    $(".results-message").kendoPager({
-        dataSource: ds,
-        numeric: false,
-        previousNext: false,
-        messages: {
-         display: "{0}-{1} of {2} results",
-         empty: "Sorry, there were no results found. Maybe try a broader search."
-       }
-    });
 });
--- a/_includes/nav.html
+++ b/_includes/nav.html
@ -76,7 +76,7 @@
                    <span class="sr-only">Search</span>
                </a>

-                <form class="global-search" action="{{site.baseurl}}/search/">
+                <form class="global-search" action="{{site.baseurl}}/search">
                  <input name="q" />
                </form>
              </li>
--- a/_layouts/default.html
+++ b/_layouts/default.html
@ -6,20 +6,6 @@
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
        <meta name="turbolinks-root" content="{{site.baseurl}}/">
-
-        {% capture generated_title %}
-            {% if page.is_index %}{{ page.component | default: page.package }}{% endif %}
-            {{ page.title }}
-            {% if page.api_reference %}
-            - {{ page.package }} API
-            {% elsif page.is_index %}
-            - Documentation
-            {% elsif page.package %}
-            - {{ page.component | default: page.package }}
-            {{ page.subsection }}
-            {% endif  %}
-            - {{ site.product }}
-        {% endcapture %}
        <title>{{ page.page_title | default: generated_title }}</title>
        <meta name="description" content="{{ page.description }}" />

@ -29,11 +15,6 @@
        <link rel="canonical" href="{{ site.url  }}{{ page.canonical_url }}">
        {% endif %}

-        {% if page.brand == "homepage" %}
-        <link rel="stylesheet" href="https://telerik-media.s3.amazonaws.com/kendo/kendo-angular-ui.css" />
-        {% stylesheet "homepage" %}
-        {% endif %}
-
        <link rel="stylesheet" href="https://d6vtbcy3ong79.cloudfront.net/telerik-navigation/1.0.28/css/index.min.css" />
        <link rel="stylesheet" href="https://d6vtbcy3ong79.cloudfront.net/fonts/1.1.5/css/metric.min.css" />
        <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto+Mono|Roboto:300,400,500,700" />
@ -108,10 +89,6 @@
 </div>

 {% include footer.html %}
-{% if page.use_runner %}
-{% javascript "systemjs-config-runner" %}
-{% javascript "runner" %}
-{% endif %}

 <script src="https://da189i1jfloii.cloudfront.net/js/kinvey-html5-sdk-3.10.1.min.js"></script>
 </body>
--- a/_common/root/search.html
+++ b/_common/root/search.html
@ -2,7 +2,7 @@
 title: Search results
 position: 1
 heading: Search results
-subheading:
+include_in_navigation: false
 ---
 <div class="container-fluid headbanner">
  <div class="row">
@ -12,7 +12,7 @@ subheading:
      <article>
        <h1>{{ page.heading }}</h1>
        <div class="local-search mt-20">
-          <form action="{{site.baseurl}}/search/" method="get">
+          <form action="{{site.baseurl}}/search" method="get">
            <input id="local-search" placeholder="Search for &hellip;" name="q" />
          </form>
        </div>
@ -24,14 +24,10 @@ subheading:
 </div>

 <div class="container-fluid mt-30 mb-80">
-
  <div class="row">
  <div class="col-sm-10 col-sm-offset-1 col-md-10 col-md-offset-1 col-lg-8 col-lg-offset-2">
    <div class="row">
    <div class="col-sm-12 col-md-12 col-lg-10 col-lg-offset-1">
-
-
-
        <div id="search-container" style="display: none">
            <div class="results-message mb-5"></div>
            <div id="results" class="mb-20">
@ -65,8 +61,15 @@ subheading:
 </div>

 <script>
-    var searchApplianceUrl = "{{site.search_appliance_url}}";
-    var gsaCollection = "{{site.gsa_collection}}";
+(function () {
+    var cx = {% if page.slug == 'knowledge_base' %} '{{site.google_custom_kb_search}}' {% else %} '{{site.google_custom_search}}' {% endif %};
+  var gcse = document.createElement('script');
+  gcse.async = true;
+  gcse.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') +
+    '//www.google.com/cse/cse.js?cx=' + cx;
+  var s = document.getElementsByTagName('script')[0];
+  s.parentNode.insertBefore(gcse, s);
+  })();
 </script>

 {% javascript "search-results" %}