Widget Core Framework

Marko

Afrux Widget Framework

Installazione

Ricorda che questo è solo un editor di widget per forum, che al momento include 4 widget.

composer require afrux/forum-widgets-core:"*"

Ecco un elenco di widget attualmente compatibili che puoi installare:

Aggiornamento

composer update afrux/forum-widgets-core:"*"
php flarum migrate
php flarum cache:clear

Aggiungi il tuo widget al Framework

Sviluppatori di estensioni che desiderano creare widget con questo piccolo framework, possono leggere le seguenti spiegazioni per registrare un nuovo widget, ricordandosi che se ne può registrare solo uno per estensione.

Aggiungi la dipendenza obbligatoria del framework al file composer.json:

"require": {
  "flarum/core": "^1.0.0",
  "afrux/forum-widgets-core": "^0.1.0"
},

Crea il tuo componente nella cartella common/components estendendo il componente Widget del framework.

import Widget from 'flarum/extensions/afrux-forum-widgets-core/common/components/Widget';

export default class MyWidget extends Widget {
  className() {
    // Classe Css personalizzata.
    // O è possibile utilizzare la classe "AfruxWidgets-Widget--flat" per un widget non contenuto in un blocco.
    // Si prega di evitare uno stile personalizzato forte in modo che appaia coerente in altri temi.
    return 'MyWidget';
  }

  icon() {
    // Icona del Widget.
    return 'fas fa-cirlce';
  }

  title() {
    // Titolo del Widget.
    // Può essere vuoto per widget senza titolo
    return app.translator.trans('afrux-online-users-widget.forum.widget.title');
  }

  content() {
    return (
      <div className="Afrux-OnlineUsersWidget-users">
        // ...
      </div>
    );
  }
}

Registra il widget nel frontend di admin e forum:

Create un nuovo file registerWidget.js nella cartella common:

import Widgets from 'flarum/extensions/afrux-forum-widgets-core/common/extend/Widgets';

import MyWidget from './components/MyWidget';

export default function(app) {
  (new Widgets).add({
    key: 'onlineUsers',
    component: MyWidget,
    
    // Può essere una callback booleana.
    // example: () => app.forum.attribute('myCustomExtension.mySetting')
    isDisabled: false,
    
    // È un widget utilizzabile una sola volta? lascia su true se non sei sicuro.
    isUnique: true,
    
    // I seguenti valori sono valori predefiniti che possono essere modificati dall'amministratore.
    placement: 'end',
    position: 1,
  }).extend(app, 'my-extension-id');
};

Registra il widget nel frontend admin/index.js & forum/index.js:

import registerWidget from '../common/registerWidget';

app.initializers.add('my-extension-id', () => {
  registerWidget(app);
});

Se utilizzi typescript:

"flarum/extensions/afrux-forum-widgets-core/*": ["../vendor/afrux/forum-widgets-core/js/dist-typings/*"]

Puoi anche controllare altri widget di esempio nella repository Afrux su GitHub.