Skip to content

Instantly share code, notes, and snippets.

@quickgrid
Created April 14, 2016 21:25
Show Gist options
  • Save quickgrid/765ab533d4b0f67a9d311f5d93c81bda to your computer and use it in GitHub Desktop.
Save quickgrid/765ab533d4b0f67a9d311f5d93c81bda to your computer and use it in GitHub Desktop.
Blogger Permalink Fixer Firebase App with Clipboard JS
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<meta name="description" content="http://quickgrid.blogspot.com">
<meta name="author" content="Asif Ahmed">
<link rel="icon" href="favicon.ico">
<title>Blogger Permalink Fixer</title>
<!-- Bootstrap core CSS -->
<link href="/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<link href="/assets/css/ie10-viewport-bug-workaround.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="cover.css" rel="stylesheet">
<!-- Just for debugging purposes. Don't actually copy these 2 lines! -->
<!--[if lt IE 9]><script src="/assets/js/ie8-responsive-file-warning.js"></script><![endif]-->
<script src="/assets/js/ie-emulation-modes-warning.js"></script>
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="site-wrapper">
<div class="site-wrapper-inner">
<div class="cover-container">
<div class="masthead clearfix">
<div class="inner">
<h3 class="masthead-brand">Blogger Tools v1</h3>
<nav>
<ul class="nav masthead-nav">
<li class="active"><a href="http://quickgrid.blogspot.com">Home</a></li>
<li><a href="https://twitter.com/quick_grid">Contact</a></li>
</ul>
</nav>
</div>
</div>
<div class="inner cover">
<div class="form-group">
<label for="exampleInputName2">Enter Site Title</label>
<input type="text" class="form-control" id="siteTitleInput" placeholder="Enter Post Title">
</div>
<div class="row">
<div class="col-lg-12">
<div class="input-group">
<input type="text" class="form-control" id="fixedPermalinkOutput" placeholder="">
<span class="input-group-btn">
<button class="btn btn-primary" id="outputCopyButton" type="button" data-clipboard-target="#fixedPermalinkOutput">Copy</button>
</span>
</div><!-- /input-group -->
</div><!-- /.col-lg-6 -->
</div><!-- /.row -->
</div>
<div class="mastfoot">
<div class="inner">
<p>Blogger Tools <a href="http://quickgrid.blogspot.com">Quickgrid</a>, by <a href="https://twitter.com/quick_grid">Asif Ahmed</a>.</p>
</div>
</div>
</div>
</div>
</div>
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="/assets/js/vendor/jquery.min.js"><\/script>')</script>
<script src="/dist/js/bootstrap.min.js"></script>
<!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
<script src="/assets/js/ie10-viewport-bug-workaround.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/1.5.8/clipboard.min.js"></script>
<script type="text/javascript">
var clipboard = new Clipboard('#outputCopyButton');
String.prototype.replaceAt=function(index, character) {
return this.substr(0, index) + character + this.substr(index+character.length);
}
$("#siteTitleInput").keyup(function() {
var value = $(this).val();
for(var i = 0; i < value.length; i++){
if(value.charAt(i) === ' '){
value = value.replaceAt(i, "-");
}
}
$("#fixedPermalinkOutput").attr("value", value );
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment