isolated clipboard, styling

This commit is contained in:
Uvis Grinfelds 2014-11-06 21:15:29 +01:00
parent 9f87fb789f
commit 950e165e2e
6 changed files with 60 additions and 98 deletions

View file

@ -7,3 +7,4 @@
</div> </div>
<div id="overlay" class="overlay"></div> <div id="overlay" class="overlay"></div>
</div> </div>
<script src="scripts/clipboard.js"></script>

View file

@ -0,0 +1,57 @@
(function() {
var copylinkbtn = document.getElementById("copy-link-btn"),
copylink = document.getElementById("copy-link-wrapper"),
overlay = document.getElementById("overlay");
var url = "http://url"
copylinkbtn.addEventListener("click", function() {
var error = document.getElementsByClassName('error');
while (error[0]) {
error[0].parentNode.removeChild(error[0]);
}
document.body.className += ' active';
copylink.children[1].value = url;
copylink.children[1].focus();
copylink.children[1].select();
}, false);
overlay.addEventListener("click", function() {
document.body.className = '';
}, false);
copylink.children[2].addEventListener("keydown", function(e) {
var error = document.getElementsByClassName('error');
while (error[0]) {
error[0].parentNode.removeChild(error[0]);
}
setTimeout(function() {
if((e.metaKey || e.ctrlKey) && e.keyCode === 67 && isTextSelected(copylink.children[2])) {
document.body.className = '';
} else if((e.metaKey || e.ctrlKey) && e.keyCode === 67 && isTextSelected(copylink.children[2]) === false) {
var error = document.createElement('span');
error.className = 'error';
var errortext = document.createTextNode('The link was not copied, make sure the entire text is selected.');
error.appendChild(errortext);
copylink.appendChild(error);
}
}, 100);
function isTextSelected(input) {
if (typeof input.selectionStart == "number") {
return input.selectionStart == 0 && input.selectionEnd == input.value.length;
} else if (typeof document.selection != "undefined") {
input.focus();
return document.selection.createRange().text == input.value;
}
}
}, false);
})();

View file

@ -104,60 +104,3 @@ $(document).ready(function() {
})(); })();
(function() {
var copylinkbtn = document.getElementById("copy-link-btn"),
copylink = document.getElementById("copy-link-wrapper"),
overlay = document.getElementById("overlay");
var url = "http://url"
copylinkbtn.addEventListener("click", function() {
var error = document.getElementsByClassName('error');
while (error[0]) {
error[0].parentNode.removeChild(error[0]);
}
document.body.className += ' active';
copylink.children[1].value = url;
copylink.children[1].focus();
copylink.children[1].select();
}, false);
overlay.addEventListener("click", function() {
document.body.className = '';
}, false);
copylink.children[2].addEventListener("keydown", function(e) {
var error = document.getElementsByClassName('error');
while (error[0]) {
error[0].parentNode.removeChild(error[0]);
}
setTimeout(function() {
if((e.metaKey || e.ctrlKey) && e.keyCode === 67 && isTextSelected(copylink.children[2])) {
document.body.className = '';
} else if((e.metaKey || e.ctrlKey) && e.keyCode === 67 && isTextSelected(copylink.children[2]) === false) {
var error = document.createElement('span');
error.className = 'error';
var errortext = document.createTextNode('The link was not copied, make sure the entire text is selected.');
error.appendChild(errortext);
copylink.appendChild(error);
}
}, 100);
function isTextSelected(input) {
if (typeof input.selectionStart == "number") {
return input.selectionStart == 0 && input.selectionEnd == input.value.length;
} else if (typeof document.selection != "undefined") {
input.focus();
return document.selection.createRange().text == input.value;
}
}
}, false);
})();

View file

@ -9,7 +9,7 @@
// Core CSS // Core CSS
@import "../bower_components/bootstrap/less/scaffolding.less"; @import "../bower_components/bootstrap/less/scaffolding.less";
@import "../bower_components/bootstrap/less/type.less"; @import "../bower_components/bootstrap/less/type.less";
@import "../bower_components/bootstrap/less/code.less"; // @import "../bower_components/bootstrap/less/code.less";
@import "../bower_components/bootstrap/less/grid.less"; @import "../bower_components/bootstrap/less/grid.less";
@import "../bower_components/bootstrap/less/tables.less"; @import "../bower_components/bootstrap/less/tables.less";
@import "../bower_components/bootstrap/less/forms.less"; @import "../bower_components/bootstrap/less/forms.less";

View file

@ -622,45 +622,6 @@ address {
font-style: normal; font-style: normal;
line-height: 1.42857143; line-height: 1.42857143;
} }
code,
kbd,
pre,
samp {
font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
}
code {
padding: 2px 4px;
font-size: 90%;
color: #c7254e;
background-color: #f9f2f4;
white-space: nowrap;
border-radius: 4px;
}
pre {
display: block;
padding: 9.5px;
margin: 0 0 10px;
font-size: 13px;
line-height: 1.42857143;
word-break: break-all;
word-wrap: break-word;
color: #333333;
background-color: #f5f5f5;
border: 1px solid #cccccc;
border-radius: 4px;
}
pre code {
padding: 0;
font-size: inherit;
color: inherit;
white-space: pre-wrap;
background-color: transparent;
border-radius: 0;
}
.pre-scrollable {
max-height: 340px;
overflow-y: scroll;
}
.container { .container {
margin-right: auto; margin-right: auto;
margin-left: auto; margin-left: auto;

File diff suppressed because one or more lines are too long