1<!DOCTYPE html> 2<html lang="en"> 3 <head> 4 <title>BrainWeb</title> 5 6 <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous"> 7 <link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900|Material+Icons" rel="stylesheet" type="text/css"> 8 <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/quasar.min.css" rel="stylesheet" type="text/css"> 9 <link href="https://cdn.jsdelivr.net/npm/animate.css@^3.5.2/animate.min.css" rel="stylesheet"> 10 <link rel="shortcut icon" type="image/x-icon" href="./favicon.ico" /> 11 <link href="https://fonts.googleapis.com/css?family=Raleway:100,300,400,500,900" rel="stylesheet"> 12 <link rel="stylesheet" type="text/css" href="/css/main.css"> 13 <link rel="stylesheet" type="text/css" href="./community.css"> 14 </head> 15 16 <body> 17 <div id="firebaseui-auth-container" class="auth-dialog"></div> 18 19 <!-- navigation bar --> 20 <!-- currently, the fixed top class is added, so it sticks to the top --> 21 <!-- data value of nav bar corresponds to id in each section --> 22 <nav class="navbar navbar-expand-lg fixed-top "> 23 24 <a class="navbar-brand" href="/" > 25 <div class="logo_brainweb"> 26 <p style="padding-left:4em;color:white;cursor:pointer;font-size:14px;font-weight:300;line-height:2.7;vertical-align: middle;">BrainWeb</p> 27 </div> 28 </a> 29 30 <button 31 class="navbar-toggler landing-page myCollapsedMenuBarIcon" 32 id="myMenuBtn" 33 type="button" 34 data-toggle="collapse" 35 data-target="#myMenu" 36 aria-controls="myMenu" 37 aria-expanded="false" 38 aria-label="Toggle navigation" 39 style="padding:0;border:none; width:1.5em;height:1.5em;" 40 onclick="this.blur();" 41 ></button> 42 43 <div class="collapse navbar-collapse" id="myMenu" style="width:100%;"> 44 <ul class="navbar-nav mr-4" > 45 <li class="nav-item"> 46 <a class="nav-link" href="/">BrainWeb</a> 47 </li> 48 <li class="nav-item"> 49 <a class="nav-link" href="/#events">Events</a> 50 </li> 51 <li class="nav-item"> 52 <a class="nav-link" href="/series/">Series</a> 53 </li> 54 <li class="nav-item"> 55 <a class="nav-link" href="/projects/">Projects</a> 56 </li> 57 <li class="nav-item"> 58 <a class="nav-link" href="/community/">Community</a> 59 </li> 60 <li class="nav-item"> 61 <a class="nav-link" href="/videoconference/">Videoconference</a> 62 </li> 63 <li class="nav-item"> 64 <span class="nav-link" id="loginStatus" style="border-bottom:none"> 65 Sign In 66 </span> 67 </li> 68 <li class="nav-item" id="userAvatar"> 69 <img class="userIcon"/> 70 </li> 71 </ul> 72 </div> 73 </nav> 74 75 <!-- main --> 76 <div id="q-app"> 77 <!-- part 4 Community --> 78 <div id="community"> 79 80 <div id="search-field"> 81 <q-select 82 rounded outlined 83 label="Find skills" 84 color="white" 85 v-model="searchItems" 86 use-input 87 use-chips 88 multiple 89 hide-dropdown-icon 90 input-debounce="0" 91 new-value-mode="add-unique" 92 :options="searchOptions" 93 @filter="searchFn" 94 @input="searchAdd" 95 > 96 <!-- <q-icon name="search" @click.stop style="font-size: 24px; height: inherit"/> --> 97 </q-select> 98 </div> 99 100 <!-- network --> 101 <div id="network"></div> 102 103 <!-- spinner --> 104 <q-spinner-ball 105 color="white" 106 size="4em" 107 v-if="spinning" 108 style="position:absolute;top:50%;left:50%;transform: translate( -50%, -50%);z-index:1000" 109 ></q-spinner-ball> 110 111 <div class="container" style="margin-top: 1em"> 112 113 <!-- text --> 114 <div id="text"> 115 <h1>Community</h1> 116 <p> 117 This is the BrainWeb. If you just logged in, your name should be an isolated dot flying 118 around. Find it, click on it, and add your skills. That will start creating links with 119 others, and you'll become part of the cluster of people sharing similar skills. You can 120 learn more about them by clicking on their dots. 121 </p> 122 </div> 123 124 <!-- skills card --> 125 <div v-cloak class="row"> 126 <!-- other person's card --> 127 <div v-if="cardUID !== uid"> 128 <q-dialog v-model="displayCard"> 129 <q-card style="height:400px;width:400px"> 130 <q-card-section> 131 <q-chip> 132 <q-avatar round size="48px"> 133 <img :src="cardImgSrc" /> 134 </q-avatar> 135 <a v-cloak class="col text-h6" :href="cardGitHubURL"> 136 {{cardDisplayName}} 137 </a> 138 </q-chip> 139 </q-card-section> 140 <q-card-section style="background: hsla(0,0%,100%,0.07);border-radius:4px 4px 0 0;margin:16px"> 141 <q-chip v-cloak color="dark" v-for="skill in cardSkills"> 142 {{skill}} 143 </q-chip> 144 </q-card-section> 145 </q-card> 146 </q-dialog> 147 </div> 148 149 <!-- logged person's card --> 150 <div v-else> 151 <q-dialog v-model="displayCard" @hide="updateUser"> 152 <q-card style="height:400px;width:400px"> 153 <q-card-section> 154 <q-chip> 155 <q-avatar round size="48px"> 156 <img :src="`https://avatars3.githubusercontent.com/u/${uid}?v=4`" /> 157 </q-avatar> 158 <a v-cloak class="col text-h6" :href="`https://github.com/${userGitHubName}`"> 159 {{userDisplayName}} 160 </a> 161 </q-chip> 162 </q-card-section> 163 <q-card-section> 164 <q-select 165 label="Skills" 166 filled 167 v-model="people[people.map((o)=>o.uid).indexOf(uid)].skills" 168 use-input 169 use-chips 170 multiple 171 hide-dropdown-icon 172 input-debounce="0" 173 new-value-mode="add-unique" 174 :options="skills" 175 @filter="filterFn" 176 @new-value="createValue" 177 ></q-select> 178 </q-card-section> 179 </q-card> 180 </q-dialog> 181 </div> 182 </div> 183 184 </div> 185 </div> 186 </div> 187 188 <!-- sentry --> 189
189<script src="/js/sentry.min.js" data-lazy="no"></script>
189 190 191 <!-- Vue and Quasar --> 192
192<script src="https://cdn.jsdelivr.net/npm/vue@^2.0.0/dist/vue.min.js"></script>
192 193
193<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/quasar.umd.min.js"></script>
193 194
194<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/icon-set/svg-material-icons.umd.min.js"></script>
194 195 196 <!-- Firebase --> 197
197<script defer src="https://www.gstatic.com/firebasejs/ui/4.5.0/firebase-ui-auth.js"></script>
197 198 <link type="text/css" rel="stylesheet" href="https://www.gstatic.com/firebasejs/ui/4.5.0/firebase-ui-auth.css" /> 199
199<script defer src="https://www.gstatic.com/firebasejs/7.12.0/firebase-app.js"></script>
199 200
200<script defer src="https://www.gstatic.com/firebasejs/7.12.0/firebase-auth.js"></script>
200 201
201<script defer src="https://www.gstatic.com/firebasejs/7.12.0/firebase-database.js"></script>
201 202
202<script defer src="/js/init-firebase.js"></script>
202 203 204 <!-- D3 and BrainWeb graph --> 205
205<script src="https://d3js.org/d3.v5.min.js"></script>
205 206 207
207<script type="module"> 208 import * as BW from "./brainweb.js"; 209 210 const circleSkill = null; 211 const filterSkills = null; 212 // const filterSkills = [ "graph theory", "Network Neuroscience", "multiplex", "Multilayer", 213 // "Networkx", "Complex networks", "Network theory", 214 // "Circuit dynamics", "Systems neuroscience"]; 215 // if(circleSkill) { 216 // filterSkills.push(circleSkill); 217 // } 218 219 BW.init({ 220 appSel: "#q-app", 221 networkSel: "#network", 222 circleName: "BrainWeb", 223 circleSkill, 224 filterSkills 225 }); 226 </script>
226 227 228 <!-- Global site tag (gtag.js) - Google Analytics -->
vendor: 70 bytes, lines 228-229
228 229 <script async src="https://www.googletagmanager.com/gtag/js?id=
229UA-138729622-3
vendor: 18 bytes, lines 229-230
229"></script> 230
230<script> 231
vendor: 151 bytes, lines 231-234
231window.dataLayer = window.dataLayer || []; 232 function gtag(){dataLayer.push(arguments);} 233 gtag('js', new Date()); 234 gtag('config', '
234UA-138729622-3
vendor: 10 bytes, lines 234-235
234'); 235
235</script>
235 236 237 </body> 238</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.