upload files to github

assets/.htaccess

@@ -0,0 +1,7 @@
+<IfModule !mod_authz_core.c>
+  Order allow,deny
+  Allow from all
+</IfModule>
+<IfModule mod_authz_core.c>
+  Require all granted
+</IfModule>

assets/css/comparison_slider.css

@@ -0,0 +1,52 @@
+.comparison-slider {
+    position:relative;
+    overflow:hidden;
+    margin-right:auto;
+    margin-left:auto;
+}
+
+.comparison-slider .ce_image {
+    width:50.01%;
+    height:100%;
+    left:0;
+    top:0;
+    position:absolute;
+    background-position:left top;
+    background-size:auto 100%;
+}
+
+.comparison-slider .ce_image:first-child {
+    overflow:visible;
+}
+
+.comparison-slider .ce_image:last-child {
+    left:auto;
+    right:0;
+    background-position:right top;
+    overflow: hidden;
+}
+
+.comparison-slider .ce_image .drag-button {
+    width:30px;
+    height:30px;
+    right:0;
+    top:50%;
+    position:absolute;
+    margin-top:-15px;
+    margin-right:-15px;
+    border-radius:50%;
+    background:#fff url("../img/slider_tragger.png") center center no-repeat;
+    -webkit-box-shadow:0 0 10px rgba(0,0,0,.2);
+    -moz-box-shadow:0 0 10px rgba(0,0,0,.2);
+    box-shadow:0 0 10px rgba(0,0,0,.2);
+    z-index:1;
+    cursor:pointer;
+}
+
+.comparison-slider .ce_image .drag-button:hover {
+    background-color:#ededed;
+}
+
+.comparison-slider .comparison-slider-text {
+    position: absolute;
+}

assets/js/comparison_slider.js

@@ -0,0 +1,68 @@
+(function($) {
+	var comparisonSliderWidth;
+	var comparisonSliderRatio;
+	var comparisonSliderClicked;
+	var comparisonSliderPositionX;
+	var mousePositionX;
+
+	function initComparisonSlider() {
+
+		var comparisonSliderClicked = false;
+
+		if ($(".comparison-slider").length > 0) {
+			$('.comparison-slider').each(function() {
+				comparisonSliderWidth = $(this).width();
+				$(this).find(".ce_image").each(function() {
+					// var srcToBackground = $(this).find("img").attr("src");
+					comparisonSliderRatio = $(this).attr("img-width") / $(this).attr("img-height");
+					// var imagePath = 'url(' + srcToBackground + ')';
+					// $(this).find(".image_container").css("display", "none");
+					// $(this).css("background-image", imagePath);
+					$(this).css("height", comparisonSliderWidth / comparisonSliderRatio);
+				});
+
+				$(this).css("height", comparisonSliderWidth / comparisonSliderRatio);
+				$(this).find(".ce_image:first-child").css("width", "");
+				$(this).find(".ce_image:first-child").css("max-width", comparisonSliderWidth);
+				$(this).find(".ce_image:last-child").css("width", "");
+				$(this).find(".drag-button").remove();
+				$(this).find(".ce_image:first-child").append('<div class="drag-button"></div>');
+			});
+
+
+			$('.comparison-slider .drag-button').tapstart(function() {
+		        comparisonSliderClicked = true;
+		        $(this).css("background-color", "#6cbb48");
+		    });
+
+		    $('.comparison-slider').tapend(function() {
+		        comparisonSliderClicked = false;
+		        $('.comparison-slider .drag-button').css("background-color", "");
+		    });
+
+		    $('.comparison-slider').tapmove(function(e, touch) {
+		        if (comparisonSliderClicked === false) {
+		            return;
+		        }
+				comparisonSliderPosition=$(this).offset();
+				mousePositionX = touch.position.x-comparisonSliderPosition.left;
+
+		        $(this).find(".ce_image:first-child").css("width", mousePositionX);
+				$(this).find(".ce_image:last-child").css("width", parseInt(comparisonSliderWidth) - mousePositionX);
+
+		    });
+
+		}
+
+	}
+
+	$(document).ready(function() {
+		initComparisonSlider();
+	});
+
+	$(window).resize(function() {
+		initComparisonSlider();
+	});
+
+})(jQuery);
+

composer.json

@@ -0,0 +1,42 @@
+{
+    "name": "postyou/contao-comparison-slider",
+    "description": "Slider to compare two images e.g. before/after",
+    "keywords": [
+        "contao",
+        "comparison",
+        "tl_content",
+        "slider"
+    ],
+    "type": "contao-content-element",
+    "license": "LGPL-3.0+",
+    "authors": [
+        {
+            "name": "Mario Gienapp",
+            "role": "Developer"
+        },
+       {
+            "name":"postyou",
+            "homepage":"http://postyou.de"
+        }
+    ],
+    "support": {
+        "email": "[email protected]",
+        "issues": "https://github.com/postyou/contao-comparison-slider/issues?direction=desc&sort=created&state=open",
+        "source": "https://github.com/postyou/contao-comparison-slider"
+    },
+    "require": {
+        "php": ">=5.3.2",
+        "contao/core": ">=3.2,<4.0",
+        "contao-community-alliance/composer-plugin": "~2.0"
+    },
+    "require-dev":{
+        "contao-community-alliance/build-system": "~1.0"
+    },
+    "extra": {
+        "contao": {
+            "sources": {
+                "": "system/modules/contao-comparison-slider"
+            }
+        }
+    }
+}

config/autoload.ini

@@ -0,0 +1,19 @@
+;;
+; List modules which are required to be loaded beforehand
+;;
+requires[] = "core"
+
+;;
+; Configure what you want the autoload creator to register
+;;
+register_namespaces = true
+register_classes    = true
+register_templates  = true
+
+;;
+; Override the default configuration for certain sub directories
+;;
+[vendor/*]
+register_namespaces = false
+register_classes    = false
+register_templates  = false

config/autoload.php

@@ -0,0 +1,37 @@
+<?php
+
+/**
+ * Contao Open Source CMS
+ *
+ * Copyright (c) 2005-2016 Leo Feyer
+ *
+ * @license LGPL-3.0+
+ */
+
+
+/**
+ * Register the namespaces
+ */
+ClassLoader::addNamespaces(array
+(
+	'ComparisonSlider',
+));
+
+
+/**
+ * Register the classes
+ */
+ClassLoader::addClasses(array
+(
+	// Elements
+	'ComparisonSlider\ContentComparisonSlider' => 'system/modules/contao-comparison-slider/elements/ContentComparisonSlider.php',
+));
+
+
+/**
+ * Register the templates
+ */
+TemplateLoader::addFiles(array
+(
+	'ce_comparison_slider' => 'system/modules/contao-comparison-slider/templates',
+));