Background: Currently building a web application for a company and thought it would be interesting to see which users are attempting to "peek behind the curtains" so to speak.
I know it's possible to hook into user events whenever they copy things off the page (possibly the most annoying JS control ever) and other various annoying UI actions, but I'm wondering if it's possible to run a JS function (in the background of course) whenever the user tries to view the page source.
Anyone ever tried to do this, or have a better way to do it?
Related
This question already has answers here:
Playing sound from INACTIVE browser tab
(2 answers)
Closed 12 months ago.
I have a site where the user can log in and can start and get calls. The login is automatic after the first time, so they can get to the contacts page without interacting with the site other than opening it. It's a site that automatically starts on the computers of the customers, just so they can receive or start calls, hence they might not even interact with the site.
When they receive a call, a background music starts, like this:
var audio = new Audio('ringtone.mp3');
audio.play();
Of course it does not work unless the customer pressed at least a button or hovered over something on the site, or anything like that. I am wondering if it's possible to start background music without user interaction? I understand it is no longer possible because people do not want annoying ads to play, but I'm wondering if there is a still working solution. Or can I somehow ask for their permission like for notifications? I would ask for it once during the first login, then it would get saved.
Edit:
It is not an SPA. Also my problem is not that it does not play sound when the tab is inactive. The problem is that there's a restriction on sounds which prevents JavaScript from playing sounds unless the user did anything on the site, interacted with it (hovering over a button, clicking a button, or anything). The user does not necessarily interact with the site because it starts up automatically, hence the problem when there's an incoming call.
Not sure if the OP's website is a SPA, if your using React, and using something like React-Router etc, this is a SPA (Single Page Application).
Playing Audio automatically in a normal browser window without some form of user action is blocked by most browsers. (sound policy).
Now the reason I asked the OP if his website was a SPA, these work well as Web App's, and Web Apps have a slightly different sound policy. aka, been able to play audio without user interaction.
So how do you make your website into a Web App,..
Easy, you tell the browser :)
For example in Chrome, under more tools, there is an option that says create shortcut.., this does more than just create a shortcut, it also puts your website in Web App mode.
This also works for mobile's too, eg. on Android there is the option Add to home screen,
And yes other browser have this feature too, but Firefox have decided to remove this feature, so it's not a browser I will use, or recommend to my customers anymore. Whats happening with Mozilla, they seem to have been taken over by stubborn dev's. Shame!!
So if the OP website is a SPA, all he has to do is use the create shortcut, and auto start this.
There are other benefits to making into a Web App too, like not having the address bar at the top etc. But again Mozilla have decided that's not what users want or need, thanks Moz, bye bye now..
What if's not SPA?.. ps, SPA just means there is no normal navigation / page loading. (might not have been obvious from my previous explanation).
Ok, things get a little bit more tricky. The OP mentions he auto-starts these in the morning, now the only issue here this prevents any user interaction, so obviously the sound policy kicks in.
So another idea, using something like puppeteer you could start the app, place a button on your website, that could play a startup sound, or even a silent mp3. You could then instruct puppeteer to click this button.
I'm building a simple webapp using NFC(near field communication), which involved certain tags being programmed with the URL of my website + a hash that will trigger a specific JavaScript function.
For example, "www.website.com/index.html#hide/one" will hide the element labeled "one" on the webpage. Simple enough, right? I thought it would be.
I've since learned that when you tap an NFC tag, it opens the URL in a new webpage/tab. I think this could be averted if my webpage checked to see if there are any other open pages and closes them, though.
If there's a better way to do this(trigger JavaScript functions on a webpage via a URL to that webpage), please let me know. It's important to note that there are 8 tags(elements) in total, and they all have to be triggered for the game/app to end, which requires it all to be done on the same page, preferably without refreshes(although I could probably rig something up using localstorage so it could be refreshed).
Thanks in advance, I'm just not sure how I would proceed here.
-Mitchyl
EDIT - I should mention that I already am using backbone.js for my routing needs. It's perfect for my situation at the moment,
What you need is a hash tag routing libary. http://projects.jga.me/routie/
This will run when your app page loads and read the hash, diverting the logic of your code to do something based on the hash tag, thus you make your items remove on the page in your code logic. No need for lots of pages.
But!
If the url launcher on the device launches new windows each time an item is detected, that is a problem since you can't close those windows, other than from the window itself.
Solution
The app has a main window for the game, each item is stored in local storage, You can use the local storage event system to detect if another page changes an item, and update the UI in real-time.
addEvent(window, 'storage', function (event) {
if (event.key == 'item1') {
item1.innerHTML = event.newValue;
}
});
When NFC launches a new window, display user feedback that states they have completed a task of the game then close it using a timeout.
Below that window will be the main page window with the update displayed.
Done properly it will work brilliantly. You can also add a nice x close button on the pop windows as tasks are completed.
Is it possible to "manually" open your Facebook message inbox in-browser, programmatically?
(i.e., via the "native" code/functions that Facebook normally uses to do it -- without using Facebook's API, and without an actual mouse click or Tab-Enter of the icon)
On Facebook, when you put the mouse over your message-inbox icon and click -- the inbox drops down.
Would it possible to capture programmatically what's actually happening when this is clicked, thus making the inbox drop down as if the icon had been clicked (like a debugger catching function calls)?
And if so, would it be possible to manually "replay" this programmatic pull of the puppet-strings that a mouse-click would pull, to emulate this click and see the ensuing drop-down of the inbox, -- again without using the API or any kind of physical or automated clicking/tab-entering?
This doesn't necessarily have to be done through an entirely self-contained program. If it's possible to do in-browser, like via Javascript (Scratchpad)/Greasemonkey (sans FB API) -- all the better.
You probably can't do this with PHP.
Your best bet would be to use a browser automation tool that will record your actions and play them back. For example, but not necessarily, Selenium.
This will simulate the manual clicking of elements on the page, without using the Facebook API.
I need to navigate through a particular website, frequently, to get at some sub-page that is several layers beyond the front page and it is taking too much time to click and scroll and click and scroll to get at the desired final screen where I enter the search string. So, I would like to automate the process by making Javascript trigger the right button events to get me to the distant page where I can enter the search string manually.
So, I know how the code needed to trigger the event,
document.getElementById('x').click();
but how can I implement this inside my browser, since this is not my own website?
If this is going thru different pages, then probably a Web UI automation tool would be the best (like Selenium - http://www.seleniumhq.org).
as #elcarns says, if you need to inject code into another's website, you could do so opening the console (view --> developers --> javascript console in Chrome).
Another, more complex way to do it when you have to traverse several pages is by developing a plugin.
javascript:document.getElementById('x').click(); in the url bar. You can probably make a bookmarklet for it as well.
I'm writing a suite of admin tools to sit on top of our existing site that will allow a user to quickly administer a number of pages from one convenient jquery ui window.
The issue I'm running into is that a lot of the functionality requires postbacks on specific pages, while this admin overlay can be accessed from any page. This means that in order for the functionality to work, the postback has to be sent to the correct page (or the page has to be loaded before the postback is triggered).
I've looked at Causing a PostBack to a different page from a PopUp and several c# posts, but they do not appear to address the specific issue of moving to another page prior to firing the postback using javascript.
Possible Solution: one solution I considered is using cookies transmit information about which postback events need to fire and what parameters to use while using javascript to load the correct page. It's not a great solution, so I was wondering if anyone here could think of a better one.