flamingo-ui/es/angry-bird/index.js

火烈鸟UI组件库

import Matter from "matter-js";
import { ref, onMounted } from "vue";
const __default__ = {
  name: "AngryBird"
};
const __vue_sfc__ = /* @__PURE__ */ Object.assign(__default__, {
  props: {
    ejectDistance: {
      type: Number,
      default: 3
    },
    WIDTH: {
      type: Number,
      default: 1022
    }
  },
  setup(__props, { expose }) {
    expose();
    const props = __props;
    const HEIGHT = ref(props.WIDTH / 2.2914);
    const dom = ref(null);
    const slingshot = () => {
      var Engine = Matter.Engine, Render = Matter.Render, Runner = Matter.Runner, Events = Matter.Events, Constraint = Matter.Constraint, MouseConstraint = Matter.MouseConstraint, Mouse = Matter.Mouse, World = Matter.World, Bodies = Matter.Bodies;
      var engine = Engine.create(), world = engine.world;
      var render = Render.create({
        element: dom.value,
        engine,
        options: {
          width: props.WIDTH,
          height: HEIGHT.value,
          background: "#fff",
          wireframeBackground: "#fff",
          wireframes: false,
          showVelocity: true,
          showCollitions: true
        }
      });
      Render.run(render);
      var runner = Runner.create();
      Runner.run(runner, engine);
      var ground = Bodies.rectangle(511, 446, 1022, 10, { isStatic: true }), birdOptions = { mass: 20, restitution: 0.6 }, bird = Bodies.circle(200, 350, 16, birdOptions), anchor = { x: 200, y: 350 }, elastic = Constraint.create({
        pointA: anchor,
        bodyB: bird,
        length: 0.01,
        stiffness: 0.25,
        render: {
          strokeStyle: "black"
        }
      });
      var woodOptions = { mass: 2, isStatic: false, restitution: 0, friction: 0.4 };
      var rockOptions = { mass: 4, isStatic: false, restitution: 0, friction: 0.5 };
      var ironOptions = { mass: 6, isStatic: false, restitution: 0, friction: 0.2 };
      var stacks = [];
      stacks[0] = Bodies.rectangle(450, 404, 30, 70, rockOptions);
      stacks[1] = Bodies.rectangle(485, 358, 80, 20, rockOptions);
      stacks[2] = Bodies.rectangle(520, 404, 30, 70, rockOptions);
      stacks[3] = Bodies.rectangle(620, 388, 28, 100, rockOptions);
      stacks[4] = Bodies.rectangle(650, 327, 80, 20, rockOptions);
      stacks[5] = Bodies.rectangle(680, 388, 28, 100, rockOptions);
      stacks[6] = Bodies.rectangle(780, 364, 20, 150, rockOptions);
      stacks[7] = Bodies.rectangle(800, 364, 20, 150, rockOptions);
      stacks[8] = Bodies.rectangle(850, 278, 150, 20, rockOptions);
      stacks[9] = Bodies.rectangle(900, 364, 20, 150, rockOptions);
      stacks[10] = Bodies.rectangle(920, 364, 20, 150, rockOptions);
      stacks[11] = Bodies.rectangle(570, 418, 20, 40, woodOptions);
      stacks[12] = Bodies.rectangle(570, 388, 60, 20, woodOptions);
      stacks[13] = Bodies.rectangle(730, 418, 20, 40, woodOptions);
      stacks[14] = Bodies.rectangle(730, 388, 60, 20, woodOptions);
      stacks[15] = Bodies.rectangle(900, 252, 30, 30, woodOptions);
      stacks[16] = Bodies.rectangle(840, 226, 120, 10, woodOptions);
      stacks[17] = Bodies.rectangle(485, 308, 30, 80, ironOptions);
      stacks[18] = Bodies.rectangle(485, 252, 30, 30, ironOptions);
      stacks[19] = Bodies.rectangle(650, 276, 30, 80, ironOptions);
      stacks[20] = Bodies.rectangle(570, 226, 220, 20, ironOptions);
      stacks[21] = Bodies.circle(570, 358, 20, ironOptions);
      stacks[22] = Bodies.circle(730, 362, 16, ironOptions);
      stacks[23] = Bodies.circle(570, 196, 20, ironOptions);
      World.add(engine.world, [ground, bird, ...stacks, elastic]);
      Events.on(engine, "afterUpdate", function() {
        if (mouseConstraint.mouse.button === -1 && (bird.position.x > 200 + props.ejectDistance || bird.position.y < 350 - props.ejectDistance)) {
          bird = Bodies.circle(200, 350, 16, birdOptions);
          World.add(engine.world, bird);
          elastic.bodyB = bird;
        }
      });
      var mouse = Mouse.create(render.canvas), mouseConstraint = MouseConstraint.create(engine, {
        mouse,
        constraint: {
          stiffness: 0.2,
          render: {
            visible: false
          }
        }
      });
      World.add(world, mouseConstraint);
      render.mouse = mouse;
      Render.lookAt(render, {
        min: { x: 0, y: 0 },
        max: { x: 1022, y: 446 }
      });
      return {
        engine,
        runner,
        render,
        canvas: render.canvas,
        stop: function() {
          Matter.Render.stop(render);
          Matter.Runner.stop(runner);
        }
      };
    };
    onMounted(() => {
      slingshot();
    });
    const __returned__ = { props, HEIGHT, dom, slingshot, get Matter() {
      return Matter;
    }, ref, onMounted };
    Object.defineProperty(__returned__, "__isScriptSetup", { enumerable: false, value: true });
    return __returned__;
  }
});
import { openBlock as _openBlock, createElementBlock as _createElementBlock } from "vue";
const _hoisted_1 = { ref: "dom" };
function __vue_render__(_ctx, _cache, $props, $setup, $data, $options) {
  return _openBlock(), _createElementBlock(
    "div",
    _hoisted_1,
    null,
    512
    /* NEED_PATCH */
  );
}
__vue_sfc__.render = __vue_render__;
var stdin_default = __vue_sfc__;
export {
  stdin_default as default
};