Jump to content
RAGE Multiplayer Community

1 Screenshot

About This File

Overview

This is a highly customizable and responsive interact menu script that does not require any CEF magic. All of the components of this menu come from mp.game.graphics. There is an example.js included in the repository files that set up a menu manager along with two menus that you can switch between.

Installation

Place the interact folder inside your client_packages folder.

Paste the below code into your client_packages/index.js file.

require('./interact/example');

Controls

These can be easily customized through RAGE, but if you are trying the example, hold the B key while using your mouse to navigate and press left mouse button to confirm selection.

API Usage

Getting required classes

const Menu = require('./interact/menu');
const MenuManager = require('./interact/manager');

Setting up a menu

/**
 * @param {Number} [maxItems] Max amount of items that will show when the menu is open.
 * @param {Number} [itemScale] Size of each selectable item in the menu.
 * @param {Number} [wheelScale] Size of texture in the center of the menu.
 * @param {Number} [radius] Size of each selectable item in the menu.
 * @param {RGBA} [color] Default color for all items (unless altered for each individual item added)
 * @param {RGBA} [hoverColor] Default hover color for all items (unless altered for each individual item added)
 * @param {Array} [wheelTexture] [textureDict, textureName] of the menu's center.
 * @param {Array} [backgroundTexture] [textureDict, textureName] of the optional background for items.
 */
const sampleMenu = new Menu(maxItems, itemScale, wheelScale, radius, color, hoverColor, wheelTexture, backgroundTexture);

Adding items to the menu

/**
 * @param {String} name Item identifier.
 * @param {String} textureDict Item icon texture dictionary.
 * @param {String} textureName Item icon texture name.
 * @param {Boolean} [background] Whether the item should have the optional background (recommended for icons without backgrounds).
 * @param {Boolean} [closeMenu] Whether the menu should be closed on item select.
 * @param {RGBA} [color] Color for the item in the menu (default takes color from the menu).
 * @param {RGBA} [hoverColor] Hover color for the item in the menu (default takes hover color from the menu).
 * @param {Function} callback Callback to execute on item select.
 */
sampleMenu.add(name, textureDict, textureName, background, closeMenu, color, hoverColor, () => {
    mp.game.graphics.notify('Button 1');
});

Setting up the menu manager

/**
 * @param {Menu} mainMenu The menu that opens when manager is displayed.
 */
const menuManager = new MenuManager(mainMenu);

Using the menu manager

/**
 * @param {Menu} menu The menu to switch to (use this in callback if you want complex menus).
 */
menuManager.switch(menu);

/**
 * @param {Boolean} toggle Toggle menu visibility.
 */
menuManager.display(toggle);

// Running this executes the callback associated with the selected item.
menuManager.select();

// This must be placed in the clientside render event
menuManager.render()

 

Github Link

Edited by heartgg
Forgot a critical API usage function

  • Like 4
 Share


User Feedback

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest

sheefu

   3 of 3 members found this review helpful 3 / 3 members

very beast mod! pretty easy to use.

Response from the author:

Thanks you're beast

  • Mask 1
Link to review
Guest sckindvl

   1 of 1 member found this review helpful 1 / 1 member

finally i can ban players with a wheel, beast.

Link to review
×
×
  • Create New...