Improved looks

This commit is contained in:
edwark43 2023-12-19 17:03:02 +00:00
parent 5ff7b47c1e
commit badc271554
4 changed files with 23 additions and 657 deletions

View File

@ -1,626 +0,0 @@
/*!
*
* typed.js - A JavaScript Typing Animation Library
* Author: Matt Boldt <me@mattboldt.com>
* Version: v2.0.12
* Url: https://github.com/mattboldt/typed.js
* License(s): MIT
*
*/
(function (t, e) {
"object" == typeof exports && "object" == typeof module
? (module.exports = e())
: "function" == typeof define && define.amd
? define([], e)
: "object" == typeof exports
? (exports.Typed = e())
: (t.Typed = e());
})(this, function () {
return (function (t) {
function e(n) {
if (s[n]) return s[n].exports;
var i = (s[n] = { exports: {}, id: n, loaded: !1 });
return t[n].call(i.exports, i, i.exports, e), (i.loaded = !0), i.exports;
}
var s = {};
return (e.m = t), (e.c = s), (e.p = ""), e(0);
})([
function (t, e, s) {
"use strict";
function n(t, e) {
if (!(t instanceof e))
throw new TypeError("Cannot call a class as a function");
}
Object.defineProperty(e, "__esModule", { value: !0 });
var i = (function () {
function t(t, e) {
for (var s = 0; s < e.length; s++) {
var n = e[s];
(n.enumerable = n.enumerable || !1),
(n.configurable = !0),
"value" in n && (n.writable = !0),
Object.defineProperty(t, n.key, n);
}
}
return function (e, s, n) {
return s && t(e.prototype, s), n && t(e, n), e;
};
})(),
r = s(1),
o = s(3),
a = (function () {
function t(e, s) {
n(this, t), r.initializer.load(this, s, e), this.begin();
}
return (
i(t, [
{
key: "toggle",
value: function () {
this.pause.status ? this.start() : this.stop();
},
},
{
key: "stop",
value: function () {
this.typingComplete ||
this.pause.status ||
(this.toggleBlinking(!0),
(this.pause.status = !0),
this.options.onStop(this.arrayPos, this));
},
},
{
key: "start",
value: function () {
this.typingComplete ||
(this.pause.status &&
((this.pause.status = !1),
this.pause.typewrite
? this.typewrite(
this.pause.curString,
this.pause.curStrPos
)
: this.backspace(
this.pause.curString,
this.pause.curStrPos
),
this.options.onStart(this.arrayPos, this)));
},
},
{
key: "destroy",
value: function () {
this.reset(!1), this.options.onDestroy(this);
},
},
{
key: "reset",
value: function () {
var t =
arguments.length <= 0 ||
void 0 === arguments[0] ||
arguments[0];
clearInterval(this.timeout),
this.replaceText(""),
this.cursor &&
this.cursor.parentNode &&
(this.cursor.parentNode.removeChild(this.cursor),
(this.cursor = null)),
(this.strPos = 0),
(this.arrayPos = 0),
(this.curLoop = 0),
t &&
(this.insertCursor(),
this.options.onReset(this),
this.begin());
},
},
{
key: "begin",
value: function () {
var t = this;
this.options.onBegin(this),
(this.typingComplete = !1),
this.shuffleStringsIfNeeded(this),
this.insertCursor(),
this.bindInputFocusEvents && this.bindFocusEvents(),
(this.timeout = setTimeout(function () {
t.currentElContent && 0 !== t.currentElContent.length
? t.backspace(
t.currentElContent,
t.currentElContent.length
)
: t.typewrite(
t.strings[t.sequence[t.arrayPos]],
t.strPos
);
}, this.startDelay));
},
},
{
key: "typewrite",
value: function (t, e) {
var s = this;
this.fadeOut &&
this.el.classList.contains(this.fadeOutClass) &&
(this.el.classList.remove(this.fadeOutClass),
this.cursor &&
this.cursor.classList.remove(this.fadeOutClass));
var n = this.humanizer(this.typeSpeed),
i = 1;
return this.pause.status === !0
? void this.setPauseStatus(t, e, !0)
: void (this.timeout = setTimeout(function () {
e = o.htmlParser.typeHtmlChars(t, e, s);
var n = 0,
r = t.substr(e);
if ("^" === r.charAt(0) && /^\^\d+/.test(r)) {
var a = 1;
(r = /\d+/.exec(r)[0]),
(a += r.length),
(n = parseInt(r)),
(s.temporaryPause = !0),
s.options.onTypingPaused(s.arrayPos, s),
(t = t.substring(0, e) + t.substring(e + a)),
s.toggleBlinking(!0);
}
if ("`" === r.charAt(0)) {
for (
;
"`" !== t.substr(e + i).charAt(0) &&
(i++, !(e + i > t.length));
);
var u = t.substring(0, e),
l = t.substring(u.length + 1, e + i),
c = t.substring(e + i + 1);
(t = u + l + c), i--;
}
s.timeout = setTimeout(function () {
s.toggleBlinking(!1),
e >= t.length
? s.doneTyping(t, e)
: s.keepTyping(t, e, i),
s.temporaryPause &&
((s.temporaryPause = !1),
s.options.onTypingResumed(s.arrayPos, s));
}, n);
}, n));
},
},
{
key: "keepTyping",
value: function (t, e, s) {
0 === e &&
(this.toggleBlinking(!1),
this.options.preStringTyped(this.arrayPos, this)),
(e += s);
var n = t.substr(0, e);
this.replaceText(n), this.typewrite(t, e);
},
},
{
key: "doneTyping",
value: function (t, e) {
var s = this;
this.options.onStringTyped(this.arrayPos, this),
this.toggleBlinking(!0),
(this.arrayPos === this.strings.length - 1 &&
(this.complete(),
this.loop === !1 || this.curLoop === this.loopCount)) ||
(this.timeout = setTimeout(function () {
s.backspace(t, e);
}, this.backDelay));
},
},
{
key: "backspace",
value: function (t, e) {
var s = this;
if (this.pause.status === !0)
return void this.setPauseStatus(t, e, !1);
if (this.fadeOut) return this.initFadeOut();
this.toggleBlinking(!1);
var n = this.humanizer(this.backSpeed);
this.timeout = setTimeout(function () {
e = o.htmlParser.backSpaceHtmlChars(t, e, s);
var n = t.substr(0, e);
if ((s.replaceText(n), s.smartBackspace)) {
var i = s.strings[s.arrayPos + 1];
i && n === i.substr(0, e)
? (s.stopNum = e)
: (s.stopNum = 0);
}
e > s.stopNum
? (e--, s.backspace(t, e))
: e <= s.stopNum &&
(s.arrayPos++,
s.arrayPos === s.strings.length
? ((s.arrayPos = 0),
s.options.onLastStringBackspaced(),
s.shuffleStringsIfNeeded(),
s.begin())
: s.typewrite(s.strings[s.sequence[s.arrayPos]], e));
}, n);
},
},
{
key: "complete",
value: function () {
this.options.onComplete(this),
this.loop ? this.curLoop++ : (this.typingComplete = !0);
},
},
{
key: "setPauseStatus",
value: function (t, e, s) {
(this.pause.typewrite = s),
(this.pause.curString = t),
(this.pause.curStrPos = e);
},
},
{
key: "toggleBlinking",
value: function (t) {
this.cursor &&
(this.pause.status ||
(this.cursorBlinking !== t &&
((this.cursorBlinking = t),
t
? this.cursor.classList.add("typed-cursor--blink")
: this.cursor.classList.remove(
"typed-cursor--blink"
))));
},
},
{
key: "humanizer",
value: function (t) {
return Math.round((Math.random() * t) / 2) + t;
},
},
{
key: "shuffleStringsIfNeeded",
value: function () {
this.shuffle &&
(this.sequence = this.sequence.sort(function () {
return Math.random() - 0.5;
}));
},
},
{
key: "initFadeOut",
value: function () {
var t = this;
return (
(this.el.className += " " + this.fadeOutClass),
this.cursor &&
(this.cursor.className += " " + this.fadeOutClass),
setTimeout(function () {
t.arrayPos++,
t.replaceText(""),
t.strings.length > t.arrayPos
? t.typewrite(t.strings[t.sequence[t.arrayPos]], 0)
: (t.typewrite(t.strings[0], 0), (t.arrayPos = 0));
}, this.fadeOutDelay)
);
},
},
{
key: "replaceText",
value: function (t) {
this.attr
? this.el.setAttribute(this.attr, t)
: this.isInput
? (this.el.value = t)
: "html" === this.contentType
? (this.el.innerHTML = t)
: (this.el.textContent = t);
},
},
{
key: "bindFocusEvents",
value: function () {
var t = this;
this.isInput &&
(this.el.addEventListener("focus", function (e) {
t.stop();
}),
this.el.addEventListener("blur", function (e) {
(t.el.value && 0 !== t.el.value.length) || t.start();
}));
},
},
{
key: "insertCursor",
value: function () {
this.showCursor &&
(this.cursor ||
((this.cursor = document.createElement("span")),
(this.cursor.className = "typed-cursor"),
this.cursor.setAttribute("aria-hidden", !0),
(this.cursor.innerHTML = this.cursorChar),
this.el.parentNode &&
this.el.parentNode.insertBefore(
this.cursor,
this.el.nextSibling
)));
},
},
]),
t
);
})();
(e["default"] = a), (t.exports = e["default"]);
},
function (t, e, s) {
"use strict";
function n(t) {
return t && t.__esModule ? t : { default: t };
}
function i(t, e) {
if (!(t instanceof e))
throw new TypeError("Cannot call a class as a function");
}
Object.defineProperty(e, "__esModule", { value: !0 });
var r =
Object.assign ||
function (t) {
for (var e = 1; e < arguments.length; e++) {
var s = arguments[e];
for (var n in s)
Object.prototype.hasOwnProperty.call(s, n) && (t[n] = s[n]);
}
return t;
},
o = (function () {
function t(t, e) {
for (var s = 0; s < e.length; s++) {
var n = e[s];
(n.enumerable = n.enumerable || !1),
(n.configurable = !0),
"value" in n && (n.writable = !0),
Object.defineProperty(t, n.key, n);
}
}
return function (e, s, n) {
return s && t(e.prototype, s), n && t(e, n), e;
};
})(),
a = s(2),
u = n(a),
l = (function () {
function t() {
i(this, t);
}
return (
o(t, [
{
key: "load",
value: function (t, e, s) {
if (
("string" == typeof s
? (t.el = document.querySelector(s))
: (t.el = s),
(t.options = r({}, u["default"], e)),
(t.isInput = "input" === t.el.tagName.toLowerCase()),
(t.attr = t.options.attr),
(t.bindInputFocusEvents = t.options.bindInputFocusEvents),
(t.showCursor = !t.isInput && t.options.showCursor),
(t.cursorChar = t.options.cursorChar),
(t.cursorBlinking = !0),
(t.elContent = t.attr
? t.el.getAttribute(t.attr)
: t.el.textContent),
(t.contentType = t.options.contentType),
(t.typeSpeed = t.options.typeSpeed),
(t.startDelay = t.options.startDelay),
(t.backSpeed = t.options.backSpeed),
(t.smartBackspace = t.options.smartBackspace),
(t.backDelay = t.options.backDelay),
(t.fadeOut = t.options.fadeOut),
(t.fadeOutClass = t.options.fadeOutClass),
(t.fadeOutDelay = t.options.fadeOutDelay),
(t.isPaused = !1),
(t.strings = t.options.strings.map(function (t) {
return t.trim();
})),
"string" == typeof t.options.stringsElement
? (t.stringsElement = document.querySelector(
t.options.stringsElement
))
: (t.stringsElement = t.options.stringsElement),
t.stringsElement)
) {
(t.strings = []), (t.stringsElement.style.display = "none");
var n = Array.prototype.slice.apply(
t.stringsElement.children
),
i = n.length;
if (i)
for (var o = 0; o < i; o += 1) {
var a = n[o];
t.strings.push(a.innerHTML.trim());
}
}
(t.strPos = 0),
(t.arrayPos = 0),
(t.stopNum = 0),
(t.loop = t.options.loop),
(t.loopCount = t.options.loopCount),
(t.curLoop = 0),
(t.shuffle = t.options.shuffle),
(t.sequence = []),
(t.pause = {
status: !1,
typewrite: !0,
curString: "",
curStrPos: 0,
}),
(t.typingComplete = !1);
for (var o in t.strings) t.sequence[o] = o;
(t.currentElContent = this.getCurrentElContent(t)),
(t.autoInsertCss = t.options.autoInsertCss),
this.appendAnimationCss(t);
},
},
{
key: "getCurrentElContent",
value: function (t) {
var e = "";
return (e = t.attr
? t.el.getAttribute(t.attr)
: t.isInput
? t.el.value
: "html" === t.contentType
? t.el.innerHTML
: t.el.textContent);
},
},
{
key: "appendAnimationCss",
value: function (t) {
var e = "data-typed-js-css";
if (
t.autoInsertCss &&
(t.showCursor || t.fadeOut) &&
!document.querySelector("[" + e + "]")
) {
var s = document.createElement("style");
(s.type = "text/css"), s.setAttribute(e, !0);
var n = "";
t.showCursor &&
(n +=
"\n .typed-cursor{\n opacity: 1;\n }\n .typed-cursor.typed-cursor--blink{\n animation: typedjsBlink 0.7s infinite;\n -webkit-animation: typedjsBlink 0.7s infinite;\n animation: typedjsBlink 0.7s infinite;\n }\n @keyframes typedjsBlink{\n 50% { opacity: 0.0; }\n }\n @-webkit-keyframes typedjsBlink{\n 0% { opacity: 1; }\n 50% { opacity: 0.0; }\n 100% { opacity: 1; }\n }\n "),
t.fadeOut &&
(n +=
"\n .typed-fade-out{\n opacity: 0;\n transition: opacity .25s;\n }\n .typed-cursor.typed-cursor--blink.typed-fade-out{\n -webkit-animation: 0;\n animation: 0;\n }\n "),
0 !== s.length &&
((s.innerHTML = n), document.body.appendChild(s));
}
},
},
]),
t
);
})();
e["default"] = l;
var c = new l();
e.initializer = c;
},
function (t, e) {
"use strict";
Object.defineProperty(e, "__esModule", { value: !0 });
var s = {
strings: [
"These are the default values...",
"You know what you should do?",
"Use your own!",
"Have a great day!",
],
stringsElement: null,
typeSpeed: 0,
startDelay: 0,
backSpeed: 0,
smartBackspace: !0,
shuffle: !1,
backDelay: 700,
fadeOut: !1,
fadeOutClass: "typed-fade-out",
fadeOutDelay: 500,
loop: !1,
loopCount: 1 / 0,
showCursor: !0,
cursorChar: "|",
autoInsertCss: !0,
attr: null,
bindInputFocusEvents: !1,
contentType: "html",
onBegin: function (t) {},
onComplete: function (t) {},
preStringTyped: function (t, e) {},
onStringTyped: function (t, e) {},
onLastStringBackspaced: function (t) {},
onTypingPaused: function (t, e) {},
onTypingResumed: function (t, e) {},
onReset: function (t) {},
onStop: function (t, e) {},
onStart: function (t, e) {},
onDestroy: function (t) {},
};
(e["default"] = s), (t.exports = e["default"]);
},
function (t, e) {
"use strict";
function s(t, e) {
if (!(t instanceof e))
throw new TypeError("Cannot call a class as a function");
}
Object.defineProperty(e, "__esModule", { value: !0 });
var n = (function () {
function t(t, e) {
for (var s = 0; s < e.length; s++) {
var n = e[s];
(n.enumerable = n.enumerable || !1),
(n.configurable = !0),
"value" in n && (n.writable = !0),
Object.defineProperty(t, n.key, n);
}
}
return function (e, s, n) {
return s && t(e.prototype, s), n && t(e, n), e;
};
})(),
i = (function () {
function t() {
s(this, t);
}
return (
n(t, [
{
key: "typeHtmlChars",
value: function (t, e, s) {
if ("html" !== s.contentType) return e;
var n = t.substr(e).charAt(0);
if ("<" === n || "&" === n) {
var i = "";
for (
i = "<" === n ? ">" : ";";
t.substr(e + 1).charAt(0) !== i &&
(e++, !(e + 1 > t.length));
);
e++;
}
return e;
},
},
{
key: "backSpaceHtmlChars",
value: function (t, e, s) {
if ("html" !== s.contentType) return e;
var n = t.substr(e).charAt(0);
if (">" === n || ";" === n) {
var i = "";
for (
i = ">" === n ? "<" : "&";
t.substr(e - 1).charAt(0) !== i && (e--, !(e < 0));
);
e--;
}
return e;
},
},
]),
t
);
})();
e["default"] = i;
var r = new i();
e.htmlParser = r;
},
]);
});
//# sourceMappingURL=typed.min.js.map

View File

@ -14,7 +14,7 @@ body {
font-size: large;
}
.borderimg {
.border {
border-image: url("/assets/imgs/border.png") 28 / 28px / 0 round;
border-width: 28px;
border-style: solid;
@ -30,17 +30,6 @@ body {
margin-left: 20px;
}
#footer {
padding: 20px;
text-align: center;
background: rgb(221, 221, 221);
margin-top: 20px;
position: absolute;
bottom: 0;
width: 100%;
font-size: 11px;
}
@media screen and (max-width: 800px) {
.leftcolumn,
.rightcolumn {
@ -96,17 +85,19 @@ body {
.imglink {
width: 50px;
height: 50px;
margin-left: 10px;
margin-right: 10px;
margin-bottom: 10px;
float: right;
}
.img {
height: 50px;
width: 50px;
}
.about {
background-color: #989898;
width: 250px;
height: 250px;
border-radius: 10px;
background-color: #eeeeee;
width: 20%;
height: 300px;
border-radius: 25px;
float: right;
border-style: solid;
border-width: 1px;
@ -119,7 +110,7 @@ body {
}
#aboutpg {
background-color: #eeeeee;
width: 99%;
width: 80%;
height: 300px;
border-radius: 25px;
border-color: #000000;

View File

@ -50,23 +50,24 @@
alt="zuck"
style="width: 300px; height: 300px"
srcset=""
class="borderimg"
class="border"
/>
<p class="welcome"><span class="auto-type"></span></p>
</div>
<!--<div id="footer"></div>-->
</div>
<script src="/assets/js/typed.js@2.0.12.js"></script>
<script src="https://unpkg.com/typed.js@2.1.0/dist/typed.umd.js"></script>
<script>
var typed = new Typed(".auto-type", {
strings: [
"Welcome to my Website",
"Hello",
"I've made a severe and continuous lapse in my judgement, and I don't expect to be forgiven, I'm simply here to apologize. So what we came across that day in the woods was obviously unplanned, and the reactions you saw on tape were raw, they were unfiltered. None of us knew how to react, or how to feel. I should have never posted the video. I should have put the cameras down and stopped recording what we were going through. There's a lot of things I should have done differently but I didn't, and for that, from the bottom of my heart, I am sorry. I want to apologize to the Internet. I want to apologize to anyone who's seen the video. I want to apologize to anyone who has been affected or touched by mental illness, or depression, or suicide, but most importantly, I want to apologize to the victim and his family. For my fans who are defending my actions, please don't. They do not deserve to be defended. The goal with my content is always to entertain, to push the boundaries, to be all inclusive in the world I live in. I share almost everything I do. The intent is never to be heartless, cruel, or malicious. Like I said, I've made a huge mistake. I don't expect to be forgiven, I'm just here to apologize. I'm ashamed of myself. I'm disappointed in myself and I promise to be better. I will be better. Thank you.",
"echo \"Hello.\"^1000 <br>`Hello.`",
"echo \"Welcome to my Website.\"^1000 <br>`Welcome to my Website.`",
"echo \"This is uneccessary.\"^1000 <br>`This is uneccessary.`",
"echo \"This is just filler.\"^1000 <br>`This is just filler.`",
],
typeSpeed: 50,
backSpeed: 150,
backSpeed: 50,
loop: true,
cursorChar: "<",
});
</script>
</body>

View File

@ -47,13 +47,13 @@
</li>
</ul>
<div id="content-wrap">
<div class="about">
<p class="aboutext">Links</p>
<a class="imglink" href="https://github.com/edwark43"
><img class="img" src="/assets/imgs/github.png" alt="github"
/></a>
</div>
<div id="aboutpg">
<div class="about">
<p class="aboutext">Links</p>
<a class="imglink" href="https://github.com/edwark43"
><img class="img" src="/assets/imgs/github.png" alt="github"
/></a>
</div>
<p id="pgt">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam risus odio, euismod ac dapibus vitae, semper ac orci. Praesent ac sagittis ligula. Nulla ultricies nisl et vulputate tincidunt. Vivamus risus risus, fringilla quis nisl eu, tincidunt sagittis lectus. Vestibulum vitae rhoncus mi. In ultrices ultrices arcu, in ornare urna tempor ut. Nulla commodo libero molestie, viverra diam ut, aliquet dui. Phasellus ipsum ligula, tempus non vehicula ut, elementum eget mi. Praesent ut enim varius, vestibulum lacus vel, tincidunt magna. Aliquam vitae mauris at quam facilisis laoreet. In vitae nibh at mauris tristique porta et nec sem. Cras facilisis diam sodales aliquet laoreet. Phasellus at pretium odio, et sagittis ligula. Duis a ante turpis. Nam hendrerit et erat eget pulvinar. Duis libero sapien, tincidunt at erat hendrerit, venenatis volutpat orci. Donec blandit tempus augue eu commodo. Aenean ex orci, rhoncus eget cursus vel, sagittis condimentum risus. Suspendisse lacinia dictum aliquet. Aenean sit amet ante lectus. Donec vitae facilisis risus. Morbi pellentesque nulla lectus, at blandit nunc imperdiet et. Vestibulum congue vestibulum est, id placerat ante porttitor sit amet. Maecenas venenatis erat ac orci faucibus cursus id sed orci. Vivamus est sem, molestie et enim nec, ultrices condimentum neque. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vestibulum imperdiet accumsan mi eu scelerisque. Aliquam accumsan dapibus lorem, nec fringilla enim hendrerit a. Etiam ut justo quis ex congue ultricies nec eu leo.
</p>