From 044d638091d2755a6ae9283b721102092490a905 Mon Sep 17 00:00:00 2001
From: edku3281 <martin.bieder@uni-oldenburg.de>
Date: Wed, 18 Nov 2015 20:24:51 +0100
Subject: [PATCH] =?UTF-8?q?Verlinkung=20von=20Quellen=20erm=C3=B6glichen.?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 ew/_layouts/post.html                         |  3 +-
 ...2-nachteile-von-responsive-design.markdown |  2 +-
 ew/_sass/_ew.scss                             |  4 +++
 ew/js/sources.js                              | 33 +++++++++++++++++++
 4 files changed, 40 insertions(+), 2 deletions(-)
 create mode 100644 ew/js/sources.js

diff --git a/ew/_layouts/post.html b/ew/_layouts/post.html
index f024fbf..ffe0fb2 100644
--- a/ew/_layouts/post.html
+++ b/ew/_layouts/post.html
@@ -12,7 +12,7 @@
          <div class="row">
             <div class="col-lg-10 col-lg-offset-1">
                 {% include post-breadcrumb.html %}
-               {{ content }}
+                    {{ content }}
             </div>
          </div>
       </div>
@@ -20,6 +20,7 @@
 
    {% include footer.html %}
    {% include scripts.html %}
+   <script src="{{ site.baseurl }}/js/sources.js"></script>
 </body>
 
 </html>
diff --git a/ew/_posts/2015-11-12-nachteile-von-responsive-design.markdown b/ew/_posts/2015-11-12-nachteile-von-responsive-design.markdown
index 40a892c..c3929e8 100644
--- a/ew/_posts/2015-11-12-nachteile-von-responsive-design.markdown
+++ b/ew/_posts/2015-11-12-nachteile-von-responsive-design.markdown
@@ -23,7 +23,7 @@ Gerade bei Tablet-PCs sind heutzutage Bildschirmgrößen erreicht, die denen von
 ### Fazit
 Abschließend lässt sich festhalten, dass Responsive Webdesign Vor- und Nachteile hat. Insbesondere wenn sehr stark auf Responsive Webdesign gesetzt wird, kann es zu Problemen hinsichtlich Erwartungskonformität und Perfomanz kommen.
 
-<hr>
+<hr id="sources">
 
 <small>
     <sup>1</sup> Maisriml, Chio & König, Sabine (2015). [Die Nachteile von Responsive Webdesign](http://beesign.com/themen/responsive-webdesign-nachteile.html). Abgerufen: 07.11.2015.
diff --git a/ew/_sass/_ew.scss b/ew/_sass/_ew.scss
index d1ac605..f43a807 100644
--- a/ew/_sass/_ew.scss
+++ b/ew/_sass/_ew.scss
@@ -2,6 +2,10 @@ html {
     overflow-y: scroll;
 }
 
+sup>a:target {
+    background: yellow;
+}
+
 .breadcrumb {
     margin-top: -30px;
     margin-bottom: 30px;
diff --git a/ew/js/sources.js b/ew/js/sources.js
new file mode 100644
index 0000000..52f1e2f
--- /dev/null
+++ b/ew/js/sources.js
@@ -0,0 +1,33 @@
+/**
+ * Funktionalität für den Klick-Support der Quellenangaben.
+ */
+(function($) {
+    var $sups = $('sup');
+
+    // <sup> durchlaufen und zu Links umwandeln
+    $sups.each(function() {
+        var $el = $(this);
+        var sources = $el.text().split(', ');
+
+        // Links zu #cite_{nr} für jeden <sup> erzeugen
+        sources.forEach(function(source) {
+           $el.after('<sup><a href="#cite_' + source + '">' + source + '</a></sup>');
+           $el.remove();
+        });
+    });
+
+    // <sup>-Links in #sources zu Anchor-Name-Tags umwandeln
+    $('#sources').nextAll('p').find('small>sup').each(function() {
+        var $anchor = $(this).find('a');
+
+        // Name-Attribut anhand des href zusammenbauen.
+        // Alles nach dem Hash verwenden.
+        $anchor.attr(
+            'name',
+            $anchor.attr('href').substring(
+                $anchor.attr('href').indexOf('#') + 1
+            )
+        );
+        $anchor.removeAttr('href');
+    });
+})(jQuery);
-- 
GitLab