The Presence
class is very useful as it has basic methods that we need for creating a presence.
When you create a class you must specify clientId
property.
const presence = new Presence({
clientId: "514271496134389561" // Example clientId
});
There are three properties available for Presence
class.
clientId
This property is required to make your presence work, because it uses your application id to display its logo and assets.
You can get it on your applications page.
injectOnComplete
- Deprecated since 2.2.4When setting injectOnComplete
to true
the first UpdateData
event for both the presence.ts
and iframe.ts
files will only be fired when the page has fully loaded.
appMode
- Deprecated since 2.2.4When setting appMode
to true
and the presence were to send an empty PresenceData
, the app will show the application (image and name) on the user's profile instead of nothing.
getActivity()
- Deprecated since 2.2.4Returns a PresenceData
object of what the presence is displaying.
setActivity(PresenceData | Slideshow, Boolean)
Sets your profile activity according to provided data.
First parameter requires a PresenceData
interface or a Slideshow
class to get all information that you want to display in your profile.
Second parameter defines when presence is playing something or not. Always use true
if you provide timestamps in PresenceData
.
clearActivity()
Clears your current activity and the tray title.
setTrayTitle(String)
- Deprecated since 2.2.3This method works only on Mac OS.
Sets the tray title on the Menubar.
createSlideshow()
Creates a new Slideshow
class.
const slideshow = presence.createSlideshow();
It is suggested to do this right after creating the Presence
class:
const presence = new Presence({
clientId: "514271496134389561" // Example clientId
}),
slideshow = presence.createSlideshow();
You can find the documentation for the Slideshow
class
here.
getStrings(Object)
An asyncronous method that allows you to get translated strings from extension.
You must provide Object
with keys being the key for string, keyValue
is the string value. A list of translated strings can be found at this endpoint: https://api.premid.app/v2/langFile/presence/en/
// Returns `Playing` and `Paused` strings
// from extension.
const strings = await presence.getStrings({
play: "general.playing",
pause: "general.paused"
});
const playString = strings.play; // result: Playing
const pauseString = strings.pause; // result: Paused
Since v2.2.0 of the extension you can now get the strings of a certain language. This works well with the also newly added multiLanguage
setting option.
We suggest you use the following code so it automatically updates the PresenceData if the user changes the selected language;
async function getStrings() {
return presence.getStrings(
{
play: "general.playing",
pause: "general.paused"
},
// The ID is the ID of the multiLanguage setting.
await presence.getSetting("ID").catch(() => "en");
);
}
let strings = getStrings(),
// The ID is the ID of the multiLanguage setting.
oldLang: string = await presence.getSetting("ID").catch(() => "en");
//! The following code must be inside the updateData event!
// The ID is the ID of the multiLanguage setting.
const newLang = await presence.getSetting("ID").catch(() => "en");
if (oldLang !== newLang) {
oldLang = newLang;
strings = getStrings();
}
const playString = (await strings).play, // result: Playing
pauseString = (await strings).pause; // result: Paused
getPageletiable(String)
Returns a variable from the website if it exists.
Warning: This function can cause high CPU usage & site lagging when it has been executed too many times.
const pageVar = presence.getPageletiable("pageVar");
console.log(pageVar); // This will log the "Variable content"
getExtensionVersion(Boolean)
Returns version of the extension the user is using.
getExtensionVersion(onlyNumeric?: boolean): string | number;
const numeric = presence.getExtensionVersion();
console.log(numeric); // Will log 210
const version = presence.getExtensionVersion(false);
console.log(version); // Will log 2.1.0
getSetting(String)
Returns value of setting.
const setting = await presence.getSetting("pdexID"); //Replace pdexID with the id of the setting
console.log(setting); // This will log the value of the setting
hideSetting(String)
Hides given setting.
presence.hideSetting("pdexID"); // Replace pdexID with the id of the setting
showSetting(String)
Shows given setting (Only works if the setting was already hidden).
presence.showSetting("pdexID"); // Replace pdexID with the id of the setting
getLogs()
Returns the logs of the websites console.
const logs = await presence.getLogs();
console.log(logs); // This will log the latest 100 logs (in an array).
Note: Requires readLogs
to be true
in the metadata.json
file.
info(String)
Prints the given message in the console in a format based of the presence in the info
style.
presence.info("Test") // This will log "test" in the correct styling.
success(String)
Prints the given message in the console in a format based of the presence in the success
style.
presence.success("Test") // This will log "test" in the correct styling.
error(String)
Prints the given message in the console in a format based of the presence in the error
style.
presence.error("Test") // This will log "test" in the correct styling.
getTimestampsfromMedia(HTMLMediaElement)
Returns 2 snowflake
timestamps in an Array
that can be used for startTimestamp
and endTimestamp
.
const timestamps = presence.getTimestampsfromMedia(document.querySelector(".video"));
presenceData.startTimestamp = timestamps[0];
presenceData.endTimestamp = timestamps[1];
Note: The given String
in querySelector is an example.
getTimestamps(Number, Number)
Returns 2 snowflake
timestamps in an Array
that can be used for startTimestamp
and endTimestamp
.
const video = document.querySelector(".video"),
timestamps = presence.getTimestamps(video.currentTime, video.duration);
presenceData.startTimestamp = timestamps[0];
presenceData.endTimestamp = timestamps[1];
Note: The given String
in querySelector is an example.
timestampFromFormat(String)
Converts a string with format HH:MM:SS
or MM:SS
or SS
into an integer (Does not return snowflake timestamp).
const currentTime = presence.timestampFromFormat(document.querySelector(".video-now").textContent),
duration = presence.timestampFromFormat(document.querySelector(".video-end").textContent),
timestamps = presence.getTimestamps(currentTime, duration);
presenceData.startTimestamp = timestamps[0];
presenceData.endTimestamp = timestamps[1];
Note: The given String
in querySelector is an example.
PresenceData
InterfaceThe PresenceData
interface is recommended to use when you are using the
setActivity()
method.
This interface has following variables, all of them are optional.
Variable | Description | Type |
---|---|---|
details | The first line in your presence, usually used as header. | String
|
state | Second line in your presence. | String
|
startTimestamp | Defines the current time. Used if you want to display how much hours:minutes:seconds left.
You must convert your time to timestamp or you will get a wrong
countdown.
|
Number
|
endTimestamp | Defines the full duration.
Used if you want to display how much hours:minutes:seconds left.
You must convert your time to timestamp or you will get a wrong
countdown.
|
Number
|
largeImageKey | Defines the logo for the presence. | String
|
smallImageKey | Defines the small icon next to presence's logo. | String
|
smallImageText | Defines the text that will be shown to user when they hover over the small icon. | String
|
buttons | Array of buttons, max 2, label is the button text, and url is the link. | Array<Object>
|
const enum Assets {
Logo = ""
}
const presenceData: PresenceData = {
details: "My title",
state: "My description",
largeImageKey: Assets.Logo,
smallImageKey: Assets.Reading, //Other Assets can be found in index.d.ts
smallImageText: "You hovered me, and what now?",
startTimestamp: 1564444631188,
endTimestamp: 1564444634734,
buttons: [
{
label: "Test button1",
url: "https://premid.app/"
},
{
label: "Test button2",
url: "https://premid.app/contributors"
}
]
};
Events allow you to detect and handle some changes or calls that were made. You can subscribe to events using the on
method.
presence.on("UpdateData", async () => {
// Do something when data gets updated.
});
There are few events available:
UpdateData
This event is fired every time the presence is being updated.
iFrameData
Fired when data is received from iFrame script.