Emergency Escape for page by button click or ESC button - wordpress

I am trying to use the code here to make an emergency escape:
https://css-tricks.com/website-escape/
It is being used on a Wordpress site here: http://b67.3d8.myftpupload.com/ but it doesn't seem to work. I have tried adjusting the location of the script to no avail. Can anyone see what is going on?
HTML:
<button id="get-away">Go ?</button>
JS (in <head> section):
<script>
function getAway() {
// Get away right now
window.open("http://weather.com", "_newtab");
// Replace current site with another benign site
window.location.replace('http://google.com');
}
$(function() {
$("#get-away").on("click", function(e) {
getAway();
});
$("#get-away a").on("click", function(e) {
// allow the link to work
e.stopPropagation();
});
$(document).keyup(function(e) {
if (e.keyCode == 27) { // escape key
getAway();
}
});
});
</script>

Related

Disable Woocomerce register button after one click

Hello I would like to disable the woocommmerce register page button after one click to avoid multiple clicks.
I have searched the forums and found a bunch of solutions for custom forms and I've tried the following JS code but had no luck. I have a feeling I am setting the wrong selector because I cannot for the life of me figure out what the correct selector for the default register button is.
<script>
function disableButton() {
var btn = document.getElementById('woocommerce-register-nonce');
btn.disabled = true;
btn.innerText = 'Posting...'
}
</script>
I've also tried :
<script>
jQuery('woocommerce-Button.woocommerce-button.button.woocommerce-form-register__submit').live('click', function (e) {
var self = this;
$(this).attr("disabled", "disabled");
do_something();
setTimeout(function () {
$(self).removeAttr('disabled');
}, 10000);
});
</script>
Some guidance would be very much appreciated.
Update!
Based on Onboardmass's suggestion I have corrected the selector and got it partially working using jquery.
<script>
jQuery('.woocommerce-Button.woocommerce-button.button.woocommerce-form-register__submit').click(function(){
jQuery(this).attr("disabled", "disabled");
});
</script>
The button now gets disabled on click however the issue I'm facing now is that the form does not get submitted.
The issue you're facing is because the selector is incorrect. It should be .woocommerce-Button.woocommerce-button.button.woocommerce-form-register__submit.
For anyone else who may need this I was able to figure this one out by reading through the suggestions and other threads I found. Thank you Onboardmass & Martin for the guidance!
The time out function is required for the click to register.
<script>
$(document).ready(function () {
$(".woocommerce-Button.woocommerce-button.button.woocommerce-form-register__submit").click(function () {
setTimeout(function () { disableButton(); }, 0);
});
function disableButton() {
$(".woocommerce-Button.woocommerce-button.button.woocommerce-form-register__submit").prop('disabled', true);
}
});
</script>

How to call JavaScript function on click of menu URL link of WordPress?

How to call JavaScript function on click of menu URL link of WordPress?
I have tried
jQuery(document).ready(function($) {
$(".menu-item-2916").on("click", function(){
getServerPath('signin.html?reqType=login');
});
});
which is not working for me. This menu is LOGIN menu for my website.
you have not clarify whats you need exact. but try this one if you need to change with this url on click.
menu-item-24 replace your menu id
jQuery(document).ready(function ($) {
$("nav li#menu-item-24").on("click", function (e) {
e.preventDefault();
window.open('/signin.html?reqType=login','_self');
return false;
});
});
Try it
jQuery(document).ready(function($) {
$(".nav li.menu-item-2916").on("click", function(){
getServerPath('signin.html?reqType=login');
});
});

using contenteditable with wysiwyg in meteor

I'm trying to use redactor.js to edit in place some divs in meteor;
in the template I have:
<template name="home">
<section class="editable">
</section>
...
</template>
and in the js:
Template.home.events({
"click section.editable": function(event) {
$(event.target).redactor();
},
});
this creates the redactor wysiwyg editor correctly when I click on the section; the problem is that by clicking again, another editor (nested inside the previous one is created); I'm trying without success to limit the execution of redactor() method only if the editor is not there already.
Could you wrap the state in a session variable? Of course, you'd need to set it back again once the redactor was finished (maybe try hooking into a blur event?)
Template.home.events({
"click section.editable": function(event) {
var isEditorActive = Session.get("editorActive", false);
if (!isEditorActive) {
Session.set("editorActive",true);
$(event.target).redactor({
blurCallback: function(e)
{
Session.set("editorActive",false);
this.core.destroy(); // destroy redactor ?
}
});
}
}
});
PREVIOUSLY:
Is there a particular reason you want to use meteor events for this? You could just use redactor.
if (Meteor.isClient) {
Meteor.startup(function() {
$('section.editable').redactor({
focus: false
});
});
}

How to stop video-js onclick event from pausing video

I have a simple JSFiddle here: http://jsfiddle.net/cvCWc/2/
The basic code looks like:
window.player = videojs("movie_container", { techOrder: ["html5", "slash"] }, function() {
videojs_player = this;
videojs_player.src({ src: "http://video-js.zencoder.com/oceans-clip.mp4", type: 'video/mp4'})
videojs_player.on("click", function(event){
event.preventDefault();
alert('click');
});
videojs_player.play();
});
I am trying to capture all click events on the video for future processing, but I don't want the video to pause when clicked. Any ideas?
I found the answer for HTML5... but I don't get click events in the flash fallback. Updated jsfdl: http://jsfiddle.net/cvCWc/3/
window.player = videojs("movie_container", { techOrder: ["html5", "flash"] }, function() {
videojs_player = this;
videojs_player.src({ src: "http://video-js.zencoder.com/oceans-clip.mp4", type: 'video/mp4'})
videojs_player.off('click');
videojs_player.on("click", function(event){
event.preventDefault();
console.log("click", event.clientX, event.clientY, videojs_player.currentTime());
});
videojs_player.play();
});
Just an alternative if someone drops to this. When you wanna bypass the stop play functionality when user clicks the stream(or view, whatever you call it), not the control bar, one can comment out somelines in videojs..
Player.prototype.handleTechClick_ = function handleTechClick_(event) {
// We're using mousedown to detect clicks thanks to Flash, but mousedown
// will also be triggered with right-clicks, so we need to prevent that
if (event.button !== 0) return;
// When controls are disabled a click should not toggle playback because
// the click is considered a control
if (this.controls()) {
if (this.paused()) {
//this.play(); // COMMENTED OUT
} else {
//this.pause(); // COMMENTED OUT
}
}
};
Control bar will still work...

Implementing modalpopups as default alert in entire project

right now I have a huge Solution in which we use javascript alerts via RegisterStartupScript for all messages and errors.. We were willing to modify all this to making something similar to the modalPopupExtender, or the extender itself in a way that doesn't require too much effort... I mean, to show a modalpopup on a single page I need to create it on the aspx file, setting the attributes etc... So i'm just asking for Ideas, want to know how you guys deal with this..
I'd probably use jQuery dialog and put the markup and initialization code in a MasterPage, set with autoOpen false and hidden by default. I'd inject code that interacts with the dialog into each page as needed.
<div id="modalDialog" title="Error">
<p id='modalDialogMsg'>An error has occurred.</p>
</div>
<script type="text/javascript">
$(function() {
$('#modalDialog').dialog({
autoOpen: false;
modal: true,
buttons: {
"OK" : function() {
$(this).dialog('close');
}
}
});
});
// You could "objectify" this, but I'll show as a global function
function showError( title, msg )
{
if (!title) {
title = 'Error';
}
if (!msg) {
msg = 'An error occurred.';
}
$('#modalDialogMessage').html(msg);
$('#modalDialog').attr('title',title)
.dialog('open');
}
</script>
Then, in your page you'd inject code that calls showError. Note this would need to be after the script above in order to make sure that the function has been defined. What would spit out would render like:
<script type="text/javascript">
$(function() {
showError('Database connection error', 'There was an error connecting to the database.' )'
});
</script>
Could you not place the modal popup/ modal popup extender into a user a control and embed the user control into each page?

Resources