Klärung von AdpaterEntwicklungs Fragen

Peoples

habe das Löschen hinbekommen: https://github.com/peoples0815/iobroker.viewswitch/blob/master/main.js#L245

Und bastel jetzt mal an der Admin Oberfläche weiter bis die nächste Frage kommt und die kommt bestimmt.

Ich finde es jedenfalls klasse wie Ihr hier unterstützt!

AlCalzone

@Peoples Kleiner Tipp noch - dieses Konstrukt macht nicht wirklich Sinn:

async function deleteVisObjects(arr){
    adapter.getStates('Views'+ '.*', async function (err, states) {

In deleteVisObjects nutzt du kein await, daher muss sie nicht als async definiert werden. Allerdings könntest du auch gleich die async-Variante von getStates nutzen:

async function deleteVisObjects(arr){
    try {
        const states = await adapter.getStatesAsync('Views'+ '.*');
        for (const idS in states) {
            // ...
        }
    } catch (err) {
        // Fehler behandeln oder loggen oder...
    }
}

Peoples

@AlCalzone
Danke für den Tipp genau so mach ich das

Peoples

So, ich versuche nun die Admin-Oberfläche mit Leben zu befüllen und komme wie erwartet nicht weiter.

Ich möchte die Lokale Iobroker-Strucktur des Vis Ordners auslesen, um die Projekte in einem Select oder ähnlichem aufzulisten. Nur wie ich das angehe ist mir nicht klar.

In der main.js kann ich mit:

 var fs = require("fs");
        var dirPath        = '/opt/iobroker/iobroker-data/files/vis.0/';
        var viewsJsonFile  = '/vis-views.json'

        function generateProjectList(dirPath, viewsJsonFile){
            var text = '';
            fs.readdir(dirPath, (err, files) => { 
                if(err){
                        console.log('Cannot parse views file "' + dirPath + file + 'vis-views.json"');
                        window.alert('Cannot parse views file "' + dirPath + file + 'vis-views.json');
                } else { 
                        files.forEach(file => { 
                            var isDirExists = fs.existsSync(dirPath + file) && fs.lstatSync(dirPath + file).isDirectory();
                            if(isDirExists === true){
                                if(fs.existsSync(dirPath + file + viewsJsonFile)){
                                        
                                            text += '<option value="Wandtablet" class="translate">'+file+'</option>';
                                }
                            }
                        })
                       // $('#select_projects').html(text); 
                } 
            }) 
            adapter.log.info('funktioniert!'+dirPath+viewsJsonFile);
        }

Die Projekte auflisten, aber das geht in der index_m.html so natürlich nicht weil es (soweit ich gelesen habe) require("fs") aus Sicherheitsgründen nicht gibt.

Wie kann ich nun die Datei einlesen?

Kann ich vielleicht in der main.js den Auslesevorgang machen und die Werte irgendwie in eine adapter.config.variable schreiben?

OliverIO

@Peoples

Hier hatte ich dir schon einmal geschrieben wie vis an die Daten kommt. Den Code kannst du doch direkt benützen Bzw. etwas adaptieren
https://forum.iobroker.net/topic/37589/vorhandene-vis-projekte-bzw-vis-views-auslesen/6

Peoples

@OliverIO
Da fehlts halt ein wenig am können weil ich bekomme das einfach nicht zum laufen.

Mir ist schon garnicht klar was ich da mit angeben muss dass ich nicht immer folgenden Fehler bekomme.

Uncaught TypeError: Cannot read property 'readProjects' of undefined

OliverIO

@Peoples
Und wie hast du das jetzt aufgerufen, das die Fehlermeldung erzeugt wird.

OliverIO

@Peoples
Im Zweifel kann man im Browser einen breakpoint setzen und dann mal schauen was vis da genau macht
Wenn mal den im chrome öffnete eröffnet sich eine komplett neue Welt
https://developers.google.com/web/tools/chrome-devtools

Peoples

Also, ich habe nun einiges versucht und auch mit den Developer Tools rumprobiert, konnte auch folgende funktion finden:

readDir:          function (dirname, callback) {
        //socket.io
        if (this._socket === null) {
            console.log('socket.io not initialized');
            return;
        }
        if (!dirname) dirname = '/';
        var parts = dirname.split('/');
        var adapter = parts[1];
        parts.splice(0, 2);

        this._socket.emit('readDir', adapter, parts.join('/'), {filter: true}, function (err, data) {
            if (callback) callback(err, data);
        });
    },

und

 readProjects:     function (callback) {
        var that = this;
        this.readDir('/' + this.namespace, function (err, dirs) {
            var result = [];
            var count = 0;
            for (var d = 0; d < dirs.length; d++) {
                if (dirs[d].isDir) {
                    count++;
                    that._detectViews(dirs[d].file, function (subErr, project) {
                        if (project) result.push(project);

                        err = err || subErr;
                        if (!(--count)) callback(err, result);
                    });
                }
            }
        });
    },

Ich habe wirklich viel gegooglet begreife es aber nicht.
Ich habe verstanden dass ich fs.readdir nicht nutzen kann da require('fs') clientseitig anscheinend nicht funktioniert.

Aber wie funktioniert dann this.readDir? https://github.com/ioBroker/ioBroker.vis/blob/a3d4ae6139ee5e20253a1257136f7fe0e7a635f0/www/js/conn.js#L1288

Erklärung zu this:
this ist ein Verweis auf das Objekt, das die aktuelle Javascript-Funktion aufgerufen hat. ... Bei jedem Aufruf der Funktion wird dieses Argument - sozusagen hinter den Kulissen - zusammen mit einem Zeiger auf das Objekt, das die Funktion aufrief, übergeben.

Ich verstehe nur Bahnhof
Kann ich die funktion oben nun irgendwie umschreiben dass ich sie nutzen kann oder geht das nicht.

Fakt ist, wenn ich hier nicht weiter komme bzw das begreife, wird das auch nix mit dem Adapter

OliverIO

@Peoples

Vis (client) fragt den Server und dort funktioniert fs

OliverIO

@Peoples
Hast du dir mal die Funktionen angeschaut auf die ich schon mal verwiesen habe?
Ich denke mit deinem aktuellen Lösungsweg bist du auf der falschen fährte
Welches Problem willst du aktuell nochmal lösen? Projekte oder views auflisten?

simatec

@Peoples
schaue mal hier ... Bei schoolfree lese ich so die "locations.json" aus und fülle damit dann die Config

Peoples

@OliverIO
Ja ich habe das schon angeschaut, aber komme da nicht weiter. Ich möchte im enddefekt so wie im vorherigen Post bei readProjects die Projekte Ordner / Projekte auslesen um diese dann in dein dropdown zu packen.

In der main.js ist das überhaupt kein Problem aber in der index_m.html finde ich keine Möglichkeit.

Hier fehlt es mir schlicht und ergreiffend an Wissen.

OliverIO

@Peoples
Wenn du einen Breakpoint in readprojects setzt und im edit Modus neu ladest, dann landest du in dieser Funktion und kannst schauen welche Parameter du übergeben musst und welches Ergebnis sie zurück liefert

Peoples

Nach ewigem probieren, bin ich so weit:

function loadProjects() {
  return new Promise(resolve => {
    socket.emit('getState', 'viewswitch.0.existingProjects' , function (err, state) {
        if (state && state.val) {
          var projects = state.val.split(',');
          var text = '<option value="undefined" class="translate">Platzhalter</option>';
          if(projects.length){
                for (var d = 0; d < (projects.length -1); d++) {
                text +='<option value="'+ projects[d] +'" class="translate">'+ projects[d] +'</option>';
                }
          resolve(text);
          } 
        }
    });
  });
}

  loadProjects().then(result => alert(result));

ausgegeben wird mir dann folgendes:

<option value="undefined" class="translate">Platzhalter</option>
<option value="Wandtablet" class="translate">Wandtablet</option>
<option value="main" class="translate">main</option>

Nun möchte ich natürlich ein in der Admin-Oberfläche vorhandenes Select mit diesen Daten befüllen. Wenn ich es so mache:

let visProjects = '<option value="undefined" class="translate">Platzhalter</option>';
            visProjects += '<option value="Wandtablet" class="translate">Wandtablet</option>';
            visProjects += '<option value="main" class="translate">main</option>';
            $('#visProjects').html(visProjects);

funktioniert das bestens.
Aber wenn ich versuche die Daten meiner Funktion mit:

loadProjects().then(result => $('#select_projects').html(result));

versuche funktioniert das nicht.

Leider hört die von mir gefundene Doku auch bei admin.html auf, und ich habe auch sonst nichts gefunden das ein wenig den Aufbau bzw. die Richtlinien der index_m.html erklärt.

Kann mir einer sagen warum die Ausgabe meiner Funktion keine Füllung des Selects bewirkt?

OliverIO

@Peoples

darf ich fragen wo dein code lebt? auf dem server oder auf dem client?

Peoples

@OliverIO
klar Oliver, die steht in der index.m.html und sollte somit im client abgearbeitet werden. (Denke ich :-))

AlCalzone

@Peoples sagte in Klärung von AdpaterEntwicklungs Fragen:

Kann mir einer sagen warum die Ausgabe meiner Funktion keine Füllung des Selects bewirkt?

Findet der Selektor denn das richtige Element?
$('#select_projects') heißt ja anders als im Code obendrüber.

Wird der then-Callback aufgerufen? --> Log oder Breakpoint einfügen. resolve wird ja nur aufgerufen wenn projects.length > 0 ist.

Steht in result was drin? --> Log oder Breakpoint einfügen, und Inhalt checken.

@Peoples sagte in Klärung von AdpaterEntwicklungs Fragen:

ich habe auch sonst nichts gefunden das ein wenig den Aufbau bzw. die Richtlinien der index_m.html erklärt.

Gibts nicht. Du kannst die frei gestalten, das ist einfach HTML, CSS und JS mit jQuery. Designtechnisch sollte es aber material-design sein.

Peoples

@AlCalzone sagte in Klärung von AdpaterEntwicklungs Fragen:

@Peoples sagte in Klärung von AdpaterEntwicklungs Fragen:

Kann mir einer sagen warum die Ausgabe meiner Funktion keine Füllung des Selects bewirkt?

Findet der Selektor denn das richtige Element?
$('#select_projects') heißt ja anders als im Code obendrüber.

Wird der then-Callback aufgerufen? --> Log oder Breakpoint einfügen. resolve wird ja nur aufgerufen wenn projects.length > 0 ist.

Steht in result was drin? --> Log oder Breakpoint einfügen, und Inhalt checken.

Ich bin grad nicht zu Hause schaue aber später. Sollte aber so sein, den alert zeigt ja folgendes an:
<option value="undefined" class="translate">Platzhalter</option>
<option value="Wandtablet" class="translate">Wandtablet</option>
<option value="main" class="translate">main</option>

OliverIO

@Peoples

was @AlCalzone meinte ist:
In deinem Versuch der funktioniert verwendest du den selektor #visProjects
und im richtigen Besipiel welches nicht funktioniert verwendest du den selektor #select_projects

NEWS

Klärung von AdpaterEntwicklungs Fragen

Support us

907
Online

31.9k
Users

80.2k
Topics

1.3m
Posts

NEWS

Klärung von AdpaterEntwicklungs Fragen

Support us

907Online

31.9kUsers

80.2kTopics

1.3mPosts

907
Online

31.9k
Users

80.2k
Topics

1.3m
Posts