برنامه نویسی

موتور بازی با هوش مصنوعی✨ قسمت 2 – DALL E Sprites

هی، توسعه دهندگان! 🖐🎮
امیدوارم همه شما روز خوبی داشته باشید! من چند به روز رسانی جالب در helicity.ai دارم

پشتیبانی داخلی DALL E

من پشتیبانی DALL-E را یکپارچه کرده ام! 🎨🖌️ بله، پس از این به بعد، می توانید URL sprite خود را به صورت “جستجو: برخی توضیحات”و Helicity.ai با استفاده از DALL-E یک اسپرایت منحصربفرد برای شما در حال پرواز ایجاد می کند. بدون نیاز به ترک IDE، تصاویر منحصر به فرد و سفارشی ایجاد کنید.

چطور درستش کردم

  1. بنابراین همه چیز در Gameobject.js مدول. هر زمان که یک نمونه جدید از GameObject می سازید، این کد اجرا می شود
  2. وقتی قرار دادی رشته “lookup:”. در منبع تصویر شما، این را به عنوان یک درخواست در نظر می گیرد و یک تابع firebase ساخته شده در Express را فراخوانی می کند
  3. تابع firebase DALL E API را فراخوانی می کند که رشته را دنبال می کند “جستجو:” و به صورت ناهمزمان image-url را برمی گرداند، این به شی بازی بازگردانده می شود.
  4. تصویر شی بازی در هر فریم با استفاده از * ترسیم می شودارائه دادن() *(به طور خودکار در حلقه بازی) یا در غیر این صورت، فقط یک جعبه سیاه است
  5. SadImages اطمینان حاصل می کند که اگر 2 شی بازی با توضیحات جستجوی یکسان ایجاد شوند، چندین فراخوانی برای dall e ساخته نمی شوند. به عنوان مثال لوله در فلپی پرنده.

Gameobject.js

var savedImages = {};

export class GameObject {
  constructor(x, y, width, height, type, imageSrc) {
    this.x = x;
    this.y = y;
    this.width = width;
    this.height = height;
    this.type = type; // can be Used for collision detection
    this.image = new Image();
    this.image.loaded = false;

    //check if imagesrc contains the string lookup:
    if (imageSrc.includes("lookup:")) {
      //check if the image is already saved
      if (savedImages[imageSrc]) {
        this.image = savedImages[imageSrc];
        this.image.loaded = true;
      } else {
        //make a post request. this is in html to use XMLHttpRequest
        var xhr = new XMLHttpRequest();
        xhr.open(
          "POST",
          "https://us-central1-myaigameengine.cloudfunctions.net/api/Image",
          true
        );
        xhr.setRequestHeader("Content-Type", "application/json");
        xhr.send(
          JSON.stringify({
            userPrompt: imageSrc.split("lookup:")[1],
          })
        );
        xhr.onreadystatechange = () => {
          if (xhr.readyState == 4 && xhr.status == 200) {
            //console.log(xhr.responseText);

            //get the imageURL from the response
            var imageURL = JSON.parse(xhr.responseText).image_url;
            this.image = new Image();
            this.image.src = imageURL;
            this.image.onload = () => {
              this.image.loaded = true;
              //save the image
              savedImages[imageSrc] = this.image;
            };
            this.image.onerror = () => {
              console.error(`Error loading image ${this.imageSrc}`);
            };
          }
        };
      }
    } else {
      this.imageSrc = imageSrc;
      this.image = new Image();
      this.image.src = imageSrc;
      this.image.onerror = () => {
        console.error(`Error loading image ${this.imageSrc}`);
      };
      this.image.onload = () => {
        this.image.loaded = true;
      };
    }

    Game.addGameObject(this);
  }

  update(deltaTime) {
    // Overridden by child classes
  }

  render() {
    //draw a black rectangle if there isnt an image else draw it
    if (this.image.loaded) {
      Renderer.drawImage(this.image, this.x, this.y, this.width, this.height);
    } else {

      Renderer.context.fillStyle = "black";
      Renderer.context.fillRect(this.x, this.y, this.width, this.height);
    }
  }
}

وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

نقطه پایانی تصویر اکسپرس تابع Firebase

app.post("/Image", async (req, res) => {
  //var uuid = req.body.uuid;
  var userPrompt = req.body.userPrompt;
  //console.log("uuid is " + uuid);
  console.log("user prompt is ");
  openai
    .createImage({
      prompt: userPrompt,
      n: 1,
      size: "256x256",
    })
    .then((result) => {
      image_url = result.data.data[0].url;
      console.log(image_url);
      res.send({
        success: true,
        image_url: image_url,
      });
    });
});
وارد حالت تمام صفحه شوید

از حالت تمام صفحه خارج شوید

خودشه!

در مورد آن فکر کنید – نیاز به یک جن از “اژدهای بنفش با کلاه بالا؟” 🐉🎩 فقط جستجو را تایپ کنید: اژدهای بنفش با کلاه بالا و voila، جن شخصی شما آماده استفاده در بازی شما است! ساده است! 🎲🚀

پشتیبانی چند نفره به زودی ارائه می شود!

اگر می‌خواهید در مورد توسعه صحبت کنید و در آن شرکت کنید، من را به اختلاف برسانید!

https://discord.com/invite/H4HkgFmqVp

با ما همراه باشید برای مطالب بیشتر! کد نویسی مبارک 🎮💖

نوشته های مشابه

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

دکمه بازگشت به بالا