Skip to content

Commit f387552

Browse files
astroanuastroanu
committed
updates
1 parent a0a2cb3 commit f387552

11 files changed

Lines changed: 143 additions & 106 deletions

File tree

‎vue/index.html‎

Lines changed: 1 addition & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -12,12 +12,6 @@
1212
content="An API for astronomical data retrival and processing for developers. With the API developers can fetch almanac data, astronomical data for planets, stars and satellites." />
1313
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/milligram/1.4.1/milligram.min.css" />
1414
<script src="https://maps.googleapis.com/maps/api/js?libraries=places" async defer></script>
15-
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.30.1/moment.min.js"></script>
16-
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.7.16/vue.common.dev.js"
17-
integrity="sha512-GO+HtElgvDSLcjZttScpq+bQFO+5ZEgcq9naSLr2Cm0f6TCu3B5zafoybXZoxu8XQDGWRXEBpEetJF0JXfXJHg=="
18-
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
19-
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue-router/4.5.1/vue-router.js"></script>
20-
<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/1.12.2/axios.js"></script>
2115
<style>
2216
a {
2317
color: #d49254;
@@ -79,9 +73,7 @@
7973
</head>
8074

8175
<body>
82-
<div id="app">
83-
<router-view></router-view>
84-
</div>
76+
<div id="app"></div>
8577
</body>
8678

8779
</html>

‎vue/js/App.vue‎

Lines changed: 5 additions & 81 deletions
Original file line numberDiff line numberDiff line change
@@ -1,95 +1,19 @@
11
<template>
2-
<div class="container">
3-
<h2>
4-
<img
5-
src="https://www.gitbook.com/cdn-cgi/image/width=40,height=40,fit=contain,dpr=1,format=auto/https%3A%2F%2F2229349915-files.gitbook.io%2F~%2Ffiles%2Fv0%2Fb%2Fgitbook-legacy-files%2Fo%2Fspaces%252F-MKQ7_I-c79Ln1c6Chop%252Favatar-1603563866478.png%3Fgeneration%3D1603563866686051%26alt%3Dmedia"
6-
/>
7-
Astronomy API - Demo
8-
</h2>
9-
10-
<div class="row">
11-
<div class="column column-25">
12-
<p>
13-
Copy your App Id and the App Secret from the
14-
<a href="https://astronomyapi.com/dashboard" target="_blank"
15-
>Astronomy API console</a
16-
>
17-
paste below to see the samples in action.
18-
</p>
19-
<form>
20-
<fieldset>
21-
<label>App Id</label>
22-
<input
23-
v-model="store.appId"
24-
@change="validateCredentials"
25-
type="text"
26-
/>
27-
<label>App Secret</label>
28-
<input
29-
v-model="store.appSecret"
30-
@change="validateCredentials"
31-
type="password"
32-
/>
33-
</fieldset>
34-
</form>
35-
36-
<div v-bind:class="messageClass" v-if="status">{{ status }}</div>
37-
38-
<p v-if="store.credentialsValid">Explore each endpoint below.</p>
39-
40-
<ul v-if="store.credentialsValid">
41-
<li>
42-
<router-link to="/positions">Planetary Positions</router-link>
43-
</li>
44-
<li><router-link to="/star-chart">Star Charts</router-link></li>
45-
<li><router-link to="/moon-phase">Moon Phase</router-link></li>
46-
<li><router-link to="/search">Search</router-link></li>
47-
</ul>
48-
</div>
49-
</div>
50-
<div class="column column-75"></div>
51-
</div>
2+
<router-view></router-view>
523
</template>
534

545
<script>
556
import { store } from "./store.js";
7+
import Home from "./components/Home.vue";
568
579
export default {
10+
components: {
11+
Home: Home,
12+
},
5813
data() {
5914
return {
6015
store,
61-
status: "",
62-
messageClass: "",
6316
};
6417
},
65-
methods: {
66-
validateCredentials() {
67-
if (!store.appId || !store.appSecret) {
68-
return;
69-
}
70-
71-
this.status = "Checking Credentials...";
72-
axios
73-
.get(`${store.apiEndpoint}/api/v2/bodies`, {
74-
headers: {
75-
"X-Requested-With": "XMLHttpRequest",
76-
Authorization: `Basic ${btoa(`${store.appId}:${store.appSecret}`)}`,
77-
},
78-
})
79-
.then((response) => {
80-
console.log(response);
81-
82-
this.status = "Credentials valid";
83-
this.messageClass = "success";
84-
this.store.credentialsValid = true;
85-
})
86-
.catch((e) => {
87-
console.log(e);
88-
89-
this.status = "Credential validation failed";
90-
this.messageClass = "error";
91-
});
92-
},
93-
},
9418
};
9519
</script>

‎vue/js/app.js‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
11
import Routes from "./routes.js";
22
import App from "./App.vue";
3+
import { createRouter, createWebHistory } from "vue-router";
4+
import { createApp } from "vue";
35

4-
const router = new VueRouter({
6+
const router = createRouter({
7+
history: createWebHistory(),
58
routes: Routes,
69
});
710

8-
const app = new Vue({
9-
router: router,
10-
components: {
11-
App: App,
12-
},
13-
el: "#app",
14-
});
11+
const app = createApp(App);
12+
13+
app.use(router);
14+
app.mount("#app");

‎vue/js/components/Home.vue‎

Lines changed: 96 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,96 @@
1+
<template>
2+
<div class="container">
3+
<h2>
4+
<img
5+
src="https://www.gitbook.com/cdn-cgi/image/width=40,height=40,fit=contain,dpr=1,format=auto/https%3A%2F%2F2229349915-files.gitbook.io%2F~%2Ffiles%2Fv0%2Fb%2Fgitbook-legacy-files%2Fo%2Fspaces%252F-MKQ7_I-c79Ln1c6Chop%252Favatar-1603563866478.png%3Fgeneration%3D1603563866686051%26alt%3Dmedia"
6+
/>
7+
Astronomy API - Demo
8+
</h2>
9+
10+
<div class="row">
11+
<div class="column column-25">
12+
<p>
13+
Copy your App Id and the App Secret from the
14+
<a href="https://astronomyapi.com/dashboard" target="_blank"
15+
>Astronomy API console</a
16+
>
17+
paste below to see the samples in action.
18+
</p>
19+
<form>
20+
<fieldset>
21+
<label>App Id</label>
22+
<input
23+
v-model="store.appId"
24+
@change="validateCredentials"
25+
type="text"
26+
/>
27+
<label>App Secret</label>
28+
<input
29+
v-model="store.appSecret"
30+
@change="validateCredentials"
31+
type="password"
32+
/>
33+
</fieldset>
34+
</form>
35+
36+
<div v-bind:class="messageClass" v-if="status">{{ status }}</div>
37+
38+
<p v-if="store.credentialsValid">Explore each endpoint below.</p>
39+
40+
<ul v-if="store.credentialsValid">
41+
<li>
42+
<router-link to="/positions">Planetary Positions</router-link>
43+
</li>
44+
<li><router-link to="/star-chart">Star Charts</router-link></li>
45+
<li><router-link to="/moon-phase">Moon Phase</router-link></li>
46+
<li><router-link to="/search">Search</router-link></li>
47+
</ul>
48+
</div>
49+
</div>
50+
<div class="column column-75"></div>
51+
</div>
52+
</template>
53+
54+
<script>
55+
import { store } from "../store.js";
56+
import axios from "axios";
57+
58+
export default {
59+
data() {
60+
return {
61+
store,
62+
status: "",
63+
messageClass: "",
64+
};
65+
},
66+
methods: {
67+
validateCredentials() {
68+
if (!store.appId || !store.appSecret) {
69+
return;
70+
}
71+
72+
this.status = "Checking Credentials...";
73+
axios
74+
.get(`${store.apiEndpoint}/api/v2/bodies`, {
75+
headers: {
76+
"X-Requested-With": "XMLHttpRequest",
77+
Authorization: `Basic ${btoa(`${store.appId}:${store.appSecret}`)}`,
78+
},
79+
})
80+
.then((response) => {
81+
console.log(response);
82+
83+
this.status = "Credentials valid";
84+
this.messageClass = "success";
85+
this.store.credentialsValid = true;
86+
})
87+
.catch((e) => {
88+
console.log(e);
89+
90+
this.status = "Credential validation failed";
91+
this.messageClass = "error";
92+
});
93+
},
94+
},
95+
};
96+
</script>

‎vue/js/components/MoonPhase.vue‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -58,6 +58,8 @@ import GoBack from "./GoBack.vue";
5858
import CodeView from "./CodeView.vue";
5959
import mixins from "../mixins.js";
6060
import { store } from "../store.js";
61+
import axios from "axios";
62+
import moment from "moment";
6163
6264
export default {
6365
mixins: [mixins],

‎vue/js/components/StarChart.vue‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -57,6 +57,8 @@ import GoBack from "./GoBack.vue";
5757
import CodeView from "./CodeView.vue";
5858
import mixins from "../mixins.js";
5959
import { store } from "../store.js";
60+
import axios from "axios";
61+
import moment from "moment";
6062
6163
export default {
6264
mixins: [mixins],

‎vue/js/mixins.js‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { store } from "./store.js";
2-
import HTTPSnippet from "httpsnippet";
2+
import { HTTPSnippet } from "httpsnippet";
33

44
function objectToArray(dataObject) {
55
return Object.keys(dataObject)

‎vue/js/routes.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
1-
import App from "./App.vue";
21
import Positions from "./components/Positions.vue";
32
import StarChart from "./components/StarChart.vue";
43
import MoonPhase from "./components/MoonPhase.vue";
54
import Search from "./components/Search.vue";
5+
import Home from "./components/Home.vue";
66

77
export default [
88
{
99
name: "home",
1010
path: "/",
11-
component: App,
11+
component: Home,
1212
},
1313
{
1414
path: "/positions",

‎vue/package.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,8 @@
4646
"axios": "^1.12.2",
4747
"httpsnippet": "^3.0.0",
4848
"lodash": "^4.17.13",
49-
"moment": "^2.30.1"
49+
"moment": "^2.30.1",
50+
"vue-router": "^4.6.3"
5051
},
5152
"packageManager": "yarn@4.10.3"
5253
}

‎vue/webpack.config.js‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ const { VueLoaderPlugin } = require("vue-loader");
55
const webpack = require("webpack");
66

77
module.exports = {
8-
mode: "development", // or "production"
8+
mode: "development",
99

1010
entry: {
1111
app: "./js/app.js",
@@ -21,6 +21,7 @@ module.exports = {
2121
extensions: [".js", ".vue"],
2222
alias: {
2323
vue$: "vue/dist/vue.esm-bundler.js",
24+
axios$: require.resolve('axios/dist/browser/axios.cjs'),
2425
},
2526
fallback: {
2627
stream: require.resolve("stream-browserify"),
@@ -30,9 +31,9 @@ module.exports = {
3031
process: require.resolve("process/browser"),
3132
url: require.resolve("url/"),
3233
querystring: require.resolve("querystring-es3"),
33-
http: require.resolve("stream-http"), // ✅ added
34-
https: require.resolve("https-browserify"), // ✅ added
35-
fs: false, // ✅ no browser equivalent
34+
http: require.resolve("stream-http"),
35+
https: require.resolve("https-browserify"),
36+
fs: false,
3637
},
3738
},
3839

0 commit comments

Comments
 (0)