VaKeR CYBER ARMY
Logo of a company 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/libs/absol-acomp/demo/

Upload File :
current_dir [ Writeable ] document_root [ Writeable ]

 

Current File : /var/www/html/libs/absol-acomp/demo/buttonarray.html
<!DOCTYPE html>
<html>

<head>
    <title>ButtonArray</title>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="https://absol.cf/hightlight/styles/default.css">
    <!-- <link rel="stylesheet" href="https://absol.cf/materialdesignicons/materialdesignicons.min.css"> -->
    <script src="../dist/absol-acomp.js?<?php  echo stat('../dist/absol-acomp.js')['mtime'];?>"></script>

    <script src="https://absol.cf/hightlight/highlight.pack.js"></script>
</head>

<body>
    <div id="demo0"></div>
    <script>
        var _ = absol._;
        var $ = absol.$;
    </script>
    <script class="viewable">
        var ba0 = _({
            tag: 'buttonarray',
            style:{
                'font-size':'30px'
            },
            props: {
                items: [
                    true, false, null, 1, 2, 3, 4, 5
                ]
            },
            on: {
                change: function (event) {
                    console.log(event.value, this.value);
                }
            }
        });


        $('#demo0').addChild(ba0);
    </script>
    <h2>Expert</h2>
    <div id="demo1"></div>
    <style class="viewable">
        .button-on-off{
           
        }

        .button-on-off.off .as-button-array-item.as-active{
            background-color: rgb(255, 40, 40);
            color: white;
        }
        .button-on-off.off {
            border-color: red;
        }

        .button-on-off.off .as-button-array-item{
            color: red;
            border-color: red;
        }

    </style>
    <script>
          var ba1 = _({
                tag: 'buttonarray',
                class:['button-on-off', 'off'],
                props: {
                    items: [
                        {
                            text: 'On',
                            value: true
                        },
                        {
                            text: 'Off',
                            value: false
                        }
                    ],
                    value: false

                },
                on: {
                    change: function (event) {
                        if (this.value){
                            this.removeClass('off');
                        }
                        else{
                             this.addClass('off');
                        }
                    }
                }
            });
            $('#demo1').addChild(ba1);
    </script>

    <script src="https://absol.cf/absol/demo/autohightlighting.js?"></script>

</body>

</html>

VaKeR 2022