How to get Lua variables into an App?

Discussion in 'Programming' started by danielr, Aug 7, 2020.

  1. danielr

    danielr
    Expand Collapse

    Joined:
    Jan 6, 2014
    Messages:
    69
    Hello, I'm trying to make an app that tracks and shows driven distance for all spawned cars individually. So far I've managed to frankenstein together some lua/js from the information available here:

    The lua is working but I have trouble getting lua values into the app.js. I've tried a couple of methods from above but had no luck. Is there a simple way of getting the "distanceTotalkm " from lua into the app? Current files so far:
    separatedistancecounter.lua
    Code:
    local M = {}
    local distancem = 0
    local distanceTotalm = 0
    local distanceTotalkm = 0
    
    local function printDistance()
        print("Totalm: " .. distanceTotalm)
        print("Totalkm: " .. distanceTotalkm)
    end
    
    local function updateGFX(dt)
        distancem = electrics.values.wheelspeed * dt
        distanceTotalm = distancem + distanceTotalm
    end
    
    local function getVar()
        --return distanceTotalm
        print("returning: " .. distanceTotalm)
    end
    
    M.printDistance = printDistance
    M.updateGFX = updateGFX
    M.getVar = getVar
    
    
    return M
    
    app.js (removed the different methods that I've tried)
    Code:
    angular.module('beamng.apps').directive('distanceDisplay', ['bngApi', function (bngApi) {
        return {
            template:
            '<div>' +
            '    <input type="button" ng-click="startTracking()" value="Reset"></input><br>' +
            '<span style="font-size:1.3em; text-align:center; text-transform: capitalize;" > Total Metres: {{progress }}</span><br>' +
            '<span style="font-size:1.3em; text-align:center; text-transform: capitalize;" > Status: {{status}}</span>' +
            '</div>',
            replace: true,
            restrict: 'EA',
            link: function (scope, element, attrs) {
                'use strict';
           
                scope.progress = 0;
                scope.status = "Testing";
                           
                scope.startTracking = function(){
                    bngApi.activeObjectLua('extensions.separatedistancecounter.printDistance()');
                    bngApi.activeObjectLua('extensions.separatedistancecounter.getVar()');
                };
               
            }
        };
    }])
    
     
    #1 danielr, Aug 7, 2020
    Last edited: Aug 26, 2020
  2. danielr

    danielr
    Expand Collapse

    Joined:
    Jan 6, 2014
    Messages:
    69
    Got it working while trying things, anayzing and using some code of @Dummiesman Beam Regenerator app. This got me thinking how to update the numbers in the app as updateGFX(dt) might be overkill? I was thinking every second, is that better/more efficient in lua, js or no difference? I'm using scope.$on('streamsUpdate' atm, my plan is to make a leaderboard ui app that shows and sorts all cars and their total distance.

    Anyway here is the code so far. It tracks the metres of each vehicle individually (Not sure how clean and proper this all is as I'm a lua dummy):

    Lua:
    Code:
    local M = {}
    local distancem = 0
    local distanceTotalm = 0
    local distanceTotalkm = 0
    local state = {}
    
    
    local function onInit()
        print('onInit')
        print("Totalm: " .. distanceTotalm)
        state.progress = distanceTotalm
        guihooks.trigger('sendState', state)
    end
    
    local function updateGFX(dt)
        distancem = electrics.values.wheelspeed * dt
        distanceTotalm = distancem + distanceTotalm
    end
    
    local function getVar()
        state.progress = distanceTotalm
        guihooks.trigger('sendState', state)
        --return distanceTotalm
    end
    
    local function resetTracking()
        distanceTotalm = 0
        --guihooks.trigger('sendState', state)
    end
    
    M.onInit = onInit
    M.updateGFX = updateGFX
    M.getVar = getVar
    M.resetTracking = resetTracking
    
    
    return M
    Js:
    Code:
    angular.module('beamng.apps').directive('distanceDisplay', ['bngApi', function (bngApi) {
        return {
            template:
            '<div>' +
            '    <input type="button" ng-click="resetTracking()" value="Reset Distance"></input>' +
            '    <input type="button" ng-click="displayDistance()" value="Update Value"></input><br>' +
            '<span style="font-size:1.3em; text-align:center; text-transform: capitalize;" > Total Metres: {{progress}}</span><br>' +
            '</div>',
            replace: true,
            restrict: 'EA',
            link: function (scope, element, attrs) {
                'use strict';
               
                var state;
                scope.progress = 0;
               
                scope.resetTracking = function(){
                    bngApi.activeObjectLua('extensions.separatedistancecounter.resetTracking()');   
                };
               
                scope.displayDistance = function(){
                    bngApi.activeObjectLua('extensions.separatedistancecounter.getVar()');   
                };
    
                scope.$on('sendState', function (event, data) {
                    state = data;
                 
                    scope.progress = Math.trunc(data.progress);
                    scope.$apply();
                });   
               
                scope.$on('VehicleFocusChanged', function (event, data) {
                    bngApi.activeObjectLua('extensions.separatedistancecounter.getVar()');
                });
               
                scope.$on('streamsUpdate', function (event, streams) {
                    scope.$evalAsync(function () {
                        bngApi.activeObjectLua('extensions.separatedistancecounter.getVar()');
                    });
                });
    
            }
        };
    }])
    
     
    #2 danielr, Aug 26, 2020
    Last edited: Aug 26, 2020
    • Like Like x 1
  3. danielr

    danielr
    Expand Collapse

    Joined:
    Jan 6, 2014
    Messages:
    69
    More progress which I'm posting here if anyone searches for similar things. So far I have driven distance & estimate (km/mi) as well as fuel economy (l/100km & mpg).

    284160_20200827122330_1.png

    Lua:
    Code:
    local M = {}
    local distancem = 0
    local distanceTotalm = 0
    local distanceTotalkm = 0
    local state = {}
    
    local function onInit()
        distanceTotalm = 0
        --print('onInit')  
        --print("Totalm: " .. distanceTotalm)
        state.progress = distanceTotalm
        guihooks.trigger('sendState', state)
    end
    
    local function onReset()
        distanceTotalm = 0
        --print('onReset')
        --print("Totalm: " .. distanceTotalm)
        state.progress = distanceTotalm
        guihooks.trigger('sendState', state)
    end
    
    local function updateGFX(dt)
        distancem = electrics.values.wheelspeed * dt
        distanceTotalm = distancem + distanceTotalm
    end
    
    local function getVar()
        state.fuelPercent = electrics.values['fuel']
        state.fuelCap = electrics.values['fuelCapacity']
        state.fuelVol = electrics.values['fuelVolume']
        state.progress = distanceTotalm
        guihooks.trigger('sendState', state)
        --return distanceTotalm
    end
    
    M.onInit = onInit
    M.onReset = onReset
    M.updateGFX = updateGFX
    M.getVar = getVar
    
    return M
    
    JS:
    Code:
    angular.module('beamng.apps').directive('distanceDisplay', ['bngApi', function (bngApi) {
        return {
            templateUrl: "modules/apps/separatedistancecounter/endurance.html",
            replace: true,
            restrict: 'EA',
            link: function (scope, element, attrs) {
                'use strict';
               
                scope.$on('$destroy', function () {
                    StreamsManager.remove(streamsList);
                });
               
                var state;
                scope.progress = 0;
                scope.progress2 = 0;
                scope.progressEst = 0;
                scope.progress2Est = 0;
                scope.fuelPercent = 0;
                scope.fuelCap = 0;
                scope.fuelVol = 0;
                scope.fuelLperKM = 0;
                scope.fuelMperG = 0;
               
                scope.$on('sendState', function (event, data) {
                    state = data;
                 
                    scope.progress = Math.round((data.progress / 1000) * 100) / 100;
                    scope.progress2 = Math.round((data.progress / 1609.3440057765) * 100) / 100;
                    scope.progressEst = Math.round(((scope.fuelVol / scope.fuelLperKM) * 100) * 10) / 10;
                    scope.progressEst2 = Math.round((scope.progressEst / 1.6093440057765) * 10) / 10;
                   
                    scope.fuelPercent = Math.round((data.fuelPercent * 100) * 10) / 10;
                    scope.fuelCap = data.fuelCap;
                    scope.fuelVol = Math.round(data.fuelVol * 100) / 100;
                    scope.fuelLperKM = Math.round((((scope.fuelCap - scope.fuelVol) / scope.progress) * 100) * 10) / 10;
                    scope.fuelMperG = Math.round((235.214583 / scope.fuelLperKM) * 10) / 10;
                   
                    scope.$apply();
                });  
    
                scope.$on('streamsUpdate', function (event, streams) {
                    scope.$evalAsync(function () {
                        bngApi.activeObjectLua('extensions.separatedistancecounter.getVar()');
                    });
                });
               
            }
        };
    }])
    
     
    • Like Like x 1
  4. danielr

    danielr
    Expand Collapse

    Joined:
    Jan 6, 2014
    Messages:
    69
    Yay more progress, even managed to fit an rpm meter inside it. After many failed attempts making an app, this feels like a success ^^ also I've just uploaded the file so it'll be in the repository soon.

     
    • Like Like x 2
  5. ClassicMike

    ClassicMike
    Expand Collapse

    Joined:
    Jul 24, 2017
    Messages:
    608
    nice work! will defo give this a try
     
  6. danielr

    danielr
    Expand Collapse

    Joined:
    Jan 6, 2014
    Messages:
    69
    Thanks, I plan on adding more information, electric car support maybe and make sections hideable with buttons. Btw, here's a comparison video with the trip counter app demonstrating the individual tracking:
     
    #6 danielr, Sep 7, 2020
    Last edited: Sep 7, 2020
  1. This site uses cookies to help personalise content, tailor your experience and to keep you logged in if you register.
    By continuing to use this site, you are consenting to our use of cookies.
    Dismiss Notice