Skip to content

Instantly share code, notes, and snippets.

@eclectic-coding
Forked from jscher2000/showAsPrint.js
Created December 13, 2019 12:59
Show Gist options
  • Select an option

  • Save eclectic-coding/ad508208d783b90546bf00cebf2cad79 to your computer and use it in GitHub Desktop.

Select an option

Save eclectic-coding/ad508208d783b90546bf00cebf2cad79 to your computer and use it in GitHub Desktop.
Emulate print media in Firefox 62 (userscript work in progress)
// For Firefox's Web Console, creates the functions showAsPrint() and undoShowAsPrint()
// to roughly emulate print media and revert
function p2s(media){
if (media.indexOf('all') > -1) return media; //no need to change
if (media == 'print') return 'all, wasprint'; //show on screen, too
if (media.indexOf('print') > -1 && media.indexOf('screen') > -1) return media; //no need to change
if (media == 'screen') return 'wasscreen'; //hide these rules
if (media.indexOf('screen') > -1) return media.replace('screen', 'wasscreen'); //hide these rules
return media + ', WTF'; //for debugging only
}
function showAsPrint(){
var docSS = document.styleSheets, ss, oldMedia, newMedia;
for (var i=0; i<docSS.length; i++) {
ss = docSS[i];
if (!ss.disabled){
if (ss.ownerNode && ss.ownerNode.id.indexOf('stylus-') == -1 && ss.ownerNode.id.indexOf('stylish-') == -1){
// check link or style tag for media attribute and edit as needed
if (ss.ownerNode.hasAttribute('media') && ss.ownerNode.getAttribute('media') != 'all'){
oldMedia = ss.ownerNode.getAttribute('media');
newMedia = p2s(oldMedia);
if (newMedia != oldMedia){
console.log('Updating: ' + ss.ownerNode.outerHTML + ' to ' + newMedia);
ss.ownerNode.setAttribute('media', newMedia);
}
}
// check content of style sheet for media rules
for (var j=0; j<ss.cssRules.length; j++){
if (ss.cssRules[j].type == 4){
oldMedia = ss.cssRules[j].conditionText;
newMedia = p2s(oldMedia);
if (newMedia != oldMedia){
console.log('Updating CSSMediaRule from ' + oldMedia + ' to ' + newMedia);
ss.cssRules[j].conditionText = newMedia;
}
}
}
} else if (!ss.ownerNode){
console.log('No .ownerNode on i=' + i + ' (' + ss.cssRules + ')');
}
}
}
}
function unp2s(media){
if (media == 'all, wasprint' || media == 'all,wasprint') return 'print'; //undo applying to screen
if (media == 'wasscreen') return 'screen'; //undo hiding
return media; // otherwise, we didn't mess with it
}
function undoShowAsPrint(){
var docSS = document.styleSheets;
for (var i=0; i<docSS.length; i++) {
var ss = docSS[i];
if (!ss.disabled){
if (ss.ownerNode && ss.ownerNode.id.indexOf('stylus-') == -1 && ss.ownerNode.id.indexOf('stylish-') == -1){
// check link or style tag for media attribute and edit as needed
if (ss.ownerNode.hasAttribute('media') && ss.ownerNode.getAttribute('media') != 'all'){
ss.ownerNode.setAttribute('media', unp2s(ss.ownerNode.getAttribute('media')));
if (ss.ownerNode) console.log('Updated: ' + ss.ownerNode.outerHTML);
else console.log('Updated media attribute but lost .ownerNode for i=' + i + ' (' + ss.cssRules + ')');
} else {
// check content of style sheet for media rules
for (var j=0; j<ss.cssRules.length; j++){
if (ss.cssRules[j].type == 4){
ss.cssRules[j].conditionText = unp2s(ss.cssRules[j].conditionText);
console.log('CSSMediaRule updated to ' + ss.cssRules[j].conditionText);
}
}
}
}
}
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment