From dda9cf2fe2c9137526413f3cb6cf81fc8569107f Mon Sep 17 00:00:00 2001 From: Dave Smith-Hayes Date: Sat, 24 Feb 2024 22:54:16 -0500 Subject: [PATCH] Startinga basic frontend application. --- frontend/build.ts | 4 ++-- frontend/public/index.html | 2 +- frontend/public/js/index.js | 36 +++++++++++++++++++++++++---- frontend/src/components/UserList.ts | 19 ++++++++------- frontend/src/index.ts | 4 +--- 5 files changed, 47 insertions(+), 18 deletions(-) diff --git a/frontend/build.ts b/frontend/build.ts index ec4bcf5..b77e8ee 100644 --- a/frontend/build.ts +++ b/frontend/build.ts @@ -1,4 +1,4 @@ await Bun.build({ - entrypoints: [ './src/index.ts' ], - outdir: './public/js' + entrypoints: [ './src/index.ts' ], + outdir: './public/js' }); diff --git a/frontend/public/index.html b/frontend/public/index.html index 8c68dd2..48f8b60 100644 --- a/frontend/public/index.html +++ b/frontend/public/index.html @@ -4,6 +4,6 @@ Slovocast - + diff --git a/frontend/public/js/index.js b/frontend/public/js/index.js index 744a1da..13cfe09 100644 --- a/frontend/public/js/index.js +++ b/frontend/public/js/index.js @@ -1923,12 +1923,40 @@ var require_mithril = __commonJS((exports, module) => { }); // src/index.ts +var import_mithril2 = __toESM(require_mithril(), 1); + +// src/components/UserList.ts var import_mithril = __toESM(require_mithril(), 1); + +// src/models/User.ts +class User { + username; + constructor(username) { + this.username = username; + } + getUsername() { + return this.username; + } +} + +// src/components/UserList.ts +var users = [ + new User("U1"), + new User("U2"), + new User("U3") +]; +var oninit = function() { +}; +var view = function() { + return import_mithril.default(".UserList", import_mithril.default("ul", users.map((u) => import_mithril.default("li", u.getUsername())))); +}; +var UserList = { oninit, view }; +var UserList_default = UserList; + +// src/index.ts var App = { view: function() { - return import_mithril.default("body", [ - import_mithril.default("div", "Hello!") - ]); + return import_mithril2.default("body", [UserList_default]); } }; -import_mithril.default.mount(document.body, App); +import_mithril2.default.mount(document.body, App); diff --git a/frontend/src/components/UserList.ts b/frontend/src/components/UserList.ts index b46a122..0585cfb 100644 --- a/frontend/src/components/UserList.ts +++ b/frontend/src/components/UserList.ts @@ -7,12 +7,15 @@ const users: User[] = [ new User('U3') ]; -export default const UserList = { - getList: function () { - return users.map(u => m('li', u.getUsername())); - }, - - view: function () { - return m('li', { id: 'UserList' }, this.getList()); - } +const oninit = function () { + // get the users value }; + +const view = function () { + return m('.UserList', + m('ul', users.map(u => m('li', u.getUsername()))) + ); +} + +const UserList = { oninit, view }; +export default UserList; diff --git a/frontend/src/index.ts b/frontend/src/index.ts index 0d9f724..5571e95 100644 --- a/frontend/src/index.ts +++ b/frontend/src/index.ts @@ -3,9 +3,7 @@ import UserList from './components/UserList'; const App = { view: function() { - return m('body', [ - UserList - ]); + return m('body', [ UserList ]); } }