File tree Expand file tree Collapse file tree 5 files changed +152
-0
lines changed Expand file tree Collapse file tree 5 files changed +152
-0
lines changed Original file line number Diff line number Diff line change
1
+ < html >
2
+ < head >
3
+ < meta charset ="UTF-8 ">
4
+ < title > Notes</ title >
5
+ < link href ="styles.css " rel ="stylesheet ">
6
+ </ head >
7
+ < body >
8
+ < div class ="notes ">
9
+ < h2 > Notes</ h2 >
10
+ < div class ="new-note ">
11
+ < input placeholder ="Your note " />
12
+ < button onclick ="addNote() "> add</ button >
13
+ </ div >
14
+ < ul id ="notes "> </ ul >
15
+ </ div >
16
+
17
+ < templates >
18
+ < ul name ="note ">
19
+ < li class ="note ">
20
+ < h4 > Note 1</ h4 >
21
+ < p > Content</ p >
22
+ </ li >
23
+ </ ul >
24
+ </ templates >
25
+ </ body >
26
+ < script src ="notes.js "> </ script >
27
+ </ html >
Original file line number Diff line number Diff line change
1
+ const elNotes = document . querySelector ( '#notes' ) ;
2
+ const elNoteTemplate = document . querySelector ( 'templates ul[name="note"] li' ) ;
3
+
4
+ function renderNote ( note ) {
5
+ const el = elNoteTemplate . cloneNode ( true ) ;
6
+ el . querySelector ( 'h4' ) . innerText = 'Note #' + note . id ;
7
+ el . querySelector ( 'p' ) . innerText = note . content ;
8
+ return el ;
9
+ }
10
+
11
+ async function addNote ( ) {
12
+ const inpEl = document . querySelector ( '.new-note input' ) ;
13
+ const content = inpEl . value ;
14
+ const resp = await fetch ( '/notes/' , {
15
+ method : "POST" ,
16
+ body : content
17
+ } ) ;
18
+ const note = await resp . json ( ) ;
19
+ inpEl . value = '' ;
20
+ console . log ( note ) ;
21
+ elNotes . prepend ( renderNote ( note ) ) ;
22
+ }
23
+
24
+ async function getNotes ( ) {
25
+ const resp = await fetch ( "/notes" ) ;
26
+ const notes = await resp . json ( ) ;
27
+ elNotes . innerHTML = '' ;
28
+ for ( const note of notes ) {
29
+ elNotes . prepend ( renderNote ( note ) ) ;
30
+ }
31
+ }
32
+
33
+ getNotes ( ) ;
Original file line number Diff line number Diff line change
1
+ templates {
2
+ display : none;
3
+ }
4
+
5
+ # notes {
6
+ list-style-type : none;
7
+ padding : 0 ;
8
+ }
9
+ .note {
10
+ margin : 0 ;
11
+ padding : 0rem 0.3rem ;
12
+ }
13
+ .note h4 {
14
+ margin : 0 ;
15
+ }
16
+ .note p {
17
+ color : # 333 ;
18
+ margin-top : 0 ;
19
+ }
20
+
21
+ .new-note {
22
+ margin-bottom : 2rem ;
23
+ }
24
+ .new-note input {
25
+ width : 15rem ;
26
+ padding : 0.3rem ;
27
+ }
28
+ .new-note button {
29
+ padding : 0.3rem 1rem ;
30
+ background-color : # 4caf50 ;
31
+ color : # fff ;
32
+ border : none;
33
+ cursor : pointer;
34
+ font-size : 1rem ;
35
+ }
Original file line number Diff line number Diff line change
1
+ use std, jdbc, server
2
+
3
+ // curl -X POST http://localhost:8084/notes/ -d "New note 2"
4
+
5
+ conn = getConnection("jdbc:sqlite::memory:")
6
+ st = conn.createStatement()
7
+ st.executeUpdate("CREATE TABLE IF NOT EXISTS notes(id integer primary key, content string)")
8
+ stAddNote = conn.prepareStatement("INSERT INTO notes(content) VALUES(?)", RETURN_GENERATED_KEYS)
9
+ stGetNote = conn.prepareStatement("SELECT id, content FROM notes WHERE id = ?")
10
+
11
+ createNote("This is your first note.")
12
+
13
+ def getNotes() {
14
+ notes = []
15
+ rs = st.executeQuery("SELECT id, content FROM notes")
16
+ while (rs.next()) {
17
+ notes += {"id": rs.getInt(1), "content": rs.getString(2)}
18
+ }
19
+ rs.close()
20
+ return notes
21
+ }
22
+
23
+ def createNote(content) {
24
+ stAddNote.setString(1, content)
25
+ stAddNote.executeUpdate()
26
+ rs = stAddNote.getGeneratedKeys()
27
+ rs.next()
28
+ return {"id": rs.getLong(1) ?? -1, "content": content}
29
+ }
30
+
31
+ newServer({"dev": true, "externalDirs": ["notes_public"]})
32
+ .get("/notes", def(ctx) = ctx.json( getNotes() ))
33
+ .post("/notes", def(ctx) {
34
+ ctx.status(201)
35
+ ctx.json( createNote(ctx.body()) )
36
+ })
37
+ .start(8084)
Original file line number Diff line number Diff line change
1
+ use std, jdbc, server
2
+
3
+ // curl -X POST http://localhost:8084/notes/ -d "New note 2"
4
+
5
+ notes = []
6
+ createNote("This is your first note.")
7
+
8
+ def createNote(content) {
9
+ note = {"id": notes.length + 1, "content": content};
10
+ notes += note
11
+ return note
12
+ }
13
+
14
+ newServer({"externalDirs": ["notes_public"]})
15
+ .get("/notes", def(ctx) = ctx.json(notes))
16
+ .post("/notes", def(ctx) {
17
+ ctx.status(201)
18
+ ctx.json( createNote(ctx.body()) )
19
+ })
20
+ .start(8084)
You can’t perform that action at this time.
0 commit comments