Search the Community

Showing results for tags 'CEF'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • RAGE Multiplayer
    • Announcements
    • Discussion
    • Suggestions
  • Scripting
    • Scripting
    • Resources
  • Community
    • Support
    • Servers
    • Media Gallery
  • Non-English
    • Русский - Russian
    • Français - French
    • Deutsch - German
    • Espanol - Spanish
    • Română - Romanian
    • Portuguesa - Portuguese
    • Polski - Polish


  • Scripts
  • Gamemodes
  • Libraries
  • Plugins
  • Maps
  • Tools

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



About Me






Found 16 results

  1. Got a quick question regarding CEF, why can't I create a webgl context? I used the chrome debugger to create a canvas node and then tried to create a webgl context but it didn't work.
  2. Hello, I am starting with ragemp scripting and I want to try to do something with html/css/js and i have some issue when creating a browser to execute html with code : let browser ="package://[my folder where is html file]/index.html"); // Get from rage wiki and the console log to me something like: Cannot read property 'new' of undefined Mayby I am doing something wrong. I will be very thankful for any help. This is also my first post on the forum so if something is wrong I am really sorry .
  3. Hi everyone, I am playing with C# for RageMP I unfortunately I don't get one thing with CEF. I'm keep learning how to use some events and this time I have to create some UI to use them. UI based on Javascript works great (e.g. however when I write my own code in C# - it does not show at all. I am using Stuyk tutorial from and it is not working. Even tried to copy everything 1:1 and script literally does not respond. Recent code (based on Stuyk tutorial): using System; using RAGE; using RAGE.Elements; using RAGE.Ui; namespace hello { public class Main : Events.Script { RAGE.Ui.HtmlWindow CustomWindow = null; public Main() { LoadCEF("package://html/index.html"); } public void LoadCEF(string uri) { CustomWindow = new HtmlWindow(uri) { Active = true }; } } } html file contains proper template with HTML5 encoding and body bg color set for black only. Works with local browsers such as Firefox and Chrome. Cleared cache memory several times to make sure it's overwriting the new one. Some suggestions? Thank you in advance VasiDe
  4. Version 1.0.1


    Internet radio over colshapes using CEF. Scope of application: custom clubs, interiors. Default location is the Galileo Observatory (behind the monument). Default radio station - Wacken Radio (DE). Installation: I. Put server files to: server-files\packages\yourGameMode II. Add require('./rStreamColshapes'); to your server's index.js III. Put client files to: client_packages then edit your client's index.js and add require('./rStream'); To change radio stream url, edit index.html here: client_packages\cef\rStream\index.html GitHub
  5. Los

    CEF Boilerplate

    CEF Boilerplate This is a boilerplate that will make your development proccess easier. It has a workflow that works like a website development, but, adapted for UI development. Built with Gulp + Webpack + Babel + SASS + ES6 Features: Focused on performance, lightweight. Made to be maintainable and SCALABLE. Small, medium or big projects, doesn't matter how much components, it will be easy to maintain. Easy for integrating any framework like Vue or React. Hot reload Local development: Run npm install Run gulp The index.html inside the src folder, works like a summary. This is the default page that will open when you start the development environment. You can customize it. The others folders is just like any other web project structure. Building for production: Run npm install Run gulp production It will make all the minifying proccess, create bundles and will send it to ../../client_packages/dist folder by default. If you want to change it, go to gulpfile.js/config.json and change the destProd value. Integrating I strongly recommend you to use the ragemp-start typescript by @ekoozu Using with ragemp-starter: Clone this repo into the src folder Run the npm install on it Run gulp production Done. Creating a browser:"package://dist/html/boilerplate.html") That's all, folks. Feel free to open an issue or answer this thread if you have any question. Download it on GitHub
  6. В целях изучения разбираю примеры уже готовых серверов, и появился вопрос, как лучше поступать с UI через CEF ? Использовать единый html в котором собрать все элементы интерфейса и управлять ими изнутри, те в одном html будет к примеру компонент и чата и спидометра. Или инициализировать несколько CEF, допустим в один элемент CEF закинуть chat.html, и по верх него еще один элемент с CEF только уже с spedometr.html ? В чем плюсы и минуты того и другого?
  7. Привет! Последний тутер из серии как начать разрабатывать сервер в RageMp, поехали:Ссылка на проект:
  8. Inside your server folder, open config.json and add the following line "allow-cef-debugging": true Now head to your registry (Windows Key + R ) and type regedit and hit enter. Head to the following path: Once you're there, right click and Go New > String Value and put "launch.cefPort" as the name and Hit Enter, then right click and hit Modify and set the data to the port you'd like to use (9222 for example) and it should look the same as below Now head to your browser using the following: http://localhost:9222/ or whatever port you had entered to enable it. You'll need to quit Rage and open it back up if you enabled this while in game, and make sure you restart your server when you change the setting. Credits to @kemperrr as I used his post on Discord to make this up.
  9. Tellarion

    Voice Chat

    Version 1.0.0


    Hi, my realization voice chat on cef in the RAGE:MP Voice working by distance position (noice control), activation F8 (push and talk) Installing 1. Read all .js comments and put code in your gamemode 2. Prepare security Web Server and start peer js server, generate crt files and put with server in one folder 3. Change all urls my web project on yours For peerjs server, use next package install: npm install fs peer P.s, i dont know would be new version that scripts, but if you want himself update and i can upload its here Date Build: 22 feb 2018
  10. Hey there. I started developing a client-side user interface, and I had problems with custom fonts. I included my custom fonts in the CSS file: @font-face { font-family: Gabriela; src: url(../Fonts/Gabriela-Regular.ttf); } @font-face { font-family: FontAwesome; src: url(../Fonts/fontawesome-webfont.ttf); } * { font-family: Gabriela; } .dws-input::before { font-family: FontAwesome; content: "\f007"; position: absolute; font-size: 30px; padding: 25px 0 0 0px; color: white; } In the browser, all the fonts look great, but when I started the game, all the fonts changed to standard ones. What have I done wrong? Maybe I incorrectly connected fonts? Thanks in advance
  11. Kasimir


    Version 0.3.0


    To access the console press F11 ingame. Motivation RAGE console is designed to be a simple and universal logging library with support for client-side, including CEF and server-side. The server-side currently logs all the logs into separate daily files. Installation Installation is extremely simple Copy "packages" folder inside your server "packages" folder, except config.json if you have edited it Copy "client_packages" folder inside your "client_packages" folder Edit your "client_packages" -> index.js to include the rage-console with: require('_rage-console'); (remember to paste this on line 1) Config The config exists inside your 'packages/_rage-console/config.json'. You can freely edit these, if no data is provided it will default to default settings. These options are accepted by the config: zippedArchive: A boolean to define whether or not to gzip archived log files. (default 'false') name: Filename to be used to log to. This filename can include the date placeholder which will include the formatted. (default: 'YYYY-MM-DD') maxSize: Maximum size of the file after which it will rotate. This can be a number of bytes, or units of kb, mb, and gb. If using the units, add 'k', 'm', or 'g' as the suffix. The units need to directly follow the number. (default: '30m') maxFiles: Maximum number of logs to keep. If not set, no logs will be removed. This can be a number of files or number of days. If using days, add 'd' as the suffix. (default: '30d') { "logs": { "name": "YYYY-MM-DD", "maxSize": '30m', "maxFiles": '30d', "zippedArchive": false } } Upgrading Upgrading is extremely simple Copy "packages" folder inside your server "packages" folder Copy "client_packages" folder inside your "client_packages" folder Usage Can be used on server-side or client-side. You do not need to require the file as these are available globally. Writes an info log to the console. console.log('Hey! Log something?'); Writes an info log to the console.'Hey! Log something?'); Writes an warning log to the console. console.warn('Hey! Log something?'); Writes an error log to the console. console.error('Hey! Log something?'); Usage with CEF (Browser) To use with CEF you need to add the following line to your HTML <head> element, put this to the top of all your script files. <script src="package://_rage-console/CEF/debugger.js" crossorigin="anonymous"></script> Build in commands help — provides all the commands available clear — clears all the logs API Enable or disable access to console [client-side] = true/false; Add command handler [client-side] terminal.commands.add('pos', { description: 'Gets the position of the player' }, function(...arguments) { return ` X: ${user.position.x.toFixed(2)}, Y: ${user.position.y.toFixed(2)}, Z: ${user.position.z.toFixed(2)} - R: ${user.getHeading(true).toFixed(2)}`; }); Todo Add options to disable and enable server-side log files Add options to custom style the console, mainly due to accessibility Run proper tests and clean the logic Add ability to see which file the log is coming from Add ability to be used with C bridge Bugs/Feedback Bugs should be reported currently in RAGE Discord channel to the username @Porn on private message, I appreciate any bugs being reported. If you have a feature request please do the same as mentioned above. This is currently in BETA and some stuff is still unpolished.
  12. Hello, I'm trying to play custom music in game using CEF, but It only works when audio is very short (less then 10s). I'm using .ogg format and this code: function playAudio() { let myAudio = new Audio("sampel.ogg");; myAudio.volume = 0.1; } Is there any limit to using custom songs?
  13. Angel

    CEF local storage

    Good morning, Just playing around with the window.localStorage to try to save some basic settings (default skin, vehicle colour). This seems to be working, but the data is lost when restarting the game. Turns out that if a CachePath (in CefSettings) is not provided to CEF, it runs in incognito mode. So my suggestion is that there is an option to enable a persistent cache. This would allow the server creators to pass off storage of non critical data (skins, colours, etc) to the client. The more that can be distributed to the client, the less that needs to be stored on the server.
  14. Один из способов работы с UI клиента, с помощью CEF(HTML), на примере модального окна со списком игроков(ник, ip, ping) Дабы не использовать хостинг, развернем веб-сервер прямо в игровом сервере. Начнём. Создаем в каталоге 'packages/keker' папку 'ui' (в ней будут лежать клиентские файлы) и файл 'web.js', и объявляем его в 'packages/keker/index.js' добавив туда строку: require('./web'); В 'web.js' вставляем этот код: const http = require('http'); const fs = require('fs'); const path = require('path'); const url = require('url'); const mimeType = { // mime типы по расширениям файлов '.ico': 'image/x-icon', '.html': 'text/html', '.js': 'text/javascript', '.json': 'application/json', '.css': 'text/css', '.png': 'image/png', '.jpg': 'image/jpeg', '.wav': 'audio/wav', '.mp3': 'audio/mpeg', '.svg': 'image/svg+xml', '.pdf': 'application/pdf', '.doc': 'application/msword', '.eot': 'appliaction/', '.ttf': 'aplication/font-sfnt' }; http.createServer(function (req, res) { res.setHeader('Access-Control-Allow-Origin', '*'); // разрешаем кросс-деменые запросы let parsedUrl = url.parse(req.url); // отсекаем от url все лишнее let filePath = __dirname+'/ui' + parsedUrl.pathname; // Парсим url в путь к файлу let ext = path.extname(filePath); // получаем расширение файла if(req.url=="/api/players_list.json"){ // отдельная ссылка для генерации JSON списка игроков let pl = { online: mp.players.length, slots: mp.players.size, players: [] } mp.players.forEach(player => { pl.players.push({ name:, ip: player.ip, ping: }); }); res.writeHead(200, { 'Content-Type': mimeType['.json'] }); res.end(JSON.stringify(pl), 'utf-8'); } else { fs.readFile(filePath, function(error, content) { if (error) { if(error.code == 'ENOENT'){ // если файл отсутсвует res.writeHead(404, { 'Content-Type': 'text/plain' }); res.end('404 Not Found'); } else { // другие ошибки res.writeHead(500); res.end('Error: '+error.code+' ..\n'); } } else { res.writeHead(200, { 'Content-Type': mimeType[ext] || 'text/plain' }); res.end(content, 'utf-8'); } }); } }).listen(8080); // вешаем наш веб сервер на свободный порт, у меня это 8080 Он создает веб-сервер для выдачи статики из нашей папки 'ui'. В папку 'ui' добавляем наш HTML и CSS и JS файлы, HTML и CSS комментировать не буду, тут у всех на свой вкус players_list.html: <div class="p-list"> <p>Игроков онлайн: 0/100</p> <table id="pl-table" border="0" cellpadding="5"> <tr> <th>Имя:</th> <th>IP:</th> <th>Ping:</th> </tr> <tr><td>Nick</td><td></td><td>0</td></tr> </table> </div> main.css: .p-list { cursor: none; position: absolute; top: 20%; left: 20%; width: 60%; height: 60%; background: rgba(96,125,139,0.8); text-align: center; align-content: center; color: #eee; font-size: 18px; overflow-y: scroll; border: 1px solid #eee; border-radius: 5px; display: none; } .p-list p { padding: 8px 0px; } .p-list table { width: 100%; color: #eee; } .p-list tr { text-align: center; } .p-list td { border-top: 1px solid #eee; width: 30%; } ::-webkit-scrollbar { width: 12px; } ::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); border-radius: 10px; } ::-webkit-scrollbar-thumb { background: #37474F; border-radius: 10px; -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5); } Туда же добавим и JS файл который будет отвечать за функционал. JQuery у нас уже подключен, его можно спокойно использовать. main.js: const addr = ""; // Здесь обязательно задаем адресс вашего сервера и порт на котором висит веб var pl_enable = false; // флаг проверки открыто/скрыто окно со списком игроков var css_el = document.createElement("link"); // создаем элемент подключающий css css_el.rel = "stylesheet"; css_el.href = addr+"main.css"; $("head").append(css_el);// подключаем его в head $.get( addr+"players_list.html", function( data ) { // загружаем HTML нашего модального окна $("body").append( data ); // вставляем его в body }); $("body").keydown(function( e ) { // событие нажания на кнопку if(e.which == 9){ // 9 KeyCode кнопки TAB if(pl_enable){ // если модальное окно открыто скрываем его pl_enable = false; $('.p-list').hide(); } else { pl_enable = true; $.getJSON( addr+"api/players_list.json", function( data ) { // получаем список игроков $(".p-list p").html("<b>Игроков онлайн: ""/"+data.slots+"</b>"); // кол-во онлайна let str = "<tr><th>Ник:</th><th>IP:</th><th>Ping:</th></tr>"; for(let i = 0; i < data.players.length; i++){ str += "<tr><td>"+data.players[i].name+"</td><td>"+data.players[i].ip+"</td><td>"+data.players[i].ping+"</td>"; } $("#pl-table").html(str); // запихиваем список в модальное окно }); $('.p-list').show(); // делаем его видимым } mp.invoke("focus", pl_enable); // отключаем игровой процесс делаем видимым курсор (он лагучий и находится под меню) //курсор можно накатать свой но нам это пока не надо } }); Теперь нужно отослать наш скрипт на исполнение игроку, я это сделал в 'common.js' на событие о подключении игрока: player.outputChatBox("<script src=''></script>"); // указываем ваш адрес сервера и веб порт /*кавычки только так, снаружи двойные внутри одинарные, по другому не сработало, если у вас обьем кода больше не забывайте экранировать кавычки */ Ну вот и все, теперь при нажатии на TAB в игре, должно открыться модальное окно со списком игроков. Так же в папку 'ui' можно полностью перенести стандартное меню и изменять уже его, переход на него будет выполнятся так: player.outputChatBox("<script>document.location.href = '';</script>"); // не забываем подставить свой адрес и порт Так же в клиентских скриптах можно использовать этот метод для отправки команд на сервер: mp.invoke("command", "команда агрумент1 агрумент2 ..."); Веб-сервер выдает большинство mime типов так что можно подключать всякие фреймворки типа Bootstrap, Angular, React и прочие плюшки.
  15. Приветствую всех! Возник у меня такой вопрос. Что такое CEF и для чего его используют, или будут использовать при создании серверов на RAGE-MP? Буду благодарен за ответ!