Skip to content

Commit ed9d6f6

Browse files
AnaethelionAnaethelion
authored
[Examples] Fix vue dependancy in xkcdsearch index html (#418) (#423)
1 parent a402a10 commit ed9d6f6

File tree

1 file changed

+41
-36
lines changed

1 file changed

+41
-36
lines changed

‎_examples/xkcdsearch/web/index.html

+41-36
Original file line numberDiff line numberDiff line change
@@ -1,53 +1,58 @@
11
<!DOCTYPE html>
22
<html>
33
<head>
4-
<title>xkcdsearch</title>
5-
<link href="data:image/x-icon;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQEAYAAABPYyMiAAAABmJLR0T///////8JWPfcAAAACXBIWXMAAABIAAAASABGyWs+AAAAF0lEQVRIx2NgGAWjYBSMglEwCkbBSAcACBAAAeaR9cIAAAAASUVORK5CYII=" rel="icon" type="image/x-icon">
6-
<link rel="stylesheet" type="text/css" href="style.css">
4+
<title>xkcdsearch</title>
5+
<link href="data:image/x-icon;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQEAYAAABPYyMiAAAABmJLR0T///////8JWPfcAAAACXBIWXMAAABIAAAASABGyWs+AAAAF0lEQVRIx2NgGAWjYBSMglEwCkbBSAcACBAAAeaR9cIAAAAASUVORK5CYII="
6+
rel="icon" type="image/x-icon">
7+
<link href="style.css" rel="stylesheet" type="text/css">
78
</head>
89
<body>
9-
<div v-bind:class="{loading:state.loading}" id="app" v-cloak>
10+
<div id="app" v-bind:class="{loading:state.loading}" v-cloak>
1011
<div id="search-form">
11-
<form v-on:submit.prevent="">
12-
<input v-model.lazy="query" type="text" size="50" placeholder="Search...">
13-
</form>
14-
<p class="total"><span class="label"># results/</span><span class="content">{{ total }}</span></p>
12+
<form v-on:submit.prevent="">
13+
<input placeholder="Search..." size="50" type="text" v-model.lazy="query">
14+
</form>
15+
<p class="total"><span class="label"># results/</span><span class="content">{{ total }}</span></p>
1516
</div>
1617

17-
<div v-if="total < 1 && !state.loading" class="no-results">
18-
<p>Sorry, no results for your query&hellip;</p>
18+
<div class="no-results" v-if="total < 1 && !state.loading">
19+
<p>Sorry, no results for your query&hellip;</p>
1920
</div>
2021

21-
<div v-for="result in results" v-bind:id="result.id" :key="result.id" class="result">
22-
<h2>
23-
<span v-html="result.title" class="title"></span>
24-
<span class="published">/{{ result.published }}/</span>
25-
</h2>
26-
<div class="highlights">
27-
<p v-show="result.alt" class="alt">
28-
<span class="label">Alt/</span>
29-
<span v-html="result.alt" class="content"></span>
30-
</p>
31-
<p v-show="result.transcript" class="transcript">
32-
<span class="label">Transcript/</span>
33-
<span v-html="result.transcript" class="content"></span>
34-
</p>
35-
</div>
36-
<a v-bind:href="result.url" v-bind:title="result.alt">
37-
<img v-bind:src="result.image_url" v-bind:alt="result.alt" v-on:mouseover="toggle($event)" v-on:mouseout="toggle($event)">
38-
</a>
22+
<div :key="result.id" class="result" v-bind:id="result.id" v-for="result in results">
23+
<h2>
24+
<span class="title" v-html="result.title"></span>
25+
<span class="published">/{{ result.published }}/</span>
26+
</h2>
27+
<div class="highlights">
28+
<p class="alt" v-show="result.alt">
29+
<span class="label">Alt/</span>
30+
<span class="content" v-html="result.alt"></span>
31+
</p>
32+
<p class="transcript" v-show="result.transcript">
33+
<span class="label">Transcript/</span>
34+
<span class="content" v-html="result.transcript"></span>
35+
</p>
36+
</div>
37+
<a v-bind:href="result.url" v-bind:title="result.alt">
38+
<img v-bind:alt="result.alt" v-bind:src="result.image_url" v-on:mouseout="toggle($event)"
39+
v-on:mouseover="toggle($event)">
40+
</a>
3941
</div>
40-
<p v-show="state.fetching" id="loading-results">Loading results...</p>
42+
<p id="loading-results" v-show="state.fetching">Loading results...</p>
4143

42-
<p v-show="state.loading" id="loading-app">Loading the application...</p>
43-
<p v-if="state.error" id="app-error">[{{ state.error.status }}] {{ state.error.statusText }}</p>
44-
</div>
44+
<p id="loading-app" v-show="state.loading">Loading the application...</p>
45+
<p id="app-error" v-if="state.error">[{{ state.error.status }}] {{ state.error.statusText }}</p>
46+
</div>
4547

46-
<a href="https://github.com/elastic/go-elasticsearch/tree/master/_examples/xkcd" title="See the source code at GitHub" style="position: fixed; top: 0; right: 0; border: 0; display: inline-block;"><img src="/assets/images/github-ribbon.svg" width="50px" height="50px" alt=""></a>
48+
<a href="https://github.com/elastic/go-elasticsearch/tree/master/_examples/xkcd"
49+
style="position: fixed; top: 0; right: 0; border: 0; display: inline-block;"
50+
title="See the source code at GitHub"><img alt="" height="50px" src="/assets/images/github-ribbon.svg" width="50px"></a>
4751

48-
<a href="https://xkcd.com/license.html" style="position: fixed; bottom: 0; right: 0; border: 0; display: inline-block;"><img src="https://mirrors.creativecommons.org/presskit/buttons/80x15/png/by-nc.png" height="15px"></img></a>
52+
<a href="https://xkcd.com/license.html" style="position: fixed; bottom: 0; right: 0; border: 0; display: inline-block;"><img
53+
height="15px" src="https://mirrors.creativecommons.org/presskit/buttons/80x15/png/by-nc.png"></img></a>
4954

50-
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
51-
<script src="/application.js"></script>
55+
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14"></script>
56+
<script src="/application.js"></script>
5257
</body>
5358
</html>

0 commit comments

Comments
 (0)