Javascript console – fConsole (Miscellaneous)

fConsole v1.0 – For touch devices and desktop browsers

A simple plugin that you can use to display the values of whatever you want. Its useful for touch devices as for desktop too.

• very useful for environments who lack of a console
• you can dragg the console around the browser (works fine on touch devices too)
• you can run Javascript code in fConsole footer area and see the results by pressing enter key or ‘Exec’ button.
• you can minimize the console
• will log Javascript errors
• on desktop browsers use UP or DOWN keys to access typing history
• available keyboard shortcuts:
  • Alt + C – Open fConsole
  • Alt + X – Close fConsole
  • Alt + Z – Minimize fConsole
  • Alt + D – Clear fConsole
• How to use this plugin

  • var myConsole;
    (function () {
        //init console
        myConsole = new fConsole({
            hideHeader: false, //if is true - will disable draggable option
            hideFooter: false, //if is true - will no longer be able to run Javascript code
            className: null, //if is set - you can control the console from CSS - all inline style will be removed
            width: "250px",
            minWidth: 0,
            maxHeight: "250px",
            position: "bottomLeft", //topLeft | topRight | bottomLeft | bottomRight
            draggable: true,
            opacity: 1,
            fontSize: "12px",
            fontFamily: "monospace",
            theme: "default", //default | clasic | light
            logJSErrors: true, //will log JS errors
            zIndex: 2147483647
        });
    })();
    
    $(document).ready(function () {
        //myConsole.log method parameters
        //  first - a string
        //  second - interval - set in miliseconds
        //  third - row background color
        //  four - row text color
    
        //simple message
        myConsole.log("Hello!");
    
        //mssage with custom BgColor
        myConsole.log("Hello!", null, "#00FF00");
    
        //mssage withc custom BgColor and TextColor
        myConsole.log("Hello!", null, "#00FF00", "#000");
    
        //message in realtime - get time stamp at one second interval
        myConsole.log(function() { return Date.now(); }, 1000);
    });
    

• you can use the fConsole directly too – will use default options

  • $(document).ready(function () {
        //simple message
        fConsole.log("Hello!");
    
        //mssage with custom BgColor
        fConsole.log("Hello!", null, "#00FF00");
    
        //mssage withc custom BgColor and TextColor
        fConsole.log("Hello!", null, "#00FF00", "#000");
    
        //message in realtime - get time stamp at one second interval
        fConsole.log(function() { return Date.now(); }, 1000);
    });
    

• you can change fConsole settings like this

  • var myConsole;
    (function () {
        //init console
        myConsole = new fConsole();
    })();
    
    $(document).ready(function () {
        myConsole.reloadSettings({ theme: "default" });
        myConsole.reloadSettings({ width: "100%", minWidht: 0 });
    });
    

Some general methods that may help you

• rgbToHex

  fConsole.rgbToHex("rgb(65, 5, 116)");

• hexToRgb

  fConsole.hexToRgb("#FF00FF")

• isNumeric

  fConsole.isNumeric(123); //verify if the parameter is a number

• isTouchDevice

  fConsole.isTouchDevice(); //return true of false

• getWindowWidth

  fConsole.getWindowWidth(); //get browser window width

• getWindowHeight

  fConsole.getWindowHeight(); //get browser window height

• openUrlInNewTab

  fConsole.openUrlInNewTab("http://compedio.ro/fConsole"); //will open a url in a new tab

• setCookie

  fConsole.setCookie("cookie-name", "cookie-value", 2); //cookie name, cookie value, cookie expire in nr of days

• setTempCookie

  fConsole.setTempCookie("cookie-name", "cookie-value"); //cookie name, cookie value - the cookie will expire aftere the you close the browser

• getCookie

  fConsole.getCookie("cookie-name"); //will display the value of that cookie, null if cookie don't exists

• validateEmail

  fConsole.validateEmail("[email protected]"); //will validate if a string is a valid email address