I am trying to make a chrome app to display the realtime html source code of the webview.
Need help to get the source code of webview element. The below code is not working.
index.html
<!doctype html>
<html>
<head>
<script type="text/javascript" src="popup.js"></script>
</head>
<body>
<webview id="wa_webview" src="https://www.google.com/" autosize="on"></webview>
<br>
<h2 id="heading">Source Code</h2>
<p id="demo"></p>
</body>
</html>
popup.js
chrome.app.runtime.onLaunched.addListener(function() {
chrome.app.window.create('popup.html', {
'id': 'window_launcher',
'outerBounds': {
'width': 1200,
'height': 900
}
});
});
document.addEventListener('DOMContentLoaded', function(event) {
let view = document.getElementById('wa_webview');
view.addContentScripts([{
name: 'contentScript',
matches: ['*://google.com/*'],
}]);
view.executeScript(
{code: 'document.documentElement.innerHTML'},
function(results) {
var source = results[0];
document.getElementById('demo').innerHTML = source;
});
});
Related
I need to save the source code of any website in a java script variable. For example, saving Google source code in a variable "GoogleSourceCode".
I tried some ways but I don't have enough knowledge for that.
<html>
<head>
<script src="http://code.jquery.com/jquery-1.12.1.min.js"></script>
</head>
<body>
<div id="container">
<button id="acessaSite">Acessa Site</button>
<button id="pegarHTMLagora">pegar HTML agora</button>
</div>
<script>
$('#acessaSite').on('click', function () {
$.getJSON('http://www.whateverorigin.org/get?url=' + encodeURIComponent('https://google.com.br') + '&callback=?', function(data){
alert(dados.conteudo);
});
});
$('#pegarHTMLagora').on('click', function () {
var htmlAgora = document.documentElement.innerHTML; // Javascript vanilla (sem jquery)
alert(htmlAgora);
});
let htmlPego = document.documentElement.innerHTML;
</script>
</body>
</html>
I am using javascript to check if app is installed or not, if my app installed i want to open my app or else it will redirect to play store account. the issue is that it is redirecting to play store even i already have app installed
This is my .html file where i am checking for app
<!DOCTYPE html>
<html>
<body>
<script type="text/javascript">
window.onload = function() {
// Deep link to your app goes here
document.getElementById("l").src = "intent://sdf/SplashScreen#Intent;scheme=vsd;package=com.sdf.android.ff;end";
setTimeout(function() {
// Link to the App Store should go here -- only fires if deep link fails
window.location = "https://play.google.com/store/apps/details?id=com.sdf.android.dffd";
}, 500);
};
</script>
<iframe id="l" width="1" height="1" style="visibility:hidden"></iframe>
</body>
</html>
It solved by this way
<html>
<head>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script>
var fallbackToStore = function() {
window.location.replace('https://play.google.com/store/apps/details?id=packgename');
};
var openApp = function() {
window.location.replace('intent://app/SplashScreen#Intent;scheme=app_;package=com.sdf.android.dsds;end');
};
var triggerAppOpen = function() {
openApp();
setTimeout(fallbackToStore, 700);
};
triggerAppOpen();
</script>
</head>
<body>
</body>
</html>
FYI, I am not at all a programmer so anything will have to spelled out clearly.
I am using this .js script inside sharepoint. It works fine!
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>ColorBox demo</title>
<link rel="stylesheet" href="http://www.jacklmoore.com/colorbox/example1/colorbox.css" />
</head>
<body>
<h1>Hello, there!</h1>
<h2>This is some content</h2>
<p>The popup will open in five seconds</p>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="http://www.jacklmoore.com/colorbox/jquery.colorbox.js"></script>
<script>
function openColorBox(){
$.colorbox({iframe:true, width:"40%", height:"30%", href: "http://172.16.96.254/pf17.html"});
}
setTimeout(openColorBox, 5000);
setTimeout(parent.$.colorbox.close, 15000);
</script>
</body>
</html>
I have created several Pages on a local internal site. pf1.html - pf21.html
I would like to randomize these when the popup runs.
I have seen this function..posted in this forum.
(Math.random()*11)
How can I add this to the above script and randomize the pages.
This is the full random clip
$(document).ready(function() {
$("a.colorbox").click(function() {
$(this).attr("href","print"+Math.floor(Math.random()*11)+".html");
});
I know the *11 sets the number of pages..
Try something like:
function openColorBox(){
var urlBase = "http://172.16.96.254/pf";
var urlPage = Math.floor(Math.random() * 21);
var urlExt = ".html";
var randomizedURL = urlBase + urlPage + urlExt;
$.colorbox({iframe:true, width:"40%", height:"30%", href: randomizedURL});
}
setTimeout(openColorBox, 5000);
setTimeout(parent.$.colorbox.close, 15000);
I have two examples using setTimeout(). This one works:
<html>
<head>
<script type='text/javascript' src='https://www.google.com/jsapi'></script>
<script type="text/javascript">
google.load('visualization','1',{packages:['table']});
function start() {
setTimeout(ShowClipboardContent, 2000);
}
function ShowClipboardContent() {
var data = new google.visualization.DataTable(window.clipboardData.getData('Text'));
var table = new google.visualization.Table(document.getElementById('div'));
table.draw(data,{showRowNumber: true});
}
</script>
</head>
<body>
<button onclick='start();'>Show text data in clipboard</button>
<div id='div'></div>
</body>
</html>
But this doesn't:
<!DOCTYPE html>
<html>
<head>
<script type='text/javascript' src='https://www.google.com/jsapi'></script>
<script type='text/javascript'>
google.load('visualization','1',{packages:['table']});
</script>
<script type='text/javascript'>
//runs powershell and copies output onto clipboard
function powershell(t) {
//object that will execute powershell
var run = new ActiveXObject("Shell.Application");
//breaks the list of servers into array
var servers = t.textarea.value.split('\n');
//script that powershell will run
var script = 'some powershell command';
//path to powershell.exe
var program = 'C:\\Windows\\system32\\WindowsPowerShell\\v1.0\\powershell.exe';
//putting it all together
run.ShellExecute(program,script,'','open','1');
setTimeout(drawTable, 10000);
}
//draws data table using data from clipboard
function drawTable() {
var data = new google.visualization.DataTable(window.clipboardData.getData('Text'));
var table = new google.visualization.Table(document.getElementById('table'));
table.draw(data, {showRowNumber: true});
}
</script>
</head>
<body>
<div id='form'>
<form>
Enter name(s):<br />
<textarea id='textarea' style='width:20%; height:500px;'></textarea><br />
<button onclick='powershell(this.form)'>Query</button>
</form>
</div>
<div id='table'></div>
</body>
</html>
Just to reiterate: the problem is that setTimeout() won't work on the second code but works on the first one and I would like to know why because I see no difference.
try to add a
console.log(drawTable);
just before your timeout. if it returns 'function', it'a good, your timeout will be ok. if not return anything, your activeX script should break the code
I have trouble adding a personal javascript file in my option.html for my google-chrome extension.
I've added this line to my options.html:
<script type="text/javasctipt" src="/js/content/toto.js"></script>
And the object $.toto, described in this file is unreachable.
I would like to know if it's possible to add a personal js file and how or if you have to do everything in the options.js ?
Thank in advance for your answers.
Here is a part of the code as the project is already large:
options.html:
<!DOCTYPE html>
<html lang="fr">
<body>
<script type="text/javascript" src="/js/lib/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="/js/lib/sprintf-0.6.js"></script>
<script type="text/javascript" src="/js/lib/bootstrap/bootstrap-modal.js"></script>
<script type="text/javascript" src="/js/shared/constant.js"></script>
<script type="text/javascript" src="/js/shared/storage.js"></script>
<script type="text/javasctipt" src="/js/content/toto.js"></script>
<script type="text/javascript" src="/js/content/messages.js"></script>
<script type="text/javascript" src="/js/content/debug.js"></script>
<script type="text/javascript" src="/js/content/form.js"></script>
<script type="text/javascript" src="/js/content/base.js"></script>
<script type="text/javascript" src="/js/content/options.js"></script>
</body>
</html>
options.js:
$.options = $.extend({}, $.base, {
ready: function() {
// onMessage
chrome.extension.onMessage.addListener(this.onMessage);
// init events
$("#logout_btn").live("click",function() {
$.options.logout();
});
// init ui
$.toto.initialize();
this.displayCorrectContext();
this.initMailPrescrip();
}
});
toto.js:
$.toto = $.extend({}, $.base, {
TAG: "MESSAGES",
ready: function() {
$("[title-message]").each(function() {
var txt = chrome.i18n.getMessage($(this).attr("title-message"));
$(this).attr('title', txt);
});
$("[data-message]").each(function() {
var txt = chrome.i18n.getMessage($(this).attr("data-message"));
$(this).html(txt);
});
},
log: function(message) {
$.base.log($.messages.TAG,message);
}
});
Use .ready event like this.
jQuery(document).ready(function(){
// jquery function code
});
In the manifest.json, try adding it in the "scripts" line, like so:
"app": {
"background": {
"scripts": ["exampleReference1.js", "exampleReference2.js", "toto.js"],
"transient": true
}
},
Hope it works.