feat: Update composeMail function
- Move function to hippie functions - Use vanilla instead of jQuery - Add examples to introduction page - Reindent
This commit is contained in:
parent
9fbc19388f
commit
875041bacf
3 changed files with 213 additions and 213 deletions
|
|
@ -1,22 +1,22 @@
|
|||
//NEW
|
||||
|
||||
function Clock(id){
|
||||
function Clock(id) {
|
||||
this.id = id;
|
||||
|
||||
var that = this;
|
||||
setInterval(function(){that.updateClock();}, 1000);
|
||||
setInterval(function () { that.updateClock(); }, 1000);
|
||||
this.updateClock();
|
||||
}
|
||||
|
||||
Clock.prototype.updateClock = function(){
|
||||
Clock.prototype.updateClock = function () {
|
||||
var date = new Date();
|
||||
var clock = document.getElementById(this.id);
|
||||
//console.log(this);
|
||||
clock.innerHTML = this.formatDigits(date.getHours()) + ":" + this.formatDigits(date.getMinutes()) + ":" + this.formatDigits(date.getSeconds());
|
||||
};
|
||||
|
||||
Clock.prototype.formatDigits = function(val){
|
||||
if(val<10) val = "0" + val;
|
||||
Clock.prototype.formatDigits = function (val) {
|
||||
if (val < 10) val = "0" + val;
|
||||
|
||||
return val;
|
||||
}
|
||||
|
|
@ -43,35 +43,35 @@ function ongoing() {
|
|||
var h = Math.floor(now.getHours() + m / 60);
|
||||
|
||||
var j2000 = new Date(); // Bezugspunkt ist der 1.1.2000 0:00 UT (entspricht JD 2451544,5)
|
||||
j2000.setUTCFullYear(2000,0,1);
|
||||
j2000.setUTCHours(0,0,0,0);
|
||||
j2000.setUTCFullYear(2000, 0, 1);
|
||||
j2000.setUTCHours(0, 0, 0, 0);
|
||||
|
||||
var utc = new Date();
|
||||
utc.setUTCFullYear(y,MNumb,DNumb); // Monate müssen im Wertebereich 0...11 übergeben werden
|
||||
utc.setUTCHours(h,m,s,ms);
|
||||
utc.setUTCFullYear(y, MNumb, DNumb); // Monate müssen im Wertebereich 0...11 übergeben werden
|
||||
utc.setUTCHours(h, m, s, ms);
|
||||
|
||||
var utc0 = new Date();
|
||||
utc0.setUTCFullYear(y,MNumb,DNumb);
|
||||
utc0.setUTCHours(0,0,0,0);
|
||||
utc0.setUTCFullYear(y, MNumb, DNumb);
|
||||
utc0.setUTCHours(0, 0, 0, 0);
|
||||
|
||||
var jd = 2451544.5 + (utc-j2000) / 86400000; // Zählung erfolgt in Millisekunden, 1 Tag = 86.400.000 ms
|
||||
var jdUTC0 = 2451544.5 + (utc0-j2000) / 86400000;
|
||||
var jd = 2451544.5 + (utc - j2000) / 86400000; // Zählung erfolgt in Millisekunden, 1 Tag = 86.400.000 ms
|
||||
var jdUTC0 = 2451544.5 + (utc0 - j2000) / 86400000;
|
||||
|
||||
var N = jd - 2451545.0;
|
||||
var L = 280.460 + 0.9856474 * N; // mittlere ekliptikale Länge der Sonne
|
||||
var g = 357.528 + 0.9856003 * N; // mittlere Anomalie
|
||||
var el = L + 1.915 * Math.sin(g) + 0.020 * Math.sin(2*g);
|
||||
var el = L + 1.915 * Math.sin(g) + 0.020 * Math.sin(2 * g);
|
||||
var e = 23.439 - 0.0000004 * N;
|
||||
var rektaszension = Math.atan((Math.cos(e)*Math.sin(el)) / Math.cos(el));
|
||||
var rektaszension = Math.atan((Math.cos(e) * Math.sin(el)) / Math.cos(el));
|
||||
|
||||
var T = (jdUTC0 - 2451545.0) / 36525;
|
||||
var stGMT = (((6*3600) + (41*60) + 50.54841) + (8640184.812866*T) + (0.093104*Math.pow(T,2)) - (0.0000062*Math.pow(T,3))) / 3600;
|
||||
var stGMT = (((6 * 3600) + (41 * 60) + 50.54841) + (8640184.812866 * T) + (0.093104 * Math.pow(T, 2)) - (0.0000062 * Math.pow(T, 3))) / 3600;
|
||||
|
||||
var stGMT2 = 6.697376 + 2400.05134 * T + 1.002738 * T;
|
||||
var hWGMT = stGMT2 * 15;
|
||||
var hW = hWGMT + 11.9566185772;
|
||||
|
||||
var st = (stGMT + (now.getUTCHours()*1.00273790935)) + (11.9566185772/15); // Sommerzeit muss noch berücksichtigt werden
|
||||
var st = (stGMT + (now.getUTCHours() * 1.00273790935)) + (11.9566185772 / 15); // Sommerzeit muss noch berücksichtigt werden
|
||||
var st24 = Math.abs(st - (Math.round(st / 24) * 24));
|
||||
var stH = Math.floor(st24);
|
||||
var stM = Math.floor((st24 % 1) * 60);
|
||||
|
|
@ -103,90 +103,47 @@ function ongoing() {
|
|||
|
||||
}
|
||||
|
||||
function zeroFill( number, width ){
|
||||
function zeroFill(number, width) {
|
||||
width -= number.toString().length;
|
||||
if ( width > 0 ){
|
||||
return new Array( width + (/\./.test( number ) ? 2 : 1) ).join( '0' ) + number;
|
||||
if (width > 0) {
|
||||
return new Array(width + (/\./.test(number) ? 2 : 1)).join('0') + number;
|
||||
}
|
||||
return number + ""; // always return a string
|
||||
}
|
||||
|
||||
// create emails
|
||||
function composeMail(tag, name, prov, suffix, text, topic) {
|
||||
var trigger = tag.indexOf(".");
|
||||
var mailString = name + '@' + prov + '.' + suffix;
|
||||
var textString = mailString.replace(/@/g, "(at)");
|
||||
var descString = "Nachricht an " + mailString;
|
||||
if (trigger == -1) {
|
||||
if (!text) {
|
||||
text = mailString;
|
||||
} else if (text == "at") {
|
||||
text = textString;
|
||||
} else if (text == "to") {
|
||||
text = descString;
|
||||
}
|
||||
if (!topic) {
|
||||
topic = "";
|
||||
} else {
|
||||
topic = "?subject=" + topic;
|
||||
}
|
||||
var old = $('#'+tag).html();
|
||||
$('#'+tag).html(old + text);
|
||||
$('#'+tag).attr("href", "mailto:" + mailString + topic);
|
||||
} else {
|
||||
$(tag).each(function() {
|
||||
if (!text) {
|
||||
text = mailString;
|
||||
} else if (text == "at") {
|
||||
text = textString;
|
||||
} else if (text == "to") {
|
||||
text = descString;
|
||||
}
|
||||
if (!topic) {
|
||||
topic = "";
|
||||
} else {
|
||||
topic = "?subject=" + topic;
|
||||
}
|
||||
var old = $(this).html();
|
||||
$(this).html(old + text);
|
||||
$(this).attr("href", "mailto:" + mailString + topic);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
//Länge der Balken im Diagram berechnen
|
||||
function barwidth(size, G, W) {
|
||||
var s = size;
|
||||
var g = G;
|
||||
var w = W;
|
||||
var p = ( w / g ) * 100;
|
||||
var newW = s * ( p /100 );
|
||||
var p = (w / g) * 100;
|
||||
var newW = s * (p / 100);
|
||||
|
||||
return newW;
|
||||
}
|
||||
//String Element erweitern
|
||||
String.prototype.transform = function() {
|
||||
String.prototype.transform = function () {
|
||||
return parseFloat(this.replace(',', '.'));
|
||||
}
|
||||
//Array Element erweitern
|
||||
Array.prototype.arrayAdd = function() {
|
||||
Array.prototype.arrayAdd = function () {
|
||||
return eval(this.join("+"));
|
||||
}
|
||||
//Speicherplatz in Prozent berechnen
|
||||
function percentage(total, gigs, round) {
|
||||
var totalSpace = total;
|
||||
var singleSpace = gigs;
|
||||
var z = round;
|
||||
var p = singleSpace / ( totalSpace / 100 );
|
||||
var totalSpace = total;
|
||||
var singleSpace = gigs;
|
||||
var z = round;
|
||||
var p = singleSpace / (totalSpace / 100);
|
||||
|
||||
return p;
|
||||
return p;
|
||||
}
|
||||
//Speicherplatz in GB berechnen
|
||||
function gigabytes(percent, total, round) {
|
||||
var occupiedPercent = percent;
|
||||
var singleSpace = total;
|
||||
var z = round;
|
||||
var g = (singleSpace / 100 ) * occupiedPercent;
|
||||
var occupiedPercent = percent;
|
||||
var singleSpace = total;
|
||||
var z = round;
|
||||
var g = (singleSpace / 100) * occupiedPercent;
|
||||
|
||||
return g;
|
||||
return g;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,149 +1,188 @@
|
|||
// This is called everytime
|
||||
function setup() {
|
||||
'use strict';
|
||||
'use strict';
|
||||
|
||||
console.group('Document information');
|
||||
console.info('\n', hippie.brand, '\n\n');
|
||||
console.info('HTML:', hippie.screen, '\nBODY:', hippie.body);
|
||||
console.groupEnd();
|
||||
if (debugOn) {
|
||||
console.group('Debug information');
|
||||
console.dir(hippie);
|
||||
console.groupEnd();
|
||||
}
|
||||
console.group('Document information');
|
||||
console.info('\n', hippie.brand, '\n\n');
|
||||
console.info('HTML:', hippie.screen, '\nBODY:', hippie.body);
|
||||
console.groupEnd();
|
||||
if (debugOn) {
|
||||
console.group('Debug information');
|
||||
console.dir(hippie);
|
||||
console.groupEnd();
|
||||
}
|
||||
|
||||
// WANNABE MODULE Mouse over effect
|
||||
// With CSS only
|
||||
if ($('#js_mob').length && viewHover) {
|
||||
$('#js_mob').addClass('mouse_over');
|
||||
}
|
||||
// if (viewHover) {
|
||||
// $('body').prepend('<div id="js_mob" class="mouse_over"></div>');
|
||||
// }
|
||||
// With JS
|
||||
// WANNABE MODULE Mouse over effect
|
||||
// With CSS only
|
||||
if ($('#js_mob').length && viewHover) {
|
||||
$('#js_mob').addClass('mouse_over');
|
||||
}
|
||||
// if (viewHover) {
|
||||
// $('body').prepend('<div id="js_mob" class="mouse_over"></div>');
|
||||
// }
|
||||
// With JS
|
||||
}
|
||||
|
||||
// MODULE Scroll navigation
|
||||
// Using constructor function
|
||||
function HippieScroll($tp, $dn) {
|
||||
'use strict';
|
||||
'use strict';
|
||||
|
||||
// this.$tp = $tp;
|
||||
// Define initial situation
|
||||
let initLeft = false;
|
||||
const initY = hippie.screen.vh;
|
||||
// this.$tp = $tp;
|
||||
// Define initial situation
|
||||
let initLeft = false;
|
||||
const initY = hippie.screen.vh;
|
||||
|
||||
$tp.addClass('di_none');
|
||||
$tp.addClass('di_none');
|
||||
|
||||
// Check scroll position and toggle element
|
||||
this.check = function () {
|
||||
hippie.screen.y = Math.min($(document).scrollTop(), document.documentElement.scrollTop);
|
||||
if (hippie.screen.y > initY) {
|
||||
if (!initLeft) {
|
||||
$tp.removeClass('di_none');
|
||||
console.info('Initial viewport left');
|
||||
}
|
||||
initLeft = true;
|
||||
} else {
|
||||
if (initLeft) {
|
||||
$tp.addClass('di_none');
|
||||
console.info('Initial viewport entered');
|
||||
}
|
||||
initLeft = false;
|
||||
}
|
||||
};
|
||||
// Check scroll position and toggle element
|
||||
this.check = function () {
|
||||
hippie.screen.y = Math.min($(document).scrollTop(), document.documentElement.scrollTop);
|
||||
if (hippie.screen.y > initY) {
|
||||
if (!initLeft) {
|
||||
$tp.removeClass('di_none');
|
||||
console.info('Initial viewport left');
|
||||
}
|
||||
initLeft = true;
|
||||
} else {
|
||||
if (initLeft) {
|
||||
$tp.addClass('di_none');
|
||||
console.info('Initial viewport entered');
|
||||
}
|
||||
initLeft = false;
|
||||
}
|
||||
};
|
||||
|
||||
// Add events to navigation elements
|
||||
$tp.click(function (event) {
|
||||
event.preventDefault();
|
||||
$('html, body').stop().animate({
|
||||
scrollTop: 0
|
||||
}, basicEase);
|
||||
// console.log('Scrolled to top');
|
||||
});
|
||||
$dn.click(function (event) {
|
||||
event.preventDefault();
|
||||
var pos = Math.max(hippie.screen.dh, hippie.body.h) - hippie.screen.vh;
|
||||
$('html').scrollTop(pos);
|
||||
// document.documentElement.scrollTop = pos;
|
||||
console.info('Scrolled down to', pos);
|
||||
});
|
||||
// Add events to navigation elements
|
||||
$tp.click(function (event) {
|
||||
event.preventDefault();
|
||||
$('html, body').stop().animate({
|
||||
scrollTop: 0
|
||||
}, basicEase);
|
||||
// console.log('Scrolled to top');
|
||||
});
|
||||
$dn.click(function (event) {
|
||||
event.preventDefault();
|
||||
var pos = Math.max(hippie.screen.dh, hippie.body.h) - hippie.screen.vh;
|
||||
$('html').scrollTop(pos);
|
||||
// document.documentElement.scrollTop = pos;
|
||||
console.info('Scrolled down to', pos);
|
||||
});
|
||||
}
|
||||
|
||||
// MODULE Meta elements
|
||||
function HippieMeta($ma, $pp) {
|
||||
'use strict';
|
||||
'use strict';
|
||||
|
||||
let metaOn = false;
|
||||
let metaOn = false;
|
||||
|
||||
$ma.click(function () {
|
||||
var $wrap, $pop;
|
||||
$ma.click(function () {
|
||||
var $wrap, $pop;
|
||||
|
||||
// if (metaOn !== true) {
|
||||
if (!metaOn) {
|
||||
metaOn = true;
|
||||
// if (metaOn !== true) {
|
||||
if (!metaOn) {
|
||||
metaOn = true;
|
||||
|
||||
$pp.each(function () {
|
||||
// if ($(this).css('position') === 'static') {
|
||||
// $(this).addClass('js_changed_pos');
|
||||
// $(this).css('position', 'relative');
|
||||
// }
|
||||
// $pop = $(this).next('.exp_pop').detach();
|
||||
// $wrap = $(this).wrap('<span class="exp_wrap"></span>').parent().prepend('<span class="exp_overlay"></span>').prepend('<span class="exp_marker_pop"></span>');
|
||||
// $wrap.after($pop);
|
||||
$pp.each(function () {
|
||||
// if ($(this).css('position') === 'static') {
|
||||
// $(this).addClass('js_changed_pos');
|
||||
// $(this).css('position', 'relative');
|
||||
// }
|
||||
// $pop = $(this).next('.exp_pop').detach();
|
||||
// $wrap = $(this).wrap('<span class="exp_wrap"></span>').parent().prepend('<span class="exp_overlay"></span>').prepend('<span class="exp_marker_pop"></span>');
|
||||
// $wrap.after($pop);
|
||||
|
||||
$('<div></div>').addClass('exp_overlay').css({
|
||||
position: 'absolute',
|
||||
width: '100%',
|
||||
height: '100%',
|
||||
top: 0,
|
||||
left: 0
|
||||
}).appendTo($(this).addClass('exp_wrap'));
|
||||
$('<div></div>').addClass('exp_overlay').css({
|
||||
position: 'absolute',
|
||||
width: '100%',
|
||||
height: '100%',
|
||||
top: 0,
|
||||
left: 0
|
||||
}).appendTo($(this).addClass('exp_wrap'));
|
||||
|
||||
// Displays explanation popup following the mouse
|
||||
$(this).on({
|
||||
mouseenter: function () {
|
||||
// if ($(this).attr('emmet')) {
|
||||
//
|
||||
// }
|
||||
$(this).next('.exp_pop').show();
|
||||
},
|
||||
mouseleave: function () {
|
||||
$(this).next('.exp_pop').hide();
|
||||
},
|
||||
mousemove: function (event) {
|
||||
$(this).next('.exp_pop').css({
|
||||
'top': event.pageY - $(this).next('.exp_pop').outerHeight() - 4,
|
||||
'left': event.pageX + 8
|
||||
// 'left': event.pageX - $(this).offset().left + 8
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
// Displays explanation popup following the mouse
|
||||
$(this).on({
|
||||
mouseenter: function () {
|
||||
// if ($(this).attr('emmet')) {
|
||||
//
|
||||
// }
|
||||
$(this).next('.exp_pop').show();
|
||||
},
|
||||
mouseleave: function () {
|
||||
$(this).next('.exp_pop').hide();
|
||||
},
|
||||
mousemove: function (event) {
|
||||
$(this).next('.exp_pop').css({
|
||||
'top': event.pageY - $(this).next('.exp_pop').outerHeight() - 4,
|
||||
'left': event.pageX + 8
|
||||
// 'left': event.pageX - $(this).offset().left + 8
|
||||
});
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
} else {
|
||||
$pp.each(function () {
|
||||
$(this).off('mouseenter mouseleave mousemove');
|
||||
} else {
|
||||
$pp.each(function () {
|
||||
$(this).off('mouseenter mouseleave mousemove');
|
||||
|
||||
$(this).removeClass('exp_wrap').find('.exp_overlay').remove();
|
||||
// $wrap = $(this).parent('.exp_wrap');
|
||||
// $pop = $wrap.next('.exp_pop').detach();
|
||||
// $wrap.find('.exp_marker_pop').remove();
|
||||
// $(this).unwrap('.exp_wrap');
|
||||
// $(this).after($pop);
|
||||
// if ($(this).hasClass('js_changed_pos')) {
|
||||
// $(this).css('position', '');
|
||||
// if ($(this).attr('style') === '') {
|
||||
// $(this).removeAttr('style');
|
||||
// }
|
||||
// $(this).removeClass('js_changed_pos');
|
||||
// }
|
||||
});
|
||||
$(this).removeClass('exp_wrap').find('.exp_overlay').remove();
|
||||
// $wrap = $(this).parent('.exp_wrap');
|
||||
// $pop = $wrap.next('.exp_pop').detach();
|
||||
// $wrap.find('.exp_marker_pop').remove();
|
||||
// $(this).unwrap('.exp_wrap');
|
||||
// $(this).after($pop);
|
||||
// if ($(this).hasClass('js_changed_pos')) {
|
||||
// $(this).css('position', '');
|
||||
// if ($(this).attr('style') === '') {
|
||||
// $(this).removeAttr('style');
|
||||
// }
|
||||
// $(this).removeClass('js_changed_pos');
|
||||
// }
|
||||
});
|
||||
|
||||
metaOn = false;
|
||||
}
|
||||
console.log('Explanation mode', metaOn);
|
||||
});
|
||||
metaOn = false;
|
||||
}
|
||||
console.log('Explanation mode', metaOn);
|
||||
});
|
||||
}
|
||||
|
||||
// Sets the href attribute to mailto: with given information
|
||||
function composeMail(tag, name, prov, suffix, text, topic) {
|
||||
let trigger = tag.indexOf(".");
|
||||
let mailString = name + '@' + prov + '.' + suffix;
|
||||
let textString = mailString.replace(/@/g, "(at)");
|
||||
let descString = "Nachricht an " + mailString;
|
||||
|
||||
if (!text) {
|
||||
text = mailString;
|
||||
} else if (text === "at") {
|
||||
text = textString;
|
||||
} else if (text === "to") {
|
||||
text = descString;
|
||||
}
|
||||
|
||||
if (topic) {
|
||||
topic = "?subject=" + topic;
|
||||
} else {
|
||||
topic = "";
|
||||
}
|
||||
|
||||
if (trigger === -1) {
|
||||
const el = document.getElementById(tag);
|
||||
const elContent = el.innerHTML;
|
||||
|
||||
el.innerHTML = elContent + text;
|
||||
el.setAttribute("href", "mailto:" + mailString + topic);
|
||||
} else {
|
||||
const els = document.getElementsByClassName(tag.slice(1));
|
||||
|
||||
for (let el of els) {
|
||||
const elContent = el.innerHTML;
|
||||
|
||||
el.innerHTML = elContent + text;
|
||||
el.setAttribute("href", "mailto:" + mailString + topic);
|
||||
};
|
||||
}
|
||||
}
|
||||
|
||||
// get document coordinates of the element
|
||||
|
|
|
|||
|
|
@ -26,6 +26,8 @@ tags:
|
|||
</header>
|
||||
<article>
|
||||
<p>…</p>
|
||||
<p>Contact: <a id="special" href=""></a></p>
|
||||
<p>More: <a class="general" href=""></a>, <a class="general" href=""></a></p>
|
||||
</article>
|
||||
</section>
|
||||
{% endblock %}
|
||||
|
|
@ -43,6 +45,8 @@ tags:
|
|||
|
||||
$(document).ready(function () {
|
||||
logPerf('JQ document ready event fired.');
|
||||
composeMail('special', 'me', 'domain', 'tld', 'Me', 'HIPPIE')
|
||||
composeMail('.general', 'name', 'domain', 'tld', '', '')
|
||||
});
|
||||
|
||||
$(document).scroll(function () {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue