Skip to content

Commit

Permalink
Added - nicer loading messages
Browse files Browse the repository at this point in the history
  • Loading branch information
AndreiIgna committed Jul 30, 2020
1 parent 70078d8 commit 584e27b
Show file tree
Hide file tree
Showing 6 changed files with 221 additions and 50 deletions.
2 changes: 1 addition & 1 deletion package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

4 changes: 2 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "domain-info",
"version": "1.4.0",
"description": "Detailed info about a site's domain, DNS and tech stack",
"version": "1.4.1",
"description": "Detailed info about a domain, DNS Records and tech stack",
"author": "Andrei <[email protected]>",
"license": "MIT",
"scripts": {
Expand Down
47 changes: 47 additions & 0 deletions src/components/Loading.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
<template>

<div class="text-center">
<transition name="fade" mode="in-out">
<p v-if="message" class="lead" :key="message">{{ message }}</p>
</transition>
</div>

</template>

<style>
.fade-enter-active, .fade-leave-active {
transition: opacity .4s;
}
.fade-enter, .fade-leave-to {
opacity: 0;
}
</style>

<script>
import messages from '../loading-messages.js'
export default {
name: 'Loading',
props: ['interval'],
data() {
return {
t: null,
message: null,
}
},
created() {
this.t = setTimeout(this.setMessage, 1000)
},
methods: {
setMessage() {
this.message = null
setTimeout(() => {
this.message = messages[Math.floor(Math.random() * messages.length)]
}, 400)
this.t = setTimeout(this.setMessage, this.interval || 4000)
}
},
}
</script>
118 changes: 118 additions & 0 deletions src/loading-messages.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,118 @@
export default [
"Generating witty dialog…",
"Swapping time and space…",
"Tokenizing real life…",
"Bending the spoon…",
"Filtering morale…",
"We need a new fuse…",
"Upgrading Windows…",
"640K ought to be enough for anybody",
"The architects are still drafting",
"The bits are breeding",
"We're building the buildings as fast as we can",
"Don't worry - a few bits tried to escape, but we caught them",
"Checking the gravitational constant in your locale…",
"The server is powered by a lemon and two electrodes.",
"We're testing your patience",
"As if you had any other choice",
"The satellites move into position",
"The bits are flowing slowly today",
"It's still faster than you could draw it",
"My other loading screen is much faster.",
"Reconfoobling energymotron…",
"Are we there yet?",
"Just count to 10",
"Counting backwards from Infinity",
"Embiggening Prototypes",
"We're making you a cookie.",
"Creating time-loop inversion field",
"Spinning the wheel of fortune…",
"Loading the enchanted bunny…",
"Computing chance of success",
"Looking for exact change",
"All I really need is a kilobit.",
"I feel like im supposed to be loading something…",
"What do you call 8 Hobbits? A Hobbyte 🥁",
"Should have used a compiled language…",
"Adjusting flux capacitor…",
"Please wait until the sloth starts moving.",
"Don't break your screen yet!",
"I swear it's almost done.",
"Let's take a mindfulness minute…",
"Listening for the sound of one hand clapping…",
"Keeping all the 1's and removing all the 0's…",
"Putting the icing on the cake. The cake is not a lie…",
"Cleaning off the cobwebs…",
"We need more dilithium crystals",
"Where did all the internets go",
"Time flies when you’re having fun.",
"Spinning the hamster…",
"Stay awhile and listen…",
"Load it and they will come",
"Convincing AI not to turn evil…",
"There is no spoon. Because we are not done loading it",
"Computing the secret to life, the universe, and everything.",
"I love my job only when I'm on vacation…",
"i'm not lazy, I'm just relaxed!!",
"I’ve got problem for your solution…",
"Where there’s a will, there’s a relative",
"Adults are just kids with money",
"I think I am, therefore, I am. I think.",
"You don’t pay taxes—they take taxes.",
"May the forks be with you",
"Constructing additional pylons…",
"If you type Google into Google you can break the internet",
"Well, this is embarrassing…",
"What is the airspeed velocity of an unladen swallow?",
"I'm going to walk the dog",
"Dividing by zero…",
"We’re going to need a bigger boat",
"Cracking military-grade encryption…",
"Simulating traveling salesman…",
"Entangling superstrings…",
"Twiddling thumbs…",
"Searching for plot device…",
"Please hold on as we reheat our coffee",
"Kindly hold on as we convert this bug to a feature…",
"Installing dependencies",
"Switching to the latest JS framework…",
"BRB, working on my side project",
"Let's hope it's worth the wait",
"Ordering 1s and 0s…",
"Updating dependencies…",
"Whatever you do, don't look behind you…",
"Waiting Daenerys say all her titles…",
"Feel free to spin in your chair",
"Bored of slow loading spinner, buy more RAM!",
"Downloading more RAM…",
"Initializing the initializer…",
"Optimizing the optimizer…",
"Never let a computer know you're in a hurry.",
"Shovelling coal into the server",
"Pushing some pixels…",
"How about this weather, eh?",
"Updating Updater…",
"Debugging Debugger…",
"Reading Terms and Conditions for you.",
"Working, WORKING…",
"Patience! This is difficult, you know…",
"Your time is very important to us. Please wait a bit more…",
"Time flies like an arrow; fruit flies like a banana",
"Still faster than Windows update",
"Still faster than Android update",
"Obfuscating quantum entaglement",
"Chuck Norris doesn't scroll with a mouse. He uses a lion.",
"Chuck Norris can delete the Recycling Bin.",
"Preventing robot uprising …",
"Hacking into the Main Frame…",
"Waiting for something to load sucks…",
"Oh, are you waiting for me?",
"Oh you are an eager beaver",
"Doing the heavy lifting",
"Attaching Beards to Dwarves",
"Creating Randomly Generated Feature",
"Doing Something You Don't Wanna Know About",
"Doing The Impossible",
"Hitting Your Keyboard Won't Make This Faster",
"Outfitting Pigs With Wings",
]
2 changes: 1 addition & 1 deletion src/manifest.json
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
{
"name": "Domain info",
"description": "Shows really detailed info about a domain, like registration status & dates, WHOIS, Name Servers and DNS records",
"version": "1.4.0",
"version": "1.0.0",
"manifest_version": 2,
"icons": {
"48": "icons/icon_48.png",
Expand Down
98 changes: 52 additions & 46 deletions src/popup/App.vue
Original file line number Diff line number Diff line change
Expand Up @@ -58,55 +58,58 @@
</tbody>
</table>
</div>
<div v-else-if="tab.title === 'History'" class="bg-light rounded p-2 mb-3">
<p>Notes and changes recorded about the domain.</p>

<table class="table">
<thead>
<tr>
<th>When</th>
<!--<th>Type</th>-->
<th>Changes</th>
</tr>
</thead>
<tbody>
<tr v-for="activity in data.history" :key="activity.id">
<td>{{ formatDate(activity.created_at) }}</td>
<!--<td>{{ activity.type }}</td>-->
<td>
<div v-if="activity.type === 'whois'">
<p><span class="badge badge-light-secondary">WHOIS change</span></p>
<div class="mb-1" v-for="(item, index) in activity.data" :key="index">
<div v-if="item.kind === 'E'">
<p class="bg-diff-line-deleted px-2 mb-0">
{{ item.path.slice(1).join(', ') }}: <span class="bg-diff-deleted px-1">{{ item.lhs }}</span>
</p>
<p class="bg-diff-line-new px-2 mb-2">
{{ item.path.slice(1).join(', ') }}: <span class="bg-diff-new px-1">{{ item.rhs }}</span>
<div v-else-if="tab.title === 'History'" class="mb-3">
<p class="lead">Notes and changes recorded about the domain.</p>
<p>Want to be notified about changes in real time? <a :href="`https://dmns.app/domains/${domainRoot || domain}`" target="_blank" class="btn btn-sm btn-primary">📸 Monitor domain</a></p>

<div class="bg-light rounded p-2">
<table class="table">
<thead>
<tr>
<th>When</th>
<!--<th>Type</th>-->
<th>Changes</th>
</tr>
</thead>
<tbody>
<tr v-for="activity in data.history" :key="activity.id">
<td>{{ formatDate(activity.created_at) }}</td>
<!--<td>{{ activity.type }}</td>-->
<td>
<div v-if="activity.type === 'whois'">
<p><span class="badge badge-light-secondary">WHOIS change</span></p>
<div class="mb-1" v-for="(item, index) in activity.data" :key="index">
<div v-if="item.kind === 'E'">
<p class="bg-diff-line-deleted px-2 mb-0">
{{ item.path.slice(1).join(', ') }}: <span class="bg-diff-deleted px-1">{{ item.lhs }}</span>
</p>
<p class="bg-diff-line-new px-2 mb-2">
{{ item.path.slice(1).join(', ') }}: <span class="bg-diff-new px-1">{{ item.rhs }}</span>
</p>
</div>

<p v-else-if="item.kind === 'D'" class="bg-diff-line-deleted px-2 mb-2">{{ item.path.slice(1).join(', ') }}: {{ item.lhs }}</p>
<p v-else-if="item.kind === 'A' && item.item.kind === 'D'" class="bg-diff-line-deleted px-2 mb-2">
{{ item.path.slice(1).join(', ') }}, {{ item.index }}: {{ item.item.lhs }}
</p>
</div>

<p v-else-if="item.kind === 'D'" class="bg-diff-line-deleted px-2 mb-2">{{ item.path.slice(1).join(', ') }}: {{ item.lhs }}</p>
<p v-else-if="item.kind === 'A' && item.item.kind === 'D'" class="bg-diff-line-deleted px-2 mb-2">
{{ item.path.slice(1).join(', ') }}, {{ item.index }}: {{ item.item.lhs }}
</p>

<p v-else-if="item.kind === 'N'" class="bg-diff-line-new px-2 mb-2">{{ item.path.slice(1).join(', ') }}: {{ item.rhs }}</p>
<p v-else-if="item.kind === 'A' && item.item.kind === 'N'" class="bg-diff-line-new px-2 mb-2">
{{ item.path.slice(1).join(', ') }}, {{ item.index }}: {{ item.item.rhs }}
</p>
<p v-else-if="item.kind === 'N'" class="bg-diff-line-new px-2 mb-2">{{ item.path.slice(1).join(', ') }}: {{ item.rhs }}</p>
<p v-else-if="item.kind === 'A' && item.item.kind === 'N'" class="bg-diff-line-new px-2 mb-2">
{{ item.path.slice(1).join(', ') }}, {{ item.index }}: {{ item.item.rhs }}
</p>

<span v-else>{{ item }}</span>
<span v-else>{{ item }}</span>
</div>
</div>
</div>
<div v-else>
<p><span class="badge badge-light-secondary text-capitalize">{{ activity.type }}</span></p>
<p class="mb-2">{{ activity.data }}</p>
</div>
</td>
</tr>
</tbody>
</table>
<div v-else>
<p><span class="badge badge-light-secondary text-capitalize">{{ activity.type }}</span></p>
<p class="mb-2">{{ activity.data }}</p>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div v-else-if="tab.title === 'DNS'" class="bg-light rounded p-2 mb-3">
<table class="table table-sm table-hover">
Expand Down Expand Up @@ -314,7 +317,7 @@
</div>

<div class="bg-light rounded p-3 mb-3">
<h6>Other TLDs for "{{ data.domain.keyword }}" keyword</h6>
<h6>Other TLDs for "{{ data.domain.keyword }}":</h6>

<a v-for="tld in tlds" :href="'https://dmns.app/domains/' + data.domain.keyword + '.' + tld.tld" :key="tld.tld" class="btn btn-sm m-1" target="_blank" :class="{ 'btn-outline-success': tld.status === 'available', 'btn-outline-secondary': !['available'].includes(tld.status) }">
<span v-if="tld.status === 'loading'">.{{ tld.tld }} <div class="spinner-border spinner-border-sm" role="status"></div></span>
Expand All @@ -332,6 +335,7 @@
<span class="sr-only">Loading...</span>
</div>
</div>
<loading></loading>
</div>
<div v-else-if="tab.status === 'error'" class="alert alert-danger">
{{ tab.content }}
Expand All @@ -344,9 +348,11 @@

<script>
import md5 from 'blueimp-md5'
import Loading from '../components/Loading.vue'
console.log = chrome.extension.getBackgroundPage().console.log
export default {
components: { Loading },
data() {
return {
domain: '-',
Expand Down

0 comments on commit 584e27b

Please sign in to comment.