2021-01-02 13:10:00 -05:00
< html >
< head >
< meta content = "width=device-width,initial-scale=1,minimal-ui" name = "viewport" >
2021-12-22 08:51:49 -05:00
< link rel = "stylesheet" href = "roboto.css" >
< link rel = "stylesheet" href = "material-icons.css" >
< link rel = "stylesheet" href = "vue-material.min.css" >
< link rel = "stylesheet" href = "vue-material-theme-default-dark.css" >
< script src = "vue.js" > < / script >
2021-01-02 13:10:00 -05:00
< script src = "vue-material.js" > < / script >
2021-01-13 21:56:14 -05:00
< script src = "tf-user.js" > < / script >
< script src = "tf-message.js" > < / script >
2021-01-13 21:59:11 -05:00
< script src = "tf.js" > < / script >
2021-12-22 08:51:49 -05:00
< script src = "commonmark.min.js" > < / script >
2021-01-02 13:10:00 -05:00
< / head >
< body style = "color: #fff" >
< div id = "app" >
< md-dialog :md-active . sync = "show_connect_dialog" >
< md-dialog-title > Connect< / md-dialog-title >
< md-dialog-content >
< md-field >
< label > net:127.0.0.1:8008~shs:id< / label >
< md-input v-model = "connect" > < / md-input >
< / md-field >
< / md-dialog-content >
< md-dialog-actions >
< md-button class = "md-primary" @ click = "ssb_connect(connect); connect = null; show_connect_dialog = false" > Connect< / md-button >
< md-button @ click = "connect = null; show_connect_dialog = false" > Cancel< / md-button >
< / md-dialog-actions >
< / md-dialog >
< md-app style = "position: absolute; height: 100%; width: 100%" >
< md-app-toolbar class = "md-primary" >
< span class = "md-title" > Tilde Friends Secure Scuttlebutt Test< / span >
< / md-app-toolbar >
2021-12-28 15:21:23 -05:00
< md-app-drawer md-permanent = "full" >
2021-01-02 13:10:00 -05:00
< md-list >
2021-12-28 15:21:23 -05:00
< md-subheader > Broadcasts< / md-subheader >
2021-01-02 13:10:00 -05:00
< md-list-item v-for = "broadcast in broadcasts" v-bind:key = "JSON.stringify(broadcast)" @ click = "ssb_connect(broadcast)" > {{broadcast.address}}:{{broadcast.port}} < tf-user :id = "broadcast.pubkey" > < / tf-user > < / md-list-item >
< md-subheader > Connections< / md-subheader >
< md-list-item v-for = "connection in connections" v-bind:key = "'connection-' + JSON.stringify(connection)" > < tf-user :id = "connection" > < / tf-user > < / md-list-item >
< md-list-item @ click = "show_connect_dialog = true" > Connect< / md-list-item >
2021-12-28 15:21:23 -05:00
< md-subheader > Users< / md-subheader >
2022-01-06 20:52:47 -05:00
<!-- <md - list - item v - for="user in Object.keys(users).sort((x, y) => (users[x].name || x).localeCompare(users[y].name || y))" v - bind:key="'user - ' + user"><tf - user v - bind:id="user"/></md - list - item> -->
2021-01-02 13:10:00 -05:00
< / md-list >
< / md-app-drawer >
2021-12-29 09:57:10 -05:00
< md-app-toolbar class = "md-secondary" v-show = "unread > 0" >
< md-button @ click = "refresh()" class = "md-raised md-primary" > Refresh< / md-button >
< span class = "md-title" > {{unread}} unread item{{unread == 1 ? '' : 's'}}< / span >
< / md-app-toolbar >
2021-01-02 13:10:00 -05:00
< md-app-content >
Welcome, < tf-user :id = "whoami" > < / tf-user > .
< md-card class = "md-elevation-8" >
< md-card-header >
< div class = "md-title" > What's up?< / div >
< / md-card-header >
< md-card-content >
2021-12-31 14:01:53 -05:00
< md-chip v-if = "reply_root || reply_branch" md-deletable @ md-delete = "reply_root = null; reply_branch = null" > Replying in thread {{reply_root}} to message {{reply_branch}}< / md-chip >
2021-12-31 10:12:46 -05:00
< md-chip v-for = "link in Object.keys(mentions)" v-bind:key = "link" md-deletable @ md-delete = "remove_from_mentions(link)" >
{{mentions[link].name}}: {{link}}
2021-01-09 17:19:52 -05:00
< / md-chip >
2021-01-02 13:10:00 -05:00
< md-field >
< label > Post a message< / label >
< md-textarea id = "post_text" > < / md-textarea >
< / md-field >
< / md-card-content >
< md-card-actions >
2021-01-09 17:19:52 -05:00
< md-menu >
< md-button md-menu-trigger > Share App< / md-button >
< md-menu-content >
2021-12-31 10:12:46 -05:00
< md-menu-item v-for = "app in Object.keys(apps)" v-bind:key = "app" @ click = "add_app_to_mentions(app)" >
2021-01-09 17:19:52 -05:00
{{app}}
< / md-menu-item >
< / md-menu-content >
< / md-menu >
2021-01-02 13:10:00 -05:00
< md-button class = "md-raised md-primary" v-on:click = "post_message()" > Submit Post< / md-button >
< / md-card-actions >
< / md-card >
2022-01-06 20:52:47 -05:00
< template v-if = "messages.length" >
< tf-message
v-for="message in messages"
v-bind:message="message"
v-bind:messages="messages"
v-bind:key="message.id"
v-bind:votes="votes">< / tf-message >
< / template >
< md-empty-state v-else-if = "loading" md-label = "Loading..." >
< md-progress-spinner md-mode = "indeterminate" > < / md-progress-spinner >
< / md-empty-state >
< md-empty-state v-else md-label = "Nothing to see here." > < / md-empty-state >
2021-01-02 13:10:00 -05:00
< / md-app-content >
< / md-app >
< / div >
< / body >
< / html >
