Front-end stuff

Signed-off-by: Thomas Citharel <tcit@tcit.fr>

js/.env.dist

@@ -0,0 +1,3 @@
+API_HOST=event.tcit.fr
+API_ORIGIN=https://event.tcit.fr
+API_PATH=/api/v1

js/.gitignore

@@ -22,3 +22,5 @@ yarn-error.log*
 *.njsproj
 *.sln
 *.sw*
+
+.env

js/package-lock.json

@@ -4449,6 +4449,21 @@
         "is-obj": "^1.0.0"
       }
     },
+    "dotenv": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-5.0.1.tgz",
+      "integrity": "sha512-4As8uPrjfwb7VXC+WnLCbXK7y+Ueb2B3zgNCePYfhxS1PYeaO1YTeplffTEcbfLhvFNGLAz90VvJs9yomG7bow==",
+      "dev": true
+    },
+    "dotenv-webpack": {
+      "version": "1.5.5",
+      "resolved": "https://registry.npmjs.org/dotenv-webpack/-/dotenv-webpack-1.5.5.tgz",
+      "integrity": "sha1-NEEJTwTTBLYRnmtyUk5i+zJS9fI=",
+      "dev": true,
+      "requires": {
+        "dotenv": "^5.0.1"
+      }
+    },
     "duplexify": {
       "version": "3.6.0",
       "resolved": "https://registry.npmjs.org/duplexify/-/duplexify-3.6.0.tgz",

js/package.json

@@ -23,6 +23,7 @@
     "vuex-i18n": "^1.10.5"
   },
   "devDependencies": {
+    "dotenv-webpack": "^1.5.5",
     "@vue/cli-plugin-babel": "^3.0.0-beta.10",
     "@vue/cli-plugin-e2e-nightwatch": "^3.0.0-beta.10",
     "@vue/cli-plugin-eslint": "^3.0.0-beta.10",

js/src/App.vue

@@ -61,7 +61,7 @@
       <v-icon>add</v-icon>
     </v-btn>
     <v-footer class="indigo" app>
-      <span class="white--text">© Thomas Citharel {{ new Date().getFullYear() }} - Made with <a href="https://api-platform.com/">API Platform</a> & <a href="https://vuejs.org/">VueJS</a> & <a href="https://www.vuetifyjs.com/">Vuetify</a> with some love and some weeks</span>
+      <span class="white--text">© Thomas Citharel {{ new Date().getFullYear() }} - Made with Elixir, Phoenix & <a href="https://vuejs.org/">VueJS</a> & <a href="https://www.vuetifyjs.com/">Vuetify</a> with some love and some weeks</span>
     </v-footer>
     <v-snackbar
       :timeout="error.timeout"

js/src/api/_entrypoint.js

@@ -1,2 +1,3 @@
-export const API_HOST = 'http://0.0.0.0:4000';
+export const API_HOST = process.env.API_HOST;
-export const API_PATH = '/api';
+export const API_ORIGIN = process.env.API_ORIGIN;
+export const API_PATH = process.env.API_PATH;

js/src/api/eventFetch.js

@@ -1,4 +1,4 @@
-import { API_HOST, API_PATH } from './_entrypoint';
+import { API_ORIGIN, API_PATH } from './_entrypoint';
 
 const jsonLdMimeType = 'application/json';
 
@@ -19,7 +19,7 @@ export default function eventFetch(url, store, optionsarg = {}) {
     options.headers.set('Authorization', `Bearer ${localStorage.getItem('token')}`);
   }
 
-  const link = url.includes(API_PATH) ? API_HOST + url : API_HOST + API_PATH + url;
+  const link = url.includes(API_PATH) ? API_ORIGIN + url : API_ORIGIN + API_PATH + url;
 
   return fetch(link, options).then((response) => {
     if (response.ok) return response;

js/src/auth/index.js

@@ -1,10 +1,10 @@
-import { API_HOST, API_PATH } from '../api/_entrypoint';
+import { API_ORIGIN, API_PATH } from '../api/_entrypoint';
 
 // URL and endpoint constants
-const LOGIN_URL = `${API_HOST}${API_PATH}/login`;
+const LOGIN_URL = `${API_ORIGIN}${API_PATH}/login`;
-const SIGNUP_URL = `${API_HOST}${API_PATH}/users/`;
+const SIGNUP_URL = `${API_ORIGIN}${API_PATH}/users/`;
-const CHECK_AUTH = `${API_HOST}${API_PATH}/user/`;
+const CHECK_AUTH = `${API_ORIGIN}${API_PATH}/user/`;
-const REFRESH_TOKEN = `${API_HOST}${API_PATH}/token/refresh`;
+const REFRESH_TOKEN = `${API_ORIGIN}${API_PATH}/token/refresh`;
 
 export default {
 

js/src/components/Account/Account.vue

@@ -10,7 +10,7 @@
                 <v-icon>chevron_left</v-icon>
               </v-btn>
               <v-spacer></v-spacer>
-              <v-btn icon class="mr-3" v-if="$store.state.user && $store.state.user.account.id === account.id">
+              <v-btn icon class="mr-3" v-if="$store.state.user && $store.state.user.actor.id === actor.id">
                 <v-icon>edit</v-icon>
               </v-btn>
               <v-btn icon>
@@ -33,9 +33,9 @@
             <v-container fluid grid-list-lg>
               <v-layout row>
                 <v-flex xs7>
-                  <div class="headline">{{ account.display_name }}</div>
+                  <div class="headline">{{ actor.display_name }}</div>
-                  <div><span class="subheading">@{{ account.username }}</span><span v-if="account.server">@{{ account.server.address }}</span></div>
+                  <div><span class="subheading">@{{ actor.username }}</span><span v-if="actor.server">@{{ actor.server.address }}</span></div>
-                  <v-card-text v-if="account.description" v-html="account.description"></v-card-text>
+                  <v-card-text v-if="actor.description" v-html="actor.description"></v-card-text>
                 </v-flex>
               </v-layout>
             </v-container>
@@ -74,10 +74,10 @@
             </v-list-tile-content>
           </v-list-tile>
         </v-list>
-        <v-container fluid grid-list-md v-if="account.participatingEvents && account.participatingEvents.length > 0">
+        <v-container fluid grid-list-md v-if="actor.participatingEvents && actor.participatingEvents.length > 0">
           <v-subheader>Participated at</v-subheader>
           <v-layout row wrap>
-            <v-flex v-for="event in account.participatingEvents" :key="event.id">
+            <v-flex v-for="event in actor.participatingEvents" :key="event.id">
               <v-card>
                 <v-card-media
                   class="black--text"
@@ -115,10 +115,10 @@
             </v-flex>
           </v-layout>
         </v-container>
-        <v-container fluid grid-list-md v-if="account.organizingEvents && account.organizingEvents.length > 0">
+        <v-container fluid grid-list-md v-if="actor.organizingEvents && actor.organizingEvents.length > 0">
           <v-subheader>Organized events</v-subheader>
           <v-layout row wrap>
-            <v-flex v-for="event in account.organizingEvents" :key="event.id">
+            <v-flex v-for="event in actor.organizingEvents" :key="event.id">
               <v-card>
                 <v-card-media
                   class="black--text"
@@ -169,11 +169,16 @@ export default {
   name: 'Account',
   data() {
     return {
-      account: null,
+        actor: null,
-      loading: true,
+        loading: true,
     }
   },
-  props: ['id'],
+  props: {
+      name: {
+          type: String,
+          required: true,
+      }
+  },
   mounted() {
     this.fetchData();
   },
@@ -183,12 +188,12 @@ export default {
   },
   methods: {
     fetchData() {
-      eventFetch(`/accounts/${this.id}`, this.$store)
+      eventFetch(`/actors/${this.name}`, this.$store)
         .then(response => response.json())
         .then((response) => {
-          this.account = response.data;
+          this.actor = response.data;
           this.loading = false;
-          console.log(this.account);
+          console.log(this.actor);
         })
     }
   }

js/src/components/Event/Create.vue

@@ -1,195 +1,201 @@
 <template>
-  <v-container fluid grid-list-md>
+  <v-container fluid grid-list-sm>
     <h3>Create a new event</h3>
     <v-form>
-      <v-stepper v-model="e1" vertical>
+      <v-stepper v-model="e1">
-        <v-stepper-step step="1" :complete="e1 > 1">Basic Informations
+        <v-stepper-header>
-        <small>Title and description</small>
+          <v-stepper-step step="1" :complete="e1 > 1" editable>Basic Informations
-        </v-stepper-step>
+            <small>Title and description</small>
-        <v-stepper-content step="1">
+          </v-stepper-step>
-          <v-layout row wrap>
+          <v-divider></v-divider>
-            <v-flex xs12>
+          <v-stepper-step step="2" :complete="e1 > 2" editable>Date and place</v-stepper-step>
-          <v-text-field
+          <v-divider></v-divider>
-            label="Title"
+          <v-stepper-step step="3" :complete="e1 > 3">Extra informations</v-stepper-step>
-            v-model="event.title"
+        </v-stepper-header>
-            :counter="100"
+        <v-stepper-items>
-            required
+          <v-stepper-content step="1">
-          ></v-text-field>
+            <v-layout row wrap>
-            </v-flex>
+              <v-flex xs12>
-          <v-flex md6>
             <v-text-field
-              label="Description"
+              label="Title"
-              v-model="event.description"
+              v-model="event.title"
-              multiLine
+              :counter="100"
               required
             ></v-text-field>
-          </v-flex>
+              </v-flex>
-          <v-flex md6>
-            <vue-markdown class="markdown-render"
-              :watches="['show','html','breaks','linkify','emoji','typographer','toc']"
-              :source="event.description"
-              :show="true" :html="false" :breaks="true" :linkify="true"
-              :emoji="true" :typographer="true" :toc="false"
-            ></vue-markdown>
-          </v-flex>
-            <v-flex md12>
-              <v-select
-                v-bind:items="categories"
-                v-model="event.category"
-                item-text="title"
-                item-value="@id"
-                label="Categories"
-                single-line
-                bottom
-              ></v-select>
-            </v-flex>
-            <v-flex md12>
-              <!--<v-text-field
-                v-model="tagsToSend"
-                label="Tags"
-              ></v-text-field>-->
-              <v-select
-                v-model="tagsToSend"
-                label="Tags"
-                chips
-                tags
-                :items="tagsFetched"
-              ></v-select>
-            </v-flex>
-          </v-layout>
-          <v-btn color="primary" @click.native="e1 = 2">Next</v-btn>
-        </v-stepper-content>
-        <v-stepper-step step="2" :complete="e1 > 2">Date and place</v-stepper-step>
-        <v-stepper-content step="2">
-          Event starts at:
-          <v-text-field type="datetime-local" v-model="event.begins_on"></v-text-field>
-          <!--<v-layout row wrap>
             <v-flex md6>
-              <v-dialog
+              <v-text-field
-                persistent
+                label="Description"
-                v-model="modals.beginning.date"
+                v-model="event.description"
-                lazy
+                multiLine
-                full-width
+                required
-              >
+              ></v-text-field>
-                <v-text-field
-                  slot="activator"
-                  label="Beginning of the event date"
-                  v-model="event.startDate.date"
-                  prepend-icon="event"
-                  readonly
-                ></v-text-field>
-                <v-date-picker v-model="event.startDate.date" scrollable dateFormat="val => new Date(val).">
-                  <template scope="{ save, cancel }">
-                    <v-card-actions>
-                      <v-btn flat primary @click.native="cancel()">Cancel</v-btn>
-                      <v-btn flat primary @click.native="save()">Save</v-btn>
-                    </v-card-actions>
-                  </template>
-                </v-date-picker>
-              </v-dialog>
             </v-flex>
             <v-flex md6>
-              <v-dialog
+              <vue-markdown class="markdown-render"
-                persistent
+                :watches="['show','html','breaks','linkify','emoji','typographer','toc']"
-                v-model="modals.beginning.time"
+                :source="event.description"
-                lazy
+                :show="true" :html="false" :breaks="true" :linkify="true"
-              >
+                :emoji="true" :typographer="true" :toc="false"
-                <v-text-field
+              ></vue-markdown>
-                  slot="activator"
-                  label="Beginning of the event time"
-                  v-model="event.startDate.time"
-                  prepend-icon="access_time"
-                  readonly
-                ></v-text-field>
-                <v-time-picker v-model="event.startDate.time" actions format="24h">
-                  <template scope="{ save, cancel }">
-                    <v-card-actions>
-                      <v-btn flat primary @click.native="cancel()">Cancel</v-btn>
-                      <v-btn flat primary @click.native="save()">Save</v-btn>
-                    </v-card-actions>
-                  </template>
-                </v-time-picker>
-              </v-dialog>
             </v-flex>
-          </v-layout>-->
+              <v-flex md12>
-          Event ends at:
+                <v-select
-          <v-text-field type="datetime-local" v-model="event.ends_on"></v-text-field>
+                  v-bind:items="categories"
-          <!--<v-layout row wrap>
+                  v-model="event.category"
-            <v-flex md6>
+                  item-text="title"
-              <v-dialog
+                  item-value="@id"
-                persistent
+                  label="Categories"
-                v-model="modals.end.date"
+                  single-line
-                lazy
+                  bottom
-                full-width
+                ></v-select>
-              >
+              </v-flex>
-                <v-text-field
+              <v-flex md12>
-                  slot="activator"
+                <!--<v-text-field
-                  label="End of the event date"
+                  v-model="tagsToSend"
-                  v-model="event.endDate.date"
+                  label="Tags"
-                  prepend-icon="event"
+                ></v-text-field>-->
-                  readonly
+                <v-select
-                ></v-text-field>
+                  v-model="tagsToSend"
-                <v-date-picker v-model="event.endDate.date" scrollable >
+                  label="Tags"
-                  <template scope="{ save, cancel }">
+                  chips
-                    <v-card-actions>
+                  tags
-                      <v-btn flat primary @click.native="cancel()">Cancel</v-btn>
+                  :items="tagsFetched"
-                      <v-btn flat primary @click.native="save()">Save</v-btn>
+                ></v-select>
-                    </v-card-actions>
+              </v-flex>
-                  </template>
+            </v-layout>
-                </v-date-picker>
+            <v-btn color="primary" @click.native="e1 = 2">Next</v-btn>
-              </v-dialog>
+          </v-stepper-content>
-            </v-flex>
+          <v-stepper-content step="2">
-            <v-flex md6>
+            Event starts at:
-              <v-dialog
+            <v-text-field type="datetime-local" v-model="event.begins_on"></v-text-field>
-                persistent
+            <!--<v-layout row wrap>
-                v-model="modals.end.time"
+              <v-flex md6>
-                lazy
+                <v-dialog
-              >
+                  persistent
-                <v-text-field
+                  v-model="modals.beginning.date"
-                  slot="activator"
+                  lazy
-                  label="End of the event time"
+                  full-width
-                  v-model="event.endDate.time"
+                >
-                  prepend-icon="access_time"
+                  <v-text-field
-                  readonly
+                    slot="activator"
-                ></v-text-field>
+                    label="Beginning of the event date"
-                <v-time-picker v-model="event.endDate.time" format="24h" actions >
+                    v-model="event.startDate.date"
-                  <template scope="{ save, cancel }">
+                    prepend-icon="event"
-                    <v-card-actions>
+                    readonly
-                      <v-btn flat primary @click.native="cancel()">Cancel</v-btn>
+                  ></v-text-field>
-                      <v-btn flat primary @click.native="save()">Save</v-btn>
+                  <v-date-picker v-model="event.startDate.date" scrollable dateFormat="val => new Date(val).">
-                    </v-card-actions>
+                    <template scope="{ save, cancel }">
-                  </template>
+                      <v-card-actions>
-                </v-time-picker>
+                        <v-btn flat primary @click.native="cancel()">Cancel</v-btn>
-              </v-dialog>
+                        <v-btn flat primary @click.native="save()">Save</v-btn>
-            </v-flex>
+                      </v-card-actions>
-          </v-layout>-->
+                    </template>
+                  </v-date-picker>
+                </v-dialog>
+              </v-flex>
+              <v-flex md6>
+                <v-dialog
+                  persistent
+                  v-model="modals.beginning.time"
+                  lazy
+                >
+                  <v-text-field
+                    slot="activator"
+                    label="Beginning of the event time"
+                    v-model="event.startDate.time"
+                    prepend-icon="access_time"
+                    readonly
+                  ></v-text-field>
+                  <v-time-picker v-model="event.startDate.time" actions format="24h">
+                    <template scope="{ save, cancel }">
+                      <v-card-actions>
+                        <v-btn flat primary @click.native="cancel()">Cancel</v-btn>
+                        <v-btn flat primary @click.native="save()">Save</v-btn>
+                      </v-card-actions>
+                    </template>
+                  </v-time-picker>
+                </v-dialog>
+              </v-flex>
+            </v-layout>-->
+            Event ends at:
+            <v-text-field type="datetime-local" v-model="event.ends_on"></v-text-field>
+            <!--<v-layout row wrap>
+              <v-flex md6>
+                <v-dialog
+                  persistent
+                  v-model="modals.end.date"
+                  lazy
+                  full-width
+                >
+                  <v-text-field
+                    slot="activator"
+                    label="End of the event date"
+                    v-model="event.endDate.date"
+                    prepend-icon="event"
+                    readonly
+                  ></v-text-field>
+                  <v-date-picker v-model="event.endDate.date" scrollable >
+                    <template scope="{ save, cancel }">
+                      <v-card-actions>
+                        <v-btn flat primary @click.native="cancel()">Cancel</v-btn>
+                        <v-btn flat primary @click.native="save()">Save</v-btn>
+                      </v-card-actions>
+                    </template>
+                  </v-date-picker>
+                </v-dialog>
+              </v-flex>
+              <v-flex md6>
+                <v-dialog
+                  persistent
+                  v-model="modals.end.time"
+                  lazy
+                >
+                  <v-text-field
+                    slot="activator"
+                    label="End of the event time"
+                    v-model="event.endDate.time"
+                    prepend-icon="access_time"
+                    readonly
+                  ></v-text-field>
+                  <v-time-picker v-model="event.endDate.time" format="24h" actions >
+                    <template scope="{ save, cancel }">
+                      <v-card-actions>
+                        <v-btn flat primary @click.native="cancel()">Cancel</v-btn>
+                        <v-btn flat primary @click.native="save()">Save</v-btn>
+                      </v-card-actions>
+                    </template>
+                  </v-time-picker>
+                </v-dialog>
+              </v-flex>
+            </v-layout>-->
 
-          <vuetify-google-autocomplete
+            <vuetify-google-autocomplete
-            id="map"
+              id="map"
-            append-icon="search"
+              append-icon="search"
-            classname="form-control"
+              classname="form-control"
-            placeholder="Start typing"
+              placeholder="Start typing"
-            label="Location"
+              label="Location"
-            enable-geolocation
+              enable-geolocation
-            types="geocode"
+              types="geocode"
-            v-on:placechanged="getAddressData"
+              v-on:placechanged="getAddressData"
-          >
+            >
-          </vuetify-google-autocomplete>
+            </vuetify-google-autocomplete>
-          <v-btn color="primary" @click.native="e1 = 3">Next</v-btn>
+            <v-btn color="primary" @click.native="e1 = 3">Next</v-btn>
-        </v-stepper-content>
+          </v-stepper-content>
-        <v-stepper-step step="3" :complete="e1 > 3">Extra informations</v-stepper-step>
+          <v-stepper-content step="3">
-        <v-stepper-content step="3">
+            <v-text-field
-          <v-text-field
+              label="Number of seats"
-            label="Number of seats"
+              v-model="event.seats"
-            v-model="event.seats"
+            ></v-text-field>
-          ></v-text-field>
+            <v-text-field
-          <v-text-field
+              label="Price"
-            label="Price"
+              prefix="$"
-            prefix="$"
+              type="float"
-            type="float"
+              v-model="event.price"
-            v-model="event.price"
+            ></v-text-field>
-          ></v-text-field>
+          </v-stepper-content>
-        </v-stepper-content>
+        </v-stepper-items>
       </v-stepper>
     </v-form>
     <v-btn color="primary" @click="create">Create event</v-btn>
@@ -240,7 +246,7 @@
           participants: [],
         },
         categories: [],
-        tags: [{ name: 'test' }, { name: 'montag' }],
+        tags: [],
         tagsToSend: [],
         tagsFetched: [],
       };
@@ -259,13 +265,13 @@
         this.event.seats = parseInt(this.event.seats, 10);
         this.tagsToSend.forEach((tag) => {
           this.event.tags.push({
-            name: tag,
+            title: tag,
             // '@type': 'Tag',
           });
         });
         this.event.category_id = this.event.category.id;
-        this.event.organizer_account_id = this.$store.state.user.account.id;
+        this.event.organizer_actor_id = this.$store.state.user.actor.id;
-        this.event.participants = [this.$store.state.user.account.id];
+        this.event.participants = [this.$store.state.user.actor.id];
         this.event.price = parseFloat(this.event.price);
 
         if (this.id === undefined) {
@@ -283,6 +289,7 @@
               this.$router.push({name: 'Event', params: {id: data.id}});
             });
         }
+        this.event.tags = [];
       },
       fetchCategories() {
         eventFetch('/categories', this.$store)

js/src/components/Event/Event.vue

@@ -11,7 +11,7 @@
                 <v-icon>chevron_left</v-icon>
               </v-btn>
               <v-spacer></v-spacer>
-              <v-btn icon class="mr-3" v-if="event.organizer.id === $store.state.user.account.id" :to="{ name: 'EditEvent', params: {id: event.id}}">
+              <v-btn icon class="mr-3" v-if="event.organizer.id === $store.state.user.actor.id" :to="{ name: 'EditEvent', params: {id: event.id}}">
                 <v-icon>edit</v-icon>
               </v-btn>
               <v-menu bottom left>
@@ -22,7 +22,7 @@
                   <v-list-tile @click="downloadIcsEvent()">
                     <v-list-tile-title>Download</v-list-tile-title>
                   </v-list-tile>
-                  <v-list-tile @click="deleteEvent()" v-if="$store.state.user.account.id === event.organizer.id">
+                  <v-list-tile @click="deleteEvent()" v-if="$store.state.user.actor.id === event.organizer.id">
                     <v-list-tile-title>Delete</v-list-tile-title>
                   </v-list-tile>
                 </v-list>
@@ -54,8 +54,8 @@
                 </router-link>
                 Organisateur <span>{{ event.organizer.username }}</span>
               </v-flex>
-              <v-flex xs2 v-for="account in event.participants" :key="account.id">
+              <v-flex xs2 v-for="actor in event.participants" :key="actor.id">
-                <router-link :to="{name: 'Account', params: {'id': account.id}}">
+                <router-link :to="{name: 'Account', params: {'id': actor.id}}">
                   <v-avatar size="75px">
                     <img v-if="!account.avatar_url"
                          class="img-circle elevation-7 mb-1"
@@ -67,13 +67,13 @@
                     >
                   </v-avatar>
                 </router-link>
-                <span>{{ account.username }}</span>
+                <span>{{ actor.username }}</span>
               </v-flex>
             </v-layout>
           </v-container>
           <v-card-actions>
-            <button v-if="!event.participants.map(participant => participant.id).includes($store.state.user.account.id)" @click="joinEvent" class="btn btn-primary">Join</button>
+            <button v-if="!event.participants.map(participant => participant.id).includes($store.state.user.actor.id)" @click="joinEvent" class="btn btn-primary">Join</button>
-            <button v-if="event.participants.map(participant => participant.id).includes($store.state.user.account.id)" @click="leaveEvent" class="btn btn-primary">Leave</button>
+            <button v-if="event.participants.map(participant => participant.id).includes($store.state.user.actor.id)" @click="leaveEvent" class="btn btn-primary">Leave</button>
             <button @click="deleteEvent" class="btn btn-danger">Delete</button>
           </v-card-actions>
           </v-layout>
@@ -97,7 +97,8 @@
         loading: true,
         error: false,
         event: {
-          id: this.id,
+          name: this.name,
+          slug: this.slug,
           title: '',
           description: '',
           organizer: {
@@ -111,11 +112,11 @@
     methods: {
       deleteEvent() {
         const router = this.$router;
-        eventFetch(`/events/${this.id}`, this.$store, { method: 'DELETE' })
+        eventFetch(`/events/${this.name}/${this.slug}`, this.$store, { method: 'DELETE' })
           .then(() => router.push({'name': 'EventList'}));
       },
       fetchData() {
-        eventFetch(`/events/${this.id}`, this.$store)
+        eventFetch(`/events/${this.name}/${this.slug}`, this.$store)
           .then(response => response.json())
           .then((data) => {
             this.loading = false;
@@ -129,21 +130,21 @@
         });
       },
       joinEvent() {
-        eventFetch(`/events/${this.id}/join`, this.$store)
+        eventFetch(`/events/${this.name}/${this.slug}/join`, this.$store)
           .then(response => response.json())
           .then((data) => {
             console.log(data);
           });
       },
       leaveEvent() {
-        eventFetch(`/events/${this.id}/leave`, this.$store)
+        eventFetch(`/events/${this.name}/${this.slug}/leave`, this.$store)
           .then(response => response.json())
           .then((data) => {
             console.log(data);
           });
       },
       downloadIcsEvent() {
-        eventFetch('/events/' + this.event.id + '/ics', this.$store, {responseType: 'arraybuffer'})
+        eventFetch(`/events/${this.name}/${this.slug}/ics`, this.$store, {responseType: 'arraybuffer'})
           .then((response) => response.text())
           .then(response => {
             const blob = new Blob([response],{type: 'text/calendar'});
@@ -156,7 +157,16 @@
           })
       },
     },
-    props: ['id'],
+    props: {
+        name: {
+            type: String,
+            required: true,
+        },
+        slug: {
+            type: String,
+            required: true
+        },
+    },
     created() {
       this.fetchData();
     },

js/src/components/Event/EventList.vue

@@ -28,12 +28,12 @@
           <v-container>
               <!--<span class="grey&#45;&#45;text">{{ event.startDate | formatDate }} à <router-link :to="{name: 'EventList', params: {location: geocode(event.address.geo.latitude, event.address.geo.longitude, 10) }}">{{ event.address.addressLocality }}</router-link></span><br>-->
               <p><vue-markdown>{{ event.description }}</vue-markdown></p>
-              <p v-if="event.organizer">Organisé par <router-link :to="{name: 'Account', params: {'id': event.organizer.id}}">{{ event.organizer.username }}</router-link></p>
+              <p v-if="event.organizer">Organisé par <router-link :to="{name: 'Account', params: {'name': event.organizer.username}}">{{ event.organizer.username }}</router-link></p>
           </v-container>
           <v-card-actions>
             <v-btn flat color="orange" @click="downloadIcsEvent(event)">Share</v-btn>
-            <v-btn flat color="orange" @click="viewEvent(event.id)">Explore</v-btn>
+            <v-btn flat color="orange" @click="viewEvent(event)">Explore</v-btn>
-            <v-btn flat color="red" @click="deleteEvent(event.id)">Delete</v-btn>
+            <v-btn flat color="red" @click="deleteEvent(event)">Delete</v-btn>
           </v-card-actions>
         </v-card>
       </v-flex>
@@ -98,16 +98,16 @@
             this.events = response.data;
           });
       },
-      deleteEvent(id) {
+      deleteEvent(event) {
         const router = this.$router;
-        eventFetch('/events/' + id, this.$store, {'method': 'DELETE'})
+        eventFetch(`/events/${event.organizer.username}/${event.slug}`, this.$store, {'method': 'DELETE'})
           .then(() => router.push('/events'));
       },
-      viewEvent(id) {
+      viewEvent(event) {
-        this.$router.push({ name: 'Event', params: { id } })
+        this.$router.push({ name: 'Event', params: { name: event.organizer.username, slug: event.slug } })
       },
       downloadIcsEvent(event) {
-        eventFetch('/events/' + event.id + '/export', this.$store, {responseType: 'arraybuffer'})
+        eventFetch(`/events/${event.organizer.username}/${event.slug}/export`, this.$store, {responseType: 'arraybuffer'})
           .then((response) => response.text())
           .then(response => {
             const blob = new Blob([response],{type: 'text/calendar'});

js/src/components/Group/Group.vue

@@ -73,7 +73,7 @@
             <v-subheader>Membres</v-subheader>
             <v-layout row>
               <v-flex xs2 v-for="member in group.members" :key="member.id">
-                <router-link :to="{name: 'Account', params: {'id': member.account.id}}">
+                <router-link :to="{name: 'Account', params: {'id': member.actor.id}}">
                   <v-badge overlap>
                     <span slot="badge" v-if="member.role == 3"><v-icon>stars</v-icon></span>
                     <v-avatar size="75px">
@@ -88,7 +88,7 @@
                     </v-avatar>
                   </v-badge>
                 </router-link>
-                <span>{{ groupAccount.account.username }}</span>
+                <span>{{ groupAccount.actor.username }}</span>
               </v-flex>
             </v-layout>
           </v-container>

js/src/components/Home.vue

@@ -50,7 +50,7 @@ export default {
   },
   computed: {
     displayed_name: function() {
-      return this.$store.state.user.account.display_name === null ? this.$store.state.user.account.username : this.$store.state.user.account.display_name
+      return this.$store.state.user.actor.display_name === null ? this.$store.state.user.actor.username : this.$store.state.user.actor.display_name
     },
   },
   methods: {

js/src/components/NavBar.vue

@@ -58,7 +58,7 @@
         </v-card-actions>
       </v-card>
     </v-menu>
-    <v-btn flat @click="$router.push({name: 'Account', params: {'id': getUser().account.id}})" v-if="$store.state.user">{{ this.displayed_name }}</v-btn>
+    <v-btn flat @click="$router.push({name: 'Account', params: {'id': getUser().actor.id}})" v-if="$store.state.user">{{ this.displayed_name }}</v-btn>
   </v-toolbar>
 </template>
 
@@ -97,7 +97,7 @@
     },
     computed: {
       displayed_name: function() {
-        return this.$store.state.user.account.display_name === null ? this.$store.state.user.account.username : this.$store.state.user.account.display_name
+        return this.$store.state.user.actor.display_name === null ? this.$store.state.user.actor.username : this.$store.state.user.actor.display_name
       },
     },
     methods: {

js/src/router/index.js

@@ -33,13 +33,6 @@ const router = new Router({
       component: EventList,
       meta: { requiredAuth: false },
     },
-    {
-      path: '/events/:id(\\d+)',
-      name: 'Event',
-      component: Event,
-      props: true,
-      meta: { requiredAuth: false },
-    },
     {
       path: '/events/create',
       name: 'CreateEvent',
@@ -84,14 +77,7 @@ const router = new Router({
       meta: { requiredAuth: false },
     },
     {
-      path: '/accounts/:id(\\d+)',
+      path: '/groups',
-      name: 'Account',
-      component: Account,
-      props: true,
-      meta: { requiredAuth: false },
-    },
-    {
-      path: '/group',
       name: 'GroupList',
       component: GroupList,
       meta: { requiredAuth: false },
@@ -103,12 +89,26 @@ const router = new Router({
       meta: { requiredAuth: true },
     },
     {
-      path: '/group/:id',
+      path: '/~:name',
       name: 'Group',
       component: Group,
       props: true,
       meta: { requiredAuth: false },
     },
+    {
+      path: '/@:name',
+      name: 'Account',
+      component: Account,
+      props: true,
+      meta: { requiredAuth: false },
+    },
+    {
+      path: '/@:name/:slug',
+      name: 'Event',
+      component: Event,
+      props: true,
+      meta: { requiredAuth: false },
+    },
     { path: "*",
       name: 'PageNotFound',
       component: PageNotFound,

js/vue.config.js

@@ -1,11 +1,11 @@
-//const Dotenv = require('dotenv-webpack');
+const Dotenv = require('dotenv-webpack');
 
 module.exports = {
   lintOnSave: false,
   compiler: true,
   configureWebpack: {
     plugins: [
-      //new Dotenv(),
+      new Dotenv(),
     ],
   },
 };

lib/eventos/actors/actor.ex

@@ -62,7 +62,7 @@ defmodule Eventos.Actors.Actor do
     field :preferred_username, :string
     field :public_key, :string
     field :private_key, :string
-    field :manually_approves_followers, :boolean
+    field :manually_approves_followers, :boolean, default: false
     field :suspended, :boolean, default: false
     many_to_many :followers, Actor, join_through: Follower
     has_many :organized_events, Event, [foreign_key: :organizer_actor_id]
@@ -92,7 +92,7 @@ defmodule Eventos.Actors.Actor do
     changes =
       %Actor{}
       |> Ecto.Changeset.cast(params, [:url, :outbox_url, :inbox_url, :following_url, :followers_url, :type, :name, :domain, :summary, :preferred_username, :public_key, :manually_approves_followers])
-      |> validate_required([:url, :outbox_url, :inbox_url, :following_url, :followers_url, :type, :name, :domain, :summary, :preferred_username, :public_key, :manually_approves_followers])
+      |> validate_required([:url, :outbox_url, :inbox_url, :type, :name, :domain, :summary, :preferred_username, :public_key])
       |> unique_constraint(:preferred_username, name: :actors_preferred_username_domain_index)
       |> validate_length(:summary, max: 5000)
       |> validate_length(:preferred_username, max: 100)
@@ -101,21 +101,6 @@ defmodule Eventos.Actors.Actor do
     Logger.debug("Remote actor creation")
     Logger.debug(inspect changes)
     changes
-    #    if changes.valid? do
-    #      case changes.changes[:info]["source_data"] do
-    #        %{"followers" => followers} ->
-    #          changes
-    #          |> put_change(:follower_address, followers)
-    #
-    #        _ ->
-    #          followers = User.ap_followers(%User{nickname: changes.changes[:nickname]})
-    #
-    #          changes
-    #          |> put_change(:follower_address, followers)
-    #      end
-    #    else
-    #      changes
-    #    end
   end
 
   def get_or_fetch_by_url(url) do

lib/eventos/actors/actors.ex

@@ -150,10 +150,6 @@ defmodule Eventos.Actors do
   defp blank?(n), do: n
 
   def insert_or_update_actor(data) do
-    data =
-      data
-      |> Map.put(:name, blank?(data[:preferred_username]) || data[:name])
-
     cs = Actor.remote_actor_creation(data)
     Repo.insert(cs, on_conflict: [set: [public_key: data.public_key]], conflict_target: [:preferred_username, :domain])
   end
@@ -207,6 +203,19 @@ defmodule Eventos.Actors do
     Repo.one from a in Actor, where: a.preferred_username == ^name and is_nil(a.domain)
   end
 
+  def get_local_actor_by_name_with_everything(name) do
+    actor = Repo.one from a in Actor, where: a.preferred_username == ^name and is_nil(a.domain)
+    Repo.preload(actor, :organized_events)
+  end
+
+  def get_actor_by_name_with_everything(name) do
+    actor = case String.split(name, "@") do
+      [name] -> Repo.one from a in Actor, where: a.preferred_username == ^name and is_nil(a.domain)
+      [name, domain] -> Repo.one from a in Actor, where: a.preferred_username == ^name and a.domain == ^domain
+    end
+    Repo.preload(actor, :organized_events)
+  end
+
   def get_or_fetch_by_url(url) do
     if actor = get_actor_by_url(url) do
       actor

lib/eventos/events/event.ex

@@ -32,7 +32,7 @@ defmodule Eventos.Events.Event do
   """
   use Ecto.Schema
   import Ecto.Changeset
-  alias Eventos.Events.{Event, Participant, Request, Tag, Category, Session, Track}
+  alias Eventos.Events.{Event, Participant, Tag, Category, Session, Track}
   alias Eventos.Events.Event.TitleSlug
   alias Eventos.Actors.Actor
   alias Eventos.Addresses.Address
@@ -55,7 +55,6 @@ defmodule Eventos.Events.Event do
     many_to_many :tags, Tag, join_through: "events_tags"
     belongs_to :category, Category
     many_to_many :participants, Actor, join_through: Participant
-    has_many :event_request, Request
     has_many :tracks, Track
     has_many :sessions, Session
     belongs_to :address, Address

lib/eventos/events/events.ex

@@ -20,7 +20,8 @@ defmodule Eventos.Events do
 
   """
   def list_events do
-    Repo.all(Event)
+    events = Repo.all(Event)
+    Repo.preload(events, [:organizer_actor])
   end
 
   def get_events_for_actor(%Actor{id: actor_id} = _actor, page \\ 1, limit \\ 10) do
@@ -94,12 +95,17 @@ defmodule Eventos.Events do
 
   @spec get_event_full_by_name_and_slug!(String.t, String.t) :: Event.t
   def get_event_full_by_name_and_slug!(name, slug) do
-    event = Repo.one(
+    query = case String.split(name, "@") do
-      from e in Event,
+      [name, domain] -> from e in Event,
-      join: a in Actor,
+                             join: a in Actor,
-      on: a.id == e.organizer_actor_id and a.name == ^name,
+                             on: a.id == e.organizer_actor_id and a.preferred_username == ^name and a.domain == ^domain,
-      where: e.slug == ^slug
+                             where: e.slug == ^slug
-    )
+      [name] -> from e in Event,
+                     join: a in Actor,
+                     on: a.id == e.organizer_actor_id and a.preferred_username == ^name and is_nil(a.domain),
+                     where: e.slug == ^slug
+    end
+    event = Repo.one(query)
     Repo.preload(event, [:organizer_actor, :category, :sessions, :tracks, :tags, :participants, :address])
   end
 

lib/eventos_web/controllers/account_controller.ex

@@ -1,41 +0,0 @@
-defmodule EventosWeb.ActorController do
-  @moduledoc """
-  Controller for Actors
-  """
-  use EventosWeb, :controller
-
-  alias Eventos.Actors
-  alias Eventos.Actors.Actor
-
-  action_fallback EventosWeb.FallbackController
-
-  def index(conn, _params) do
-    actors = Actors.list_actors()
-    render(conn, "index.json", actors: actors)
-  end
-
-  def show(conn, %{"id" => id}) do
-    actor = Actors.get_actor_with_everything!(id)
-    render(conn, "show.json", actor: actor)
-  end
-
-  def update(conn, %{"id" => id, "actor" => actor_params}) do
-    actor = Actors.get_actor!(id)
-
-    with {:ok, %Actor{} = actor} <- Actors.update_actor(actor, actor_params) do
-      render(conn, "show.json", actor: actor)
-    end
-  end
-
-  def delete(conn, %{"id" => id_str}) do
-    {id, _} = Integer.parse(id_str)
-    if Guardian.Plug.current_resource(conn).actor.id == id do
-      actor = Actors.get_actor!(id)
-      with {:ok, %Actor{}} <- Actors.delete_actor(actor) do
-        send_resp(conn, :no_content, "")
-      end
-    else
-      send_resp(conn, 401, "")
-    end
-  end
-end

lib/eventos_web/controllers/actor_controller.ex

@@ -0,0 +1,50 @@
+defmodule EventosWeb.ActorController do
+  @moduledoc """
+  Controller for Actors
+  """
+  use EventosWeb, :controller
+
+  alias Eventos.Actors
+  alias Eventos.Actors.Actor
+  alias Eventos.Service.ActivityPub
+
+  action_fallback EventosWeb.FallbackController
+
+  def index(conn, _params) do
+    actors = Actors.list_actors()
+    render(conn, "index.json", actors: actors)
+  end
+
+  def show(conn, %{"name" => name}) do
+    actor = Actors.get_actor_by_name_with_everything(name)
+    render(conn, "show.json", actor: actor)
+  end
+
+  def search(conn, %{"name" => name}) do
+    with {:ok, actor} <- ActivityPub.make_actor_from_nickname(name) do
+      render(conn, "acccount_basic.json", actor: actor)
+    else
+      {:error, err} -> json(conn, err)
+    end
+  end
+
+  def update(conn, %{"name" => name, "actor" => actor_params}) do
+    actor = Actors.get_local_actor_by_name(name)
+
+    with {:ok, %Actor{} = actor} <- Actors.update_actor(actor, actor_params) do
+      render(conn, "show.json", actor: actor)
+    end
+  end
+
+#  def delete(conn, %{"id" => id_str}) do
+#    {id, _} = Integer.parse(id_str)
+#    if Guardian.Plug.current_resource(conn).actor.id == id do
+#      actor = Actors.get_actor!(id)
+#      with {:ok, %Actor{}} <- Actors.delete_actor(actor) do
+#        send_resp(conn, :no_content, "")
+#      end
+#    else
+#      send_resp(conn, 401, "")
+#    end
+#  end
+end

lib/eventos_web/controllers/event_controller.ex

@@ -35,28 +35,27 @@ defmodule EventosWeb.EventController do
     end
   end
 
-  def show(conn, %{"id" => id}) do
+  def show(conn, %{"username" => username, "slug" => slug}) do
-    event = Events.get_event_full!(id)
+    event = Events.get_event_full_by_name_and_slug!(username, slug)
     render(conn, "show.json", event: event)
   end
 
-  def export_to_ics(conn, %{"id" => id}) do
+  def export_to_ics(conn, %{"username" => username, "slug" => slug}) do
-    event = id
+    event = Events.get_event_full_by_name_and_slug!(username, slug)
-      |> Events.get_event!()
       |> ICalendar.export_event()
     send_resp(conn, 200, event)
   end
 
-  def update(conn, %{"id" => id, "event" => event_params}) do
+  def update(conn, %{"username" => username, "slug" => slug, "event" => event_params}) do
-    event = Events.get_event!(id)
+    event = Events.get_event_full_by_name_and_slug!(username, slug)
 
     with {:ok, %Event{} = event} <- Events.update_event(event, event_params) do
       render(conn, "show_simple.json", event: event)
     end
   end
 
-  def delete(conn, %{"id" => id}) do
+  def delete(conn, %{"username" => username, "slug" => slug}) do
-    event = Events.get_event!(id)
+    event = Events.get_event_full_by_name_and_slug!(username, slug)
     with {:ok, %Event{}} <- Events.delete_event(event) do
       send_resp(conn, :no_content, "")
     end

lib/eventos_web/router.ex

@@ -38,12 +38,16 @@ defmodule EventosWeb.Router do
       post "/users", UserController, :register
       post "/login", UserSessionController, :sign_in
       #resources "/groups", GroupController, only: [:index, :show]
-      resources "/events", EventController, only: [:index, :show]
+      get "/events", EventController, :index
+      get "/events/:username/:slug", EventController, :show
+      get "/events/:username/:slug/ics", EventController, :export_to_ics
+      get "/events/:username/:slug/tracks", TrackController, :show_tracks_for_event
+      get "/events/:username/:slug/sessions", SessionController, :show_sessions_for_event
       resources "/comments", CommentController, only: [:show]
-      get "/events/:id/ics", EventController, :export_to_ics
+
-      get "/events/:id/tracks", TrackController, :show_tracks_for_event
+      get "/actors", ActorController, :index
-      get "/events/:id/sessions", SessionController, :show_sessions_for_event
+      get "/actors/search/:name", ActorController, :search
-      resources "/actors", ActorController, only: [:index, :show]
+      get "/actors/:name", ActorController, :show
       resources "/tags", TagController, only: [:index, :show]
       resources "/categories", CategoryController, only: [:index, :show]
       resources "/sessions", SessionController, only: [:index, :show]
@@ -61,8 +65,11 @@ defmodule EventosWeb.Router do
        get "/user", UserController, :show_current_actor
        post "/sign-out", UserSessionController, :sign_out
        resources "/users", UserController, except: [:new, :edit, :show]
-       resources "/actors", ActorController, except: [:new, :edit]
+       patch "/actors/:name", ActorController, :update
-       resources "/events", EventController
+       post "/events", EventController, :create
+       patch "/events/:username/:slug", EventController, :update
+       put "/events/:username/:slug", EventController, :update
+       delete "/events/:username/:slug", EventController, :delete
        resources "/comments", CommentController, except: [:new, :edit]
        #post "/events/:id/request", EventRequestController, :create_for_event
        resources "/participant", ParticipantController

lib/eventos_web/views/actor_view.ex

@@ -19,10 +19,10 @@ defmodule EventosWeb.ActorView do
 
   def render("acccount_basic.json", %{actor: actor}) do
     %{id: actor.id,
-      username: actor.username,
+      username: actor.preferred_username,
       domain: actor.domain,
-      display_name: actor.display_name,
+      display_name: actor.name,
-      description: actor.description,
+      description: actor.summary,
       # public_key: actor.public_key,
       suspended: actor.suspended,
       url: actor.url,
@@ -31,14 +31,14 @@ defmodule EventosWeb.ActorView do
 
   def render("actor.json", %{actor: actor}) do
     %{id: actor.id,
-      username: actor.username,
+      username: actor.preferred_username,
       domain: actor.domain,
-      display_name: actor.display_name,
+      display_name: actor.name,
-      description: actor.description,
+      description: actor.summary,
       # public_key: actor.public_key,
       suspended: actor.suspended,
       url: actor.url,
-      organized_events: render_many(actor.organized_events, EventView, "event_simple.json")
+      organized_events: render_many(actor.organized_events, EventView, "event_for_actor.json")
     }
   end
 end

lib/eventos_web/views/event_view.ex

@@ -17,12 +17,23 @@ defmodule EventosWeb.EventView do
     %{data: render_one(event, EventView, "event.json")}
   end
 
+  def render("event_for_actor.json", %{event: event}) do
+    %{id: event.id,
+      title: event.title,
+      slug: event.slug
+    }
+  end
+
   def render("event_simple.json", %{event: event}) do
     %{id: event.id,
       title: event.title,
+      slug: event.slug,
       description: event.description,
       begins_on: event.begins_on,
       ends_on: event.ends_on,
+      organizer: %{
+        username: event.organizer_actor.preferred_username
+      },
     }
   end
 
@@ -33,7 +44,6 @@ defmodule EventosWeb.EventView do
       begins_on: event.begins_on,
       ends_on: event.ends_on,
       organizer: render_one(event.organizer_actor, ActorView, "acccount_basic.json"),
-      group: render_one(event.organizer_group, GroupView, "group_basic.json"),
       participants: render_many(event.participants, ActorView, "show_basic.json"),
       address: render_one(event.address, AddressView, "address.json"),
     }

lib/service/activity_pub/activity_pub.ex

@@ -241,6 +241,11 @@ defmodule Eventos.Service.ActivityPub do
           "type" => "Image",
           "url" => [%{"href" => data["image"]["url"]}]
         }
+    name = if String.trim(data["name"]) === "" do
+      data["preferredUsername"]
+    else
+      data["name"]
+    end
 
     user_data = %{
       url: data["id"],
@@ -250,7 +255,7 @@ defmodule Eventos.Service.ActivityPub do
         "banner" => banner
       },
       avatar: avatar,
-      name: data["name"],
+      name: name,
       preferred_username: data["preferredUsername"],
       follower_address: data["followers"],
       summary: data["summary"],
@@ -269,7 +274,7 @@ defmodule Eventos.Service.ActivityPub do
   end
 
   @spec fetch_public_activities_for_actor(Actor.t, integer(), integer()) :: list()
-  def fetch_public_activities_for_actor(%Actor{} = actor, page \\ 10, limit \\ 1) do
+  def fetch_public_activities_for_actor(%Actor{} = actor, page \\ 10, limit \\ 10) do
     {:ok, events, total} = Events.get_events_for_actor(actor, page, limit)
     activities = Enum.map(events, fn event ->
       {:ok, activity} = event_to_activity(event)

lib/service/web_finger/web_finger.ex

@@ -80,8 +80,9 @@ defmodule Eventos.Service.WebFinger do
 
       address = "http://#{domain}/.well-known/webfinger?resource=acct:#{actor}"
 
-    with response <- HTTPoison.get(address, [Accept: "application/json"],follow_redirect: true),
+      Logger.debug(inspect address)
-         {:ok, %{status_code: status_code, body: body}} when status_code in 200..299 <- response do
+    with response <- HTTPoison.get!(address, [Accept: "application/json, application/activity+json, application/jrd+json"],follow_redirect: true),
+         %{status_code: status_code, body: body} when status_code in 200..299 <- response do
           {:ok, doc} = Jason.decode(body)
           webfinger_from_json(doc)
     else

priv/repo/migrations/20180517100700_move_from_account_to_actor.exs

@@ -26,11 +26,11 @@ defmodule Eventos.Repo.Migrations.MoveFromAccountToActor do
     alter table("actors") do
       add :inbox_url, :string
       add :outbox_url, :string
-      add :following_url, :string
+      add :following_url, :string, null: true
-      add :followers_url, :string
+      add :followers_url, :string, null: true
-      add :shared_inbox_url, :string
+      add :shared_inbox_url, :string, null: false, default: ""
       add :type, :actor_type
-      add :manually_approves_followers, :boolean
+      add :manually_approves_followers, :boolean, default: false
       modify :name, :string, null: true
       modify :preferred_username, :string, null: false
     end
@@ -49,6 +49,8 @@ defmodule Eventos.Repo.Migrations.MoveFromAccountToActor do
     end
 
     rename table("comments"), :account_id, to: :actor_id
+
+    rename table("users"), :account_id, to: :actor_id
   end
 
   def down do
@@ -91,6 +93,8 @@ defmodule Eventos.Repo.Migrations.MoveFromAccountToActor do
 
     rename table("comments"), :actor_id, to: :account_id
 
+    rename table("users"), :actor_id, to: :account_id
+
     drop index("accounts", [:preferred_username, :domain], name: :actors_preferred_username_domain_index)
 
     drop table("followers")