mirror of
https://github.com/openobserve/openobserve.git
synced 2026-11-05 16:10:43 +00:00
Problem: Suppose we want to give POST permission for all log streams. Then we use orgId as entity, as we give permission for all log streams in that org. If orgId and stream name are same. For eg. default log stream in default org. The permission object for post permission on single "default" (name of stream) log stream and Post permission on all log streams in "default" org, both are same. And this creates a conflict Solution: While giving all resources permission on any of resource type, we prefix orgId with `_all_` and this will not conflict with any resource --------- Co-authored-by: oasisk <ashish.j.kolhe@gmail.com>
Looking for a Vue.js version? Go here --> @preflight-hq/rrweb-player-vue
rrweb-player
Since rrweb's replayer only provides a basic UI, you can choose rrweb-replayer which is based on rrweb's public APIs but has a feature-rich replayer UI.
How is this different from rrweb.Replayer?
rrweb-player uses rrweb's Replayer under the hood, but as Replayer doesn't include any UI for controls, rrweb-player adds those.
Installation
rrweb-player can also be included with <script>:
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/rrweb-player@latest/dist/style.css"
/>
<script src="https://cdn.jsdelivr.net/npm/rrweb-player@latest/dist/index.js"></script>
Or installed by using NPM:
npm install --save rrweb-player
import rrwebPlayer from 'rrweb-player';
import 'rrweb-player/dist/style.css';
Usage
new rrwebPlayer({
target: document.body, // customizable root element
props: {
events,
},
});
Options
| key | default | description |
|---|---|---|
| events | [] | the events for replaying |
| width | 1024 | the width of the replayer |
| height | 576 | the height of the replayer |
| maxScale | 1 | the maximum scale of the replayer (1 = 100%), set to 0 for unlimited |
| autoPlay | true | whether to autoplay |
| speed | 1 | The default speed to play at |
| speedOption | [1, 2, 4, 8] | speed options in UI |
| showController | true | whether to show the controller UI |
| tags | {} | customize the custom events style with a key-value map |
| inactiveColor | #D4D4D4 | Customize the color of inactive periods indicator in the progress bar with a valid CSS color string. |
| ... | - | all the rrweb Replayer options will be bypassed |
methods on the rrwebPlayer component
addEventListener(event: string, handler: (params: any) => unknown): void;
addEvent(event: eventWithTime): void;
getMetaData() => {
startTime: number;
endTime: number;
totalTime: number;
}
getReplayer() => Replayer;
getMirror() => Mirror;
Toggles between play/pause
toggle();
Sets speed of player
setSpeed(speed: number)
Turns on/off skip inactive
toggleSkipInactive();
Triggers resize, do this whenever you change width/height
triggerResize();
Plays replay
play();
Pauses replay
pause();
Go to a point in time and pause or play from then
goto(timeOffset: number, play?: boolean)
Plays from a time to a time and (optionally) loop
playRange(
timeOffset: number,
endTimeOffset: number,
startLooping: boolean = false,
afterHook: undefined | (() => void) = undefined,
)