Skip to content
Snippets Groups Projects
function.js 2.47 KiB
Newer Older
  • Learn to ignore specific revisions
  • Silas Meister's avatar
    Silas Meister committed
    const LOREM_IPSUM = "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.";
    const NUMBER_OF_ARTICLES = 10;
    
    window.onload = handler;
    
    function handler() {
        "use strict";
    
        fillArticleSectionWithArticles();
    }
    
    function fillArticleSectionWithArticles() {
        "use strict";
    
        const articleSection = document.getElementById('article-section');
    
        for (let i = 0; i < NUMBER_OF_ARTICLES; ++i) {
            const article = createArticle();
    
            articleSection.appendChild(article);
        }
    }
    
    function createArticle() {
        "use strict";
    
        const article = document.createElement('article');
    
        article.classList.add('article-lorem')
    
        const loremIpsumLength = LOREM_IPSUM.length;
    
        const num1 = parseInt(Math.random() * loremIpsumLength);
        const num2 = parseInt(Math.random() * loremIpsumLength);
    
        const start = Math.min(num1, num2);
        const end = Math.max(num1, num2);
    
        const text = LOREM_IPSUM.substring(start, end + 1);
    
        const content = document.createTextNode(text);
    
        article.appendChild(content);
    
        const backgroundColor = calculateBackgroundColor(start, end, loremIpsumLength);
    
        console.log(backgroundColor);
    
        article.style.setProperty('background-color', backgroundColor);
    
        return article;
    }
    
    function calculateBackgroundColor(start, end, length) {
        const mean = (start + end) / 2;
    
        const totalNumberOfRGB = Math.pow(16, 6);
        const colorCode = Math.floor(mean / length * totalNumberOfRGB);
    
        const rgb = calculateRGB(colorCode, Math.pow(16, 2));
    
        const r = rgb[0];
        const g = rgb[1];
        const b = rgb[2];
    
        const backgroundColor = `rgb(${r}, ${g}, ${b})`;
    
        return backgroundColor;
    }
    
    function calculateRGB(colorCode, basis) {
        if (colorCode > basis) {
            const rest = colorCode % basis;
            const division = parseInt(colorCode / basis);
    
            const rests = calculateRGB(division, basis);
            
            rests.push(rest);
    
            return rests;
        } else {
            return [colorCode];
        }
    }