क्रेजी कैटल 3डी

719 argghh

संपादक में खोलें Video अपना कोड प्रकाशित करें

अनुशंसित

22 August 2024

3डी होवर प्रभाव के साथ एनिमेटेड कार्ड

22 April 2025

3डी यथार्थवादी मधुमक्खी

12 December 2025

3डी आकार व्यूअर: ब्राउज़र में घन, गोला, त्रिभुज

HTML

<!DOCTYPE html>

<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0">
  <title>CrazyCattle3D</title>
  <style>
    html,
    body,
    #canvas {
      margin: 0;
      padding: 0;
      border: 0;
    }

body {
      color: white;
      background-color: black;
      overflow: hidden;
      touch-action: none;
    }

#canvas {
      display: block;
    }

#canvas:focus {
      outline: none;
    }

#status,
    #status-splash, 
    #status-progress { 
      position: absolute;
      left: 0;
      right: 0;
    }

#status,
    #status-splash {
      top: 0;
      bottom: 0;
    }

#status {
      background-color: #000000;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      visibility: hidden;
    }

#status-splash {
      max-height: 100%;
      max-width: 100%;
      margin: auto;
    }

#status-splash.show-image--false {
      display: none;
    }

#status-splash.fullsize--true {
      height: 100%;
      width: 100%;
      object-fit: contain;
    }

#status-splash.use-filter--false {
      image-rendering: pixelated;
    }

#status-progress,
    #status-notice {
      display: none;
    }

#status-progress {
      bottom: 10%;
      width: 50%;
      margin: 0 auto;
    }

#status-notice {
      background-color: #5b3943;
      border-radius: 0.5rem;
      border: 1px solid #9b3943;
      color: #e0e0e0;
      font-family: 'Noto Sans', 'Droid Sans', Arial, sans-serif;
      line-height: 1.3;
      margin: 0 2rem;
      overflow: hidden;
      padding: 1rem;
      text-align: center;
      z-index: 1;
    }
  </style>
  <link id="-gd-engine-icon" rel="icon" type="image/png" href="https://cdn.jsdelivr.net/gh/bubbls/cc3d-merge/index.icon.png" />
  <link rel="apple-touch-icon" href="https://cdn.jsdelivr.net/gh/bubbls/cc3d-merge/index.apple-touch-icon.png" />

console.log(`Merging ${baseName} from ${numParts} parts...`);
        
        const responses = await Promise.all(parts.map(part => 
          fetch(part).catch(err => {
            console.error(`Failed to fetch ${part}:`, err);
            throw new Error(`Failed to load ${part}`);
          })
        ));
        
        for (let i = 0; i < responses.length; i++) {
          if (!responses[i].ok) {
            throw new Error(`Failed to load ${parts[i]}: ${responses[i].status} ${responses[i].statusText}`);
          }
        }

const buffers = await Promise.all(responses.map(r => r.arrayBuffer()));
        
        const totalSize = buffers.reduce((sum, buf) => sum + buf.byteLength, 0);

const mergedArray = new Uint8Array(totalSize);
        let offset = 0;
        for (const buffer of buffers) {
          mergedArray.set(new Uint8Array(buffer), offset);
          offset += buffer.byteLength;
        }

console.log(`${baseName} merged successfully: ${totalSize} bytes`);
        return mergedArray.buffer;
      } catch (error) {
        console.error(`Error merging ${baseName}:`, error);
        throw error;
      }
    }

window.mergedFiles = {
      pck: null,
      wasm: null
    };

if (!window.originalFetch) {
      window.originalFetch = window.fetch;
    }

(async function() {
      try {
        const [pckBuffer, wasmBuffer] = await Promise.all([
          mergeSplitFiles('index.pck', 3),
          mergeSplitFiles('index.wasm', 3)
        ]);
        
        window.mergedFiles.pck = pckBuffer;
        window.mergedFiles.wasm = wasmBuffer;
        
        console.log('All files merged and ready!');
      } catch (error) {
        console.error('Failed to merge files:', error);
        alert('Failed to load game files. Please check that all .part files are uploaded to your CDN.\n\nError: ' + error.message);
      }
    })();
  </script>
</head>

<body>
  <canvas id="canvas">
    Your browser does not support the canvas tag.
  </canvas>

(function() {
      const statusOverlay = document.getElementById('status');
      const statusProgress = document.getElementById('status-progress');
      const statusNotice = document.getElementById('status-notice');

let initializing = true;
      let statusMode = '';

const missing = Engine.getMissingFeatures({
        threads: GODOT_THREADS_ENABLED,
      });

if (missing.length !== 0) {
        const missingMsg = 'Error\nThe following features required to run Godot projects on the Web are missing:\n';
        displayFailureNotice(missingMsg + missing.join('\n'));
      } else {
        setStatusMode('progress');
        engine.startGame({
          'onProgress': function(current, total) {
            if (current > 0 && total > 0) {
              statusProgress.value = current;
              statusProgress.max = total;
            } else {
              statusProgress.removeAttribute('value');
              statusProgress.removeAttribute('max');
            }
          },
        }).then(() => {
          setStatusMode('hidden');
        }, displayFailureNotice);
      }
    }());
  </script>
</body>
</html>

क्रेजी कैटल 3डी

अनुशंसित

3डी होवर प्रभाव के साथ एनिमेटेड कार्ड

3डी यथार्थवादी मधुमक्खी

3डी आकार व्यूअर: ब्राउज़र में घन, गोला, त्रिभुज

HTML

CSS

JS

अनुशंसित

3डी होवर प्रभाव के साथ एनिमेटेड कार्ड

3डी यथार्थवादी मधुमक्खी

3डी आकार व्यूअर: ब्राउज़र में घन, गोला, त्रिभुज

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS