Skip to content

Commit 3db40bd

Browse files
bors[bot]bidoubiwa
andauthored
Merge #935
935: Add playgrounds r=bidoubiwa a=bidoubiwa Add a playground to hot reload during development Co-authored-by: Charlotte Vermandel <[email protected]>
2 parents f2afd7e + 47bb622 commit 3db40bd

File tree

10 files changed

+427
-1
lines changed

10 files changed

+427
-1
lines changed

.npmignore

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@
33

44
## Tests
55
examples/
6+
playgrounds/
67
tests/
78

89
## Builds
@@ -25,3 +26,4 @@ node_modules/
2526
## this is generated by `npm pack`
2627
*.tgz
2728
package
29+
assets

assets/small_movies.json

Lines changed: 212 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,212 @@
1+
[
2+
{
3+
"id": "287947",
4+
"title": "Shazam!",
5+
"poster": "https://image.tmdb.org/t/p/w1280/xnopI5Xtky18MPhK40cZAGAOVeV.jpg",
6+
"overview": "A boy is given the ability to become an adult superhero in times of need with a single magic word.",
7+
"release_date": 1553299200
8+
},
9+
{
10+
"id": "299537",
11+
"title": "Captain Marvel",
12+
"poster": "https://image.tmdb.org/t/p/w1280/AtsgWhDnHTq68L0lLsUrCnM7TjG.jpg",
13+
"overview": "The story follows Carol Danvers as she becomes one of the universe’s most powerful heroes when Earth is caught in the middle of a galactic war between two alien races. Set in the 1990s, Captain Marvel is an all-new adventure from a previously unseen period in the history of the Marvel Cinematic Universe.",
14+
"release_date": 1551830400
15+
},
16+
{
17+
"id": "522681",
18+
"title": "Escape Room",
19+
"poster": "https://image.tmdb.org/t/p/w1280/8yZAx7tlKRZIg7pJfaPhl00yHIQ.jpg",
20+
"overview": "Six strangers find themselves in circumstances beyond their control, and must use their wits to survive.",
21+
"release_date": 1546473600
22+
},
23+
{
24+
"id": "166428",
25+
"title": "How to Train Your Dragon: The Hidden World",
26+
"poster": "https://image.tmdb.org/t/p/w1280/xvx4Yhf0DVH8G4LzNISpMfFBDy2.jpg",
27+
"overview": "As Hiccup fulfills his dream of creating a peaceful dragon utopia, Toothless’ discovery of an untamed, elusive mate draws the Night Fury away. When danger mounts at home and Hiccup’s reign as village chief is tested, both dragon and rider must make impossible decisions to save their kind.",
28+
"release_date": 1546473600
29+
},
30+
{
31+
"id": "450465",
32+
"title": "Glass",
33+
"poster": "https://image.tmdb.org/t/p/w1280/svIDTNUoajS8dLEo7EosxvyAsgJ.jpg",
34+
"overview": "In a series of escalating encounters, security guard David Dunn uses his supernatural abilities to track Kevin Wendell Crumb, a disturbed man who has twenty-four personalities. Meanwhile, the shadowy presence of Elijah Price emerges as an orchestrator who holds secrets critical to both men.",
35+
"release_date": 1547596800
36+
},
37+
{
38+
"id": "495925",
39+
"title": "Doraemon the Movie: Nobita's Treasure Island",
40+
"poster": "https://image.tmdb.org/t/p/w1280/cmJ71gdZxCqkMUvGwWgSg3MK7pC.jpg",
41+
"overview": "The story is based on Robert Louis Stevenson's Treasure Island novel.",
42+
"release_date": 1520035200
43+
},
44+
{
45+
"id": "329996",
46+
"title": "Dumbo",
47+
"poster": "https://image.tmdb.org/t/p/w1280/279PwJAcelI4VuBtdzrZASqDPQr.jpg",
48+
"overview": "A young elephant, whose oversized ears enable him to fly, helps save a struggling circus, but when the circus plans a new venture, Dumbo and his friends discover dark secrets beneath its shiny veneer.",
49+
"release_date": 1553644800
50+
},
51+
{
52+
"id": "299536",
53+
"title": "Avengers: Infinity War",
54+
"poster": "https://image.tmdb.org/t/p/w1280/7WsyChQLEftFiDOVTGkv3hFpyyt.jpg",
55+
"overview": "As the Avengers and their allies have continued to protect the world from threats too large for any one hero to handle, a new danger has emerged from the cosmic shadows: Thanos. A despot of intergalactic infamy, his goal is to collect all six Infinity Stones, artifacts of unimaginable power, and use them to inflict his twisted will on all of reality. Everything the Avengers have fought for has led up to this moment - the fate of Earth and existence itself has never been more uncertain.",
56+
"release_date": 1524618000
57+
},
58+
{
59+
"id": "458723",
60+
"title": "Us",
61+
"poster": "https://image.tmdb.org/t/p/w1280/ux2dU1jQ2ACIMShzB3yP93Udpzc.jpg",
62+
"overview": "Husband and wife Gabe and Adelaide Wilson take their kids to their beach house expecting to unplug and unwind with friends. But as night descends, their serenity turns to tension and chaos when some shocking visitors arrive uninvited.",
63+
"release_date": 1552521600
64+
},
65+
{
66+
"id": "424783",
67+
"title": "Bumblebee",
68+
"poster": "https://image.tmdb.org/t/p/w1280/fw02ONlDhrYjTSZV8XO6hhU3ds3.jpg",
69+
"overview": "On the run in the year 1987, Bumblebee finds refuge in a junkyard in a small Californian beach town. Charlie, on the cusp of turning 18 and trying to find her place in the world, discovers Bumblebee, battle-scarred and broken. When Charlie revives him, she quickly learns this is no ordinary yellow VW bug.",
70+
"release_date": 1544832000
71+
},
72+
{
73+
"id": "920",
74+
"title": "Cars",
75+
"poster": "https://image.tmdb.org/t/p/w1280/5damnMcRFKSjhCirgX3CMa88MBj.jpg",
76+
"overview": "Lightning McQueen, a hotshot rookie race car driven to succeed, discovers that life is about the journey, not the finish line, when he finds himself unexpectedly detoured in the sleepy Route 66 town of Radiator Springs. On route across the country to the big Piston Cup Championship in California to compete against two seasoned pros, McQueen gets to know the town's offbeat characters.",
77+
"release_date": 1149728400
78+
},
79+
{
80+
"id": "299534",
81+
"title": "Avengers: Endgame",
82+
"poster": "https://image.tmdb.org/t/p/w1280/dHjLaIUHXcMBt7YxK1TKWK1end9.jpg",
83+
"overview": "After the devastating events of Avengers: Infinity War, the universe is in ruins due to the efforts of the Mad Titan, Thanos. With the help of remaining allies, the Avengers must assemble once more in order to undo Thanos' actions and restore order to the universe once and for all, no matter what consequences may be in store.",
84+
"release_date": 1556067600
85+
},
86+
{
87+
"id": "324857",
88+
"title": "Spider-Man: Into the Spider-Verse",
89+
"poster": "https://image.tmdb.org/t/p/w1280/iiZZdoQBEYBv6id8su7ImL0oCbD.jpg",
90+
"overview": "Miles Morales is juggling his life between being a high school student and being a spider-man. When Wilson 'Kingpin' Fisk uses a super collider, others from across the Spider-Verse are transported to this dimension.",
91+
"release_date": 1544140800
92+
},
93+
{
94+
"id": "157433",
95+
"title": "Pet Sematary",
96+
"poster": "https://image.tmdb.org/t/p/w1280/7SPhr7Qj39vbnfF9O2qHRYaKHAL.jpg",
97+
"overview": "Louis Creed, his wife Rachel and their two children Gage and Ellie move to a rural home where they are welcomed and enlightened about the eerie 'Pet Sematary' located nearby. After the tragedy of their cat being killed by a truck, Louis resorts to burying it in the mysterious pet cemetery, which is definitely not as it seems, as it proves to the Creeds that sometimes dead is better.",
98+
"release_date": 1554339600
99+
},
100+
{
101+
"id": "456740",
102+
"title": "Hellboy",
103+
"poster": "https://image.tmdb.org/t/p/w1280/nUXCJMnAiwCpNPZuJH2n6h5hGtF.jpg",
104+
"overview": "Hellboy comes to England, where he must defeat Nimue, Merlin's consort and the Blood Queen. But their battle will bring about the end of the world, a fate he desperately tries to turn away.",
105+
"release_date": 1554944400
106+
},
107+
{
108+
"id": "537915",
109+
"title": "After",
110+
"poster": "https://image.tmdb.org/t/p/w1280/u3B2YKUjWABcxXZ6Nm9h10hLUbh.jpg",
111+
"overview": "A young woman falls for a guy with a dark secret and the two embark on a rocky relationship.",
112+
"release_date": 1554944400
113+
},
114+
{
115+
"id": "485811",
116+
"title": "Redcon-1",
117+
"poster": "https://image.tmdb.org/t/p/w1280/vVPrWngVJ2cfYAncBedQty69Dlf.jpg",
118+
"overview": "After a zombie apocalypse spreads from a London prison, the UK is brought to its knees. The spread of the virus is temporarily contained but, without a cure, it’s only a matter of time before it breaks its boundaries and the biggest problem of all… any zombies with combat skills are now enhanced. With the South East of England quarantined from the rest of the world using fortified borders, intelligence finds that the scientist responsible for the outbreak is alive and well in London. With his recovery being the only hope of a cure, a squad of eight Special Forces soldiers is sent on a suicide mission to the city, now ruled by the undead, with a single task: get him out alive within 72 hours by any means necessary. What emerges is an unlikely pairing on a course to save humanity against ever-rising odds.",
119+
"release_date": 1538096400
120+
},
121+
{
122+
"id": "471507",
123+
"title": "Destroyer",
124+
"poster": "https://image.tmdb.org/t/p/w1280/sHw9gTdo43nJL82py0oaROkXXNr.jpg",
125+
"overview": "Erin Bell is an LAPD detective who, as a young cop, was placed undercover with a gang in the California desert with tragic results. When the leader of that gang re-emerges many years later, she must work her way back through the remaining members and into her own history with them to finally reckon with the demons that destroyed her past.",
126+
"release_date": 1545696000
127+
},
128+
{
129+
"id": "400650",
130+
"title": "Mary Poppins Returns",
131+
"poster": "https://image.tmdb.org/t/p/w1280/uTVGku4LibMGyKgQvjBtv3OYfAX.jpg",
132+
"overview": "In Depression-era London, a now-grown Jane and Michael Banks, along with Michael's three children, are visited by the enigmatic Mary Poppins following a personal loss. Through her unique magical skills, and with the aid of her friend Jack, she helps the family rediscover the joy and wonder missing in their lives.",
133+
"release_date": 1544659200
134+
},
135+
{
136+
"id": "297802",
137+
"title": "Aquaman",
138+
"poster": "https://image.tmdb.org/t/p/w1280/5Kg76ldv7VxeX9YlcQXiowHgdX6.jpg",
139+
"overview": "Once home to the most advanced civilization on Earth, Atlantis is now an underwater kingdom ruled by the power-hungry King Orm. With a vast army at his disposal, Orm plans to conquer the remaining oceanic people and then the surface world. Standing in his way is Arthur Curry, Orm's half-human, half-Atlantean brother and true heir to the throne.",
140+
"release_date": 1544140800
141+
},
142+
{
143+
"id": "512196",
144+
"title": "Happy Death Day 2U",
145+
"poster": "https://image.tmdb.org/t/p/w1280/4tdnePOkOOzwuGPEOAHp8UA4vqx.jpg",
146+
"overview": "Collegian Tree Gelbman wakes up in horror to learn that she's stuck in a parallel universe. Her boyfriend Carter is now with someone else, and her friends and fellow students seem to be completely different versions of themselves. When Tree discovers that Carter's roommate has been altering time, she finds herself once again the target of a masked killer. When the psychopath starts to go after her inner circle, Tree soon realizes that she must die over and over again to save everyone.",
147+
"release_date": 1550016000
148+
},
149+
{
150+
"id": "390634",
151+
"title": "Fate/stay night: Heaven’s Feel II. lost butterfly",
152+
"poster": "https://image.tmdb.org/t/p/w1280/4tS0iyKQBDFqVpVcH21MSJwXZdq.jpg",
153+
"overview": "Theatrical-release adaptation of the visual novel 'Fate/stay night', following the third and final route. (Part 2 of a trilogy.)",
154+
"release_date": 1547251200
155+
},
156+
{
157+
"id": "500682",
158+
"title": "The Highwaymen",
159+
"poster": "https://image.tmdb.org/t/p/w1280/4bRYg4l12yDuJvAfqvUOPnBrxno.jpg",
160+
"overview": "In 1934, Frank Hamer and Manny Gault, two former Texas Rangers, are commissioned to put an end to the wave of vicious crimes perpetrated by Bonnie Parker and Clyde Barrow, a notorious duo of infamous robbers and cold-blooded killers who nevertheless are worshiped by the public.",
161+
"release_date": 1552608000
162+
},
163+
{
164+
"id": "454294",
165+
"title": "The Kid Who Would Be King",
166+
"poster": "https://image.tmdb.org/t/p/w1280/kBuvLX6zynQP0sjyqbXV4jNaZ4E.jpg",
167+
"overview": "Old-school magic meets the modern world when young Alex stumbles upon the mythical sword Excalibur. He soon unites his friends and enemies, and they become knights who join forces with the legendary wizard Merlin. Together, they must save mankind from the wicked enchantress Morgana and her army of supernatural warriors.",
168+
"release_date": 1547596800
169+
},
170+
{
171+
"id": "543103",
172+
"title": "Kamen Rider Heisei Generations FOREVER",
173+
"poster": "https://image.tmdb.org/t/p/w1280/6sOFQDlkY6El1B2P5gklzJfVdsT.jpg",
174+
"overview": "In the world of Sougo Tokiwa and Sento Kiryu, their 'companions' are losing their memories one after the other as they're replaced by other people. The Super Time Jacker, Tid , appears before them. He orders his powerful underlings, Another Double and Another Den-O, to pursue a young boy called Shingo. While fighting to protect Shingo, Sougo meets Ataru, a young man who loves Riders, but Ataru says that Kamen Riders aren't real. What is the meaning of those words? While the mystery deepens, the true enemy that Sougo and Sento must defeat appears in the Kuriogatake mountain...",
175+
"release_date": 1545436800
176+
},
177+
{
178+
"id": "404368",
179+
"title": "Ralph Breaks the Internet",
180+
"poster": "https://image.tmdb.org/t/p/w1280/lvfIaThG5HA8THf76nghKinjjji.jpg",
181+
"overview": "Video game bad guy Ralph and fellow misfit Vanellope von Schweetz must risk it all by traveling to the World Wide Web in search of a replacement part to save Vanellope's video game, 'Sugar Rush.' In way over their heads, Ralph and Vanellope rely on the citizens of the internet -- the netizens -- to help navigate their way, including an entrepreneur named Yesss, who is the head algorithm and the heart and soul of trend-making site BuzzzTube.",
182+
"release_date": 1542672000
183+
},
184+
{
185+
"id": "338952",
186+
"title": "Fantastic Beasts: The Crimes of Grindelwald",
187+
"poster": "https://image.tmdb.org/t/p/w1280/fMMrl8fD9gRCFJvsx0SuFwkEOop.jpg",
188+
"overview": "Gellert Grindelwald has escaped imprisonment and has begun gathering followers to his cause—elevating wizards above all non-magical beings. The only one capable of putting a stop to him is the wizard he once called his closest friend, Albus Dumbledore. However, Dumbledore will need to seek help from the wizard who had thwarted Grindelwald once before, his former student Newt Scamander, who agrees to help, unaware of the dangers that lie ahead. Lines are drawn as love and loyalty are tested, even among the truest friends and family, in an increasingly divided wizarding world.",
189+
"release_date": 1542153600
190+
},
191+
{
192+
"id": "399579",
193+
"title": "Alita: Battle Angel",
194+
"poster": "https://image.tmdb.org/t/p/w1280/xRWht48C2V8XNfzvPehyClOvDni.jpg",
195+
"overview": "When Alita awakens with no memory of who she is in a future world she does not recognize, she is taken in by Ido, a compassionate doctor who realizes that somewhere in this abandoned cyborg shell is the heart and soul of a young woman with an extraordinary past.",
196+
"release_date": 1548892800
197+
},
198+
{
199+
"id": "450001",
200+
"title": "Master Z: Ip Man Legacy",
201+
"poster": "https://image.tmdb.org/t/p/w1280/nkCoAik5I4j3Gkd2upj9xv4F0QN.jpg",
202+
"overview": "After being defeated by Ip Man, Cheung Tin Chi is attempting to keep a low profile. While going about his business, he gets into a fight with a foreigner by the name of Davidson, who is a big boss behind the bar district. Tin Chi fights hard with Wing Chun and earns respect.",
203+
"release_date": 1545264000
204+
},
205+
{
206+
"id": "504172",
207+
"title": "The Mule",
208+
"poster": "https://image.tmdb.org/t/p/w1280/oeZh7yEz3PMnZLgBPhrafFHRbVz.jpg",
209+
"overview": "Earl Stone, a man in his 80s who is broke, alone, and facing foreclosure of his business when he is offered a job that simply requires him to drive. Easy enough, but, unbeknownst to Earl, he’s just signed on as a drug courier for a Mexican cartel. He does so well that his cargo increases exponentially, and Earl hit the radar of hard-charging DEA agent Colin Bates.",
210+
"release_date": 1544745600
211+
}
212+
]

playgrounds/javascript/.gitignore

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
node_modules
2+
.DS_Store
3+
dist
4+
dist-ssr
5+
*.local

playgrounds/javascript/README.md

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
# Vanilla JavaScript Playground
2+
3+
## Required
4+
5+
- Yarn or NPM
6+
- Parent directory should have its packages installed
7+
8+
## Start
9+
10+
First:
11+
12+
```
13+
yarn install
14+
```
15+
16+
Run development server
17+
```
18+
yarn dev
19+
```
20+
21+
## Play
22+
23+
When running `yarn dev` a server it should be served on `http://localhost:3000/`.
24+
25+
Changes in `main.js` and `../../src` hot reload the server.

playgrounds/javascript/index.html

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
<title>MeiliSearch Playground</title>
7+
</head>
8+
<body>
9+
<div id="app"></div>
10+
<script type="module" src="/main.js"></script>
11+
</body>
12+
</html>

playgrounds/javascript/main.js

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
import './style.css'
2+
import { MeiliSearch } from '../../src/meilisearch'
3+
import dataset from '../../assets/small_movies.json'
4+
5+
const INDEX = 'js_playground'
6+
const client = new MeiliSearch({
7+
host: 'http://localhost:7700',
8+
apiKey: 'masterKey',
9+
})
10+
11+
async function sleep(ms) {
12+
return await new Promise((resolve) => setTimeout(resolve, ms))
13+
}
14+
15+
;(async () => {
16+
// Delete if exist
17+
try {
18+
await client.index(INDEX).delete()
19+
} catch (e) {
20+
console.log('nop')
21+
}
22+
// index instance
23+
const index = client.index(INDEX)
24+
25+
// add documents
26+
const { updateId } = await index.addDocuments(dataset)
27+
await index.waitForPendingUpdate(updateId)
28+
29+
// wait for
30+
await sleep(1000)
31+
32+
// documents
33+
const documents = await index.getDocuments()
34+
35+
// indexes
36+
const indexes = await client.listIndexes()
37+
38+
// search response
39+
const response = await index.search('the')
40+
41+
console.log({
42+
indexes,
43+
documents,
44+
response,
45+
})
46+
47+
document.querySelector('#app').innerHTML = `
48+
<div><h2>Indexes</h2> ${indexes
49+
.map((index) => `\n<div>${index.name}</div>`)
50+
.join('')}</div> <br>
51+
<div><h2>Documents</h2> ${documents
52+
.map((doc) => `\n<div>${doc.title}</div>`)
53+
.slice(0, 5)
54+
.join('')}</div>
55+
<div><h2>Search</h2> ${response.hits
56+
.map((hit) => `\n<div>${hit.title}</div>`)
57+
.slice(0, 5)
58+
.join('')}</div>
59+
`
60+
})()
Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
{
2+
"version": "0.0.0",
3+
"scripts": {
4+
"dev": "vite",
5+
"build": "vite build",
6+
"serve": "vite preview"
7+
},
8+
"devDependencies": {
9+
"vite": "^2.4.0"
10+
},
11+
"dependencies": {}
12+
}

playgrounds/javascript/style.css

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
#app {
2+
font-family: Avenir, Helvetica, Arial, sans-serif;
3+
-webkit-font-smoothing: antialiased;
4+
-moz-osx-font-smoothing: grayscale;
5+
text-align: center;
6+
color: #2c3e50;
7+
margin-top: 60px;
8+
}

0 commit comments

Comments
 (0)