share msg ü some other stuff ig
derzombiiie
parent
a5b53dec54
commit
969b00e0da
Binary file not shown.
|
After Width: | Height: | Size: 2.6 KiB |
|
|
@ -12,6 +12,7 @@
|
|||
<script src="/js/themes.js"></script>
|
||||
<script src="/js/menubar.js"></script>
|
||||
<script src="/js/entry.js"></script>
|
||||
<script src="/js/share.js"></script>
|
||||
<script src="/js/index.js"></script>
|
||||
</head>
|
||||
|
||||
|
|
|
|||
71
js/entry.js
71
js/entry.js
|
|
@ -1,24 +1,79 @@
|
|||
class entry {
|
||||
constructor( title, author, desc, href, tags ) {
|
||||
constructor(title, author, desc, href, tags, id) {
|
||||
this.title = title;
|
||||
this.author = author;
|
||||
this.desc = desc;
|
||||
this.href = href;
|
||||
this.tags = tags;
|
||||
this.id = id
|
||||
}
|
||||
createelement() {
|
||||
let element = document.createElement("DIV");
|
||||
element.innerHTML +=
|
||||
`<div class="entry">
|
||||
<div class="title">${this.title}</div>
|
||||
<div class="author">BY ${this.author}</div>
|
||||
let element = document.createElement("DIV");
|
||||
element.innerHTML +=
|
||||
`<div class="entry">
|
||||
<a class="title" href="/posts?post=${this.id}">${this.title}</a>
|
||||
<div class="author">BY <a class="author" href="/author?author=${this.author}">${this.author}</a></div>
|
||||
<hr class="seperator" \>
|
||||
<div class="preview">${this.desc}</div>
|
||||
</div>`
|
||||
element.classList = ["entrybox"]
|
||||
return element
|
||||
}
|
||||
appendto( tag ) {
|
||||
appendto(tag) {
|
||||
$(tag).append(this.createelement());
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// ---------------------------------------------------- //
|
||||
class metaentry {
|
||||
constructor(type, title, writeto, additional) {
|
||||
this.type = type
|
||||
this.title = title;
|
||||
this.writeto = writeto;
|
||||
this.additional = additional;
|
||||
switch (this.type) {
|
||||
case "stat":
|
||||
this.update()
|
||||
break;
|
||||
|
||||
default:
|
||||
this.appendto( this.writeto )
|
||||
}
|
||||
}
|
||||
createelement() {
|
||||
let element = document.createElement("DIV");
|
||||
element.innerHTML +=
|
||||
` <div class="entry metaentry">
|
||||
<div class="title" href="/posts?post=${this.id}">${this.title}</div>
|
||||
<hr class="seperator" \\>
|
||||
<div class="preview">${this.additional.content}</div>
|
||||
</div>`
|
||||
element.classList = ["entrybox"]
|
||||
return element
|
||||
}
|
||||
update() {
|
||||
if (!this.structed) {
|
||||
this.init()
|
||||
this.update()
|
||||
return
|
||||
}
|
||||
switch (this.type) {
|
||||
case "stat":
|
||||
$.get("/stats?api", d => {
|
||||
let json = JSON.parse(d)
|
||||
this.stats = json
|
||||
$(this.writeto).append(this.createelement())
|
||||
})
|
||||
break
|
||||
}
|
||||
}
|
||||
init() {
|
||||
let html = document.createElement("div")
|
||||
html.classList = ["entrybox"]
|
||||
|
||||
return this.structed = html
|
||||
}
|
||||
appendto(tag) {
|
||||
$(tag ? tag : this.writeto).append(this.createelement());
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -16,7 +16,7 @@ $.get("/posts?api&featured&len=10", d => {
|
|||
else {
|
||||
elements = []
|
||||
for( let i = 0 ; i < json.content.length ; i++ ) {
|
||||
let elem = new entry(json.content[i].title, json.content[i].author, json.content[i].desc, json.content[i].href, json.content[i].tags)
|
||||
let elem = new entry(json.content[i].title, json.content[i].author, json.content[i].desc, json.content[i].href, json.content[i].tags, json.content[i].id)
|
||||
elements.push(elem)
|
||||
$(".content").append(elem.createelement())
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,4 @@
|
|||
console.log(
|
||||
`- * - # Menubar (by derz) # - * -`)
|
||||
console.log(`- * - # Menubar (by derz) # - * -`)
|
||||
|
||||
class menubar {
|
||||
constructor( tag, content ) {
|
||||
|
|
@ -11,15 +10,15 @@ class menubar {
|
|||
for ( let i = 0; i < p.length ; i++ ) {
|
||||
switch( p[i].type ) {
|
||||
case "href":
|
||||
html += `<div class="href" onclick='location = "${p[i].href}"'>\n`
|
||||
html += `${p[i].text}\n`
|
||||
html += `</div>\n`
|
||||
html += `<a class="href" title="${ p[i].href }" href="${ p[i].href }">\n`
|
||||
html += `${ p[i].text }\n`
|
||||
html += `</a>\n`
|
||||
break
|
||||
|
||||
case "input":
|
||||
html += `<div class="input">\n`
|
||||
html += ` <input type="${ p[i].type ? p[i].type : "text" }" id="${p[i].id}">\n`
|
||||
html += ` <img src="${ p[i].icon }" alt="${ p[i].alt }">\n`
|
||||
html += ` <input type="${ p[i].type ? p[i].type : "text" }" id="${ p[i].id }">\n`
|
||||
html += ` <img src="${ p[i].icon }" title="${ p[i].alt }" alt="${ p[i].alt }">\n`
|
||||
html += `</div>`
|
||||
break
|
||||
|
||||
|
|
@ -35,12 +34,11 @@ class menubar {
|
|||
}
|
||||
|
||||
// init:
|
||||
document.onreadystatechange = () => {
|
||||
if( document.readyState == "complete" )
|
||||
a = new menubar( ".menubox", [
|
||||
{"type":"href", "text":"derzombiiie.com","href":"/"},
|
||||
{"type":"href", "text":"posts", "href":"/posts"},
|
||||
{"type":"href", "text":"newest", "href":"/posts?newest"},
|
||||
{"type":"input","id" :"search-field", "icon":"/icon/search.svg"}
|
||||
])
|
||||
}
|
||||
$(document).ready(() => {
|
||||
a = new menubar( ".menubox", [
|
||||
{"type":"href", "text":"derzombiiie.com","href":"/"},
|
||||
{"type":"href", "text":"posts", "href":"/posts"},
|
||||
{"type":"href", "text":"newest", "href":"/posts?newest"},
|
||||
{"type":"input","id" :"search-field", "icon":"/icon/search.svg" ,"alt":"search"}
|
||||
])
|
||||
})
|
||||
|
|
|
|||
|
|
@ -0,0 +1,13 @@
|
|||
$(document).ready(() => {
|
||||
sharemenu = new metaentry(undefined,"Share",".content",{"content":
|
||||
`Don't know why you would, but here you can find me elsewhere on the Net:<br \\>
|
||||
<a href="https://github.com/derzombiiie"><img class="socialicon" src="/icon/github.png" \\></a>
|
||||
<small>(yea thats it)</small><br \\><br \\>
|
||||
oh yea the title of this box: go share my page:
|
||||
<a class="share" href="mailto:?subject=DerZombiiies%20totally%20cool%20website!&body=Hi%2C%0AI%20just%20found%20this%20on%20the%20interwebz%3A%20derzombiiie.com">Email</a>,
|
||||
<a class="share" href="whatsapp://send?text=Hi%2C%0AI%20just%20found%20this%20on%20the%20interwebz%3A%20derzombiiie.com">WhatsApp</a>,
|
||||
<a class="share" href="https://twitter.com/intent/tweet?text==Check%20derzombiiies%20website!%0A%40%20derzombiiie.com">Twitter</a>,
|
||||
Copy: <input value="derzombiiie.com" \\>`
|
||||
})
|
||||
})
|
||||
|
||||
|
|
@ -1 +1 @@
|
|||
{"type":"s","content":[{"title":"My first Post - test test 12 12 Lorem ipsum dolor sit, amet consectetur elit","author":"derzombiiie","desc":"Hi, this is my first post on this blog, its going to be about IT stuff. now here some Lorem:\nLorem ipsum dolor sit, amet consectetur adipisicing elit. Ullam fugiat commodi illum autem voluptatum, eveniet eos aspernatur neque consequatur. Veritatis nesciunt repellat quae tenetur aut consequatur consequuntur cupiditate quis quod? Lorem, ipsum dolor sit amet consectetur adipisicing elit. Delectus quas culpa perferendis sapiente necessitatibus ea sint vero, commodi pariatur laboriosam vel dignissimos adipisci unde dolores consequuntur. Voluptatibus ad architecto ex. Lorem ipsum dolor sit amet consectetur adipisicing elit. Voluptas qui reprehenderit id, officiis odio nisi unde? Quaerat quisquam dignissimos, inventore, doloremque expedita iusto maiores quas placeat voluptatem nobis, est sequi.","href":"#","tags":["testing","$$$"]},{"title":"My second Post - test test 12 12 Lorem ipsum dolor sit, amet consectetur elit","author":"derzombiiie","desc":"Lorem ipsum dolor sit amet consectetur adipisicing elit. Aperiam, fugiat? Eius porro nam placeat voluptate nihil quisquam velit quaerat voluptates. Dolorum itaque reiciendis nemo tempora beatae quasi? Officiis, rem. Quis?Lorem ipsum dolor sit amet consectetur adipisicing elit. Magnam tempora quibusdam, autem vel accusamus enim nesciunt? Dolores, adipisci molestias. Totam nisi doloremque modi voluptates eveniet cumque commodi a laborum delectus. Lorem ipsum dolor sit amet consectetur adipisicing elit. Nulla sed qui enim dignissimos id blanditiis voluptatem, vitae nisi facilis tempora eligendi laboriosam, laborum earum eius neque veritatis optio maiores quam. Lorem ipsum dolor sit amet consectetur adipisicing elit. Autem laudantium asperiores, maxime, officiis deserunt sed nulla aperiam distinctio mollitia repellendus vitae! Nostrum enim, rem iste architecto obcaecati quam possimus aliquid! Lorem, ipsum dolor sit amet consectetur adipisicing elit. Error laboriosam sapiente quis numquam! Iusto reprehenderit corporis expedita atque illo pariatur molestias, aut, voluptas in corrupti mollitia tenetur doloribus quis inventore.","href":"#","tags":["testing","$$$"]}]}
|
||||
{"type":"s","content":[{"title":"My second Post","author":"derzombiiie","desc":"Lorem ipsum dolor sit.","href":"#","tags":["testing","$$$"],"id":1}]}
|
||||
|
|
@ -17,6 +17,9 @@
|
|||
border-width: 2px;
|
||||
border-color: black;
|
||||
}
|
||||
.menubox > .menubar > *:not(.spacer):hover {
|
||||
background-color: #6d5dbf33;
|
||||
}
|
||||
.menubox > .menubar > .input > img {
|
||||
image-rendering: pixelated;
|
||||
image-rendering: -moz-crisp-edges;
|
||||
|
|
@ -32,16 +35,34 @@
|
|||
border-top-width: 0.6em;
|
||||
border-top-color: #6d5dbf;
|
||||
}
|
||||
.entrybox > .entry:hover {
|
||||
background-color: #6d5dbf33;
|
||||
}
|
||||
.entrybox > .entry > .title {
|
||||
position: relative;
|
||||
font-size: 3em;
|
||||
font-family: slkscr;
|
||||
color: black;
|
||||
}
|
||||
.entrybox > .entry > .title:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.entrybox > .metaentry > .title:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
.entrybox > .entry > .author {
|
||||
font-style: italic;
|
||||
font-family: slkscr;
|
||||
font-size: 1em;
|
||||
}
|
||||
.entrybox > .entry > .author > .author {
|
||||
font-family: slkscr;
|
||||
text-decoration: none;
|
||||
color: black;
|
||||
}
|
||||
.entrybox > .entry > .author > .author:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.entrybox > .entry > .seperator {
|
||||
border: none;
|
||||
border-top-color: #6d5dbf;
|
||||
|
|
|
|||
|
|
@ -1,8 +1,13 @@
|
|||
* {
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
color: black
|
||||
}
|
||||
a {
|
||||
text-decoration: none;
|
||||
}
|
||||
body, html {
|
||||
width: 100%;
|
||||
background-color: white;
|
||||
}
|
||||
.content {
|
||||
position: absolute;
|
||||
|
|
@ -70,11 +75,6 @@ body, html {
|
|||
padding-right: 0.5em;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
.entrybox > .entry > .title-bar {
|
||||
position: relative;
|
||||
justify-content: left;
|
||||
display: flex;
|
||||
}
|
||||
.entrybox > .entry > .title {
|
||||
left: 0px;
|
||||
}
|
||||
|
|
@ -88,3 +88,13 @@ body, html {
|
|||
top: 0.5em;
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
/* share */
|
||||
.socialicon {
|
||||
height: 2em;
|
||||
padding-top: 0.5em;
|
||||
padding-right: 0.5em;
|
||||
}
|
||||
.share {
|
||||
color: blue
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue