mstar/linstrom
1
0
Fork 0
Code Issues 3 Pull requests Projects Releases Packages Wiki Activity Actions

sync

Browse source
This commit is contained in:
Melody Becker 2024-09-20 16:35:59 +02:00
parent c75acc48a2
commit 5dbf3d9af2
10 changed files with 114 additions and 66 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
frontend-reactive/app/components/note.hbs
View file

@ -1,14 +1,14 @@
<div class="note">
{{!-- TODO: figure out how to make the entire note clickable for opening with something like {{on "click" (fn this.openFullView)}} --}}
<Note::UserHeader
@displayname="{{@displayname}}"
@handle="@{{@username}}@{{@serverdomain}}"
@displayname="{{@note.displayname}}"
@handle="@{{@note.username}}@{{@note.server}}"
/>
<Note::Content @content="{{@content}}" />
<Note::Content @content="{{@note.content}}" />
<div class="note-timestamps-container">
<p class="note-timestamp" id="note-edited-timestamp">Edited: At some time in
the future</p>
<p class="note-timestamp" id="note-created-timestamp">Posted: Before the Big
Bang</p>
{{#if @note.editedAt}}
<p class="note-timestamp" id="note-edited-timestamp">Edited: {{moment-format @note.editedAt}}</p>
{{/if}}
<p class="note-timestamp" id="note-created-timestamp">Posted: {{moment-format @note.createdAt ""}}</p>
</div>
</div>

48
frontend-reactive/app/components/note.ts
View file

@ -1,26 +1,34 @@
import { action } from '@ember/object';
import Component from '@glimmer/component';
import { action } from "@ember/object";
import Component from "@glimmer/component";
export interface NoteSignature {
// The arguments accepted by the component
Args: {
isInTimeline: boolean;
};
// Any blocks yielded by the component
Blocks: {
default: [];
};
// The element to which `...attributes` is applied in the component template
Element: null;
// The arguments accepted by the component
Args: {
isInTimeline: boolean;
note: {
content: string;
server: string;
username: string;
displayname: string;
createdAt: number;
editedAt?: number;
};
};
// Any blocks yielded by the component
Blocks: {
default: [];
};
// The element to which `...attributes` is applied in the component template
Element: null;
}
export default class Note extends Component<NoteSignature> {
@action
openFullView() {
if (this.args.isInTimeline) {
alert("Would have opened note's own view");
} else {
console.log("Alread in note specific view, can't open it again");
}
}
@action
openFullView() {
if (this.args.isInTimeline) {
alert("Would have opened note's own view");
} else {
console.log("Alread in note specific view, can't open it again");
}
}
}

6
frontend-reactive/app/components/timeline.hbs
View file

@ -1,5 +1,3 @@
{{#each this.notes as |note|}}
<Note />
{{#each this.model.notes as |note|}}
<Note @isInTimeline="true" @content="{{note.content}}" @username="{{note.username}}" @serverdomain="{{note.server}}"/>
{{/each}}
<InfinityLoader />

14
frontend-reactive/app/router.ts
View file

@ -1,15 +1,11 @@
import EmberRouter from '@ember/routing/router';
import config from 'frontend-reactive/config/environment';
import EmberRouter from "@ember/routing/router";
import config from "frontend-reactive/config/environment";
export default class Router extends EmberRouter {
location = config.locationType;
rootURL = config.rootURL;
location = config.locationType;
rootURL = config.rootURL;
}
Router.map(function () {
this.route('about');
this.route('notes', function () {
this.route(':note_id');
});
this.route("about");
});

20
frontend-reactive/app/routes/application.ts
View file

@ -1,7 +1,19 @@
import Route from '@ember/routing/route';
import Route from "@ember/routing/route";
export default class ApplicationRoute extends Route {
model() {
console.log('root route loaded');
}
model() {
console.log("root route loaded");
return {
notes: [
{
displayname: "alice",
username: "bob",
server: "example.com",
content: "lorem ipsum",
createdAt: Date.now() - 360000,
editedAt: Date.now() - 60000,
},
],
};
}
}

3
frontend-reactive/app/routes/notes/:note-id.ts
View file

@ -1,3 +0,0 @@
import Route from '@ember/routing/route';
export default class Notes:noteIdRoute extends Route {}

13
frontend-reactive/app/templates/application.hbs
View file

@ -1,14 +1,11 @@
{{page-title "FrontendReactive"}}
{{outlet}}
{{#each @model.notes as |note|}}
<Note
@displayname="bob"
@username="alice"
@serverdomain="example.com"
@note={{note}}
@isInTimeline="false"
@content="Scuttle crack Jennys tea cup American Main lass Jolly Roger prow reef sails tackle ye Chain Shot. Cackle fruit topgallant draft bilge gangplank Jolly Roger ahoy holystone black jack aye. Mizzenmast stern warp Buccaneer Spanish Main Letter of Marque pink aft skysail grog blossom.
Crow's nest scuppers topgallant fore dance the hempen jig loot tack fluke squiffy flogging. Red ensign Letter of Marque poop deck scallywag chandler rutters sheet avast sloop to go on account. Spike loaded to the gunwalls prow smartly gabion heave down scallywag interloper chantey case shot.
Quarterdeck cackle fruit ballast lookout bounty jack trysail crow's nest hulk spyglass. Gabion gangplank long boat coffer ahoy wench parley American Main jack come about. Trysail code of conduct cable provost loaded to the gunwalls chase landlubber or just lubber gibbet gunwalls hempen halter."
/>
{{/each}}
<!--<Timeline />-->

23
frontend-reactive/ember-cli-build.js
View file

@ -1,16 +1,19 @@
'use strict';
"use strict";
const EmberApp = require('ember-cli/lib/broccoli/ember-app');
const EmberApp = require("ember-cli/lib/broccoli/ember-app");
module.exports = function (defaults) {
const app = new EmberApp(defaults, {
'ember-cli-babel': { enableTypeScriptTransform: true },
minifyCSS: {
options: { processImport: true },
},
const app = new EmberApp(defaults, {
"ember-cli-babel": { enableTypeScriptTransform: true },
minifyCSS: {
options: { processImport: true },
},
// Add options here
});
// Add options here
autoImport: {
watchDependencies: ["ember-moment"],
},
});
return app.toTree();
return app.toTree();
};

33
frontend-reactive/package-lock.json generated
View file

@ -8,6 +8,9 @@
"name": "frontend-reactive",
"version": "0.0.0",
"license": "EUPL-1.2",
"dependencies": {
"moment": "^2.30.1"
},
"devDependencies": {
"@babel/core": "^7.25.2",
"@ember/optional-features": "^2.1.0",
@ -65,6 +68,7 @@
"ember-infinity": "^3.0.0",
"ember-load-initializers": "^2.1.2",
"ember-modifier": "^4.2.0",
"ember-moment": "^10.0.1",
"ember-page-title": "^8.2.3",
"ember-qunit": "^8.1.0",
"ember-resolver": "^11.0.1",
@ -17313,6 +17317,27 @@
"rsvp": "^4.8.4"
}
},
"node_modules/ember-moment": {
"version": "10.0.1",
"resolved": "https://registry.npmjs.org/ember-moment/-/ember-moment-10.0.1.tgz",
"integrity": "sha512-Es5PaFBRF6djyb0zwmcCMqWjLhyKrCWs5Ug6iaZoKxDgEc8incVCTv3ED2Z4oCcNDY2gKTqXY5VTsP1J9hUPcg==",
"dev": true,
"dependencies": {
"@embroider/addon-shim": "^1.8.9"
},
"peerDependencies": {
"moment": "^2",
"moment-timezone": "^0.5.34"
},
"peerDependenciesMeta": {
"moment": {
"optional": true
},
"moment-timezone": {
"optional": true
}
}
},
"node_modules/ember-page-title": {
"version": "8.2.3",
"resolved": "https://registry.npmjs.org/ember-page-title/-/ember-page-title-8.2.3.tgz",
@ -23810,6 +23835,14 @@
"node": ">0.9"
}
},
"node_modules/moment": {
"version": "2.30.1",
"resolved": "https://registry.npmjs.org/moment/-/moment-2.30.1.tgz",
"integrity": "sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how==",
"engines": {
"node": "*"
}
},
"node_modules/morgan": {
"version": "1.10.0",
"resolved": "https://registry.npmjs.org/morgan/-/morgan-1.10.0.tgz",

4
frontend-reactive/package.json
View file

@ -82,6 +82,7 @@
"ember-infinity": "^3.0.0",
"ember-load-initializers": "^2.1.2",
"ember-modifier": "^4.2.0",
"ember-moment": "^10.0.1",
"ember-page-title": "^8.2.3",
"ember-qunit": "^8.1.0",
"ember-resolver": "^11.0.1",
@ -110,5 +111,8 @@
},
"ember": {
"edition": "octane"
},
"dependencies": {
"moment": "^2.30.1"
}
}