2021-01-02 18:10:00 +00:00
< html >
< head >
< meta content = "width=device-width,initial-scale=1,minimal-ui" name = "viewport" >
2021-12-22 13:51:49 +00: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 18:10:00 +00:00
< script src = "vue-material.js" > < / script >
2021-01-14 02:56:14 +00:00
< script src = "tf-user.js" > < / script >
< script src = "tf-message.js" > < / script >
2021-01-14 02:59:11 +00:00
< script src = "tf.js" > < / script >
2021-12-22 13:51:49 +00:00
< script src = "commonmark.min.js" > < / script >
2021-01-02 18:10:00 +00: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" >
< md-button class = "md-icon-button" @ click = "showUsers = !showUsers" >
< md-icon > menu< / md-icon >
< / md-button >
< span class = "md-title" > Tilde Friends Secure Scuttlebutt Test< / span >
< / md-app-toolbar >
< md-app-drawer :md-active . sync = "showUsers" md-persistent = "full" >
< md-list >
< md-subheader > Network< / md-subheader >
< 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 >
< / md-list >
< / md-app-drawer >
< md-app-content >
< md-button @ click = "refresh()" class = "md-icon-button md-dense md-raised md-primary" >
< md-icon > cached< / md-icon >
< / md-button >
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-01-09 22:19:52 +00:00
< md-chip v-if = "share_app" md-deletable @ md-delete = "share_app = null" >
{{share_app}}: {{apps[share_app]}}
< / md-chip >
2021-01-02 18:10:00 +00: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 22:19:52 +00:00
< md-menu >
< md-button md-menu-trigger > Share App< / md-button >
< md-menu-content >
2021-01-14 02:45:52 +00:00
< md-menu-item v-for = "app in Object.keys(apps)" v-bind:key = "app" @ click = "share_app = app" >
2021-01-09 22:19:52 +00:00
{{app}}
< / md-menu-item >
< / md-menu-content >
< / md-menu >
2021-01-02 18:10:00 +00:00
< md-button class = "md-raised md-primary" v-on:click = "post_message()" > Submit Post< / md-button >
< / md-card-actions >
< / md-card >
2021-01-20 02:20:40 +00:00
< tf-message
v-for="message in messages"
v-if="!content_json(message).root || !messages.some(m => m.id == content_json(message).root)"
v-bind:message="message"
v-bind:messages="messages"
v-bind:key="message.id"
v-bind:votes="votes">< / tf-message >
2021-01-02 18:10:00 +00:00
< / md-app-content >
< / md-app >
< / div >
< / body >
< / html >
