Initial commit: Backup der Webseiten

- zoesch.de
- blitzkiste.net
- gruene-hassberge (norbert.zoesch.de)

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
Felix Zösch
2025-12-13 01:17:15 +01:00
commit 07c290a453
4607 changed files with 1202735 additions and 0 deletions

View File

@@ -0,0 +1,2 @@
require("./material.js");
require("./ripples.js");

View File

@@ -0,0 +1,352 @@
/* globals jQuery */
(function ($) {
// Selector to select only not already processed elements
$.expr[":"].notmdproc = function (obj) {
if ($(obj).data("mdproc")) {
return false;
} else {
return true;
}
};
function _isChar(evt) {
if (typeof evt.which == "undefined") {
return true;
} else if (typeof evt.which == "number" && evt.which > 0) {
return (
!evt.ctrlKey
&& !evt.metaKey
&& !evt.altKey
&& evt.which != 8 // backspace
&& evt.which != 9 // tab
&& evt.which != 13 // enter
&& evt.which != 16 // shift
&& evt.which != 17 // ctrl
&& evt.which != 20 // caps lock
&& evt.which != 27 // escape
);
}
return false;
}
function _addFormGroupFocus(element) {
var $element = $(element);
if (!$element.prop('disabled')) { // this is showing as undefined on chrome but works fine on firefox??
$element.closest(".form-group").addClass("is-focused");
}
}
function _toggleDisabledState($element, state) {
var $target;
if ($element.hasClass('checkbox-inline') || $element.hasClass('radio-inline')) {
$target = $element;
} else {
$target = $element.closest('.checkbox').length ? $element.closest('.checkbox') : $element.closest('.radio');
}
return $target.toggleClass('disabled', state);
}
function _toggleTypeFocus($input) {
var disabledToggleType = false;
if ($input.is($.material.options.checkboxElements) || $input.is($.material.options.radioElements)) {
disabledToggleType = true;
}
$input.closest('label').hover(function () {
var $i = $(this).find('input');
var isDisabled = $i.prop('disabled'); // hack because the _addFormGroupFocus() wasn't identifying the property on chrome
if (disabledToggleType) {
_toggleDisabledState($(this), isDisabled);
}
if (!isDisabled) {
_addFormGroupFocus($i); // need to find the input so we can check disablement
}
},
function () {
_removeFormGroupFocus($(this).find('input'));
});
}
function _removeFormGroupFocus(element) {
$(element).closest(".form-group").removeClass("is-focused"); // remove class from form-group
}
$.material = {
"options": {
// These options set what will be started by $.material.init()
"validate": true,
"input": true,
"ripples": true,
"checkbox": true,
"togglebutton": true,
"radio": true,
"arrive": true,
"autofill": false,
"withRipples": [
".btn:not(.btn-link)",
".card-image",
".navbar a:not(.withoutripple)",
".dropdown-menu a",
".nav-tabs a:not(.withoutripple)",
".withripple",
".pagination li:not(.active):not(.disabled) a:not(.withoutripple)"
].join(","),
"inputElements": "input.form-control, textarea.form-control, select.form-control",
"checkboxElements": ".checkbox > label > input[type=checkbox], label.checkbox-inline > input[type=checkbox]",
"togglebuttonElements": ".togglebutton > label > input[type=checkbox]",
"radioElements": ".radio > label > input[type=radio], label.radio-inline > input[type=radio]"
},
"checkbox": function (selector) {
// Add fake-checkbox to material checkboxes
var $input = $((selector) ? selector : this.options.checkboxElements)
.filter(":notmdproc")
.data("mdproc", true)
.after("<span class='checkbox-material'><span class='check'></span></span>");
_toggleTypeFocus($input);
},
"togglebutton": function (selector) {
// Add fake-checkbox to material checkboxes
var $input = $((selector) ? selector : this.options.togglebuttonElements)
.filter(":notmdproc")
.data("mdproc", true)
.after("<span class='toggle'></span>");
_toggleTypeFocus($input);
},
"radio": function (selector) {
// Add fake-radio to material radios
var $input = $((selector) ? selector : this.options.radioElements)
.filter(":notmdproc")
.data("mdproc", true)
.after("<span class='circle'></span><span class='check'></span>");
_toggleTypeFocus($input);
},
"input": function (selector) {
$((selector) ? selector : this.options.inputElements)
.filter(":notmdproc")
.data("mdproc", true)
.each(function () {
var $input = $(this);
// Requires form-group standard markup (will add it if necessary)
var $formGroup = $input.closest(".form-group"); // note that form-group may be grandparent in the case of an input-group
if ($formGroup.length === 0 && $input.attr('type') !== "hidden" && !$input.attr('hidden')) {
$input.wrap("<div class='form-group'></div>");
$formGroup = $input.closest(".form-group"); // find node after attached (otherwise additional attachments don't work)
}
// Legacy - Add hint label if using the old shorthand data-hint attribute on the input
if ($input.attr("data-hint")) {
$input.after("<p class='help-block'>" + $input.attr("data-hint") + "</p>");
$input.removeAttr("data-hint");
}
// Legacy - Change input-sm/lg to form-group-sm/lg instead (preferred standard and simpler css/less variants)
var legacySizes = {
"input-lg": "form-group-lg",
"input-sm": "form-group-sm"
};
$.each(legacySizes, function (legacySize, standardSize) {
if ($input.hasClass(legacySize)) {
$input.removeClass(legacySize);
$formGroup.addClass(standardSize);
}
});
// Legacy - Add label-floating if using old shorthand <input class="floating-label" placeholder="foo">
if ($input.hasClass("floating-label")) {
var placeholder = $input.attr("placeholder");
$input.attr("placeholder", null).removeClass("floating-label");
var id = $input.attr("id");
var forAttribute = "";
if (id) {
forAttribute = "for='" + id + "'";
}
$formGroup.addClass("label-floating");
$input.after("<label " + forAttribute + "class='control-label'>" + placeholder + "</label>");
}
// Set as empty if is empty (damn I must improve this...)
if ($input.val() === null || $input.val() == "undefined" || $input.val() === "") {
$formGroup.addClass("is-empty");
}
// Support for file input
if ($formGroup.find("input[type=file]").length > 0) {
$formGroup.addClass("is-fileinput");
}
});
},
"attachInputEventHandlers": function () {
var validate = this.options.validate;
$(document)
.on("keydown paste", ".form-control", function (e) {
if (_isChar(e)) {
$(this).closest(".form-group").removeClass("is-empty");
}
})
.on("keyup change", ".form-control", function () {
var $input = $(this);
var $formGroup = $input.closest(".form-group");
var isValid = (typeof $input[0].checkValidity === "undefined" || $input[0].checkValidity());
if ($input.val() === "") {
$formGroup.addClass("is-empty");
}
else {
$formGroup.removeClass("is-empty");
}
// Validation events do not bubble, so they must be attached directly to the input: http://jsfiddle.net/PEpRM/1/
// Further, even the bind method is being caught, but since we are already calling #checkValidity here, just alter
// the form-group on change.
//
// NOTE: I'm not sure we should be intervening regarding validation, this seems better as a README and snippet of code.
// BUT, I've left it here for backwards compatibility.
if (validate) {
if (isValid) {
$formGroup.removeClass("has-error");
}
else {
$formGroup.addClass("has-error");
}
}
})
.on("focus", ".form-control, .form-group.is-fileinput", function () {
_addFormGroupFocus(this);
})
.on("blur", ".form-control, .form-group.is-fileinput", function () {
_removeFormGroupFocus(this);
})
// make sure empty is added back when there is a programmatic value change.
// NOTE: programmatic changing of value using $.val() must trigger the change event i.e. $.val('x').trigger('change')
.on("change", ".form-group input", function () {
var $input = $(this);
if ($input.attr("type") == "file") {
return;
}
var $formGroup = $input.closest(".form-group");
var value = $input.val();
if (value) {
$formGroup.removeClass("is-empty");
} else {
$formGroup.addClass("is-empty");
}
})
// set the fileinput readonly field with the name of the file
.on("change", ".form-group.is-fileinput input[type='file']", function () {
var $input = $(this);
var $formGroup = $input.closest(".form-group");
var value = "";
$.each(this.files, function (i, file) {
value += file.name + ", ";
});
value = value.substring(0, value.length - 2);
if (value) {
$formGroup.removeClass("is-empty");
} else {
$formGroup.addClass("is-empty");
}
$formGroup.find("input.form-control[readonly]").val(value);
});
},
"ripples": function (selector) {
$((selector) ? selector : this.options.withRipples).ripples();
},
"autofill": function () {
// This part of code will detect autofill when the page is loading (username and password inputs for example)
var loading = setInterval(function () {
$("input[type!=checkbox]").each(function () {
var $this = $(this);
if ($this.val() && $this.val() !== $this.attr("value")) {
$this.trigger("change");
}
});
}, 100);
// After 10 seconds we are quite sure all the needed inputs are autofilled then we can stop checking them
setTimeout(function () {
clearInterval(loading);
}, 10000);
},
"attachAutofillEventHandlers": function () {
// Listen on inputs of the focused form (because user can select from the autofill dropdown only when the input has focus)
var focused;
$(document)
.on("focus", "input", function () {
var $inputs = $(this).parents("form").find("input").not("[type=file]");
focused = setInterval(function () {
$inputs.each(function () {
var $this = $(this);
if ($this.val() !== $this.attr("value")) {
$this.trigger("change");
}
});
}, 100);
})
.on("blur", ".form-group input", function () {
clearInterval(focused);
});
},
"init": function (options) {
this.options = $.extend({}, this.options, options);
var $document = $(document);
if ($.fn.ripples && this.options.ripples) {
this.ripples();
}
if (this.options.input) {
this.input();
this.attachInputEventHandlers();
}
if (this.options.checkbox) {
this.checkbox();
}
if (this.options.togglebutton) {
this.togglebutton();
}
if (this.options.radio) {
this.radio();
}
if (this.options.autofill) {
this.autofill();
this.attachAutofillEventHandlers();
}
if (document.arrive && this.options.arrive) {
if ($.fn.ripples && this.options.ripples) {
$document.arrive(this.options.withRipples, function () {
$.material.ripples($(this));
});
}
if (this.options.input) {
$document.arrive(this.options.inputElements, function () {
$.material.input($(this));
});
}
if (this.options.checkbox) {
$document.arrive(this.options.checkboxElements, function () {
$.material.checkbox($(this));
});
}
if (this.options.radio) {
$document.arrive(this.options.radioElements, function () {
$.material.radio($(this));
});
}
if (this.options.togglebutton) {
$document.arrive(this.options.togglebuttonElements, function () {
$.material.togglebutton($(this));
});
}
}
}
};
})(jQuery);

View File

@@ -0,0 +1,324 @@
/* Copyright 2014+, Federico Zivolo, LICENSE at https://github.com/FezVrasta/bootstrap-material-design/blob/master/LICENSE.md */
/* globals jQuery, navigator */
(function($, window, document, undefined) {
"use strict";
/**
* Define the name of the plugin
*/
var ripples = "ripples";
/**
* Get an instance of the plugin
*/
var self = null;
/**
* Define the defaults of the plugin
*/
var defaults = {};
/**
* Create the main plugin function
*/
function Ripples(element, options) {
self = this;
this.element = $(element);
this.options = $.extend({}, defaults, options);
this._defaults = defaults;
this._name = ripples;
this.init();
}
/**
* Initialize the plugin
*/
Ripples.prototype.init = function() {
var $element = this.element;
$element.on("mousedown touchstart", function(event) {
/**
* Verify if the user is just touching on a device and return if so
*/
if(self.isTouch() && event.type === "mousedown") {
return;
}
/**
* Verify if the current element already has a ripple wrapper element and
* creates if it doesn't
*/
if(!($element.find(".ripple-container").length)) {
$element.append("<div class=\"ripple-container\"></div>");
}
/**
* Find the ripple wrapper
*/
var $wrapper = $element.children(".ripple-container");
/**
* Get relY and relX positions
*/
var relY = self.getRelY($wrapper, event);
var relX = self.getRelX($wrapper, event);
/**
* If relY and/or relX are false, return the event
*/
if(!relY && !relX) {
return;
}
/**
* Get the ripple color
*/
var rippleColor = self.getRipplesColor($element);
/**
* Create the ripple element
*/
var $ripple = $("<div></div>");
$ripple
.addClass("ripple")
.css({
"left": relX,
"top": relY,
"background-color": rippleColor
});
/**
* Append the ripple to the wrapper
*/
$wrapper.append($ripple);
/**
* Make sure the ripple has the styles applied (ugly hack but it works)
*/
(function() { return window.getComputedStyle($ripple[0]).opacity; })();
/**
* Turn on the ripple animation
*/
self.rippleOn($element, $ripple);
/**
* Call the rippleEnd function when the transition "on" ends
*/
setTimeout(function() {
self.rippleEnd($ripple);
}, 500);
/**
* Detect when the user leaves the element
*/
$element.on("mouseup mouseleave touchend", function() {
$ripple.data("mousedown", "off");
if($ripple.data("animating") === "off") {
self.rippleOut($ripple);
}
});
});
};
/**
* Get the new size based on the element height/width and the ripple width
*/
Ripples.prototype.getNewSize = function($element, $ripple) {
return (Math.max($element.outerWidth(), $element.outerHeight()) / $ripple.outerWidth()) * 2.5;
};
/**
* Get the relX
*/
Ripples.prototype.getRelX = function($wrapper, event) {
var wrapperOffset = $wrapper.offset();
if(!self.isTouch()) {
/**
* Get the mouse position relative to the ripple wrapper
*/
return event.pageX - wrapperOffset.left;
} else {
/**
* Make sure the user is using only one finger and then get the touch
* position relative to the ripple wrapper
*/
event = event.originalEvent;
if(event.touches.length === 1) {
return event.touches[0].pageX - wrapperOffset.left;
}
return false;
}
};
/**
* Get the relY
*/
Ripples.prototype.getRelY = function($wrapper, event) {
var wrapperOffset = $wrapper.offset();
if(!self.isTouch()) {
/**
* Get the mouse position relative to the ripple wrapper
*/
return event.pageY - wrapperOffset.top;
} else {
/**
* Make sure the user is using only one finger and then get the touch
* position relative to the ripple wrapper
*/
event = event.originalEvent;
if(event.touches.length === 1) {
return event.touches[0].pageY - wrapperOffset.top;
}
return false;
}
};
/**
* Get the ripple color
*/
Ripples.prototype.getRipplesColor = function($element) {
var color = $element.data("ripple-color") ? $element.data("ripple-color") : window.getComputedStyle($element[0]).color;
return color;
};
/**
* Verify if the client browser has transistion support
*/
Ripples.prototype.hasTransitionSupport = function() {
var thisBody = document.body || document.documentElement;
var thisStyle = thisBody.style;
var support = (
thisStyle.transition !== undefined ||
thisStyle.WebkitTransition !== undefined ||
thisStyle.MozTransition !== undefined ||
thisStyle.MsTransition !== undefined ||
thisStyle.OTransition !== undefined
);
return support;
};
/**
* Verify if the client is using a mobile device
*/
Ripples.prototype.isTouch = function() {
return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
};
/**
* End the animation of the ripple
*/
Ripples.prototype.rippleEnd = function($ripple) {
$ripple.data("animating", "off");
if($ripple.data("mousedown") === "off") {
self.rippleOut($ripple);
}
};
/**
* Turn off the ripple effect
*/
Ripples.prototype.rippleOut = function($ripple) {
$ripple.off();
if(self.hasTransitionSupport()) {
$ripple.addClass("ripple-out");
} else {
$ripple.animate({"opacity": 0}, 100, function() {
$ripple.trigger("transitionend");
});
}
$ripple.on("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", function() {
$ripple.remove();
});
};
/**
* Turn on the ripple effect
*/
Ripples.prototype.rippleOn = function($element, $ripple) {
var size = self.getNewSize($element, $ripple);
if(self.hasTransitionSupport()) {
$ripple
.css({
"-ms-transform": "scale(" + size + ")",
"-moz-transform": "scale(" + size + ")",
"-webkit-transform": "scale(" + size + ")",
"transform": "scale(" + size + ")"
})
.addClass("ripple-on")
.data("animating", "on")
.data("mousedown", "on");
} else {
$ripple.animate({
"width": Math.max($element.outerWidth(), $element.outerHeight()) * 2,
"height": Math.max($element.outerWidth(), $element.outerHeight()) * 2,
"margin-left": Math.max($element.outerWidth(), $element.outerHeight()) * (-1),
"margin-top": Math.max($element.outerWidth(), $element.outerHeight()) * (-1),
"opacity": 0.2
}, 500, function() {
$ripple.trigger("transitionend");
});
}
};
/**
* Create the jquery plugin function
*/
$.fn.ripples = function(options) {
return this.each(function() {
if(!$.data(this, "plugin_" + ripples)) {
$.data(this, "plugin_" + ripples, new Ripples(this, options));
}
});
};
})(jQuery, window, document);