2021-01-02 13:10:00 -05:00
< html >
< head >
< meta content = "width=device-width,initial-scale=1,minimal-ui" name = "viewport" >
< link rel = "stylesheet" href = "//fonts.googleapis.com/css?family=Roboto:400,500,700,400italic|Material+Icons" >
< link href = "https://fonts.googleapis.com/icon?family=Material+Icons" rel = "stylesheet" >
< link rel = "stylesheet" href = "https://unpkg.com/vue-material/dist/vue-material.min.css" >
< link rel = "stylesheet" href = "https://unpkg.com/vue-material/dist/theme/default-dark.css" >
< script src = "https://cdn.jsdelivr.net/npm/vue/dist/vue.js" > < / script >
< 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-01-02 13:10:00 -05:00
< script src = "https://cdnjs.cloudflare.com/ajax/libs/commonmark/0.29.1/commonmark.min.js" > < / script >
< / 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 17:19:52 -05:00
< md-chip v-if = "share_app" md-deletable @ md-delete = "share_app = null" >
{{share_app}}: {{apps[share_app]}}
< / 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-01-13 21:45:52 -05:00
< md-menu-item v-for = "app in Object.keys(apps)" v-bind:key = "app" @ click = "share_app = 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 >
2021-01-11 21:23:57 -05: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" > < / tf-message >
2021-01-02 13:10:00 -05:00
< / md-app-content >
< / md-app >
< / div >
< / body >
< / html >
