~whychw/fbxParser.git

<!DOCTYPE html>
<html lang="en">
 
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width,initial-scale=1.0">
 
 
  <style>
    html,
    body {
      margin: 0;
      padding: 0;
    }
    .main {
      position: relative;
      width: 260px;
      height: 260px;
      background: rgba(0, 0, 0, .1);
      border-radius: 50%;
    }
 
    path {
      fill-opacity: 0;
      stroke-width: 1;
      -webkit-animation: dash 1.2s linear infinite alternate;
      animation: dash 1.2s linear infinite alternate;
    }
 
    path.y {
      stroke-dasharray: 290;
      stroke: #1bb;
      fill: #1bb;
      stroke-dashoffset: 290;
    }
 
    path.c {
      stroke: #00f7f9;
      fill: #00f7f9;
      stroke-dasharray: 336;
      stroke-dashoffset: 336;
    }
 
    .rotate {
      stroke: #00f7f9;
      stroke-width: 2;
      stroke-dasharray: 23, 115.25;
      animation: lineMove 1.5s cubic-bezier(0.1, 0.1, 0.7, 1) infinite;
    }
 
    .rotate2 {
      stroke: #00f7f9;
      stroke-width: 1;
      stroke-dasharray: 23, 115.25;
      animation: lineMove 1.5s cubic-bezier(0, 0, 1, 1) infinite;
    }
 
    @-webkit-keyframes lineMove {
      0% {
        stroke-dashoffset: -138.25;
      }
 
      100% {
        stroke-dashoffset: -0;
      }
    }
 
    @keyframes lineMove {
      0% {
        stroke-dashoffset: -138.25;
      }
 
      100% {
        stroke-dashoffset: -0;
      }
    }
 
    @-webkit-keyframes dash {
      to {
        stroke-dashoffset: 0;
        fill-opacity: .8;
      }
    }
 
    @keyframes dash {
      to {
        stroke-dashoffset: 0;
        fill-opacity: .8;
      }
    }
  </style>
 
 
 
</head>
 
<body>
  <div class="main">
    <svg width="100%" height="100%" viewBox="-9 -26 90 90" version="1.1" xmlns="http://www.w3.org/2000/svg"
      xmlns:svg="http://www.w3.org/2000/svg">
      <g style="fill: none">
        <path class="rotate" d="M 36,19.2 m-44,0 a44,44 0 1,1 88,0 a44,44 0 1,1 -88,0" />
        <path class="rotate2" d="M 36,19.2 m-44,0 a44,44 0 1,1 88,0 a44,44 0 1,1 -88,0" />
        <path
          class="y"
          d="M 37.11608,0.85162562 23.498307,23.498305 v 14.2875 h -9.525 V 23.944789 L 0.13229149,0.85162562 H 10.947135 L 18.934244,15.139125 26.648502,0.85162562 Z"
          id="Y" />
        <path
        class="c"
          d="m 58.745765,38.505141 q -4.117578,0 -7.615038,-1.21543 -3.472657,-1.21543 -5.97793,-3.621484 -2.505273,-2.406055 -3.894336,-6.002735 -1.364258,-3.596679 -1.364258,-8.30957 0,-4.390429 1.314649,-7.962304 1.314648,-3.5718753 3.819921,-6.1267581 2.406055,-2.455664 5.953125,-3.7951171 3.571875,-1.33945311 7.788672,-1.33945311 2.331641,0 4.191992,0.27285156 1.885156,0.24804687 3.472656,0.66972655 1.661914,0.4712891 3.001368,1.0666015 1.364257,0.5705079 2.38125,1.0666016 V 12.162563 H 70.726429 Q 70.031898,11.56725 68.965297,10.748696 67.9235,9.9301411 66.584047,9.1363911 65.219789,8.3426411 63.632289,7.796938 q -1.5875,-0.5457031 -3.398242,-0.5457031 -2.00918,0 -3.819922,0.6449219 -1.810742,0.6201171 -3.348633,2.0835937 -1.463476,1.4138675 -2.38125,3.7455075 -0.892969,2.331641 -0.892969,5.655469 0,3.472656 0.967383,5.804297 0.992188,2.33164 2.480469,3.671093 1.513086,1.364258 3.373437,1.959571 1.860352,0.570507 3.671094,0.570507 1.736328,0 3.423047,-0.520898 1.711523,-0.520898 3.150195,-1.413867 1.21543,-0.719336 2.257227,-1.537891 1.041797,-0.818554 1.711523,-1.413867 h 0.992188 v 8.830469 q -1.389063,0.620117 -2.654102,1.16582 -1.265039,0.545703 -2.654101,0.942578 -1.810743,0.520899 -3.398243,0.79375 -1.5875,0.272852 -4.365625,0.272852 z"
          id="C" />
      </g>
    </svg>
  </div>
 
  <script>
    api.receive('java-ready', () => {
      api.send('java-ready');
    });
  </script>
 
</body>
 
</html>