.

VaKeR CYBER ARMY

Server : Apache/2.4.41 (Ubuntu)
System : Linux absol.cf 5.4.0-198-generic #218-Ubuntu SMP Fri Sep 27 20:18:53 UTC 2024 x86_64
User : www-data ( 33)
PHP Version : 7.4.33
Disable Function : pcntl_alarm,pcntl_fork,pcntl_waitpid,pcntl_wait,pcntl_wifexited,pcntl_wifstopped,pcntl_wifsignaled,pcntl_wifcontinued,pcntl_wexitstatus,pcntl_wtermsig,pcntl_wstopsig,pcntl_signal,pcntl_signal_get_handler,pcntl_signal_dispatch,pcntl_get_last_error,pcntl_strerror,pcntl_sigprocmask,pcntl_sigwaitinfo,pcntl_sigtimedwait,pcntl_exec,pcntl_getpriority,pcntl_setpriority,pcntl_async_signals,pcntl_unshare,
Directory : /var/www/html/share/26042021_1/

Upload File :

Current File : //var/www/html/share/26042021_1/index.html

<!DOCTYPE html>
<html>

<head>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/1.3.1/p5.min.js"></script>
    <title>CANVAS</title>
</head>

<body>
    <style type="text/css">
        html,
        body {
            padding: 0;
            margin: 0;
            width: 100%;
            height: 100%;
            overflow: hidden;
            background: black;
            white-space: nowrap;
            text-align: center;
            touch-action: manipulation;
        }

        body::before {
            content: "";
            display: inline-block;
            vertical-align: middle;
            height: 100%;
        }

        canvas,
        main {
            display: inline-block;
            vertical-align: middle;
        }

        @media (orientation: landscape) {
            canvas,
            main {
                height: 100vh !important;
                width: 100vh !important;
            }
        }

        @media (orientation: portrait) {
            canvas,
            main {
                height: 100vw !important;
                width: 100vw !important;

            }
        }
    </style>
    <script type="text/javascript">
        var circles = [];
        var total = 50;
        var img;

        function makeNew(cx, cy, n) {
            var circle;
            for (var i = 0; i < n; i++) {
                circle = {};
                circle.prevPos = { x: cx, y: cy }
                circle.pos = { x: cx, y: cy }
                circle.dir = random() > 0.5 ? 1 : -1
                circle.radius = random(3, 20)
                circle.angle = 0;
                circles.push(circle);
            }
            
            while(circles.length > 300){
                circles.splice(0, 100);
            }
            total = circles.length;
        }

        function setup() {
            createCanvas(960, 960);

            loadImage('i1.jpg', function(img2) {
                background(30)
                img = img2
                makeNew(960 / 2, 960 / 2, 100);

            });
            frameRate(60);
            strokeWeight(1);
        }

        function draw() {
            //image loading
            if (!img) {
                background(30);
                if (frameCount % 2) text("loading", width / 2, height / 2);
                return;
            }
            
            if (frameCount %180 ==20){
                makeNew(random(60,  900), random(0, 900), 20);
            }

            for (var i = 0; i < total; i++) {
                var circle = circles[i]
                circle.angle += 1 / circle.radius * circle.dir

                circle.pos.x += cos(circle.angle) * circle.radius
                circle.pos.y += sin(circle.angle) * circle.radius
                if (random(80) < 10 || circle.pos.x < 0 || circle.pos.x > width || circle.pos.y < 0 || circle.pos.y > height) {
                    circle.dir *= -1
                    circle.radius = random(3, 10)
                    circle.angle += PI;
                }
                stroke(img.get(circle.pos.x, circle.pos.y))
                line(circle.prevPos.x, circle.prevPos.y, circle.pos.x, circle.pos.y)

                circle.prevPos.x = circle.pos.x
                circle.prevPos.y = circle.pos.y
            }
        }

        function mousePressed() {
            makeNew(mouseX, mouseY, 20);
        }
        
        document.body.addEventListener('touchstart',function(event){
           event.preventDefault(); 
        });
    </script>
</body>

</html>

VaKeR 2022