The best place to ask programming/development questions, imo. UPDATE: stackoverflow is the *worst* place to *ask* questions (if your first question/comment doesn't get any up-rating/response, then u can't ask anymore questions--ridiculously unrealistic), but a great reference for finding answers.

My Music (Nickleus)

20160607

[SOLVED] mac osx el capitan: customize menubar clock date & time (hack)

/////////////// SETTING THE OSX MENUBAR DATE & TIME; based on: http://apple.stackexchange.com/a/182435/156582

TERMINAL TAB 1

$ cd

$ nano -w setClock.sh

#!/bin/bash
killall -KILL SystemUIServer
while true
do
        defaults write com.apple.menuextra.clock "DateFormat" "EEEE' 'y.MM.dd' 'HH:mm:ss' 'z' ''week:'' 'ww"
done

$ chmod +x setClock.sh

[START]

$ ./setClock.sh


TERMINAL TAB 2

IF the menubar clock reappears w incorrect desired display format, run:

$ killall -KILL SystemUIServer

repeat (back to [START]) until the clock renders properly. it sometimes takes several attempts.

ELSE, stop the script:


TERMINAL TAB 1

ctrl-c (stop the "while" loop)

///////////////


NOTE about the DateFormat value string:

"EEEE' 'y.MM.dd' 'HH:mm:ss' 'z' ''week:'' 'ww"

spaces seem to need to b surrounded by single quotes ' ', as did week since w was getting interpreted as smth else.

it will render like this:



NOTE 2: this unfortunately doesn't persist thru reboots or logging out (but it does persist if u lock the screen then log back in again), but i don't normally turn off my macbook so.. please tell me if u hav corrections or tips or improvements or new info :)

20160531

[SOLVED] php+jquery page loading twice (2 GET requests) instead of once

i was using jquery to set an element's css background-image inside $(document).ready(function()... , and when i removed that code th page would load once instead of twice:

var url = el.data("imgbg");  // get the url string
el.css("background-image", "url('"+url+"')");  // set bgimg url

what was causing the extra page reload/GET request was an empty url string!

putting a simple if-test on url fixed it:

if (url != "") el.css("background-image", "url('"+url+"')");

:)

my fiddle confirming this behavior:

20160411

jquery how to get this selector as string in event handler/listener

This won't show you the DOM path, but it will output a string representation of what you see in eg chrome debugger, when viewing an object.




    $('.mybtn').click( function(event){
    console.log("%s", this);   // output: "button.mybtn"
    });

https://developer.chrome.com/devtools/docs/console-api#consolelogobject-object

20160322

PHP INCLUDE/REQUIRE PATH SCHEME

a path-include/require-scheme that will work everywhere.
paths can b copied to any file n will work, w/o needing to b changed--
as long as the __ROOT__ variable is properly configured at the top of the file u paste into :)


20151008

HTML5 form validation w jQuery ajax POST

a simple impl of a web form that uses built-in HTML5 validation, but submits the form using ajax, inside a jQuery click-event handler, instead of the default HTTP post request vis a vis the form tag.

20150929

jquery reusable handler function for event binding n how to send an array of eventData parameters/arguments for dynamic inline ckeditor instances

today i learned how to write reusable jquery handler functions for event binding n how to send an array of eventData parameters/arguments to the handler n how to extract them in the handler.

the context for this was to optimise code reuse for dynamic, inline ckeditor instances, to make them initialized/editable on doubleclick/dblclick, instead of the default single click.

what i'll show u further down is an improvement on this original, user-written ckeditor code i started out with:


 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
// note: this block is inside "document ready"
var ed = {
    init: function () {
        ed.wysiwyg();
    },
    wysiwyg: function () {
        $(".ckeditorInline")
            .on("dblclick", function (e) {
                e.preventDefault();
                e.stopPropagation();
                $(this).attr("contenteditable", "true");
                CKEDITOR.inline(this);  // "Turns a DOM element with the contenteditable attribute set to true into a CKEditor instance"
                $(this).focus();    // makes the toolbar popup after a double click. (you'd think it would b click(), but not in this case)
            });
    }
};
ed.init();


n when i needed to initialize a dynamic ckeditor instance i had to duplicate some of the code, like this:


 1
 2
 3
 4
 5
 6
 7
 8
 9
10
// inside some other function
// ...
item.find(".ckeditorInline").on("dblclick", function (e) {
    e.preventDefault();
    e.stopPropagation();
    $(this).attr("contenteditable", "true");
    CKEDITOR.inline(this);
    $(this).focus();
});
// ...


not very effective, right?

here's how i improved it, as described up top:


 1
 2
 3
 4
 5
 6
 7
 8
 9
10
var bindDblclickToCkeditorInline = function(event) {
    event.preventDefault();
    event.stopPropagation();
    $(this).attr("contenteditable", "true");
    CKEDITOR.inline(this);
    $(this).focus();
    console.log(event.data);  // print the eventData array param
};

$(".ckeditorInline").dblclick(["existing ckeditor instance on pageload", "a second param"], bindDblclickToCkeditorInline);


n now when i need to initialize a dynamic ckeditor instance i can reuse the code w a simple one-liner, like this:


1
2
3
4
// inside some other function
// ...
item.find(".ckeditorInline").dblclick(["dynamic ckeditor instance", "a different param"], bindDblclickToCkeditorInline);
// ...


cool, huh?

i got this idea while reading the jquery dblclick() api page.



UPDATE 20150930

after writing this post yesterday i discovered an extremely useful piece of information regarding jquery binding, so that i don't even need that one-liner to manually bind dynamically added DOM elements: "binding way up the DOM tree".

the only change needed is to line 10 above:


10
$(".ckeditorInline").dblclick(["existing ckeditor instance on pageload", "a second param"], bindDblclickToCkeditorInline);

change it to this and u won't need to do anything extra for dynamically added elements (i.e. code block #4 on this page is now unnecessary!):


10
$("body").on("dblclick", ".ckeditorInline", ["existing ckeditor instance on pageload", "a second param"], bindDblclickToCkeditorInline);


###

i used hilite.me for source code highlighting:
hilite.me converts your code snippets into pretty-printed HTML format, easily embeddable into blog posts, emails and websites.

20150909

[SOLVED] dynamically created jquery-ui ".resizable" div not resizing

i have jquery code inside a document.ready function that initializes all existing ".resizable" divs with a list of options n custom event listener functions
here's how i was able to add a dynamic jquery-ui resizable div to the HTML DOM n initialize it so it's immediately resizable AND has the same options config that the pre-existing resizable divs got in the main document.ready resizable declaration:

below is a jquery method  where i create a dynamic div (elem), with an inner div w class "resizable ui-resizable" that i want to initialize as "resizable":

$(".selector").on("someevent", function(){
  ...
  // the dynamic div, elem, gets a "resizable" child div
  elem.html('<div class="resizable ui-resizable"><p>dynamic, resizable div</p></div>');
  ...

  // get the resizable options(+event functions: create, start, stop, resize)
  var options = $( ".resizable" ).resizable( "option" );
  // get the elem div's inner "resizable" div
  var resizeElem = elem.find('.resizable');
  // initialize it w the options declared elsewhere in the document.ready script--we don't need to write double code
  resizeElem.resizable(options);
  // this last part was key to get it working--u have to get the instance, then initialize THAT w the options TOO!
  var resizeInst = resizeElem.resizable("instance");
  resizeInst.option( options );
}