emoji-url-shortener
Version:
Own your own url shortener as a service.
203 lines (190 loc) • 7.9 kB
HTML
<html>
<head>
<title>🌍✌🏼</title>
<meta name="image" content="https://emojipedia-us.s3.amazonaws.com/cache/52/23/52230e8ab5779d3b28c53725672bad99.png">
<link rel="icon" href="/static/favicon.ico">
<!-- Schema.org for Google -->
<meta itemprop="name" content="🌍✌🏼">
<meta itemprop="description" content="Shitty url shortener, emoji and ai powered. 🌍✌🏼">
<meta itemprop="image" content="https://emojipedia-us.s3.amazonaws.com/cache/52/23/52230e8ab5779d3b28c53725672bad99.png">
<!-- Twitter -->
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="🌍✌🏼">
<meta name="twitter:description" content="Shitty url shortener, emoji and ai powered.">
<meta name="twitter:site" content="@cagataycali">
<meta name="twitter:creator" content="@cagataycali">
<!-- Open Graph general (Facebook, Pinterest & Google+) -->
<meta name="og:title" content="🌍✌🏼">
<meta name="og:description" content="Shitty url shortener, emoji and ai powered.">
<meta name="og:image" content="https://emojipedia-us.s3.amazonaws.com/cache/52/23/52230e8ab5779d3b28c53725672bad99.png">
<meta name="og:url" content="http://🌍✌🏼.ws">
<meta name="og:site_name" content="🌍✌🏼">
<meta name="og:locale" content="en_US">
<meta name="og:type" content="website">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
<link href="/noty/lib/noty.css" rel="stylesheet"></script>
<script src="/noty/lib/noty.js" type="text/javascript"></script>
<!-- Begin emoji-picker Stylesheets -->
<link href="/lib/css/emoji.css" rel="stylesheet">
<!-- End emoji-picker Stylesheets -->
</head>
<body class="text-center" style="margin-top: 50px;">
<p>Home, sweet home... 🏡</p>
<p>I guess you have a shitty URL. That's why you're here. 💩</p>
<p>Let's see what I can do.</p>
<div class="container">
<div class="row justify-content-center">
<div class="col-10">
<div class="text-left">
<p class="lead emoji-picker-container">
<input type="text" class="form-control" id="url" placeholder="Your shitty URL">
</p>
<p class="lead emoji-picker-container" style="display:none" id="emoji-div">
<input type="text" class="form-control" id="emoji" placeholder="Choose your cool emoji" data-emojiable="true">
</p>
</div>
<div id="cool" class="jumbotron" style="display:none">
<h1>There's your cool shortened URL!</h1>
<h4 id="cool-title">That's your cool</h4>
<h4 id="cool-url"></h4>
<!-- <h4 id="cool-friendly"></h4> -->
<!-- <h4 id="cool-subdomain"> </h4> -->
<a class="btn btn-secondary" href="https://github.com/cagataycali/url-shortener" target="_blank">
Could you can give me star on GitHub? <i class="fa fa-lg fa-github"></i>
</a>
</div>
<button id="check" class="btn btn-primary btn-lg btn-block">
Check! <i class="fa fa-hand-spock-o"></i>
</button>
<button id="grab" style="display:none" class="btn btn-primary btn-lg btn-block">
Grab it! <i class="fa fa-hand-spock-o"></i>
</button>
</div>
</div>
</div>
<br>
<p>No reporting, no follow-up. It just works. </p>
<p>The world is ours, become a contributor. 🌍✌🏼</p>
<p>
<a class="btn btn-secondary" href="https://github.com/cagataycali/url-shortener" target="_blank">
View on GitHub <i class="fa fa-lg fa-github"></i>
</a>
</p>
<script src="/socket.io/socket.io.js"></script>
<script
src="https://code.jquery.com/jquery-3.2.1.min.js"
integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
crossorigin="anonymous"></script>
<!-- Begin emoji-picker JavaScript -->
<script src="/lib/js/config.js"></script>
<script src="/lib/js/util.js"></script>
<script src="/lib/js/jquery.emojiarea.js"></script>
<script src="/lib/js/emoji-picker.js"></script>
<!-- End emoji-picker JavaScript -->
<script>
$(function() {
// Initializes and creates emoji set from sprite sheet
window.emojiPicker = new EmojiPicker({
emojiable_selector: '[data-emojiable=true]',
assetsPath: '/lib/img/',
popupButtonClasses: 'fa fa-smile-o'
});
// It can be called as many times as necessary; previously converted input fields will not be converted again
window.emojiPicker.discover();
});
$(document).on('click', '#check', () => {
var url = $('#url');
if (url.val().trim().length === 0) {
new Noty({
text: `Choose one or more emoji`,
type: 'warning',
theme: 'nest',
force: true,
timeout: 2000
}).show()
} else {
new Noty({
text: 'Grr grr grr, generating your awesome emojis.',
type: 'info',
theme: 'nest',
force: true,
timeout: 1000
}).show()
socket.emit('url', url.val());
}
});
$(document).on('click', '#grab', () => {
var url = $('#url');
var emoji = $('#emoji');
if (emoji.val().trim().length === 0 || url.val().trim().length === 0) {
new Noty({
text: `Choose one or more emoji`,
type: 'warning',
theme: 'nest',
force: true,
timeout: 2000
}).show()
} else {
fetch('/', {
method: 'post',
headers: {
'Accept': 'application/json, text/plain, */*',
'Content-Type': 'application/json'
},
body: JSON.stringify({url: url.val().trim(), emoji: emoji.val().trim()})
})
.then(res => res.json())
.then(res => {
if (res.status) {
$('#cool-url').text(`${res.url}`);
$('#cool').show('slow');
// $('#grab').hide('slow');
$('#check').hide('slow');
// $('#emoji').hide('slow');
// $('#url').hide('slow');
} else {
new Noty({
text: res.message,
type: 'warning',
theme: 'nest',
force: true,
timeout: 2000
}).show()
}
});
}
});
var socket = io();
socket.on('new', (msg) => {
new Noty({
text: msg,
type: 'info',
theme: 'nest',
force: true,
timeout: 1000
}).show()
});
socket.on('emojis', (response) => {
if (response.status === false) {
new Noty({
text: response.response,
type: 'error',
theme: 'nest',
force: true,
timeout: 1000
}).show()
} else {
console.log(response);
response.response = response.response.join('')
$('.emoji-wysiwyg-editor').html(response.response)
$('#emoji-div').show('slow');
$('#grab').show('slow');
$('#check').hide('slow');
}
})
</script>
<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-59384bcb2e7d010c"></script>
</body>
</html>