Merge branch 'development'

* development:
  Fix image embedding for confluence, fixes #439
  Update dependencies
  Send correct mimetype for ComputedRawPage in live mode
  Compile theme, a bug put back the old theme
  Tweak theme and search

composer.json

@@ -21,7 +21,7 @@
         "symfony/console": "~3.0",
         "symfony/finder": "~3.0",
         "webuni/commonmark-table-extension": "0.6.*",
-        "webuni/front-matter": "^0.2.0",
+        "webuni/front-matter": "^1.0.0",
         "symfony/process": "^3.1"
     },
     "autoload": {

gulpfile.js

@@ -78,7 +78,7 @@ style_tasks.push('lint-css');
 
 gulp.task("styles", style_tasks);
 
-gulp.task('watch', function () {
+gulp.task('watch', ['default'], function () {
     // Watch .less files
     gulp.watch('themes/**/less/**/*.less', ['styles']);
 });

libs/Format/Base/ComputedRawPage.php

@@ -11,6 +11,11 @@ abstract class ComputedRawPage implements Page
         $this->raw = $content;
     }
 
+    public function getFilename()
+    {
+        return $this->raw->getUri();
+    }
+
     public function getContent()
     {
         return $this->raw->getContent();

libs/Format/Confluence/Api.php

@@ -229,7 +229,8 @@ class Api
         // Check if an attachment with
         // this name is uploaded
         try {
-            $result = json_decode($this->getClient()->get("content/$id/child/attachment?filename=$attachment[filename]")->getBody(), true);
+            $url = "content/$id/child/attachment?filename=" . urlencode($attachment['filename']);
+            $result = json_decode($this->getClient()->get($url)->getBody(), true);
         } catch (BadResponseException $e) {
             throw $this->handleError($e);
         }
@@ -242,11 +243,13 @@ class Api
             $url .= "/{$result['results'][0]['id']}/data";
         }
 
+        $contents = array_key_exists('file', $attachment) ? fopen($attachment['file']->getPath(), 'r') : $attachment['content'];
+
         try {
             $this->getClient()->post(
                 $url,
                 [
-                    'multipart' => [['name' => 'file', 'contents' => fopen($attachment['file']->getPath(), 'r')]],
+                    'multipart' => [['name' => 'file', 'contents' => $contents, 'filename' => $attachment['filename']]],
                     'headers' => ['X-Atlassian-Token' => 'nocheck'],
                 ]
             );

libs/Format/Confluence/ContentPage.php

@@ -1,6 +1,8 @@
 <?php namespace Todaymade\Daux\Format\Confluence;
 
 use Todaymade\Daux\Format\Base\EmbedImages;
+use Todaymade\Daux\Tree\ComputedRaw;
+use Todaymade\Daux\Tree\Entry;
 use Todaymade\Daux\Tree\Raw;
 
 class ContentPage extends \Todaymade\Daux\Format\Base\ContentPage
@@ -17,11 +19,16 @@ class ContentPage extends \Todaymade\Daux\Format\Base\ContentPage
             ->embed(
                 $content,
                 $this->file,
-                function ($src, array $attributes, Raw $file) {
+                function ($src, array $attributes, Entry $file) {
-                    $filename = basename($file->getPath());
 
                     //Add the attachment for later upload
-                    $this->attachments[$filename] = ['filename' => $filename, 'file' => $file];
+                    if ($file instanceof Raw) {
+                        $filename = basename($file->getPath());
+                        $this->attachments[$filename] = ['filename' => $filename, 'file' => $file];
+                    } else if ($file instanceof ComputedRaw) {
+                        $filename = $file->getUri();
+                        $this->attachments[$filename] = ['filename' => $filename, 'content' => $file->getContent()];
+                    }
 
                     return $this->createImageTag($filename, $attributes);
                 }
@@ -41,6 +48,14 @@ class ContentPage extends \Todaymade\Daux\Format\Base\ContentPage
         $img = '<ac:image';
 
         foreach ($attributes as $name => $value) {
+            if ($name == 'style') {
+                $re = '/float:\s*?(left|right);?/';
+                if (preg_match($re, $value, $matches)) {
+                    $img .= ' ac:align="' . $matches[1] . '"';
+                    $value = preg_replace($re, "", $value, 1);
+                }
+            }
+
             $img .= ' ac:' . $name . '="' . htmlentities($value, ENT_QUOTES, 'UTF-8', false) . '"';
         }
 

libs/Server/Server.php

@@ -4,6 +4,7 @@ use Symfony\Component\Console\Output\NullOutput;
 use Todaymade\Daux\Daux;
 use Todaymade\Daux\DauxHelper;
 use Todaymade\Daux\Exception;
+use Todaymade\Daux\Format\Base\ComputedRawPage;
 use Todaymade\Daux\Format\Base\LiveGenerator;
 use Todaymade\Daux\Format\HTML\RawPage;
 
@@ -59,7 +60,12 @@ class Server
             return;
         }
 
-        header('Content-type: text/html; charset=utf-8');
+        if ($page instanceof ComputedRawPage) {
+            header('Content-type: ' . MimeType::get($page->getFilename()));
+        } else {
+            header('Content-type: text/html; charset=utf-8');
+        }
+
         echo $page->getContent();
     }
 

package.json

@@ -10,7 +10,7 @@
     "gulp-postcss": "^6.1.1",
     "gulp-rename": "^1.2.2",
     "gulp-stylelint": "^3.0.0",
-    "stylelint-config-standard": "^15.0.1"
+    "stylelint-config-standard": "^16.0.0"
   },
   "scripts": {
     "build": "gulp",

templates/home.php

@@ -1,4 +1,7 @@
 <?php $this->layout('theme::layout/00_layout') ?>
+
+<?php $this->start('classes') ?>homepage<?php $this->stop() ?>
+
 <div class="Navbar hidden-print">
     <div class="container">
         <?php $this->insert('theme::partials/navbar_content', ['params' => $params]); ?>

templates/layout/00_layout.php

@@ -37,7 +37,7 @@
     <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
     <![endif]-->
 </head>
-<body class="<?= $params['html']['float'] ? 'with-float' : ''; ?>">
+<body class="<?= $params['html']['float'] ? 'with-float' : ''; ?> <?= $this->section('classes'); ?>">
     <?= $this->section('content'); ?>
 
     <?php

templates/layout/05_page.php

@@ -1,17 +1,13 @@
 <?php $this->layout('theme::layout/00_layout') ?>
-
-<header class="Navbar hidden-print">
-    <?php $this->insert('theme::partials/navbar_content', ['params' => $params]); ?>
-</header>
 <div class="Columns content">
     <aside class="Columns__left Collapsible">
-        <div class="Collapsible__container">
+        <button type="button" class="Button Collapsible__trigger">
-            <button type="button" class="Button Collapsible__trigger">
+            <span class="Collapsible__trigger--bar"></span>
-                <span class="Collapsible__trigger--bar"></span>
+            <span class="Collapsible__trigger--bar"></span>
-                <span class="Collapsible__trigger--bar"></span>
+            <span class="Collapsible__trigger--bar"></span>
-                <span class="Collapsible__trigger--bar"></span>
+        </button>
-            </button>
+
-        </div>
+        <?php $this->insert('theme::partials/navbar_content', ['params' => $params]); ?>
 
         <div class="Collapsible__content">
             <!-- Navigation -->

templates/partials/navbar_content.php

@@ -1,11 +1,11 @@
-<a class="Navbar__brand" href="<?= $params['base_page'] . $params['index']->getUri(); ?>"><?= $params['title']; ?></a>
+<a class="Brand" href="<?= $params['base_page'] . $params['index']->getUri(); ?>"><?= $params['title']; ?></a>
 
-<?php if ($params['html']['search']) {
+<?php if ($params['html']['search']) { ?>
-    ?>
     <div class="Search">
-        <svg class="Search__icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 451 451"><path d="M447.05 428l-109.6-109.6c29.4-33.8 47.2-77.9 47.2-126.1C384.65 86.2 298.35 0 192.35 0 86.25 0 .05 86.3.05 192.3s86.3 192.3 192.3 192.3c48.2 0 92.3-17.8 126.1-47.2L428.05 447c2.6 2.6 6.1 4 9.5 4s6.9-1.3 9.5-4c5.2-5.2 5.2-13.8 0-19zM26.95 192.3c0-91.2 74.2-165.3 165.3-165.3 91.2 0 165.3 74.2 165.3 165.3s-74.1 165.4-165.3 165.4c-91.1 0-165.3-74.2-165.3-165.4z"/></svg>
+        <svg class="Search__icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 451 451">
-        <input type="search" id="tipue_search_input" class="Search__field" placeholder="Search..." autocomplete="on" results=25 autosave=text_search>
+            <path d="M447.05 428l-109.6-109.6c29.4-33.8 47.2-77.9 47.2-126.1C384.65 86.2 298.35 0 192.35 0 86.25 0 .05 86.3.05 192.3s86.3 192.3 192.3 192.3c48.2 0 92.3-17.8 126.1-47.2L428.05 447c2.6 2.6 6.1 4 9.5 4s6.9-1.3 9.5-4c5.2-5.2 5.2-13.8 0-19zM26.95 192.3c0-91.2 74.2-165.3 165.3-165.3 91.2 0 165.3 74.2 165.3 165.3s-74.1 165.4-165.3 165.4c-91.1 0-165.3-74.2-165.3-165.4z"/>
+        </svg>
+        <input type="search" id="tipue_search_input" class="Search__field" placeholder="Search..." autocomplete="on"
+               results=25 autosave=text_search>
     </div>
-<?php
+<?php } ?>
-
-} ?>

themes/daux/less/_components.less

@@ -108,22 +108,27 @@ Components
     }
 }
 
+.Brand {
+    display: block;
+    background-color: @dark;
+    padding: 15px 20px;
+    font-size: 18px;
+    text-shadow: none;
+    font-family: @font-family-heading;
+    font-weight: 700;
+    color: @light;
+}
+
 .Navbar {
-    height: @navbar-height;
+    height: 50px;
     box-shadow: 0 1px 5px rgba(0, 0, 0, 0.25);
     background-color: @dark;
     margin-bottom: 0;
 
-    &__brand {
+    .Brand {
         float: left;
-        padding: 15px 20px;
-        font-size: 18px;
         line-height: 20px;
-        height: @navbar-height;
+        height: 50px;
-        color: @light;
-        text-shadow: none;
-        font-family: @font-family-heading;
-        font-weight: 700;
     }
 }
 
@@ -241,6 +246,7 @@ Components
     h1 {
         margin: 0;
         padding: 0;
+        line-height: 57px;
     }
 
     &--separator {
@@ -265,25 +271,21 @@ Components
 
 .Search {
     position: relative;
-    float: right;
-    margin: 8px 20px;
 
     &__field {
         display: block;
         width: 100%;
         height: 34px;
-        padding: 6px 30px 6px 0;
+        padding: 6px 30px 6px 20px;
         color: #555;
+        border-width: 0 0 1px;
+        border-bottom: 1px solid #ccc;
         background: #fff;
-        border: 1px solid #ccc;
+        transition: border-color ease-in-out 0.15s;
-        border-radius: 4px;
-        box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
-        transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
 
         &:focus {
             border-color: @light;
             outline: 0;
-            box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px 2px rgba(102, 175, 233, 0.6);
         }
     }
 
@@ -296,6 +298,18 @@ Components
     }
 }
 
+.Navbar .Search {
+    float: right;
+    margin: 8px 20px;
+
+    &__field {
+        box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+        border-width: 0;
+        border-radius: 4px;
+        padding-left: 10px;
+    }
+}
+
 .TableOfContents {
     font-size: 16px;
     padding-left: 0;

themes/daux/less/_structure.less

@@ -32,22 +32,17 @@ html, body {
 }
 
 .Collapsible {
-    &__container {
-        padding: 10px 15px;
-        display: block;
-        background-color: @lines;
-        border-bottom: 1px solid @lines;
-    }
-
     //mobile friendly sub-nav
     &__content {
         display: none;
     }
 
     &__trigger {
+        margin: 12px;
         padding: 7px 10px;
-        background-color: @sidebar-hover;
+        background-color: transparent;
         border: none;
+        float: right;
 
         .kill-background-image;
         .kill-box-shadow;
@@ -58,16 +53,16 @@ html, body {
             height: 2px;
             margin-top: 2px;
             margin-bottom: 3px;
-            background-color: @dark;
+            background-color: @light;
             .kill-box-shadow;
         }
 
         &:hover {
-            background-color: @dark;
+            background-color: @sidebar-hover;
             .kill-box-shadow;
 
-            .icon-bar {
+            .Collapsible__trigger--bar {
-                background-color: @light;
+                background-color: @dark;
                 .kill-box-shadow;
             }
         }
@@ -82,13 +77,13 @@ html, body {
 
     .Navbar {
         position: fixed;
-        z-index: @zindex-navbar-fixed;
+        z-index: 1030;
         width: 100%;
     }
 
     .Collapsible {
-        &__container {
+        &__trigger {
-            display: none;
+            display: none !important;
         }
 
         &__content {
@@ -98,7 +93,6 @@ html, body {
 
     .Columns {
         height: 100%;
-        padding-top: @navbar-height;
 
         &::after,
         &::before {
@@ -128,7 +122,7 @@ html, body {
             width: 75%;
 
             &__content {
-                padding: 20px;
+                padding: 0 20px 20px;
                 min-height: 100%;
             }
         }

themes/daux/less/_variables.less

@@ -1,3 +0,0 @@
-@zindex-navbar-fixed:      1030;
-
-@navbar-height: 50px;

themes/daux/less/theme-blue.less

@@ -1,6 +1,4 @@
 
-@import "_variables.less";
-
 //Daux.io Blue
 @sidebar-background: #f7f7f7;
 @sidebar-hover: #c5c5cb;

themes/daux/less/theme-green.less

@@ -1,6 +1,4 @@
 
-@import "_variables.less";
-
 //Daux.io Green
 @sidebar-background: #f5f5f6;
 @sidebar-hover: #a0d55d;

themes/daux/less/theme-navy.less

@@ -1,6 +1,4 @@
 
-@import "_variables.less";
-
 //Daux.io Navy
 @sidebar-hover: #c5c5cb;
 @lines: #e7e7e9;

themes/daux/less/theme-red.less

@@ -1,6 +1,4 @@
 
-@import "_variables.less";
-
 // Daux.io Red
 @sidebar-hover: #eee;
 @lines: #eee;

tipuesearch/tipuesearch.css

@@ -9,21 +9,7 @@ body.with-search {
     overflow: hidden;
 }
 
-/* bootstrap overrides the search field so let's undo that */
+.SearchResults {
-input[type="search"] {
-    -webkit-appearance: searchfield;
-}
-
-input[type="search"]::-webkit-search-cancel-button {
-    -webkit-appearance: searchfield-cancel-button;
-}
-
-#tipue_search_input {
-    width: 170px;
-    font-size: medium;
-}
-
-#tipue_search_content {
     background: #fff;
     max-width: 650px;
     padding: 15px;
@@ -31,20 +17,20 @@ input[type="search"]::-webkit-search-cancel-button {
 
     z-index: 100;
     position:absolute;
-    top: 50px;
+    top: 0;
     left: 0;
     bottom: 0;
 
     overflow: auto;
 }
 
-#tipue_search_backdrop {
+.SearchResultsBackdrop {
     z-index: 90;
 
     width:100%;
 
     position:absolute;
-    top: 50px;
+    top: 0;
     left: 0;
     bottom: 0;
 
@@ -52,7 +38,22 @@ input[type="search"]::-webkit-search-cancel-button {
     opacity: .6;
 }
 
-#tipue_search_warning {
+
+.homepage .SearchResults,
+.homepage .SearchResultsBackdrop {
+    top: 50px;
+}
+
+.homepage .SearchResults .Search__field {
+    display: none;
+}
+
+.SearchResults .Search__field {
+    width: 40%;
+    float: left;
+}
+
+.SearchResults__warning {
     font-weight:300;
     font-size:15px;
     line-height: 1.6;
@@ -60,23 +61,23 @@ input[type="search"]::-webkit-search-cancel-button {
     margin: 7px 0;
 }
 
-#tipue_search_warning a {
+.SearchResults__warning a {
     color: #396;
     text-decoration: none;
 }
 
-#tipue_search_warning a:hover {
+.SearchResults__warning a:hover {
     color: #555;
 }
 
-#tipue_search_results_count {
+.SearchResults__count {
     font-weight:300;
     font-size:15px;
     line-height: 1.7;
     color: #555;
 }
 
-.tipue_close {
+.SearchResults__close {
     border: 0 transparent solid;
     background: none;
 
@@ -88,23 +89,23 @@ input[type="search"]::-webkit-search-cancel-button {
     line-height: .8em;
 }
 
-.tipue_search_content_title {
+.SearchResults__title {
     font-weight:300;
     font-size:21px;
     line-height: 1.7;
     margin-top: 23px;
 }
 
-.tipue_search_content_title a {
+.SearchResults__title a {
     color: #333;
     text-decoration: none;
 }
 
-.tipue_search_content_title a:hover {
+.SearchResults__title a:hover {
     color: #555;
 }
 
-.tipue_search_content_url {
+.SearchResults__url {
     font-weight:300;
     font-size:14px;
     line-height: 1.9;
@@ -112,16 +113,16 @@ input[type="search"]::-webkit-search-cancel-button {
     hyphens: auto;
 }
 
-.tipue_search_content_url a {
+.SearchResults__url a {
     color: #396;
     text-decoration: none;
 }
 
-.tipue_search_content_url a:hover {
+.SearchResults__url a:hover {
     color: #555;
 }
 
-.tipue_search_content_text {
+.SearchResults__text {
     font-weight:300;
     font-size:15px;
     line-height: 1.6;
@@ -131,7 +132,7 @@ input[type="search"]::-webkit-search-cancel-button {
     margin-top: 3px;
 }
 
-.tipue_search_content_debug {
+.SearchResults__debug {
     font-weight:300;
     font-size:13px;
     line-height: 1.6;
@@ -139,21 +140,21 @@ input[type="search"]::-webkit-search-cancel-button {
     margin: 5px 0;
 }
 
-.h01 {
+.SearchResults__highlight {
     color: #333;
     font-weight: 400;
 }
 
-#tipue_search_foot {
+.SearchResults__footer {
     margin: 51px 0 21px 0;
     padding: 0 10px;
 }
 
-#tipue_search_foot_boxes li {
+.SearchResults__footer__links li {
     margin: 0 4px;
 }
 
-#tipue_search_foot_boxes li.current {
+.SearchResults__footer__links li.current {
     display: inline-block;
     padding: 5px 14px;
     border-radius: 15px;
@@ -166,54 +167,8 @@ input[type="search"]::-webkit-search-cancel-button {
 
 /* spinner */
 
-.tipue_search_spinner {
-    padding: 31px 0;
-    width: 50px;
-    height: 28px;
-}
-
-.tipue_search_spinner > div {
-    background-color: #777;
-    height: 100%;
-    width: 3px;
-    display: inline-block;
-    margin-right: 2px;
-    -webkit-animation: stretchdelay 1.2s infinite ease-in-out;
-    animation: stretchdelay 1.2s infinite ease-in-out;
-}
-
-.tipue_search_spinner .tipue_search_rect2 {
-    -webkit-animation-delay: -1.1s;
-    animation-delay: -1.1s;
-}
-
-.tipue_search_spinner .tipue_search_rect3 {
-    -webkit-animation-delay: -1.0s;
-    animation-delay: -1.0s;
-}
-
-@-webkit-keyframes stretchdelay {
-    0%, 40%, 100% {
-        -webkit-transform: scaleY(0.4)
-    }
-    20% {
-        -webkit-transform: scaleY(1.0)
-    }
-}
-
-@keyframes stretchdelay {
-    0%, 40%, 100% {
-        transform: scaleY(0.4);
-        -webkit-transform: scaleY(0.4);
-    }
-    20% {
-        transform: scaleY(1.0);
-        -webkit-transform: scaleY(1.0);
-    }
-}
-
 @media (min-width: 650px) {
-    #tipue_search_content {
+    .SearchResults {
         width: 650px;
 
         left: 50%;

tipuesearch/tipuesearch.js

@@ -13,18 +13,7 @@
     // Stop words (list from http://www.ranks.nl/stopwords)
     var tipuesearch_stop_words = ["a", "about", "above", "after", "again", "against", "all", "am", "an", "and", "any", "are", "aren't", "as", "at", "be", "because", "been", "before", "being", "below", "between", "both", "but", "by", "can't", "cannot", "could", "couldn't", "did", "didn't", "do", "does", "doesn't", "doing", "don't", "down", "during", "each", "few", "for", "from", "further", "had", "hadn't", "has", "hasn't", "have", "haven't", "having", "he", "he'd", "he'll", "he's", "her", "here", "here's", "hers", "herself", "him", "himself", "his", "how", "how's", "i", "i'd", "i'll", "i'm", "i've", "if", "in", "into", "is", "isn't", "it", "it's", "its", "itself", "let's", "me", "more", "most", "mustn't", "my", "myself", "no", "nor", "not", "of", "off", "on", "once", "only", "or", "other", "ought", "our", "ours", "ourselves", "out", "over", "own", "same", "shan't", "she", "she'd", "she'll", "she's", "should", "shouldn't", "so", "some", "such", "than", "that", "that's", "the", "their", "theirs", "them", "themselves", "then", "there", "there's", "these", "they", "they'd", "they'll", "they're", "they've", "this", "those", "through", "to", "too", "under", "until", "up", "very", "was", "wasn't", "we", "we'd", "we'll", "we're", "we've", "were", "weren't", "what", "what's", "when", "when's", "where", "where's", "which", "while", "who", "who's", "whom", "why", "why's", "with", "won't", "would", "wouldn't", "you", "you'd", "you'll", "you're", "you've", "your", "yours", "yourself", "yourselves"];
 
-    // Word replace
-    var tipuesearch_replace = {'words': []};
-
-    // Weighting
-    var tipuesearch_weight = {'weight': []};
-
-    // Stemming
-    var tipuesearch_stem = {'words': []};
-
     // Internal strings
-    var tipuesearch_string_results_for = 'Showing results for';
-    var tipuesearch_string_search_instead = 'Search instead for';
     var tipuesearch_string_one_result = '1 result';
     var tipuesearch_string_results = 'results';
     var tipuesearch_string_prev = 'Previous';
@@ -35,6 +24,9 @@
     var tipuesearch_string_one_character_or_more = 'Should be one character or more';
     var tipuesearch_string_should_be_x_or_more = 'Should be !min characters or more';
 
+    // Main containers
+    var tipue_container, tipue_backdrop;
+
     function getURLP(name) {
         return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search) || [, ""])[1].replace(/\+/g, '%20')) || null;
     }
@@ -55,11 +47,74 @@
         }
     }
 
-    var tipue_container, tipue_backdrop;
+    function getSearchString(searchFor) {
+        var standard = true;
+        var hasStopWords = false;
+        if ((searchFor.match("^\"") && searchFor.match("\"$")) || (searchFor.match("^'") && searchFor.match("'$"))) {
+            standard = false;
+        }
+
+        if (standard) {
+            var d_w = searchFor.split(' ');
+            searchFor = '';
+            for (var i = 0; i < d_w.length; i++) {
+                var isStopWord = false;
+                for (var f = 0; f < tipuesearch_stop_words.length; f++) {
+                    if (d_w[i] == tipuesearch_stop_words[f]) {
+                        isStopWord = true;
+                        hasStopWords = true;
+                    }
+                }
+                if (!isStopWord) {
+                    searchFor = searchFor + ' ' + d_w[i];
+                }
+            }
+            searchFor = $.trim(searchFor);
+        } else {
+            searchFor = searchFor.substring(1, searchFor.length - 1);
+        }
+
+        return {
+            hasStopWords: hasStopWords,
+            isStandard: standard,
+            searchFor: searchFor
+        };
+    }
+
+    function getScore(searchFor, page) {
+        var score = 0;
+        var pat = new RegExp(searchFor, 'gi');
+
+        if (page.title.search(pat) != -1) {
+            score += (20 * page.title.match(pat).length);
+        }
+
+        if (page.text.search(pat) != -1) {
+            score += (20 * page.text.match(pat).length);
+        }
+
+        if (page.tags.search(pat) != -1) {
+            score += (10 * page.tags.match(pat).length);
+        }
+
+        if (page.url.search(pat) != -1) {
+            score += 20;
+        }
+
+        return score;
+    }
+
+    function makeResult(score, page, text) {
+        return {
+            "score": score,
+            "title": page.title,
+            "desc": text,
+            "url": page.url
+        }
+    }
 
     window.tipuesearch = function (options) {
-
+        var settings = $.extend(
-        var set = $.extend(
             {
                 'field': $('#tipue_search_input'),
                 'show': 10,
@@ -69,13 +124,10 @@
                 'descriptiveWords': 25,
                 'highlightTerms': true,
                 'highlightEveryTerm': false,
-                'liveDescription': '*',
-                'liveContent': '*',
                 'contentLocation': 'tipuesearch/tipuesearch_content.json',
                 'debug': false
             }, options);
 
-
         var tipuesearch_in = {
             pages: []
         };
@@ -83,7 +135,7 @@
         $.ajax(
             {
                 dataType: "json",
-                url: set.base_url + set.contentLocation,
+                url: settings.base_url + settings.contentLocation,
                 async: false
             })
             .done(
@@ -93,11 +145,11 @@
 
 
         if (getURLP('q')) {
-            set.field.val(getURLP('q'));
+            settings.field.val(getURLP('q'));
             getTipueSearch(0, true);
         }
 
-        set.field.keyup(
+        settings.field.keyup(
             function (event) {
                 if (event.keyCode == '13') {
                     getTipueSearch(0, true);
@@ -105,227 +157,135 @@
             });
 
 
-        function getTipueSearch(start, replace) {
+        function highlightText(search, text) {
-            $('#tipue_search_content').html('<div class="tipue_search_spinner"><div class="tipue_search_rect1"></div><div class="tipue_search_rect2"></div><div class="rect3"></div></div>');
+            if (settings.highlightTerms) {
+                var pattern = new RegExp('(' + search + ')', settings.highlightEveryTerm ? 'gi' : 'i');
+                text = text.replace(pattern, "<span class=\"SearchResults__highlight\">$1</span>");
+            }
 
-            var out = '<button class=tipue_close>&times;</button>';
+            return text;
-            var results = '';
+        }
-            var show_replace = false;
+
-            var show_stop = false;
+        function getResults(searchFor, standard) {
-            var standard = true;
-            var c = 0;
             var found = [];
 
-            var d = set.field.val().toLowerCase();
-            d = $.trim(d);
-
-            if ((d.match("^\"") && d.match("\"$")) || (d.match("^'") && d.match("'$"))) {
-                standard = false;
-            }
-
             if (standard) {
-                var d_w = d.split(' ');
+                var d_w = searchFor.split(' ');
-                d = '';
+                for (var i = 0; i < tipuesearch_in.pages.length; i++) {
-                for (var i = 0; i < d_w.length; i++) {
+                    var score = 0;
-                    var a_w = true;
+                    var text = tipuesearch_in.pages[i].text;
-                    for (var f = 0; f < tipuesearch_stop_words.length; f++) {
+                    for (var f = 0; f < d_w.length; f++) {
-                        if (d_w[i] == tipuesearch_stop_words[f]) {
+                        if (d_w[f].match('^-')) {
-                            a_w = false;
+                            var pat = new RegExp(d_w[f].substring(1), 'i');
-                            show_stop = true;
+                            if (tipuesearch_in.pages[i].title.search(pat) != -1 || tipuesearch_in.pages[i].text.search(pat) != -1 || tipuesearch_in.pages[i].tags.search(pat) != -1) {
+                                score = 0;
+                            }
+                        } else {
+                            score += getScore(d_w[f], tipuesearch_in.pages[i]);
+                            text = highlightText(d_w[f], text);
                         }
                     }
-                    if (a_w) {
+
-                        d = d + ' ' + d_w[i];
+                    if (score != 0) {
+                        found.push(makeResult(score, tipuesearch_in.pages[i], text));
                     }
                 }
-                d = $.trim(d);
-                d_w = d.split(' ');
             } else {
-                d = d.substring(1, d.length - 1);
+                for (var i = 0; i < tipuesearch_in.pages.length; i++) {
+                    var score = getScore(searchFor, tipuesearch_in.pages[i]);
+                    if (score != 0) {
+                        found.push(makeResult(score, tipuesearch_in.pages[i], highlightText(searchFor, tipuesearch_in.pages[i].text)));
+                    }
+                }
             }
 
-            if (d.length >= set.minimumLength) {
+            found.sort(function (a, b) {
-                if (standard) {
+                return b.score - a.score
-                    if (replace) {
+            });
-                        var d_r = d;
+
-                        for (var i = 0; i < d_w.length; i++) {
+            return found
-                            for (var f = 0; f < tipuesearch_replace.words.length; f++) {
+        }
-                                if (d_w[i] == tipuesearch_replace.words[f].word) {
+
-                                    d = d.replace(d_w[i], tipuesearch_replace.words[f].replace_with);
+        function getTipueSearch(start, replace) {
-                                    show_replace = true;
+
-                                }
+            if (!tipue_container) {
-                            }
+                tipue_container = $(document.createElement("div"));
-                        }
+                tipue_container.addClass('SearchResults');
-                        d_w = d.split(' ');
+                document.body.appendChild(tipue_container.get(0));
+
+                tipue_backdrop = $(document.createElement("div"));
+                tipue_backdrop.addClass("SearchResultsBackdrop");
+                document.body.appendChild(tipue_backdrop.get(0));
+
+                tipue_container.on('click', '.SearchResults__close', closeSearch);
+                tipue_container.on('click', '.SearchResults__footer__link', function () {
+                    var id_v = $(this).attr('id');
+                    var id_a = id_v.split('_');
+
+                    getTipueSearch(parseInt(id_a[0]), id_a[1]);
+
+                    tipue_container.scrollTop(0);
+                });
+
+                tipue_container.on('keyup paste', '.Search__field', function(event) {
+                    settings.field.val($(this).val());
+
+                    if (event.keyCode == '13') {
+                        getTipueSearch(0, true);
+                    }
+                })
+            }
+
+            $(document).keyup(keyUpHandler);
+
+            var output = '<input class="Search__field" placeholder="Search..." autocomplete="on" autosave="text_search" type="search" value="'+ settings.field.val() +'"><button class=SearchResults__close>&times;</button>';
+
+            var search = getSearchString($.trim(settings.field.val().toLowerCase()));
+            var searchFor = search.searchFor;
+
+            if (searchFor.length >= settings.minimumLength) {
+                var found = getResults(search.searchFor, search.isStandard);
+                var counter = found.length;
+
+
+                if (counter == 0) {
+                    output += '<div class=SearchResults__warning>' + tipuesearch_string_no_results + '</div>';
+                } else  {
+                    if (settings.showTitleCount) {
+                        document.title = '(' + counter + ') ' + originalTitle;
                     }
 
-                    var d_t = d;
+                    if (counter == 1) {
-                    for (var i = 0; i < d_w.length; i++) {
+                        output += '<div class="SearchResults__count">' + tipuesearch_string_one_result + '</div>';
-                        for (var f = 0; f < tipuesearch_stem.words.length; f++) {
-                            if (d_w[i] == tipuesearch_stem.words[f].word) {
-                                d_t = d_t + ' ' + tipuesearch_stem.words[f].stem;
-                            }
-                        }
-                    }
-                    d_w = d_t.split(' ');
-
-                    for (var i = 0; i < tipuesearch_in.pages.length; i++) {
-                        var score = 0;
-                        var s_t = tipuesearch_in.pages[i].text;
-                        for (var f = 0; f < d_w.length; f++) {
-                            var pat = new RegExp(d_w[f], 'gi');
-                            if (tipuesearch_in.pages[i].title.search(pat) != -1) {
-                                var m_c = tipuesearch_in.pages[i].title.match(pat).length;
-                                score += (20 * m_c);
-                            }
-                            if (tipuesearch_in.pages[i].text.search(pat) != -1) {
-                                var m_c = tipuesearch_in.pages[i].text.match(pat).length;
-                                score += (20 * m_c);
-                            }
-
-                            if (set.highlightTerms) {
-                                if (set.highlightEveryTerm) {
-                                    var patr = new RegExp('(' + d_w[f] + ')', 'gi');
-                                } else {
-                                    var patr = new RegExp('(' + d_w[f] + ')', 'i');
-                                }
-                                s_t = s_t.replace(patr, "<span class=\"h01\">$1</span>");
-                            }
-
-                            if (tipuesearch_in.pages[i].tags.search(pat) != -1) {
-                                var m_c = tipuesearch_in.pages[i].tags.match(pat).length;
-                                score += (10 * m_c);
-                            }
-
-                            if (tipuesearch_in.pages[i].url.search(pat) != -1) {
-                                score += 20;
-                            }
-
-                            if (score != 0) {
-                                for (var e = 0; e < tipuesearch_weight.weight.length; e++) {
-                                    if (tipuesearch_in.pages[i].url == tipuesearch_weight.weight[e].url) {
-                                        score += tipuesearch_weight.weight[e].score;
-                                    }
-                                }
-                            }
-
-                            if (d_w[f].match('^-')) {
-                                pat = new RegExp(d_w[f].substring(1), 'i');
-                                if (tipuesearch_in.pages[i].title.search(pat) != -1 || tipuesearch_in.pages[i].text.search(pat) != -1 || tipuesearch_in.pages[i].tags.search(pat) != -1) {
-                                    score = 0;
-                                }
-                            }
-                        }
-
-                        if (score != 0) {
-                            found.push(
-                                {
-                                    "score": score,
-                                    "title": tipuesearch_in.pages[i].title,
-                                    "desc": s_t,
-                                    "url": tipuesearch_in.pages[i].url
-                                });
-                            c++;
-                        }
-                    }
-                } else {
-                    for (var i = 0; i < tipuesearch_in.pages.length; i++) {
-                        var score = 0;
-                        var s_t = tipuesearch_in.pages[i].text;
-                        var pat = new RegExp(d, 'gi');
-                        if (tipuesearch_in.pages[i].title.search(pat) != -1) {
-                            var m_c = tipuesearch_in.pages[i].title.match(pat).length;
-                            score += (20 * m_c);
-                        }
-                        if (tipuesearch_in.pages[i].text.search(pat) != -1) {
-                            var m_c = tipuesearch_in.pages[i].text.match(pat).length;
-                            score += (20 * m_c);
-                        }
-
-                        if (set.highlightTerms) {
-                            if (set.highlightEveryTerm) {
-                                var patr = new RegExp('(' + d + ')', 'gi');
-                            } else {
-                                var patr = new RegExp('(' + d + ')', 'i');
-                            }
-                            s_t = s_t.replace(patr, "<span class=\"h01\">$1</span>");
-                        }
-
-                        if (tipuesearch_in.pages[i].tags.search(pat) != -1) {
-                            var m_c = tipuesearch_in.pages[i].tags.match(pat).length;
-                            score += (10 * m_c);
-                        }
-
-                        if (tipuesearch_in.pages[i].url.search(pat) != -1) {
-                            score += 20;
-                        }
-
-                        if (score != 0) {
-                            for (var e = 0; e < tipuesearch_weight.weight.length; e++) {
-                                if (tipuesearch_in.pages[i].url == tipuesearch_weight.weight[e].url) {
-                                    score += tipuesearch_weight.weight[e].score;
-                                }
-                            }
-                        }
-
-                        if (score != 0) {
-                            found.push(
-                                {
-                                    "score": score,
-                                    "title": tipuesearch_in.pages[i].title,
-                                    "desc": s_t,
-                                    "url": tipuesearch_in.pages[i].url
-                                });
-                            c++;
-                        }
-                    }
-                }
-
-                if (c != 0) {
-                    if (set.showTitleCount) {
-                        document.title = '(' + c + ') ' + originalTitle;
-                    }
-
-                    if (show_replace == 1) {
-                        out += '<div id="tipue_search_warning">' + tipuesearch_string_results_for + ' ' + d + '. ' + tipuesearch_string_search_instead + ' <a id="tipue_search_replaced">' + d_r + '</a></div>';
-                    }
-                    if (c == 1) {
-                        out += '<div id="tipue_search_results_count">' + tipuesearch_string_one_result + '</div>';
                     } else {
-                        c_c = c.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+                        output += '<div class="SearchResults__count">' + counter + ' ' + tipuesearch_string_results + '</div>';
-                        out += '<div id="tipue_search_results_count">' + c_c + ' ' + tipuesearch_string_results + '</div>';
                     }
 
-                    found.sort(
-                        function (a, b) {
-                            return b.score - a.score
-                        });
-
                     var l_o = 0;
                     for (var i = 0; i < found.length; i++) {
-                        if (l_o >= start && l_o < set.show + start) {
+                        if (l_o >= start && l_o < settings.show + start) {
-                            out += '<div class="tipue_search_content_title"><a href="' + set.base_url + found[i].url + '"' + '>' + found[i].title + '</a></div>';
+                            output += '<div class="SearchResults__title"><a href="' + settings.base_url + found[i].url + '"' + '>' + found[i].title + '</a></div>';
 
-                            if (set.debug) {
+                            if (settings.debug) {
-                                out += '<div class="tipue_search_content_debug">Score: ' + found[i].score + '</div>';
+                                output += '<div class="SearchResults__debug">Score: ' + found[i].score + '</div>';
                             }
 
-                            if (set.showURL) {
+                            if (settings.showURL) {
                                 var s_u = found[i].url.toLowerCase();
                                 if (s_u.indexOf('http://') == 0) {
                                     s_u = s_u.slice(7);
                                 }
-                                out += '<div class="tipue_search_content_url"><a href="' + set.base_url + found[i].url + '"' + '>' + s_u + '</a></div>';
+                                output += '<div class="SearchResults__url"><a href="' + settings.base_url + found[i].url + '"' + '>' + s_u + '</a></div>';
                             }
 
                             if (found[i].desc) {
                                 var t = found[i].desc;
                                 var t_d = '';
                                 var t_w = t.split(' ');
-                                if (t_w.length < set.descriptiveWords) {
+                                if (t_w.length < settings.descriptiveWords) {
                                     t_d = t;
                                 } else {
-                                    for (var f = 0; f < set.descriptiveWords; f++) {
+                                    for (var f = 0; f < settings.descriptiveWords; f++) {
                                         t_d += t_w[f] + ' ';
                                     }
                                 }
@@ -333,19 +293,19 @@
                                 if (t_d.charAt(t_d.length - 1) != '.') {
                                     t_d += ' ...';
                                 }
-                                out += '<div class="tipue_search_content_text">' + t_d + '</div>';
+                                output += '<div class="SearchResults__text">' + t_d + '</div>';
                             }
                         }
                         l_o++;
                     }
 
-                    if (c > set.show) {
+                    if (counter > settings.show) {
-                        var pages = Math.ceil(c / set.show);
+                        var pages = Math.ceil(counter / settings.show);
-                        var page = (start / set.show);
+                        var page = (start / settings.show);
-                        out += '<div id="tipue_search_foot"><ul id="tipue_search_foot_boxes" class="Pager">';
+                        output += '<div class="SearchResults__footer"><ul class="SearchResults__footer__links Pager">';
 
                         if (start > 0) {
-                            out += '<li class="Pager--prev"><a class="tipue_search_foot_box" id="' + (start - set.show) + '_' + replace + '">' + tipuesearch_string_prev + '</a></li>';
+                            output += '<li class="Pager--prev"><a class="SearchResults__footer__link" id="' + (start - settings.show) + '_' + replace + '">' + tipuesearch_string_prev + '</a></li>';
                         }
 
                         if (page <= 2) {
@@ -355,9 +315,9 @@
                             }
                             for (var f = 0; f < p_b; f++) {
                                 if (f == page) {
-                                    out += '<li class="current">' + (f + 1) + '</li>';
+                                    output += '<li class="current">' + (f + 1) + '</li>';
                                 } else {
-                                    out += '<li><a class="tipue_search_foot_box" id="' + (f * set.show) + '_' + replace + '">' + (f + 1) + '</a></li>';
+                                    output += '<li><a class="SearchResults__footer__link" id="' + (f * settings.show) + '_' + replace + '">' + (f + 1) + '</a></li>';
                                 }
                             }
                         } else {
@@ -367,68 +327,37 @@
                             }
                             for (var f = page - 1; f < p_b; f++) {
                                 if (f == page) {
-                                    out += '<li class="current">' + (f + 1) + '</li>';
+                                    output += '<li class="current">' + (f + 1) + '</li>';
                                 } else {
-                                    out += '<li><a class="tipue_search_foot_box" id="' + (f * set.show) + '_' + replace + '">' + (f + 1) + '</a></li>';
+                                    output += '<li><a class="SearchResults__footer__link" id="' + (f * settings.show) + '_' + replace + '">' + (f + 1) + '</a></li>';
                                 }
                             }
                         }
 
                         if (page + 1 != pages) {
-                            out += '<li class="Pager--next"><a class="tipue_search_foot_box " id="' + (start + set.show) + '_' + replace + '">' + tipuesearch_string_next + '</a></li>';
+                            output += '<li class="Pager--next"><a class="SearchResults__footer__link" id="' + (start + settings.show) + '_' + replace + '">' + tipuesearch_string_next + '</a></li>';
                         }
 
-                        out += '</ul></div>';
+                        output += '</ul></div>';
                     }
-                } else {
-                    out += '<div id="tipue_search_warning">' + tipuesearch_string_no_results + '</div>';
                 }
             } else {
-                if (show_stop) {
+                if (search.hasStopWords) {
-                    out += '<div id="tipue_search_warning">' + tipuesearch_string_no_results + '. ' + tipuesearch_string_common_words_ignored + '</div>';
+                    output += '<div class=SearchResults__warning>' + tipuesearch_string_no_results + '. ' + tipuesearch_string_common_words_ignored + '</div>';
                 } else {
-                    out += '<div id="tipue_search_warning">' + tipuesearch_string_too_short + '</div>';
+                    output += '<div class=SearchResults__warning>' + tipuesearch_string_too_short + '</div>';
-                    if (set.minimumLength == 1) {
+                    if (settings.minimumLength == 1) {
-                        out += '<div id="tipue_search_warning">' + tipuesearch_string_one_character_or_more + '</div>';
+                        output += '<div class=SearchResults__warning>' + tipuesearch_string_one_character_or_more + '</div>';
                     } else {
-                        out += '<div id="tipue_search_warning">' + tipuesearch_string_should_be_x_or_more.replace("!min", set.minimumLength) + '</div>';
+                        output += '<div class=SearchResults__warning>' + tipuesearch_string_should_be_x_or_more.replace("!min", settings.minimumLength) + '</div>';
                     }
                 }
             }
 
-            if (!tipue_container) {
-                tipue_container = $(document.createElement("div"));
-                tipue_container.attr('id', "tipue_search_content");
-                document.body.appendChild(tipue_container.get(0));
-
-                tipue_backdrop = $(document.createElement("div"));
-                tipue_backdrop.attr('id', "tipue_search_backdrop");
-                document.body.appendChild(tipue_backdrop.get(0));
-            }
-
             $("body").addClass("with-search").scrollTop(0);
             tipue_backdrop.show();
             tipue_container.scrollTop(0);
-            tipue_container.show().html(out);
+            tipue_container.show().html(output);
-
-            tipue_container.find('.tipue_close').on('click', closeSearch);
-
-            $('#tipue_search_replaced').click(
-                function () {
-                    getTipueSearch(0, false);
-                });
-
-            $('.tipue_search_foot_box').click(
-                function () {
-                    var id_v = $(this).attr('id');
-                    var id_a = id_v.split('_');
-
-                    getTipueSearch(parseInt(id_a[0]), id_a[1]);
-
-                    tipue_container.scrollTop(0);
-                });
-
-            $(document).keyup(keyUpHandler);
         }
 
     };