Hauptmenü

Werkzeuge

Kategorien

Archiv

IBAN mit Vanilla/JavaScript bei Eingabe formatieren

Erstellt in Allgemein am 16. März 2022 vom Daschmi

Mit folgendem Codeblock kann man die Eingabe auf dem Input Feld mit der id=“supplier_iban“ bei Eingabe nach ISO 13616-1 und EBS 204 formatieren.

let el_supplier_iban = document.getElementById('supplier_iban');
						
el_supplier_iban.addEventListener('input', (event) => {
    
    let v = event.target.value.toUpperCase().replace(/ /g, '');
    let r = '';

    for (let i = 0; i < v.length; i ++) {
        
        r += v[i];
        
        if ((i + 1) % 4 === 0 && i > 0) r += ' ';
        
        
    }
    
    event.target.value = r.trim();
    
});

el_supplier_iban.dispatchEvent(new Event('input'));

Beispiel:

Siehe auch:

IBAN Validieren

Reiter „AIOSEO – Settings“ vom Plugin „All in One SEO“ bei bestimmten CustomPost Types ausblenden

Erstellt in Wordpress am 17. Februar 2022 vom Daschmi

Mit folgendem Hook der Action „add_meta_boxes“ kann der Reiter „AIOSEO – Settings“ des SEO Plugins „All in One SEO“ bei bestimmten Beitragstypen ausgeblendet werden.

Action registrieren z.B. in der functions.php des WordPress Themes:

#functions.php

\add_action('add_meta_boxes', ['ns\Actions', 'add_meta_boxes'], 100);

Dann in der geladenen Klasse

#Actions.class.php

abstract class Actions {

  public static function add_meta_boxes(): void {

    \remove_meta_box('aioseo-settings', ['protektor-quote', 'protektor-partner'], 'normal');

  }

}

Zugriff auf Kamera in einer Electron/HTML5 Anwendung unter MacOS

Erstellt in Allgemein am 22. Januar 2022 vom Daschmi

Damit man z.b. die Pakete webcamjs unter MacOS nutzen kann, muss die App die Berechtigungen für die Kamera abfragen. Dies geschieht über die entitlements.mac.plist.

Diese Datei muss wie folgt gefüllt werden

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
  <dict>
    <key>com.apple.security.device.camera</key>
    <true/> 
  </dict>
</plist>

Damit die Datei verwendet wird, muss in der package.json der Pfad definiert werden

..
"mac": {
    "hardenedRuntime": false,
    "entitlements": "entitlements.mac.plist",
    "extendInfo": {
        "LSMinimumSystemVersion": "10.12.6",
        "NSCameraUsageDescription": "Please give access to your webcam",
        "NSAppTransportSecurity": {
            "NSAllowsArbitraryLoads": true
        }
    }
}
..

Dann sollte die mit electron-builder gebaute App die Kameraberechtigung beim Start abfragen.

Kommunikation in einer Electron Anwendung mit Systemfunktionen

Erstellt in Allgemein am 14. Januar 2022 vom Daschmi

Um in einer Electron Anwendung auf Systembefehler wie für Netzwerk etc. zugreifen zu können muss man mit dem Eventsystem und dem icpRenderer arbeiten.

Von der HTML5 Oberfläche -> Systemschicht

/* preload.js */

const ipcRenderer = require('electron').ipcRenderer;

window.ipcRenderer = ipcRenderer;
/* app.vue */

window.ipcRenderer.invoke('scan_ip', {
    target: '127.0.0.1',
    port: this.port
});
/* main.js */
ipcMain.handle('scan_ip', (evt, arg) => {
  
  ...

});

Von der Systemschicht -> HTML5 Oberfläche

/* main.js */

mainWindow.webContents.send('network-event', arg);
/* src/index.js */
window.ipcRenderer.on('store-data', (event, store) => {

  ...

});

Element in den Viewport eines Containers scrollen

Erstellt in Javascript am 12. Januar 2022 vom Daschmi

Mit folgender Funktion kann man einen Container so scrollen, das dass ausgewählte Element innerhalb des Containers sichtbar wird. Ich habe das ganze für Autocomplete Elemente genutzt.

let el_container = document.getElementById('container'); 
let e_element = document.getElementById('selected');

el_container.scrollTo({
    top: e_element.getBoundingClientRect().top - el_container.getBoundingClientRect().top + el_container.scrollTop
});

JSFiddle