JavaScript

Settings for JS Datepicker only allow Weekdays and Future Days

Date: 02/10/2017, Author: Lostwake, Category: JavaScript

Here is how it is done

<p>Date: <input type="text" id="datepicker"></p>

$("#datepicker").datepicker({
beforeShowDay: function(date) {
var day = date.getDay();
return [day == 1 || day == 2 || day == 3 || day == 4 || day == 5,""];
},
minDate: 1
});

Be Annoying and Alert Visitors Before They Leave Your Page

Date: 12/18/2016, Author: Lostwake, Category: JavaScript

Don't reinvent the wheel:

So before you think about implementing those solutions and all required workarounds, realize you're reinventing the wheel and you're prone to running into problems others have already solved for you.

If your application already uses jQuery, you may as well use tested, maintained code instead of rolling your own, and use a third-part library for all of this. jQuery's Are You Sure? plugin works great, see their demo page. It's as simple as this:

<script src="jquery.are-you-sure.js"></script>

<script>
  $(function() {
    $('#myForm').areYouSure(
      {
        message: 'It looks like you have been editing something. '
               + 'If you leave before saving, your changes will be lost.'
      }
    );
  });

</script>




Source: http://stackoverflow.com/questions/7317273/warn-user-before-leaving-web-page-with-unsaved-changes

show multiple recaptchas on a single page?

Date: 11/28/2016, Author: Lostwake, Category: JavaScript

There is no need to clone the recaptcha nor try to workaround the problem. You just have to put multiple div elements for the recaptchas and render the recaptchas inside them explicitly.

This is easy with the google recaptcha api:
https://developers.google.com/recaptcha/docs/display#explicit_render

Here is the example html code:

<form>
    <h1>Form 1</h1>
    <div><input type="text" name="field1" placeholder="field1"></div>
    <div><input type="text" name="field2" placeholder="field2"></div>
    <div id="RecaptchaField1"></div>
    <div><input type="submit"></div>
</form>

<form>
    <h1>Form 2</h1>
    <div><input type="text" name="field3" placeholder="field3"></div>
    <div><input type="text" name="field4" placeholder="field4"></div>
    <div id="RecaptchaField2"></div>
    <div><input type="submit"></div>
</form>

In your javascript code, you have to define a callback function for recaptcha:

<script type="text/javascript">
    var CaptchaCallback = function() {
        grecaptcha.render('RecaptchaField1', {'sitekey' : '6Lc_your_site_key'});
        grecaptcha.render('RecaptchaField2', {'sitekey' : '6Lc_your_site_key'});
    };
</script>

After this, your recaptcha script url should look like this:

<script src="https://www.google.com/recaptcha/api.js?onload=CaptchaCallback&render=explicit" async defer></script>


Source: http://stackoverflow.com/questions/1241947/how-do-i-show-multiple-recaptchas-on-a-single-page

 

Make Roxy Fileman for TinyMCE editor Responsive and Usable on Mobile Devices

Date: 07/21/2016, Author: Lostwake, Category: JavaScript

So recently I was testing Roxy Fileman and for the life of me I couldnt make it usable on all devices. So I wrote some Javascript and Tweaked a little of the default CSS to make a solution.

Note: This fix is for the stand alone version of TinyMCE but Im sure it can be adapted to any CMS your using.