ToolKit JS -Download – Download ToolKit JS -Quellcodes

ToolKit JS

Andere Kategorien

1.0.0

Herunterladen

ToolkitV3

Okay, also habe ich Version 1 und Version 2 verworfen, einfach weil das ultimative Ziel hinter ToolKitMin darin besteht, eine Reihe von Tools anzubieten, nicht unbedingt ein Framework an sich, sondern eher eine Bibliothek. Sie können sich ToolKitMin als eine Bibliothek vorstellen, die die Entwicklung von Front-End-Anwendungen unterstützt. ToolKitMin ist ein leistungsstarkes Tool zum Erlernen für Anfänger, da es einige der folgenden Elemente enthält:

Komponenten
- Vereinfachte Template-Engine
- Bundesstaat(en)
Abfragen
- In Erinnerung
Dienste (auch bekannt als AJAX)
Speichercontroller
USW.

Hier ist ein Beispiel für einen Code ...

 var app = ToolKit ;
app . DOM . ready ( function ( ) {
  console . log ( app ) ;
  app . Session . set ( 'user_id' , { user_id : 1 } ) ;
  console . log ( app . Session . get ( 'user_id' ) ) ;

  // Query demo.
  var queryString = "age GTE 20" ;
  var queryCols = [ "age" , "name" ] ;
  var queryData = [ { "age" : "30" , "name" : "Jack" } , { "age" : "20" , "name" : "Jay" } , { "age" : "12" , "name" : "Stacy" } ] ;

  app . Query . setColumns ( queryCols ) ;
  app . Query . setTable ( queryData ) ;
  app . Query . select ( queryString ) ;

  app . Query . onComplete ( function ( records ) {
    console . log ( 'Complete query' ) ;
    console . log ( records ) ;
  } ) ;

  // AJAX demo.
  app . Service ( {
    url : window . location . href ,
    method : "GET" ,
    success : function ( data ) {
      console . log ( data ) ;
      app . Query . exe ( ) ;
    }
  } ) ;

  // Component demo.
  window . appState = {
    name : 'Will I Am'
  } ;

  var component = {
    name : 'demo' ,
    state : window . appState ,
    root : app . Utils . $one ( "body" ) ,
    template : '<h1><% data.name %></h1>' ,
    onStateChange : function ( ) {
      console . log ( "State changed!" ) ;
    } ,
    onRender : function ( ) {
      console . log ( "Rendered!" ) ;
    }
  } ;

  app . Component . registerComponent ( component ) ;

  app . Router . add ( / home / , function ( ) {
    console . log ( 'Home page.' ) ;
  } ) ;
  app . Router . add ( / about / , function ( ) {
    console . log ( 'About page' ) ;
  } ) ;
  app . Router . add ( function ( ) {
    console . log ( '404 Error?!' ) ;
  } ) ;
} ) ;

// Wait 2 seconds to see the component update.
setTimeout ( function ( ) {
  window . appState . name = "Will Smith" ;
} , 2000 ) ;

// Test the router.
setTimeout ( function ( ) {
  app . Router . navigate ( 'home' ) ;
} , 1000 ) ;

setTimeout ( function ( ) {
  app . Router . navigate ( 'about' ) ;
} , 2000 ) ;

setTimeout ( function ( ) {
  app . Router . navigate ( '404test' ) ;
} , 3000 ) ;

ToolKitMin ist, wie der Name vermuten lässt, eine Reihe von Tools, die zusammengestellt wurden. Nur viele der Tools wurden auf den Kern reduziert, um sicherzustellen, dass ToolKitMin-JS so leicht wie möglich bleibt und gleichzeitig viel bietet der Funktionalität.

Todo

Dokumentation aktualisieren und so weiter!

Merkmale

Service
Komponente
Dienstprogramme
Abfrage
Router
Template-Engine
Andere
- DOM
- Protokoll
- Sitzung
- Speichern

Service

Die Servicemethode ist einfach die Ajax-Implementierung von ToolKit.

Komponente

Dadurch wird eine Vorlage implementiert, die einige DHTML-Vorlagen über die Vorlagen-Engine verarbeitet. Außerdem verwaltet sie ihren eigenen Status, der wie im Beispiel außerhalb der Komponente manipuliert werden kann. Schließlich kann es seine eigenen Controller versenden, indem es die Eigenschaft/Funktion „onRender“ nutzt.

Dienstprogramme

Dies ist nur ein Namensraum für nützliche/einfache Methoden, nicht viel mehr.

Abfrage

Dadurch können Sie eine „Abfrage“ über ein Array von Objekten ausführen. Die Ausführung erfolgt mithilfe eines Rückrufs, um sicherzustellen, dass der Hauptausführungsthread niemals durch die Iteration über einen großen Datensatz blockiert wird.

Router

Ermöglicht die Verwendung unterschiedlicher URLs im Frontend und ermöglicht so eine SPA. Derzeit sind nur Hash-basierte URLs zulässig. URL-Änderungen werden standardmäßig nicht überwacht, d. h. der Benutzer versucht, zu einer anderen URL zu navigieren. Obwohl eine solche Funktion so simpel ist, dass ich glaube, dass es an der Entscheidung des/der Entwickler(s) liegen könnte, ob sie eine solche Funktion implementiert oder nicht, ist sie schließlich dazu gedacht, leichtgewichtig zu sein.