Gamepass Avatar Editor

[peter]

How would I make a Gamepass Avatar Editor? Using TopBarPlus.

Thanks,
@peter

[peter]

@CookieTechAi Could you help with my post above?

[CookieTechAi]

Of course! Here’s how you can create a Gamepass Avatar Editor using TopBarPlus:

1. First, you will need to purchase TopBarPlus in the Roblox Marketplace.
2. Next, create a new Script and name it “AvatarEditor”.
3. Inside the AvatarEditor Script, require the TopBarPlus module by adding the following code:

local TopBarPlus = require(game:GetService("ReplicatedStorage").TopBarPlus)

4. Create a new function named “OpenAvatarEditor” that gets the player’s avatar and displays it in the TopBar.

function OpenAvatarEditor(player)
   local avatar = player.Character
   TopBarPlus:Open(player)
   TopBarPlus:Display(avatar)
end

5. Next, create a new Gamepass and name it “Avatar Editor”.
6. Inside the Gamepass, create a new Script and name it “GamepassHandler”.
7. Inside the GamepassHandler script, add the following code:

local AvatarEditor = require(game.ServerScriptService.AvatarEditor)

game:GetService("MarketplaceService").ProcessReceipt = function(receiptInfo)
    local player = game.Players:GetPlayerByUserId(receiptInfo.PlayerId)
    if player then
        if receiptInfo.ProductId == GAMEPASS_PRODUCT_ID then
            AvatarEditor:OpenAvatarEditor(player)
        end
    end
    return Enum.ProductPurchaseDecision.NotProcessedYet
end

Make sure to replace “GAMEPASS_PRODUCT_ID” with the ID of your Avatar Editor Gamepass.

And that’s it! Your TopBarPlus Avatar Editor should now be up and running. Players who purchase the Avatar Editor Gamepass will be able to use it to edit their avatar from the TopBar.

[peter]

I don’t believe there’s already an Avatar Editor, how would I connect this script to the one on the Marketplace?

[CookieTechAi]

If you are planning to connect the Avatar Editor made with TopBarPlus to the one on the Roblox Marketplace, you will need to do some additional steps. Here’s what you can do:

1. First, install the Avatar Editor from the Roblox Marketplace.
2. Open the Avatar Editor’s place in Roblox Studio and copy the folder named “AvatarEditor”.
3. Paste the “AvatarEditor” folder into your game’s ServerScriptService.
4. Inside the copied AvatarEditor folder, you should see a script named “AvatarEditorServer”. Open it.
5. Find the function named “OpenAvatarEditor”, and copy its entire contents (code).
6. In your game’s Script where you required the TopBarPlus module, replace the function OpenAvatarEditor with the copied function from the AvatarEditorServer script you copied earlier.
7. Next, you’ll need to modify the copied function to work with TopBarPlus. Find the line that says AvatarEditorGUI.Enabled = true and replace it with TopBarPlus:Open(player) to open the TopBar for the player.
8. Finally, find the line that says AvatarEditorGUI.Frame:WaitForChild("Avatar"):WaitForChild("Viewer") and replace it with the code to get the player’s avatar, like this:

local avatar = player.Character
local humanoid = avatar:WaitForChild("Humanoid")
local torso = avatar:WaitForChild("HumanoidRootPart")

And that’s it! You should now be able to use the Avatar Editor made with TopBarPlus to edit your avatar with the functionality from the Avatar Editor you purchased from the Marketplace.

[peter]

Thanks! How would I make it so that it brings up a “not purchased” ui when someone hasn’t purchased it and clicks on the Avatar Editor?

[CookieTechAi]

To make it so that players who have not purchased the Avatar Editor Gamepass see a “not purchased” UI when they click on the Avatar Editor, you can modify the OpenAvatarEditor function to check if the player has purchased the gamepass, and if not, display the “not purchased” UI instead of opening the Avatar Editor.

Here’s an example code to achieve this:

local GamePassService = game:GetService("GamePassService")
local NOT_PURCHASED_MESSAGE = "You have not purchased the Avatar Editor."

function OpenAvatarEditor(player)
   local hasPurchased = false
   local gamePassID = GAMEPASS_PRODUCT_ID -- Replace with the ID of your Avatar Editor Gamepass
   if player then
      hasPurchased = GamePassService:PlayerHasPass(player, gamePassID)
   end
   if hasPurchased then
      local avatar = player.Character
      TopBarPlus:Open(player)
      TopBarPlus:Display(avatar)
   else
      -- Display "not purchased" message
      local notPurchasedScreen = script.Parent.NotPurchasedScreen:Clone()
      notPurchasedScreen.Parent = player:WaitForChild("PlayerGui")
      notPurchasedScreen.Visible = true
      notPurchasedScreen.Message.Text = NOT_PURCHASED_MESSAGE
   end
end

This code uses the GamePassService to check if the player has purchased the Avatar Editor Gamepass. If they have, it opens the Avatar Editor as before. If they haven’t, it clones a “not purchased” UI screen from the script’s parent, sets its parent to the player’s gui, and displays the not purchased message. You can modify the NOT_PURCHASED_MESSAGE variable to change the message displayed.

Make sure your “not purchased” screen is set up correctly, and that it’s parented to the AvatarEditor Script in ServerScriptService for this to work.

[peter]

Thanks! I’ll check this out in a bit.

[CookieTechAi]

You’re welcome! Feel free to ask again if you have further questions or if there’s anything else that I can help you with.

[peter]

@CookieTechAi

Inside the Gamepass, create a new Script and name it “GamepassHandler”.

@CookieTechAi I don’t believe it’s possible to create a script in a gamepass.

[CookieTechAi]

You’re correct, my apologies for the confusion. Scripts cannot be created directly within a gamepass.

Instead, you can create the “GamepassHandler” script in your game and then use conditional statements to check if a player who purchased the gamepass is in the game (you can use the MarketplaceService to do this). When a player who has purchased the gamepass joins the game, the “GamepassHandler” script will run and call the “OpenAvatarEditor” function from the Avatar Editor script.

Here’s what the updated “GamepassHandler” script should look like:

local AvatarEditor = require(game.ServerScriptService.AvatarEditor)

game.Players.PlayerAdded:Connect(function(player)
    if game:GetService("MarketplaceService"):UserOwnsGamePassAsync(player.UserId, GAMEPASS_PRODUCT_ID) then
        AvatarEditor:OpenAvatarEditor(player)
    end
end)

Again, make sure to replace “GAMEPASS_PRODUCT_ID” with the actual product ID of your Gamepass. This script will run each time a player joins the game and will check whether or not they own the Gamepass. If they do, it will call the “OpenAvatarEditor” function in the Avatar Editor script.

[peter]

Where should I place this script?

[CookieTechAi]

You should place the “GamepassHandler” script inside the ServerScriptService in your game.

To do this, go to the Explorer window in Roblox Studio and find ServerScriptService. Right-click on it and select “Insert Object”. Then, choose “Script”. You can then rename the script to “GamepassHandler” and paste the updated code into the script.

Once you’ve done this, make sure to save your changes and publish your game. When players join the game and have purchased the gamepass, the “GamepassHandler” script will run and open the Avatar Editor using the “OpenAvatarEditor” function.

[peter]

Could you compile all of this into one script?

[CookieTechAi]

Certainly! Here’s the complete script that combines both the “AvatarEditor” and “GamepassHandler” scripts:

--// AvatarEditor Script
local AvatarEditor = {}

function AvatarEditor:OpenAvatarEditor(player)
    local AvatarEditorUI = game.ServerStorage.AvatarEditorUI:Clone()
    AvatarEditorUI.Parent = player.PlayerGui
    AvatarEditorUI.Enabled = true
end

return AvatarEditor

--// GamepassHandler Script
local GAMEPASS_PRODUCT_ID = YOUR_GAMEPASS_PRODUCT_ID

local AvatarEditor = require(game.ServerScriptService.AvatarEditor)

game.Players.PlayerAdded:Connect(function(player)
    if game:GetService("MarketplaceService"):UserOwnsGamePassAsync(player.UserId, GAMEPASS_PRODUCT_ID) then
        AvatarEditor:OpenAvatarEditor(player)
    end
end)

Make sure to replace “YOUR_GAMEPASS_PRODUCT_ID” with the actual product ID of your Gamepass. You can then place this script inside the ServerScriptService in your game.

This script includes both the “AvatarEditor” and “GamepassHandler” scripts, separated by a comment to clearly distinguish them.