Merge branch '503-quicktips-neu-per-ajax' into 'development'

Resolve "Quicktips neu per ajax"

Closes #503

See merge request !1039

app/Http/Controllers/MetaGerSearch.php

@@ -51,222 +51,6 @@ class MetaGerSearch extends Controller
             ->with('r', $redirect);
     }
 
-    public function quicktips(Request $request, MetaGer $metager)
-    {
-        $q          = $request->input('q', '');
-        $mquicktips = [];
-        $quicktips  = [];
-        $spruch     = "";
-
-        # DuckDuckGo-!bangs
-        try {
-            $placeholder = "0X0plchldr0X0";
-            $searchWords = explode(" ", $q);
-            $dummyQuery  = "";
-            $realQuery   = "";
-            foreach ($searchWords as $index => $word) {
-                if ($word[0] === "!") {
-                    $dummyQuery .= $word . " ";
-                } else {
-                    $realQuery .= $word . " ";
-                }
-            }
-            $realQuery = rtrim($realQuery);
-            
-            if ($dummyQuery !== "") {
-                $dummyQuery .= $placeholder;
-                $url = "https://api.duckduckgo.com/?format=json&no_redirect=1&t=MetaGerDE&q=" . urlencode($dummyQuery);
-
-                $result = json_decode($this->get($url), true);
-
-                if (isset($result["Redirect"])) {
-                    $bang            = [];
-                    $bang["title"]   = trans('metaGerSearch.quicktips.bang.title');
-                    $bang["URL"]     = str_replace($placeholder, urlencode(trim($realQuery)), $result["Redirect"]);
-                    $bang["summary"] = '<a href="' . $bang["URL"] . '" target=_blank class="btn btn-primary" style="margin-top:5px;color: #fff">' . trans('metaGerSearch.quicktips.bang.buttonlabel') . " " . parse_url($bang["URL"], PHP_URL_HOST) . '&hellip;</a>';
-                    $bang["gefVon"]  = trans('metaGerSearch.quicktips.bang.from') . " <a href = \"https://api.duckduckgo.com/\" target=\"_blank\" rel=\"noopener\">DuckDuckGo</a>";
-                    $mquicktips[]    = $bang;
-                }
-
-            }
-        } catch (\ErrorException $e) {
-        }
-
-        if (APP::getLocale() === "de") {
-            # Spruch
-            $spruecheFile = storage_path() . "/app/public/sprueche.txt";
-            if (file_exists($spruecheFile) && $request->has('sprueche')) {
-                $sprueche = file($spruecheFile);
-                $spruch   = $sprueche[array_rand($sprueche)];
-            } else {
-                $spruch = "";
-            }
-
-            # manuelle Quicktips:
-            $file = storage_path() . "/app/public/qtdata.csv";
-
-            if (file_exists($file) && $q !== '') {
-                $file = fopen($file, 'r');
-                while (($line = fgetcsv($file)) !== false) {
-                    $words = array_slice($line, 3);
-                    $isIn  = false;
-                    foreach ($words as $word) {
-                        $word = strtolower($word);
-                        if (strpos($q, $word) !== false) {
-                            $isIn = true;
-                            break;
-                        }
-                    }
-                    if ($isIn === true) {
-                        $quicktip            = array('QT_Type' => "MQT");
-                        $quicktip["URL"]     = $line[0];
-                        $quicktip["title"]   = $line[1];
-                        $quicktip["summary"] = $line[2];
-                        $mquicktips[]        = $quicktip;
-                    }
-                }
-                fclose($file);
-            }
-
-            # Wetter
-            /* Derzeit Deaktiviert, da bei unseren Abfragezahlen nicht kostenlos */
-            /*
-            try {
-                $url = "http://api.openweathermap.org/data/2.5/weather?type=accurate&units=metric&lang=" . APP::getLocale() . "&q=" . urlencode($q) . "&APPID=" . getenv("openweathermap");
-
-                $result = json_decode($this->get($url), true);
-
-                $searchWords = explode(' ', $q);
-                $within      = false;
-                foreach ($searchWords as $word) {
-                    if (stripos($result["name"], $word) !== false) {
-                        $within = true;
-                    }
-                }
-                if ($within) {
-                    $weather          = [];
-                    $weather["title"] = "Wetter in " . $result["name"];
-                    $weather["URL"]   = "http://openweathermap.org/city/" . $result["id"];
-
-                    $summary = '<b class="detail-short">' . $result["main"]["temp"] . " °C, " . $result["weather"][0]["description"] . "</b>";
-                    $details = '<table  class="table table-condensed"><tr><td>Temperatur</td><td>' . $result["main"]["temp_min"] . " bis " . $result["main"]["temp_max"] . " °C</td></tr>";
-                    $details .= "<tr><td>Druck</td><td>" . $result["main"]["pressure"] . " hPa</td></tr>";
-                    $details .= "<tr><td>Luftfeuchtigkeit</td><td>" . $result["main"]["humidity"] . " %</td></tr>";
-                    $details .= "<tr><td>Wind</td><td>" . $result["wind"]["speed"] . " m/s, " . $result["wind"]["deg"] . "°</td></tr>";
-                    $details .= "<tr><td>Bewölkung</td><td>" . $result["clouds"]["all"] . " %</td></tr>";
-                    if (isset($result->rain)) {
-                        $details .= " | Regen letzte drei Stunden: " . $result["rain"]["3h"] . " h";
-                    }
-                    $details .= "</table>";
-                    $weather["summary"]   = $summary;
-                    $weather["details"]   = $details;
-                    $weather["gefVon"]    = "von <a href = \"https://openweathermap.org\" target=\"_blank\" rel=\"noopener\">Openweathermap</a>";
-                    $requestData          = [];
-                    $requestData["url"]   = "http://openweathermap.org/img/w/";
-                    $weather["image"]     = action('Pictureproxy@get', $requestData) . $result["weather"][0]["icon"] . ".png";
-                    $weather["image-alt"] = $result["weather"][0]["main"];
-                    $mquicktips[]         = $weather;
-                }
-            } catch (\ErrorException $e) {
-
-            }
-            */
-        }
-    
-        # Wikipedia Quicktip
-        $url             = "https://" . APP::getLocale() . ".wikipedia.org/w/api.php?action=opensearch&search=" . urlencode($q) . "&limit=10&namespace=0&format=json&redirects=resolve";
-    	try{
-    		$content = $this->get($url);
-    	}catch(\ErrorException $e){
-    		$content = "";
-    	}
-        $decodedResponse = json_decode($content, true);
-        if (isset($decodedResponse[1][0]) && isset($decodedResponse[2][0]) && isset($decodedResponse[3][0])) {
-            $quicktip     = [];
-            $firstSummary = $decodedResponse[2][0];
-            // Wenn es mehr als ein Ergebnis gibt
-            if (isset($decodedResponse[1][1])) {
-                // Solange noch zusätzliche Seiten vorhanden sind, füge sie der Tabelle hinzu
-                $details = '<table class=table table-condensed>';
-                for ($i = 1;isset($decodedResponse[1][$i]) && isset($decodedResponse[2][$i]) && isset($decodedResponse[3][$i]); $i++) {
-                    $details .= '<tr><td><a href="' . $decodedResponse[3][$i] . '" target="_blank" rel="noopener">' . $decodedResponse[1][$i] . '</a></td></tr>';
-                }
-                $details .= '</table>';
-                $quicktip["title"]   = $decodedResponse[1][0];
-                $quicktip["URL"]     = $decodedResponse[3][0];
-                $quicktip["summary"] = $decodedResponse[2][0];
-                $quicktip["details"] = $details;
-                $quicktip['gefVon']  = trans('metaGerSearch.quicktips.wikipedia.adress');
-            } else {
-                $quicktip["title"]   = $decodedResponse[1][0];
-                $quicktip["URL"]     = $decodedResponse[3][0];
-                $quicktip["summary"] = $decodedResponse[2][0];
-                $quicktip['gefVon']  = trans('metaGerSearch.quicktips.wikipedia.adress');
-            }
-            $quicktips[] = $quicktip;
-        }
-        $mquicktips = array_merge($mquicktips, $quicktips);
-    
-        if (APP::getLocale() === "de") {
-            # Dict.cc Quicktip
-            if (count(explode(' ', $q)) < 3) {
-                $url             = "http://www.dict.cc/metager.php?s=" . urlencode($q);
-                $decodedResponse = json_decode($this->get($url), true);
-                if ($decodedResponse["headline"] != "" && $decodedResponse["link"] != "") {
-                    $quicktip            = [];
-                    $quicktip["title"]   = $decodedResponse["headline"];
-                    $quicktip["URL"]     = $decodedResponse["link"];
-                    $quicktip["summary"] = implode(", ", $decodedResponse["translations"]);
-                    $quicktip['gefVon']  = trans('metaGerSearch.quicktips.dictcc.adress');
-
-                    if (App::isLocale('de')) {
-                        array_unshift($mquicktips, $quicktip);
-                    } else {
-                        $mquicktips[] = $quicktip;
-                    }
-                }
-            }
-
-            # wussten Sie schon
-            $file = storage_path() . "/app/public/tips.txt";
-            if (file_exists($file)) {
-                $tips = file($file);
-                $tip  = $tips[array_rand($tips)];
-
-                $mquicktips[] = ['title' => trans('metaGerSearch.quicktips.tips.title'), 'summary' => $tip, 'URL' => '/tips'];
-            }
-
-            # Werbelinks
-            $file = storage_path() . "/app/public/ads.txt";
-            if (file_exists($file)) {
-                $ads = json_decode(file_get_contents($file), true);
-                $ad  = $ads[array_rand($ads)];
-                if (isset($ads['details'])) {
-                    $mquicktips[] = ['title' => $ad['title'], 'summary' => $ad['summary'], 'details' => $ad['details'], 'URL' => $ad['URL']];
-                } else {
-                    $mquicktips[] = ['title' => $ad['title'], 'summary' => $ad['summary'], 'URL' => $ad['URL']];
-                }
-            }
-        }
-
-        return view('quicktip')
-            ->with('spruch', $spruch)
-            ->with('mqs', $mquicktips);
-
-    }
-
-    public function tips()
-    {
-        $file = storage_path() . "/app/public/tips.txt";
-        $tips = [];
-        if (file_exists($file)) {
-            $tips = file($file);
-        }
-        return view('tips')
-            ->with('title', 'MetaGer - Tipps & Tricks')
-            ->with('tips', $tips);
-    }
-
     public function get($url)
     {
 	   $ctx = stream_context_create(array('http'=>array('timeout' => 2,)));

gulpfile.js

@@ -23,7 +23,6 @@ elixir(function (mix) {
    | settings.js
   */
   mix.scripts(['lib/jquery.js', 'lib/jquery-ui.min.js', 'lib/bootstrap.js', 'lib/lightslider.js', 'lib/masonry.js', 'lib/imagesloaded.js', 'lib/openpgp.min.js', 'lib/iframeResizer.min.js', 'lib/md5.js'], 'public/js/lib.js')
-  mix.scripts(['lib/jquery.js', 'lib/iframeResizer.contentWindow.min.js'], 'public/js/quicktips.js')
   mix.scripts(['scriptStartPage.js', 'results.js'], 'public/js/scriptStartPage.js');
   mix.scripts(['scriptResultPage.js', 'results.js'], 'public/js/scriptResultPage.js');
   //mix.scripts(['scriptSubpages.js'], 'public/js/scriptSubpages.js');
@@ -31,6 +30,6 @@ elixir(function (mix) {
   // utility
   mix.scripts(['utility.js'], 'public/js/utility.js');
   mix.less('utility.less', 'public/css/utility.css');
-  mix.version(['css/themes/default.css', 'js/lib.js', 'js/quicktips.js', 'js/utility.js', 'css/utility.css', 'js/widgets.js', 'js/editLanguage.js', 'js/kontakt.js', 'js/scriptResultPage.js', 'js/scriptStartPage.js', 'js/settings.js', 'css/beitritt.css']);
+  mix.version(['css/themes/default.css', 'js/lib.js', 'js/utility.js', 'css/utility.css', 'js/widgets.js', 'js/editLanguage.js', 'js/kontakt.js', 'js/scriptResultPage.js', 'js/scriptStartPage.js', 'js/settings.js', 'css/beitritt.css']);
 
 })

resources/assets/js/scriptResultPage.js

@@ -9,8 +9,18 @@ $(document).ready(function () {
   if (document.location.href.indexOf('focus=container') !== -1) {
     $($('#foki > li#savedFokiTabSelector').get(0)).find('>a').tab('show');
   }
+
+  var sprueche = getURLParameter('sprueche') === 'on'; // load the sprueche url parameter
+  if (localStorage.hasOwnProperty('param_sprueche')) {
+    sprueche = localStorage.getItem('param_sprueche') === 'on'; // check for sprueche local storage parameter
+  }
+  loadQuicktips('test', 'de', sprueche); // load the quicktips
 });
 
+function getURLParameter(name) {
+  return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search) || [null, ''])[1].replace(/\+/g, '%20')) || null;
+}
+
 function activateJSOnlyContent () {
   $('#searchplugin').removeClass('hide');
   $('.js-only').removeClass('js-only');
@@ -533,3 +543,127 @@ function resultSaver (index) {
   $('div.tab-pane.active .result[data-count=' + index + ']').transfer({to: to, duration: 1000});
   new Results().updateResultPageInterface();
 }
+
+function loadQuicktips (search, locale, sprueche) {
+  var blacklist = [];
+  if (!sprueche) {
+    blacklist.push('sprueche');
+  }
+  getQuicktips(search, locale, blacklist, createQuicktips);
+}
+
+const QUICKTIP_SERVER = 'http://localhost:63825';
+
+/**
+ * Requests quicktips from the quicktip server and passes them to the loadedHandler
+ * 
+ * @param {String} search search term
+ * @param {String} locale 2 letter locale identifier
+ * @param {Array<String>} blacklist excluded loaders
+ * @param {Function} loadedHandler handler for loaded quicktips
+ */
+function getQuicktips (search, locale, blacklist, loadedHandler) {
+  var getString = QUICKTIP_SERVER + '/quicktips.xml?search=' + search + '&locale=' + locale;
+  blacklist.forEach(function (value) {
+    getString += '&loader_' + value + '=false';
+  });
+  $.get(getString, function (data, status) {
+    if (status === 'success') {
+      var quicktips = $(data).find('entry').map(function () {
+        return quicktip = {
+          type: $(this).children('type').text(),
+          title: $(this).children('title').text(),
+          summary: $(this).children('summary').text(),
+          url: $(this).children('url').text(),
+          gefVon: $(this).children('gefVon').text(),
+          priority: $(this).children('priority').text(),
+          details: $(this).children('details').map(function () {
+            return {
+              title: $(this).children('title').text(),
+              text: $(this).children('text').text(),
+              url: $(this).children('url').text()
+            }
+          }).toArray()
+        };
+      }).toArray();
+      loadedHandler(quicktips);
+    } else {
+      console.error('Loading quicktips failed with status ' + status);
+    }
+  }, 'xml');
+}
+
+/**
+ * <div id="quicktips">
+ *   <div class="quicktip" type="TYPE">
+ *     <details>
+ *       <summary>
+ *         <h1><a href="URL">TITLE</a></h1>
+ *         <p>SUMMARY</p>
+ *       </summary>
+ *       <div class="quicktip-detail">
+ *         <h2><a href="DETAILURL">DETAILTITLE</a></h1>
+ *         <p>DETAILSUMMARY</p>
+ *       </div>
+ *       <div class="quicktip-detail">
+ *         ...
+ *       </div>
+ *       ...
+ *     </details>
+ *     <span>GEFVON
+ *   </div>
+ * </div>
+ * 
+ * @param {Object} quicktips 
+ */
+function createQuicktips (quicktips, sprueche) {
+  var quicktipsDiv = $('#quicktips');
+  quicktips.sort(function (a, b) {
+    return b.priority - a.priority;
+  }).forEach(function (quicktip) {
+    var mainElem;
+    if (quicktip.details.length > 0) {
+      mainElem = $('<details>');
+      var summaryElem = $('<summary class="quicktip-summary">');
+      var headlineElem = $('<h1>');
+      if (quicktip.url.length > 0) {
+        headlineElem.append('<a href=' + quicktip.url + '>' + quicktip.title + '</a>');
+      } else {
+        headlineElem.text(quicktip.title);
+      }
+      summaryElem
+        .append(headlineElem)
+        .append('<p>' + quicktip.summary + '</p>');
+      mainElem.append(summaryElem);
+      quicktip.details.forEach(function (detail) {
+        var detailElem = $('<div class="quicktip-detail">');
+        var detailHeadlineElem = $('<h2>');
+        if (detail.url.length > 0) {
+          detailHeadlineElem.append('<a href=' + detail.url + '>' + detail.title + '</a>');
+        } else {
+          detailHeadlineElem.text(detail.title);
+        }
+        detailElem
+          .append(detailHeadlineElem)
+          .append('<p>' + detail.text + '</p>');
+          mainElem.append(detailElem);
+      });
+    } else {
+      mainElem = $('<div class="quicktip-summary">');
+      var headlineElem = $('<h1>');
+      if (quicktip.url.length > 0) {
+        headlineElem.append('<a href=' + quicktip.url + '>' + quicktip.title + '</a>');
+      } else {
+        headlineElem.text(quicktip.title);
+      }
+      mainElem
+        .append(headlineElem)
+        .append('<p>' + quicktip.summary + '</p>');
+    }
+    var quicktipDiv = $('<div class="quicktip" type="' + quicktip.type + '">');
+    quicktipDiv
+      .append(mainElem)
+      .append('<span class="gefVon">' + quicktip.gefVon + '</span>');
+    quicktipsDiv.append(quicktipDiv);
+  });
+}

resources/assets/less/metager/result-page.less

@@ -130,7 +130,7 @@ footer {
     }
 }
 
-.fa.fa-twitter{
+.fa.fa-twitter {
     color: #6faedc
 }
 
@@ -425,7 +425,10 @@ a {
             li:not(.option-title):hover {
                 background-color: #e0e0e0;
             }
-            a, a:hover, a:focus, a:visited {
+            a,
+            a:hover,
+            a:focus,
+            a:visited {
                 color: black;
                 display: block;
             }
@@ -620,4 +623,89 @@ a {
         padding-left: 0;
         padding-right: 0;
     }
+}
+
+
+/*
+ * <div id="quicktips">
+ *   <div class="quicktip" type="TYPE">
+ *     <details>
+ *       <summary>
+ *         <h1><a href="URL">TITLE
+ *         <p>SUMMARY
+ *       <div class="quicktip-detail">
+ *         <h1><a href="DETAILURL">DETAILTITLE
+ *         <p>DETAILSUMMARY
+ *     <span>GEFVON
+ * </...>
+ */
+
+#quicktips {
+    display: flex;
+    flex-direction: column;
+    // border: 2px solid #ccc;
+    .quicktip {
+        margin: 10px 0px;
+        padding-left: 10px;
+        border-left: 3px solid #fb0;
+        .quicktip-summary {
+            h1 {
+                font-size: 16px;
+                font-weight: bold;
+            }
+            p {}
+        }
+        .quicktip-detail {
+            border-top: 1px solid #ddd;
+            border-bottom: 1px solid #ddd;
+            h2 {
+                margin: 10px 0px;
+                font-size: 14px;
+                font-weight: bold;
+            }
+            p {
+                display: none;
+                font-size: 12px;
+            }
+        }
+        .gefVon {
+            font-size: 14px;
+        }
+        &[type=spruch] {
+            border-left: 3px solid #070;
+            p {
+                color: #070;
+                .author {
+                    color: #404040;
+                    font-style: italic;
+                }
+            }
+        }
+        &[type=spendenaufruf] {
+            border-left: #ddd;
+            color: #ff8000;
+            .quicktip-summary {
+                display: flex;
+                justify-content: space-between;
+                h1 {
+                    margin-right: 15px;
+                }
+                p {
+                    margin: 5px;
+                    .spendenaufruf-btn {
+                        color: white;
+                        background-color: #ff8000;
+                        font-size: 16px;
+                    }
+                }
+            }
+        }
+        &[type=dictCC] {
+            .quicktip-summary {
+                p {
+                    font-weight: bold;
+                }
+            }
+        }
+    }
 }
\ No newline at end of file

resources/assets/less/metager/static-pages.less

@@ -413,24 +413,6 @@ textarea#message {
     margin-bottom: 5px;
 }
 
-.quicktip {
-    margin-bottom: 15px;
-    padding: 10px;
-    line-height: 1.2 !important;
-    font-family: Georgia, "Times New Roman", Palatino, Times, serif;
-    color: @quicktip-color;
-    border-left: 3px solid @quicktip-border-left-color;
-    font-size: 14px;
-    h1 {
-        font-size: 22px;
-        margin-top: 0px;
-    }
-    &.aufruf {
-        color: @quicktip-aufruf-color;
-        border-left: 3px solid @quicktip-aufruf-border-left-color;
-    }
-}
-
 .wikiqtextract {
     font-family: Georgia, "Times New Roman", Palatino, Times, serif;
 }

resources/views/layouts/utility.blade.php

 {{-- Verwendung: @include('layouts.utility') --}}
 
-<script src="{{ elixir('js/utility.js') }}"></script>
+<script defer src="{{ elixir('js/utility.js') }}"></script>
 <link type="text/css" rel="stylesheet" href="{{ elixir('css/utility.css') }}" />

resources/views/metager3.blade.php

@@ -56,8 +56,6 @@
 		</nav>
 	</div>
 	@if( $metager->showQuicktips() )
-		<div class="hidden-xs col-md-4" id="quicktips">
-			<iframe class="col-mod-4 hidden-xs hidden-sm" src="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/qt") }}?q={{ $metager->getQ() }}&sprueche={{ $metager->getSprueche() }}&lang={{ Request::input('lang', 'all') }}&unfilteredLink={{ base64_encode($metager->getUnfilteredLink()) }}"></iframe>
-		</div>
+		<div class="col-md-4 hidden-xs hidden-sm" id="quicktips"></div>
 	@endif
 @endsection

resources/views/metager3results.blade.php

@@ -48,8 +48,6 @@
 	</nav>
 </div>
 @if( $metager->showQuicktips() )
-	<div class="hidden-xs col-md-4" id="quicktips">
-		<iframe class="col-mod-4 hidden-xs hidden-sm" src="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/qt") }}?q={{ $metager->getQ() }}&sprueche={{ $metager->getSprueche() }}&lang={{ Request::input('lang', 'all') }}&unfilteredLink={{ base64_encode($metager->getUnfilteredLink()) }}"></iframe>
-	</div>
+	<div class="col-md-4 hidden-xs hidden-sm" id="quicktips"></div>
 @endif
 </div>