Dawn: Som så mange andre er jeg også åben på leg på alle DB's det giver mening med. Og lige en reminder til nyere 3. års elever om at vi har et fælles emne hvis I vil være med :) (2025-11-02 14:21:00)

Yun: Hvis der er nogen der søger emner er jeg frisk, både her og på mine DB'ere! Selvom Neleh er lidt caught up i hendes flugt fra Azkaban. (2025-11-01 19:39:00)

Jack: Jeg har fået en ide til en artikel. Den skal handle om teenagers. Er der nogen som er forældre eller selv er teenager som kunne være interesseret i at være med i artiklen. Send en ugle :) (2025-11-01 18:15:00)

Opret din helt egen QuickBesked, lige her!

Log Ind

Nye Brugere

Mo Rubinaera
Cher Namoi Burrell
Victoria Fenwick
Alexandria Everly
Jacqueline Amelia Bainbridge
Frederick Hughes

Statistik

485	aktive brugere
18	online brugere

Forside

Opret Bruger

Regler

Pokaloverrækkelse år 98

Kære allesammen!

Så runder vi endnu et flot år af, og derfor vil vi traditionen tro, gerne hylde de flittige og se tilbage på de gode minder.

Vi vil gerne sige jer en stor tak for både lektier, deltagelse i konkurrencer og fantastiske emner der er spillet i løbet af året.

RAVENCLAW

Stort tillykke til Ravenclaw der løber med pokalen dette år

1328 point

550 point

519 point

203 point

Så bliver det spændende! Hvem har egentlig vundet kollegiepokalen tror du? Jamen lad os afsløre det *trommehvirvel*...

...og vinderen af kollegiepokalen er...

(Klik på mig...)

Vinder af Elevpokalen

Georgie Miller

Som vinderen af ELEVPOKALEN, har Georgie har gjort et fantastisk arbejde dette år og har indsamlet hele 463 point!. Kæmpe stort tillykke!

Vi håber på at næste år bliver lige så aktivt, og gerne med endnu flere point og lektier på banen! Held og lykke alle sammen!

Fra hele staben skal I alle have tak for jeres deltagelse!

Skrevet af Raven

24/02/2025 10:55 Generelt

<!--LÆS HER:

Dette er en udkommenteret kommentar. Den er vigtig at lære for at gøre dette opslag nemt at rette. Krokodillenæb, udråbstegn og to bindestreger først, og to bindestreger og omvendt krokodillenæb som slut. Alternativt kan du bare kopiere og sætte ind her fra -->

Kære allesammen!<br>
<br>
Så runder vi endnu et flot år af, og derfor vil vi traditionen tro, gerne hylde de flittige og se tilbage på de gode minder.<br>
<br>
<br>
Vi vil gerne sige jer en stor tak for både lektier, deltagelse i konkurrencer og fantastiske emner der er spillet i løbet af året.<br>
</div>
</div>

<div class="KollegiepokalReveal">

<div class="item item-reveal VinderRavenclaw" id="item-reveal">
<div class="VinderWrapper VinderWrapper-Ravenclaw">
  <div class="Vinder-Bg Vinder-Bg-Ravenclaw">RAVENCLAW</div>
  <div class="Vinder-Fg Vinder-Fg-Ravenclaw">RAVENCLAW</div>
</div>
  <p class="Vinder">Stort tillykke til Ravenclaw der løber med pokalen dette år</p>

<div class="AllePladser">
  <div class="Glas GlasRavenclaw1 plads">1328 point </div><div class="Glas GlasGryffindor2 plads">550 point </div><div class="Glas GlasSlytherin3 plads">519 point </div><div class="Glas GlasHufflepuff4 plads">203 point </div>
  </div>

</div>

<!-- <div class="item item-reveal VinderGryffindor" id="item-reveal">
<div class="VinderWrapper VinderWrapper-Gryffindor">
  <div class="Vinder-Bg Vinder-Bg-Gryffindor">GRYFFINDOR</div>
  <div class="Vinder-Fg Vinder-Fg-Gryffindor">GRYFFINDOR</div>
</div>
  <p class="Vinder">Stort tillykke til Gryffindor der løber med pokalen dette år</p>

<div class="AllePladser">
  <div class="Glas GlasGryffindor1 plads">1720 point </div><div class="Glas GlasRavenclaw2 plads">1427 point </div><div class="Glas GlasHufflepuff3 plads">1059 point </div><div class="Glas GlasSlytherin4 plads">1041 point </div>
  </div>
  
</div> -->

<!--<div class="item item-reveal VinderHufflepuff" id="item-reveal">
<div class="VinderWrapper VinderWrapper-Hufflepuff">
  <div class="Vinder-Bg Vinder-Bg-Hufflepuff">HUFFLEPUFF</div>
  <div class="Vinder-Fg Vinder-Fg-Hufflepuff">HUFFLEPUFF</div>
</div>
  <p class="Vinder">Stort tillykke til Hufflepuff der løber med pokalen dette år</p>

<div class="AllePladser">
  <div class="Glas GlasHufflepuff1 plads">1059 point </div><div class="Glas GlasRavenclaw2 plads">887 point </div><div class="Glas GlasGryffindor3 plads">740 point </div><div class="Glas GlasSlytherin4 plads">692 point </div>
  </div>

</div>  -->

<!--  <div class="item item-reveal VinderSlytherin" id="item-reveal">
<div class="VinderWrapper VinderWrapper-Slytherin">
  <div class="Vinder-Bg Vinder-Bg-Slytherin">SLYTHERIN</div>
  <div class="Vinder-Fg Vinder-Fg-Slytherin">SLYTHERIN</div>
</div>
  <p class="Vinder">Stort tillykke til Slytherin der løber med pokalen dette år</p>

<div class="AllePladser">
  <div class="Glas GlasSlytherin1 plads">1 point </div><div class="Glas GlasGryffindor2 plads">2 point </div><div class="Glas GlasHufflepuff3 plads">3 point </div><div class="Glas GlasRavenclaw4 plads">4 point </div>
  </div>

</div>

<div class="item Magisk-klik-boks" id="Item">
    <div class="TargetText"><p>Så bliver det spændende! Hvem har egentlig vundet kollegiepokalen tror du? Jamen lad os afsløre det *trommehvirvel*...</p><p style="font-size:30px; font-weight:bold;">...og vinderen af kollegiepokalen er...</p>
  <p style="text-align:center;">(Klik på mig...)</p></div>
</div>

<img src="https://static.vecteezy.com/system/resources/previews/010/787/933/non_2x/flower-illustration-on-transparent-background-free-png.png" style="width:500px; margin:auto;" />

Vinder af Elevpokalen</p>
<div class="ElevpokalWrap">

<div class="ElevPokalenVinder">
<div src="" class="ElevPokalVinder" style="background-image:url(https://hogwartsschool.dk/img/profile/411091.jpeg?nocache=1736354620);"></div>
</div><div class="ElevPokalTekst">
<p class="ElevVinderNavn">
Georgie Miller
</p>

Som vinderen af ELEVPOKALEN, har Georgie har gjort et fantastisk arbejde dette år og har indsamlet hele <b>463 point!</b>. Kæmpe stort tillykke!<br>
<br>
Vi håber på at næste år bliver lige så aktivt, og gerne med endnu flere point og lektier på banen! Held og lykke alle sammen!

</div><img src="https://i.imgur.com/ti6kOqT.png" style="height:212px; float:left; margin-left:25px;" /></div>
<div class="PokalAfslutning">
Fra hele staben skal I alle have tak for jeres deltagelse!
</div>

</div>
</div>

</div>

<style>

/*POINT GLAS BILLEDER*/
 /*Pointglas vinder (1)*/
 .GlasRavenclaw1 {background-image: url(https://imgur.com/YKEXgZx.png);}
 .GlasGryffindor1 {background-image: url(https://imgur.com/pZnFgD4.png);}
 .GlasHufflepuff1 {background-image: url(https://imgur.com/qsX8Mm2.png);}
 .GlasSlytherin1 {background-image: url(https://imgur.com/MqvcSY7.png);}

/*Pointglas 2. plads (2)*/
 .GlasRavenclaw2 {background-image: url(https://imgur.com/EiCqBRh.png);}
 .GlasGryffindor2 {background-image: url(https://imgur.com/9mUiqF1.png);}
 .GlasHufflepuff2 {background-image: url(https://imgur.com/Y4u0Vl4.png);}
 .GlasSlytherin2 {background-image: url(https://imgur.com/kjT1cNa.png);}

/*Pointglas 3. plads*/
 .GlasRavenclaw3 {background-image: url(https://imgur.com/2bTkfQd.png);}
 .GlasGryffindor3 {background-image: url(https://imgur.com/eOoR9df.png);}
 .GlasHufflepuff3 {background-image: url(https://imgur.com/68fyvP3.png);}
 .GlasSlytherin3 {background-image: url(https://imgur.com/QiG4jfV.png);}

/*Pointglas 4. plads*/
  .GlasRavenclaw4 {background-image: url(https://imgur.com/rghGlaI.png);}
  .GlasGryffindor4 {background-image: url(https://imgur.com/CBUmFk2.png);}
  .GlasHufflepuff4 {background-image: url(https://imgur.com/8rQFSQm.png);}
  .GlasSlytherin4 {background-image: url(https://imgur.com/FKzyZC0.png);}

/*Vinder tekst*/
.VinderRavenclaw .Vinder, .VinderGryffindor .Vinder, .VinderHufflepuff .Vinder, .VinderSlytherin .Vinder{
  color:#000;
  Margin:auto;
  font-size:20px;
  font-weight:bold;
  
}
/*RAVENCLAW OPSÆTNING*/
.VinderRavenclaw{
  
}
.VinderWrapper-Ravenclaw{
    background-image: url(https://imgur.com/ZoDicna.png);
}

div.Vinder-Bg-Ravenclaw {
  background-image: repeating-linear-gradient( 105deg, 
    #e0ac64, #7c3c12, #e0ac64);
}

div.Vinder-Fg-Ravenclaw {
  background-image: repeating-linear-gradient( 5deg,  
    #e0ac64, #7c3c12, #e0ac64);
  color: #0e1a33;
}

/*GRYFFINDOR OPSÆTNING*/
.VinderGryffindor{
  
}

.VinderWrapper-Gryffindor {
    background-image: url(https://i.pinimg.com/originals/6a/b7/9d/6ab79deb585aba8c842189b06c2a8b14.gif);
  }

div.Vinder-Bg-Gryffindor {
  background-image: repeating-linear-gradient( 105deg, 
    #c8b87f, #79643a, #d8cf99);
}

div.Vinder-Fg-Gryffindor{
  background-image: repeating-linear-gradient( 5deg,  
    #c8b87f, #79643a, #d8cf99);
  color: #450909;
}

/*HUFFLEPUFF OPSÆTNING*/

.VinderHufflepuff{
  
}
.VinderWrapper-Hufflepuff {
  background-image: url(https://i.imgur.com/sWBfSBj.gif);
}

div.Vinder-Bg-Hufflepuff{
  background-image: repeating-linear-gradient( 105deg, 
   #e9d685, #d2a754, #e9d685);
}

div.Vinder-Fg-Hufflepuff{
  background-image: repeating-linear-gradient( 5deg,  
    #e9d685, #d2a754, #e9d685);
  color: #1b1c1e;

}

/*SLYTHERIN OPSÆTNING*/

.VinderSlytherin{
  
}

.VinderWrapper-Slytherin {
    background-image: url(https://pa1.aminoapps.com/6355/7b0afeb7d6357b082630daac26c57f1e8b3e4072_hq.gif);
  }

div.Vinder-Bg-Slytherin {
  background-image: repeating-linear-gradient( 105deg, 
    #d4d4d4, #706864, #d4d4d4);
}

div.Vinder-Fg-Slytherin{
  background-image: repeating-linear-gradient( 5deg,  
    #d4d4d4, #706864, #d4d4d4);
    color: #09351f;
}

/*Resterende pladser*/

.AllePladser{
  display:flex;
  margin-top: 40px;
}

.plads{
  padding-top: 15px;
  text-align: center;
}
  
  .Glas{
    height: 220px;
    background-repeat: no-repeat;
    margin-left: 10px;
    margin-top: 0px;
    width: 131px;
    background-size: contain;
    display: grid;
    align-content: end;
    
  }

.ElevPokalHeader{
   margin:auto;
   font-size:xxx-large;
   
 }
 
 .ElevPokalenVinder{
 float:left; 
 width:185px;
 display:flex;
 }
 
 .ElevPokalTekst{
   float:left;
   width:338px;
    }
  
 .ElevVinderNavn{
   Text-transform:uppercase;
   font-weight: bold;
   font-size:xx-large;
   margin-top:5px;
   text-align:center;
   
 }
 .PokalAfslutning{
   text-align:center;
   margin: 25px 0px 25px 0px;
 }

.ElevPokalVinder { 
   height:200px; 
   width:150px; 
   background-size: cover;
   border: 5px solid #d3ae1e;
    border-image: url(https://static.vecteezy.com/system/resources/previews/002/960/482/original/of-gold-gradient-gold-gradient-background-texture-metallic-vector.jpg)5 10;
 }

.KollegiePokalOpslag-Start{
    width: 740px;
    margin: auto;
    background-color: #c9b090a6;
    background-image: url(https://i.imgur.com/3OuI1Rl.png);
    padding-top: 20px;
    padding-bottom: 20px;
    border: 1px solid #000;
    background-blend-mode: overlay;
   border-radius: 5px;
   font-family: sans-serif;
       font-size: 16px;
}

.KollegiePokalOpslag-Baggrund{
  background-color:#c9b090cc;
  width:700px;
  margin:auto;
  border:1px solid #000;
  border-radius: 5px;
}

.KollegiePokalOpslag-Header, .KollegiepokalReveal{
     place-content: center;
    display: grid;
  
}

.OpslagText{
      padding: 20px;
    text-align: center;

}

.magisk-boks {
  position: absolute;
  pointer-events: none;
}

.magisk-boks canvas {
    position: absolute;
    left: 0;
    top: 0;
    transition: transform 1s ease-out, opacity 1s ease-out;
    opacity: 1;
    transform:
      rotate(0deg) translate(0px, 0px) rotate(0deg);
  
}

@keyframes debug-pulse {
  0% { filter: none; }
  95% { filter: none; }
  95% { filter: drop-shadow(0 1px 0 rgba(255,0,0,1)); }
  100% { filter: drop-shadow(0 1px 0 rgba(255,0,0,1)); }
}

/* == Normal styling below == */

.item {
  margin-bottom: 1em;
  padding: 1em;
  border-radius: 5px;
  place-content: center;
  display: grid;

}

.item-reveal{
  display:none;

}

.Magisk-klik-boks{
  height: 250px;
  width:600px;
  display: flex;
	cursor: pointer;
	box-shadow: inset 0px 3px 5px rgba(255,255,255,0.5), 0px 0px 10px rgba(0,0,0,0.15);
background: linear-gradient(45deg, rgb(255 237 213 / 60%) 5%, rgb(228 197 154 / 60%) 6%, rgb(228 197 154 / 60%) 9%, rgba(255 237 213 / 60%) 10%, rgba(228 197 154 / 60%) 17%, rgb(255 237 213 / 60%) 19%, rgb(228 197 154 / 60%) 21%);
	background-size: 350%;
	background-position: right;
	transition: 1s;
  border:1px solid #000;
  margin-left: 7px;

}

.Magisk-klik-boks:hover, .Magisk-klik-boks:focus {
    background: linear-gradient(45deg, rgb(255 255 255) 5%, rgb(255 255 255) 6%, rgb(225 225 225) 9%, rgb(235 235 235) 10%, rgb(255 255 255) 17%, rgb(255 255 255) 19%, rgb(233 233 233) 21%);
    background-size: 250%;

}

.TargetText{
text-align:center;
margin-top: 30px;
  
}

.VinderWrapper {
  display: grid;
  grid-template-areas: 'overlap';
  place-content: center;
  height: 230px;
  width: 568px;
  background-size: cover;
  background-position-y: center;

}

.VinderWrapper div {
  background-clip: text;  
  -webkit-background-clip: text;
  font-weight: 900;
  font-size: xxx-large;
  grid-area: overlap;
  letter-spacing: 1px;
  -webkit-text-stroke: 4px transparent;

}

div.Vinder-Bg {
    filter: drop-shadow(5px 15px 15px black);
  transform: scaleY(1.05);
  transform-origin: top;
    color: transparent;
}

div.Vinder-Fg {
 transform: scale(1); 
  
}

</style>
<script src="
https://cdn.jsdelivr.net/npm/html2canvas@1.4.1/dist/html2canvas.min.js
"></script>

const DEBUG = false;
const REPETITION_COUNT = 2; // number of times each pixel is assigned to a canvas
const NUM_FRAMES = 128;

/**
 * Generates the individual subsets of pixels that are animated to create the effect
 * @param {HTMLCanvasElement} ctx
 * @param {number} count The higher the frame count, the less grouped the pixels will look - Google use 32, but for our elms we use 128 since we have images near the edges
 * @return {HTMLCanvasElement[]} Each canvas contains a subset of the original pixels
 */
function generateFrames($canvas, count = 32) {
  const { width, height } = $canvas;
  const ctx = $canvas.getContext("2d");
  const originalData = ctx.getImageData(0, 0, width, height);
  const imageDatas = [...Array(count)].map(
    (_,i) => ctx.createImageData(width, height)
  );
  
  // assign the pixels to a canvas
  // each pixel is assigned to 2 canvas', based on its x-position
  for (let x = 0; x < width; ++x) {
    for (let y = 0; y < height; ++y) {
      for (let i = 0; i < REPETITION_COUNT; ++i) {
        const dataIndex = Math.floor(
          count * (Math.random() + 2 * x / width) / 3
        );
        const pixelIndex = (y * width + x) * 4;
        // copy the pixel over from the original image
        for (let offset = 0; offset < 4; ++offset) {
          imageDatas[dataIndex].data[pixelIndex + offset]
            = originalData.data[pixelIndex + offset];
        }
      }
    }
  }
  
  // turn image datas into canvas'
  return imageDatas.map(data => {
    const $c = $canvas.cloneNode(true);
    $c.getContext("2d").putImageData(data, 0, 0);
    return $c;
  });
}

/**
 * Inserts a new element over an old one, hiding the old one
 */
function replaceElementVisually($old, $new) {
  const $parent = $old.offsetParent;
  $new.style.top = `${$old.offsetTop}px`;
  $new.style.left = `${$old.offsetLeft}px`;
  $new.style.width = `${$old.offsetWidth}px`;
  $new.style.height = `${$old.offsetHeight}px`;
  $parent.appendChild($new);
  $old.style.visibility = "hidden";
  document.getElementById("item-reveal").style.display = "inherit"
  document.getElementById("Item").style.display = "none"
  
}

/**
 * Disintegrates an element
 * @param {HTMLElement} $elm
 */
function disintegrate($elm) {
  html2canvas($elm).then($canvas => {    
    // create the container we'll use to replace the element with
    const $container = document.createElement("div");
    $container.classList.add("magisk-boks");
    
    // setup the frames for animation
    const $frames = generateFrames($canvas, NUM_FRAMES);
    $frames.forEach(($frame, i) => {
      $frame.style.transitionDelay = `${1.35 * i / $frames.length}s`;
      $container.appendChild($frame);
    });
    
    // then insert them into the DOM over the element
    replaceElementVisually($elm, $container);
    
    // then animate them
    $container.offsetLeft; // forces reflow, so CSS we apply below does transition
    if (!DEBUG) {
      // set the values the frame should animate to
      // note that this is done after reflow so the transitions trigger
      $frames.forEach($frame => {
        const randomRadian = 2 * Math.PI * (Math.random() - 0.5);
        $frame.style.transform = 
          `rotate(${15 * (Math.random() - 0.5)}deg) translate(${60 * Math.cos(randomRadian)}px, ${30 * Math.sin(randomRadian)}px)
rotate(${15 * (Math.random() - 0.5)}deg)`;
			  $frame.style.opacity = 0;
      });
    } else {
      $frames.forEach($frame => {
        $frame.style.animation = `debug-pulse 1s ease ${$frame.style.transitionDelay} infinite alternate`;
      });
    }
  });
}

/** === Below is just to bind the module and the DOM == */
[...document.querySelectorAll(".Magisk-klik-boks")].forEach($elm => {
  $elm.addEventListener("click", () => {
    if ($elm.disintegrated) { return; }
    $elm.disintegrated = true;
    disintegrate($elm);
  });
});

</script>

Emilius 24/02/2025 16:28

Stort tillykke, Georgie! ;o)

Kosmos 24/02/2025 16:36

Sejt Georgie!

Georgie 24/02/2025 17:29

Wuhu!! :D

Tak :D

Du skal være logget ind for at kunne skrive en kommentar.

© 2008 - 2025 hogwartsschool.dk | Saga Arcana | Tristan@hogwartsschool.dk
Billeder, indhold & karakterer fra Harry Potter Universet © Warner Brothers, J.K. Rowling, og/eller deres respektive ejere.

Har du feedback, idéer eller forslag til siden? Klik her for komme til Canny!

Vis ændringslog

Skift cookie-indstillinger

Årgang 102 | Ferie

Uge 6 - Marts/April

Bliv V.I.W.

Nyheder

Pokaloverrækkelse år 98

Tilføj nyt quick-link

Cookieindstillinger