{% extends ../base.html %} {% block meta %} {% end %} {% block title %}Crafty Controller Starting{% end %} {% block content %} <div class="content-wrapper"> <div class="card-header justify-content-between align-items-center" style="border: none;"> <div id="image-div" style="width: 100%;"> <img class="img-center" id="logo-animate" src="../static/assets/images/crafty-logo-square-1024.png" alt="Crafty Logo, Crafty is loading" width="20%" style="clear: both;"> </div> <br> </br> <div id="text-div" style="width: 100%; text-align: center;"> <h2 id="status" style="display: block;" data-init="{{ translate('startup', 'serverInit', data['lang']) }}" data-server="{{ translate('startup', 'server', data['lang']) }}" data-internet="{{ translate('startup', 'internet', data['lang']) }}" data-tasks="{{ translate('startup', 'tasks', data['lang']) }}" data-internals="{{ translate('startup', 'internals', data['lang']) }}" data-almost="{{ translate('startup', 'almost', data['lang']) }}" data-cache="{{ translate('startup', 'cache', data['lang'])}}"> {{ translate('startup', 'starting', data['lang']) }}</h2> </div> </div> </div> <style> .img-center { display: block; margin-left: auto; margin-right: auto; } </style> <script> function rotateImage(degree) { $('#logo-animate').animate({ transform: degree }, { step: function (now, fx) { $(this).css({ '-webkit-transform': 'rotate(' + now + 'deg)', '-moz-transform': 'rotate(' + now + 'deg)', 'transform': 'rotate(' + now + 'deg)' }); } }); setTimeout(function () { rotateImage(360); }, 2000); } $(document).ready(function () { setTimeout(function () { rotateImage(360); }, 2000); if (webSocket) { webSocket.on('update', function (data) { if ("server" in data) { $("#status").html(`${$("#status").data(data.section)} ${data.server}...`); } else { $("#status").html($("#status").data(data.section)); } }); webSocket.on('send_start_reload', function () { setTimeout(function () { location.href = '/panel/dashboard' }, 5000); }); } }); </script> {% end %}