From 71e7e383d5145d7fe5efe9d6a23255fae57c01bb Mon Sep 17 00:00:00 2001 From: Berthier Date: Wed, 26 Jun 2019 16:48:37 +0200 Subject: [PATCH 1/7] add getting started vuejs --- doc/6/getting-started/vuejs/.gitignore | 3 + doc/6/getting-started/vuejs/cypress.json | 14 ++ .../vuejs/cypress/fixtures/Environment.1.json | 3 + .../vuejs/cypress/fixtures/Environment.2.json | 26 +++ .../vuejs/cypress/fixtures/Environment.3.json | 7 + .../vuejs/cypress/fixtures/Environment.4.json | 7 + .../vuejs/cypress/integration/tchat.spec.js | 87 ++++++++ .../vuejs/cypress/plugins/index.js | 17 ++ .../vuejs/cypress/support/commands.js | 106 ++++++++++ .../vuejs/cypress/support/index.js | 20 ++ doc/6/getting-started/vuejs/package.json | 50 +++++ .../vuejs/without-vuex/babel.config.js | 5 + .../vuejs/without-vuex/public/favicon.ico | Bin 0 -> 4286 bytes .../vuejs/without-vuex/public/index.html | 17 ++ .../vuejs/without-vuex/src/App.vue | 199 ++++++++++++++++++ .../vuejs/without-vuex/src/assets/logo.png | Bin 0 -> 6849 bytes .../vuejs/without-vuex/src/main.js | 7 + .../vuejs/without-vuex/src/services/kuzzle.js | 3 + 18 files changed, 571 insertions(+) create mode 100644 doc/6/getting-started/vuejs/.gitignore create mode 100644 doc/6/getting-started/vuejs/cypress.json create mode 100644 doc/6/getting-started/vuejs/cypress/fixtures/Environment.1.json create mode 100644 doc/6/getting-started/vuejs/cypress/fixtures/Environment.2.json create mode 100644 doc/6/getting-started/vuejs/cypress/fixtures/Environment.3.json create mode 100644 doc/6/getting-started/vuejs/cypress/fixtures/Environment.4.json create mode 100644 doc/6/getting-started/vuejs/cypress/integration/tchat.spec.js create mode 100644 doc/6/getting-started/vuejs/cypress/plugins/index.js create mode 100644 doc/6/getting-started/vuejs/cypress/support/commands.js create mode 100644 doc/6/getting-started/vuejs/cypress/support/index.js create mode 100644 doc/6/getting-started/vuejs/package.json create mode 100644 doc/6/getting-started/vuejs/without-vuex/babel.config.js create mode 100644 doc/6/getting-started/vuejs/without-vuex/public/favicon.ico create mode 100644 doc/6/getting-started/vuejs/without-vuex/public/index.html create mode 100644 doc/6/getting-started/vuejs/without-vuex/src/App.vue create mode 100644 doc/6/getting-started/vuejs/without-vuex/src/assets/logo.png create mode 100644 doc/6/getting-started/vuejs/without-vuex/src/main.js create mode 100644 doc/6/getting-started/vuejs/without-vuex/src/services/kuzzle.js diff --git a/doc/6/getting-started/vuejs/.gitignore b/doc/6/getting-started/vuejs/.gitignore new file mode 100644 index 000000000..cef3da1f7 --- /dev/null +++ b/doc/6/getting-started/vuejs/.gitignore @@ -0,0 +1,3 @@ +/cypress/screenshots/ +/cypress/videos/ +package-lock.json \ No newline at end of file diff --git a/doc/6/getting-started/vuejs/cypress.json b/doc/6/getting-started/vuejs/cypress.json new file mode 100644 index 000000000..97ba7bcda --- /dev/null +++ b/doc/6/getting-started/vuejs/cypress.json @@ -0,0 +1,14 @@ +{ + "baseUrl": "http://localhost:8080", + "viewportWidth": 1400, + "viewportHeight": 900, + "defaultCommandTimeout": 5000, + "env": { + "kuzzle": { + "host": "localhost", + "port": "7512", + "index": "chat", + "collection": "messages" + } + } +} \ No newline at end of file diff --git a/doc/6/getting-started/vuejs/cypress/fixtures/Environment.1.json b/doc/6/getting-started/vuejs/cypress/fixtures/Environment.1.json new file mode 100644 index 000000000..a04d96844 --- /dev/null +++ b/doc/6/getting-started/vuejs/cypress/fixtures/Environment.1.json @@ -0,0 +1,3 @@ +{ + "username": "Elrond" +} \ No newline at end of file diff --git a/doc/6/getting-started/vuejs/cypress/fixtures/Environment.2.json b/doc/6/getting-started/vuejs/cypress/fixtures/Environment.2.json new file mode 100644 index 000000000..3c983f6b0 --- /dev/null +++ b/doc/6/getting-started/vuejs/cypress/fixtures/Environment.2.json @@ -0,0 +1,26 @@ +{ + "username": "Legolas", + "messages": [ + { + "_id": "1", + "payload": { + "value": "It still only counts as one!", + "username": "Gimli" + } + }, + { + "_id": "2", + "payload": { + "value": "What do your elf eyes see?", + "username": "Aragorn" + } + }, + { + "_id": "3", + "payload": { + "value": "What about side by side with a friend?", + "username": "Legolas" + } + } + ] +} \ No newline at end of file diff --git a/doc/6/getting-started/vuejs/cypress/fixtures/Environment.3.json b/doc/6/getting-started/vuejs/cypress/fixtures/Environment.3.json new file mode 100644 index 000000000..e84a6f198 --- /dev/null +++ b/doc/6/getting-started/vuejs/cypress/fixtures/Environment.3.json @@ -0,0 +1,7 @@ +{ + "username": "Sam", + "payload": { + "username": "Sam", + "value": "I can't carry it for you, But I can carry you!" + } +} \ No newline at end of file diff --git a/doc/6/getting-started/vuejs/cypress/fixtures/Environment.4.json b/doc/6/getting-started/vuejs/cypress/fixtures/Environment.4.json new file mode 100644 index 000000000..53f49410f --- /dev/null +++ b/doc/6/getting-started/vuejs/cypress/fixtures/Environment.4.json @@ -0,0 +1,7 @@ +{ + "username": "Sauron", + "payload": { + "username": "Eowyn", + "value": "I am no man" + } +} \ No newline at end of file diff --git a/doc/6/getting-started/vuejs/cypress/integration/tchat.spec.js b/doc/6/getting-started/vuejs/cypress/integration/tchat.spec.js new file mode 100644 index 000000000..6d3ad2034 --- /dev/null +++ b/doc/6/getting-started/vuejs/cypress/integration/tchat.spec.js @@ -0,0 +1,87 @@ +describe('test realtime tchat', () => { + let currentIt = 1; + let env; + + before(() => { + cy.initialisation(); + }); + + beforeEach(() => { + cy.visit('/'); + cy.fixture(`Environment.${currentIt}.json`) + .then((fixtures) => { env = fixtures; }) + .then(() => cy.log(`Environment ${currentIt}: `, env)) + .then(() => cy.loadEnvironment(env)); + cy.wait(2000); + }); + + afterEach(() => { + currentIt++; + }); + + it('should enter a nickname', () => { + cy.get('[placeholder="Enter your message"]') + .should('not.exist'); + + cy.get('[placeholder="Enter your nickname"]') + .type(env.username); + + + cy.contains('Valid') + .click(); + + cy.get('[placeholder="Enter your message"]') + .should('exist'); + cy.get('[placeholder="Enter your nickname"]') + .should('not.exist'); + }); + + it('should fetch and display some messages', () => { + cy.get('[placeholder="Enter your nickname"]') + .type(env.username); + cy.contains('Valid') + .click(); + + env.messages.forEach(message => { + cy.get(message.payload.username === env.username ? '.fromMe': '.fromOthers') + .within(() => { + cy.contains(message.payload.value); + cy.contains(message.payload.username); + }); + }); + }); + + it('should send a message', () => { + cy.get('[placeholder="Enter your nickname"]') + .type(env.username); + cy.contains('Valid') + .click(); + cy.createMessage({ + _id: '1', + payload: env.payload + }); + + cy.get('.fromMe') + .within(() => { + cy.contains(env.payload.value); + cy.contains(env.username); + }); + }); + + it('should receive a message', () => { + cy.get('[placeholder="Enter your nickname"]') + .type(env.username); + cy.contains('Valid') + .click(); + cy.createMessage({ + _id: '1', + payload: env.payload + }); + + cy.get('.fromOthers') + .within(() => { + cy.contains(env.payload.value); + cy.contains(env.payload.username); + }); + }); +}); \ No newline at end of file diff --git a/doc/6/getting-started/vuejs/cypress/plugins/index.js b/doc/6/getting-started/vuejs/cypress/plugins/index.js new file mode 100644 index 000000000..fd170fba6 --- /dev/null +++ b/doc/6/getting-started/vuejs/cypress/plugins/index.js @@ -0,0 +1,17 @@ +// *********************************************************** +// This example plugins/index.js can be used to load plugins +// +// You can change the location of this file or turn off loading +// the plugins file with the 'pluginsFile' configuration option. +// +// You can read more here: +// https://on.cypress.io/plugins-guide +// *********************************************************** + +// This function is called when a project is opened or re-opened (e.g. due to +// the project's config changing) + +module.exports = (on, config) => { + // `on` is used to hook into various events Cypress emits + // `config` is the resolved Cypress config +} diff --git a/doc/6/getting-started/vuejs/cypress/support/commands.js b/doc/6/getting-started/vuejs/cypress/support/commands.js new file mode 100644 index 000000000..2203db146 --- /dev/null +++ b/doc/6/getting-started/vuejs/cypress/support/commands.js @@ -0,0 +1,106 @@ +// *********************************************** +// This example commands.js shows you how to +// create various custom commands and overwrite +// existing commands. +// +// For more comprehensive examples of custom +// commands please read more here: +// https://on.cypress.io/custom-commands +// *********************************************** +// +// +// -- This is a parent command -- +// Cypress.Commands.add("login", (email, password) => { ... }) +// +// +// -- This is a child command -- +// Cypress.Commands.add("drag", { prevSubject: 'element'}, (subject, options) => { ... }) +// +// +// -- This is a dual command -- +// Cypress.Commands.add("dismiss", { prevSubject: 'optional'}, (subject, options) => { ... }) +// +// +// -- This is will overwrite an existing command -- +// Cypress.Commands.overwrite("visit", (originalFn, url, options) => { ... }) + +function reinitialisation() { + const kuzzle = Cypress.env('kuzzle'); + + // Clear collection + return cy.request({ + url: `http://${kuzzle.host}:${kuzzle.port}/${kuzzle.index}/${kuzzle.collection}/_truncate`, + method: 'DELETE', + }) + .then(searchResponse => { + cy.log(`Request : truncate ${kuzzle.collection} status : ${searchResponse.status}`); + cy.wait(500); + }); +} + +Cypress.Commands.add('createMessage', (message) => { + const kuzzle = Cypress.env('kuzzle'); + return cy.request({ + url: `http://${kuzzle.host}:${kuzzle.port}/${kuzzle.index}/${kuzzle.collection}/${message._id}/_create`, + method: 'POST', + body: message.payload, + }) + .its('body') + .then(response => { + cy.log(`Create : ${message._id} status : ${response.status}`); + cy.wait(500); + }); +}); + + +Cypress.Commands.add('initialisation', () => { + const kuzzle = Cypress.env('kuzzle'); + + // Delete index if exists + cy.request({ + url: `http://${kuzzle.host}:${kuzzle.port}/${kuzzle.index}/_exists`, + method: 'GET', + }) + .then(existsResponse => { + cy.log(`Request : exists ${kuzzle.index} status : ${existsResponse.status}`); + if (existsResponse.body.result) { + cy.request({ + url: `http://${kuzzle.host}:${kuzzle.port}/${kuzzle.index}`, + method: 'DELETE', + }) + .then(deleteResponse => { + cy.log(`Request : delete ${kuzzle.index} status : ${deleteResponse.status}`); + }); + } + }).then(() => { + // Create index + cy.request({ + url: `http://${kuzzle.host}:${kuzzle.port}/${kuzzle.index}/_create`, + method: 'POST', + }) + .then(createResponse => { + cy.log(`Request : create ${kuzzle.index} status : ${createResponse.status}`); + cy.wait(500); + }); + }) + .then(() => { + // Create collection + cy.request({ + url: `http://${kuzzle.host}:${kuzzle.port}/${kuzzle.index}/${kuzzle.collection}`, + method: 'PUT', + body: {} + }) + .then(createResponse => { + cy.log(`Request : create ${kuzzle.collection} status : ${createResponse.status}`); + cy.wait(500); + }); + }); +}); + +Cypress.Commands.add('loadEnvironment', (env) => { + reinitialisation(); + if (!env.messages) {return;} + env.messages.forEach(message => { + cy.createMessage(message); + }); +}); \ No newline at end of file diff --git a/doc/6/getting-started/vuejs/cypress/support/index.js b/doc/6/getting-started/vuejs/cypress/support/index.js new file mode 100644 index 000000000..d68db96df --- /dev/null +++ b/doc/6/getting-started/vuejs/cypress/support/index.js @@ -0,0 +1,20 @@ +// *********************************************************** +// This example support/index.js is processed and +// loaded automatically before your test files. +// +// This is a great place to put global configuration and +// behavior that modifies Cypress. +// +// You can change the location of this file or turn off +// automatically serving support files with the +// 'supportFile' configuration option. +// +// You can read more here: +// https://on.cypress.io/configuration +// *********************************************************** + +// Import commands.js using ES2015 syntax: +import './commands' + +// Alternatively you can use CommonJS syntax: +// require('./commands') diff --git a/doc/6/getting-started/vuejs/package.json b/doc/6/getting-started/vuejs/package.json new file mode 100644 index 000000000..299676360 --- /dev/null +++ b/doc/6/getting-started/vuejs/package.json @@ -0,0 +1,50 @@ +{ + "name": "kuzzle-vuejs-gs", + "version": "0.1.0", + "private": true, + "scripts": { + "postinstall": "if [ ! -f ../../../../dist/kuzzle.js ]; then npm run build --prefix ../../../../;fi && rm -rf ./node_modules/kuzzle-sdk/* && rsync -r --exclude 'getting-started' ../../../../ ./node_modules/kuzzle-sdk", + "serve-without-vuex": "cd without-vuex && vue-cli-service serve", + "build-without-vuex": "cd without-vuex && vue-cli-service build", + "lint-without-vuex": "cd without-vuex && vue-cli-service lint", + "test": "./node_modules/.bin/cypress run" + }, + "dependencies": { + "core-js": "^2.6.5", + "vue": "^2.6.10", + "vuex": "^3.1.1" + }, + "devDependencies": { + "@vue/cli-plugin-babel": "^3.7.0", + "@vue/cli-plugin-eslint": "^3.7.0", + "@vue/cli-service": "^3.7.0", + "babel-eslint": "^10.0.1", + "cypress": "^3.3.1", + "eslint": "^5.16.0", + "eslint-plugin-vue": "^5.0.0", + "vue-template-compiler": "^2.5.21" + }, + "eslintConfig": { + "root": true, + "env": { + "node": true + }, + "extends": [ + "plugin:vue/essential", + "eslint:recommended" + ], + "rules": {}, + "parserOptions": { + "parser": "babel-eslint" + } + }, + "postcss": { + "plugins": { + "autoprefixer": {} + } + }, + "browserslist": [ + "> 1%", + "last 2 versions" + ] +} diff --git a/doc/6/getting-started/vuejs/without-vuex/babel.config.js b/doc/6/getting-started/vuejs/without-vuex/babel.config.js new file mode 100644 index 000000000..ba179669a --- /dev/null +++ b/doc/6/getting-started/vuejs/without-vuex/babel.config.js @@ -0,0 +1,5 @@ +module.exports = { + presets: [ + '@vue/app' + ] +} diff --git a/doc/6/getting-started/vuejs/without-vuex/public/favicon.ico b/doc/6/getting-started/vuejs/without-vuex/public/favicon.ico new file mode 100644 index 0000000000000000000000000000000000000000..df36fcfb72584e00488330b560ebcf34a41c64c2 GIT binary patch literal 4286 zcmds*O-Phc6o&64GDVCEQHxsW(p4>LW*W<827=Unuo8sGpRux(DN@jWP-e29Wl%wj zY84_aq9}^Am9-cWTD5GGEo#+5Fi2wX_P*bo+xO!)p*7B;iKlbFd(U~_d(U?#hLj56 zPhFkj-|A6~Qk#@g^#D^U0XT1cu=c-vu1+SElX9NR;kzAUV(q0|dl0|%h|dI$%VICy zJnu2^L*Te9JrJMGh%-P79CL0}dq92RGU6gI{v2~|)p}sG5x0U*z<8U;Ij*hB9z?ei z@g6Xq-pDoPl=MANPiR7%172VA%r)kevtV-_5H*QJKFmd;8yA$98zCxBZYXTNZ#QFk2(TX0;Y2dt&WitL#$96|gJY=3xX zpCoi|YNzgO3R`f@IiEeSmKrPSf#h#Qd<$%Ej^RIeeYfsxhPMOG`S`Pz8q``=511zm zAm)MX5AV^5xIWPyEu7u>qYs?pn$I4nL9J!=K=SGlKLXpE<5x+2cDTXq?brj?n6sp= zphe9;_JHf40^9~}9i08r{XM$7HB!`{Ys~TK0kx<}ZQng`UPvH*11|q7&l9?@FQz;8 zx!=3<4seY*%=OlbCbcae?5^V_}*K>Uo6ZWV8mTyE^B=DKy7-sdLYkR5Z?paTgK-zyIkKjIcpyO z{+uIt&YSa_$QnN_@t~L014dyK(fOOo+W*MIxbA6Ndgr=Y!f#Tokqv}n<7-9qfHkc3 z=>a|HWqcX8fzQCT=dqVbogRq!-S>H%yA{1w#2Pn;=e>JiEj7Hl;zdt-2f+j2%DeVD zsW0Ab)ZK@0cIW%W7z}H{&~yGhn~D;aiP4=;m-HCo`BEI+Kd6 z={Xwx{TKxD#iCLfl2vQGDitKtN>z|-AdCN|$jTFDg0m3O`WLD4_s#$S literal 0 HcmV?d00001 diff --git a/doc/6/getting-started/vuejs/without-vuex/public/index.html b/doc/6/getting-started/vuejs/without-vuex/public/index.html new file mode 100644 index 000000000..5ee139839 --- /dev/null +++ b/doc/6/getting-started/vuejs/without-vuex/public/index.html @@ -0,0 +1,17 @@ + + + + + + + + kuzzle-vuejs-gs + + + +
+ + + diff --git a/doc/6/getting-started/vuejs/without-vuex/src/App.vue b/doc/6/getting-started/vuejs/without-vuex/src/App.vue new file mode 100644 index 000000000..0ed7a3f92 --- /dev/null +++ b/doc/6/getting-started/vuejs/without-vuex/src/App.vue @@ -0,0 +1,199 @@ + + + + + diff --git a/doc/6/getting-started/vuejs/without-vuex/src/assets/logo.png b/doc/6/getting-started/vuejs/without-vuex/src/assets/logo.png new file mode 100644 index 0000000000000000000000000000000000000000..f3d2503fc2a44b5053b0837ebea6e87a2d339a43 GIT binary patch literal 6849 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 h(App), +}).$mount('#app') diff --git a/doc/6/getting-started/vuejs/without-vuex/src/services/kuzzle.js b/doc/6/getting-started/vuejs/without-vuex/src/services/kuzzle.js new file mode 100644 index 000000000..06d4cdf11 --- /dev/null +++ b/doc/6/getting-started/vuejs/without-vuex/src/services/kuzzle.js @@ -0,0 +1,3 @@ +import { Kuzzle, WebSocket } from 'kuzzle-sdk'; + +export default new Kuzzle(new WebSocket('localhost')); \ No newline at end of file From 4993477ea75c7b90afb8aee50aa8f99f376dde82 Mon Sep 17 00:00:00 2001 From: Berthier Date: Mon, 1 Jul 2019 09:29:08 +0200 Subject: [PATCH 2/7] nit && fix && lint --- .../{tchat.spec.js => chat.spec.js} | 2 +- .../vuejs/without-vuex/src/App.vue | 107 +++++++++--------- 2 files changed, 56 insertions(+), 53 deletions(-) rename doc/6/getting-started/vuejs/cypress/integration/{tchat.spec.js => chat.spec.js} (98%) diff --git a/doc/6/getting-started/vuejs/cypress/integration/tchat.spec.js b/doc/6/getting-started/vuejs/cypress/integration/chat.spec.js similarity index 98% rename from doc/6/getting-started/vuejs/cypress/integration/tchat.spec.js rename to doc/6/getting-started/vuejs/cypress/integration/chat.spec.js index 6d3ad2034..fb30bce85 100644 --- a/doc/6/getting-started/vuejs/cypress/integration/tchat.spec.js +++ b/doc/6/getting-started/vuejs/cypress/integration/chat.spec.js @@ -1,4 +1,4 @@ -describe('test realtime tchat', () => { +describe('test realtime chat', () => { let currentIt = 1; let env; diff --git a/doc/6/getting-started/vuejs/without-vuex/src/App.vue b/doc/6/getting-started/vuejs/without-vuex/src/App.vue index 0ed7a3f92..b353e68c3 100644 --- a/doc/6/getting-started/vuejs/without-vuex/src/App.vue +++ b/doc/6/getting-started/vuejs/without-vuex/src/App.vue @@ -14,7 +14,11 @@
- @@ -42,96 +46,96 @@ import kuzzle from "./services/kuzzle"; export default { name: "app", -/* snippet:start:4 */ + /* snippet:start:4 */ data() { return { - message: "", // The string containing the user input - messages: [], // The array containing our messages - roomID: "", // The Id of the realtime subscription - username: "", // The pseudo of the current user + message: "", // The string containing the user input + messages: [], // The array containing our messages + roomID: "", // The Id of the realtime subscription + username: "", // The pseudo of the current user validate: false // The value that will change the display (false => Pseudo input; true => Message input) }; }, -/* snippet:end */ + /* snippet:end */ methods: { -/* snippet:start:5 */ + /* snippet:start:5 */ // This function return the right formated date depending on the timestamp getDate(timestamp) { const date = new Date(timestamp); - return date.toString().split("GMT")[0]; + return date.toLocaleString().split("GMT")[0]; }, -/* snippet:end */ -/* snippet:start:6 */ + /* snippet:end */ + /* snippet:start:6 */ // This function will create a message object containing the informations we need to display it - getMessage(hit) { + getMessage(document) { const message = { // The unique id of the document containing the message - _id: hit._id, + _id: document._id, // The text of the message - value: hit._source.value, + value: document._source.value, // The creation date - createdAt: hit._source._kuzzle_info.createdAt, + createdAt: document._source._kuzzle_info.createdAt, // The author name - username: hit._source.username + username: document._source.username }; return message; }, -/* snippet:end */ -/* snippet:start:10 */ + /* snippet:end */ + /* snippet:start:10 */ async sendMessage() { if (this.message === "") return; - // Call the create method of the document controller - await kuzzle.document.create("chat", "messages", + // Call the create method of the document controller + await kuzzle.document.create( + "chat", + "messages", // Give as parameter the object that will be store in kuzzle { value: this.message, username: this.username - }); + } + ); // Clear the user input this.message = ""; }, -/* snippet:end */ -/* snippet:start:11 */ - async subscribe_messages() { - // Call the subscribe method of the realtime controller and receive the roomId - // Save the id of our subscription (we could need it to unsubscribe) - this.roomID = await kuzzle.realtime.subscribe( - "chat", // Id of the index - "messages", // Id of the collection - {}, // Options - // Callback for notifications receive - notification => { - // Check if the notification interest us (only document creation) - if ( - notification.type === "document" && - notification.action === "create" - ) { + /* snippet:end */ + /* snippet:start:11 */ + async subscribe_messages() { + // Call the subscribe method of the realtime controller and receive the roomId + // Save the id of our subscription (we could need it to unsubscribe) + this.roomID = await kuzzle.realtime.subscribe( + "chat", // Id of the index + "messages", // Id of the collection + {}, // Filter + // Callback for notifications receive + notification => { + // Check if the notification interest us (only document creation) + if (notification.type !== "document") return; + if (notification.action !== "create") return; // Add the new message to our array this.messages = [ this.getMessage(notification.result), ...this.messages ]; } - } - ); - }, -/* snippet:end */ -/* snippet:start:7 */ + ); + }, + /* snippet:end */ + /* snippet:start:7 */ async fetch_messages() { - // Call the search method of the document controller - const results = await kuzzle.document.search( - "chat", // Name of the index - "messages", // Name of the collection - { sort: ["_kuzzle_info.createdAt"] }, // Query => Sort the messages by creation date - { size: 100 } // Options => get a maximum of 100 messages - ); + // Call the search method of the document controller + const results = await kuzzle.document.search( + "chat", // Name of the index + "messages", // Name of the collection + { sort: ["_kuzzle_info.createdAt"] }, // Query => Sort the messages by creation date + { size: 100 } // Options => get a maximum of 100 messages + ); // Add each message to our array results.hits.map(hit => { this.messages = [this.getMessage(hit), ...this.messages]; }); }, -/* snippet:end */ -/* snippet:start:2 */ + /* snippet:end */ + /* snippet:start:2 */ async valid() { // Etablish the connection await kuzzle.connect(); @@ -195,5 +199,4 @@ export default { margin-bottom: 10px; } /* snippet:end */ - From e38c7244dcc4b3f1173e02791344343401fbd5b0 Mon Sep 17 00:00:00 2001 From: Berthier Esteban <44427849+berthieresteban@users.noreply.github.com> Date: Mon, 1 Jul 2019 10:35:33 +0200 Subject: [PATCH 3/7] Update doc/6/getting-started/vuejs/without-vuex/src/App.vue Co-Authored-By: Adrien Maret --- doc/6/getting-started/vuejs/without-vuex/src/App.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/doc/6/getting-started/vuejs/without-vuex/src/App.vue b/doc/6/getting-started/vuejs/without-vuex/src/App.vue index b353e68c3..11ff4162c 100644 --- a/doc/6/getting-started/vuejs/without-vuex/src/App.vue +++ b/doc/6/getting-started/vuejs/without-vuex/src/App.vue @@ -49,7 +49,7 @@ export default { /* snippet:start:4 */ data() { return { - message: "", // The string containing the user input + message: "", // String containing the user input messages: [], // The array containing our messages roomID: "", // The Id of the realtime subscription username: "", // The pseudo of the current user From bc576348775a3986edfaba6a507b7e4b47104395 Mon Sep 17 00:00:00 2001 From: Berthier Esteban <44427849+berthieresteban@users.noreply.github.com> Date: Mon, 1 Jul 2019 10:35:40 +0200 Subject: [PATCH 4/7] Update doc/6/getting-started/vuejs/without-vuex/src/App.vue Co-Authored-By: Adrien Maret --- doc/6/getting-started/vuejs/without-vuex/src/App.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/doc/6/getting-started/vuejs/without-vuex/src/App.vue b/doc/6/getting-started/vuejs/without-vuex/src/App.vue index 11ff4162c..426ee679c 100644 --- a/doc/6/getting-started/vuejs/without-vuex/src/App.vue +++ b/doc/6/getting-started/vuejs/without-vuex/src/App.vue @@ -50,7 +50,7 @@ export default { data() { return { message: "", // String containing the user input - messages: [], // The array containing our messages + messages: [], // Array containing our messages roomID: "", // The Id of the realtime subscription username: "", // The pseudo of the current user validate: false // The value that will change the display (false => Pseudo input; true => Message input) From 529835479cef0e952dc5e86a6c20278c55843f97 Mon Sep 17 00:00:00 2001 From: Berthier Esteban <44427849+berthieresteban@users.noreply.github.com> Date: Mon, 1 Jul 2019 10:35:49 +0200 Subject: [PATCH 5/7] Update doc/6/getting-started/vuejs/without-vuex/src/App.vue Co-Authored-By: Adrien Maret --- doc/6/getting-started/vuejs/without-vuex/src/App.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/doc/6/getting-started/vuejs/without-vuex/src/App.vue b/doc/6/getting-started/vuejs/without-vuex/src/App.vue index 426ee679c..12b61216a 100644 --- a/doc/6/getting-started/vuejs/without-vuex/src/App.vue +++ b/doc/6/getting-started/vuejs/without-vuex/src/App.vue @@ -51,7 +51,7 @@ export default { return { message: "", // String containing the user input messages: [], // Array containing our messages - roomID: "", // The Id of the realtime subscription + roomID: "", // Id of the realtime subscription username: "", // The pseudo of the current user validate: false // The value that will change the display (false => Pseudo input; true => Message input) }; From 7441da079e7b7cff3bb68c62f859837539bfcc18 Mon Sep 17 00:00:00 2001 From: Berthier Esteban <44427849+berthieresteban@users.noreply.github.com> Date: Mon, 1 Jul 2019 10:36:23 +0200 Subject: [PATCH 6/7] Update doc/6/getting-started/vuejs/without-vuex/src/App.vue Co-Authored-By: Adrien Maret --- doc/6/getting-started/vuejs/without-vuex/src/App.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/doc/6/getting-started/vuejs/without-vuex/src/App.vue b/doc/6/getting-started/vuejs/without-vuex/src/App.vue index 12b61216a..14d03307d 100644 --- a/doc/6/getting-started/vuejs/without-vuex/src/App.vue +++ b/doc/6/getting-started/vuejs/without-vuex/src/App.vue @@ -53,7 +53,7 @@ export default { messages: [], // Array containing our messages roomID: "", // Id of the realtime subscription username: "", // The pseudo of the current user - validate: false // The value that will change the display (false => Pseudo input; true => Message input) + validate: false // Value that will change the display (false => Pseudo input; true => Message input) }; }, /* snippet:end */ From b8b2c35055a6fde2593e394572b47178acc2f7c0 Mon Sep 17 00:00:00 2001 From: Berthier Esteban <44427849+berthieresteban@users.noreply.github.com> Date: Mon, 1 Jul 2019 10:49:02 +0200 Subject: [PATCH 7/7] Update doc/6/getting-started/vuejs/without-vuex/src/App.vue Co-Authored-By: Adrien Maret --- doc/6/getting-started/vuejs/without-vuex/src/App.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/doc/6/getting-started/vuejs/without-vuex/src/App.vue b/doc/6/getting-started/vuejs/without-vuex/src/App.vue index 14d03307d..1d64093ae 100644 --- a/doc/6/getting-started/vuejs/without-vuex/src/App.vue +++ b/doc/6/getting-started/vuejs/without-vuex/src/App.vue @@ -52,7 +52,7 @@ export default { message: "", // String containing the user input messages: [], // Array containing our messages roomID: "", // Id of the realtime subscription - username: "", // The pseudo of the current user + username: "", // Nickname of the current user validate: false // Value that will change the display (false => Pseudo input; true => Message input) }; },