bauerjj

Ackee Analytics with MongoDB Atlas using Netlify

2021-03-26T00:00:00-07:00

I transitioned from the spyware of Google Analytics to a more privacy focused analytics solution. I also didn’t require the granularity that Google Analytics provided. My other requirement was that I’m lazy and didn’t want to self-host. Thus I opted to use Ackee and Netlify in conjunction with MongoDB Atlas. It took me about 20 minutes to create the necessary accounts and install the small snippet of code to start seeing the analytics.

MongoDB Atlas

Create an account at MongoDB Atlas and opt for a free account. Create a new Project and then click Create a New Cluster button and wait for it to finish.
Under the Security column, select Database Access and create a new user database user by clicking ADD NEW DATABASE USER and choose to authenticate using the password method. Make the username ackee and create your own strong password.
Select Network Access and then ADD IP ADDRESS and enter 0.0.0.0/0 to make it universal since Netlify will be making the requests and not your local machine.
When the cluster is finished creating, select Connect and then Connect your application and note a similar connection string of mongodb+srv://ackee:<password>@cluster0.<your-server-uri>.mongodb.net/myFirstDatabase. That is all for now

Netlify

Click the Deploy to Netlify button found on Ackee’s Getting Started page. Then authenticate using your existing github credentials.
Netlify will prompt you for a few credentials. Enter the following:

ACKEE_USERNAME = ackee
ACKEE_PASSWORD = <your-strong-password>
ACKEE_MONGODB = <your-mongodb-database-password-from-atlas>
ACKEE_ALLOW_ORIGIN = *

The astrix can be replaced with your netfliy URL. Mine looks something like this dazzling-engelbart-xxxxx.netlify.app

NOTE You can change these environment variables after you create the website inside netlify under Deploy->Environment

Allow Netlify to now create your repository on github and build and publish it automatically! Login to your Ackee web interface, in Settings panel, set up a New domain in the Domains section. You should also see the the tracking code (embed code) with a unique domain-id. Copy and paste this code in the header section of your website in order to capture all vists. In Laravel, there is a unique head.blade template for stuffing this into.

See this blog post on how to keep up-to-date with Ackee.
You can now export all of your existing Google Analytics information into excel and delete the tracking code.

Git History Graphs

2019-06-14T00:00:00-07:00

This is more of a reminder for myself so that I can remember how to edit my banner image.

I was looking for a way to generate pretty git graphs for my webpage to showcase my professional progression when I stumpled upon this stackoverflow post. From there I followed one of the answers to gitdags repo. I would encourage new users to use the supplied docker image to save yourself from installing numerous software packages like I did.

Here is the source of my tex file to generate my banner image:

\documentclass[preview]{standalone}
%\documentclass{article}
\usepackage[a4paper, landscape, total={20in, 20in}, margin=0pt]{geometry}



\usepackage{subcaption}
\usepackage{gitdags}

\begin{document}

\begin{figure}
  \begin{subfigure}[b]{\textwidth}
    \centering
    \begin{tikzpicture}
      % Commit DAG
      \gitDAG[grow right sep = 2.5em, branch down=4em]{
          1989[xshift=-4em] -- 2011 -- feb --     
          {  microchip{-}technology[yshift=2em, xshift=0em] -- 2014[yshift=2em] -- blockwise{-}engineering[yshift=2em] -- 2017[yshift=2em] --  agjunction[yshift=2em] -- 2019[yshift=2em] -- axon[yshift=2em] ,  
            sphinx{-}search[xshift=0em, yshift=0em] -- http{://}mcuhq{.}com -- http{://}bauerjj{.}github{.}io[yshift=0em] }
           -- justin{-}bauer
      };
      % Tag reference
      \gittag
        [v0p1]       % node name
        {electrical\char`_engineering}       % node text
        {above=of 2011} % node placement
        {2011}  
      \gittag
        [v0p2]       % node name
        {rose-hulman\char`_inst\char`_of\char`_tech}       % node text
        {above=of v0p1} % node placement
        {v0p1}          % target        % target
      \gittag
        [appEngineer]       % node name
        {applications\char`_engineer}       % node text
        {above=of microchip{-}technology} % node placement
        {microchip{-}technology}
      \gittag
        [bwisejob]       % node name
        {embedded\char`_electrical\char`_engineer}       % node text
        {above=of blockwise{-}engineering} % node placement
        {blockwise{-}engineering} 
      \gittag
        [agjunctionjob]       % node name
        {embedded\char`_software\char`_engineer}       % node text
        {above=of agjunction} % node placement
        {agjunction} 
      \gittag
        [axonjob]       % node name
        {senior\char`_software\char`_engineer}       % node text
        {above=of axon} % node placement
        {axon} 
      % Remote branch
      \gitremotebranch
        [origmaster]    % node name
        {origin/master} % node text
        {above=of 1989}    % node placement
        {1989}             % target
      % Branch
      \gitbranch
        {chicago{-}il}     % node name and text 
        {below=of 1989} % node placement
        {1989}          % target
      \gitbranch
        {indy-in}     % node name and text 
        {below=of 2011} % node placement
        {2011}          % target
      \gitbranch
        {tempe{-}az}     % node name and text 
        {below=of feb} % node placement
        {feb}          % target
      \gitHEAD
        {above=of justin{-}bauer} % node placement
        {justin{-}bauer}          % target
      \gitbranch
        {dev{-}hobby}     % node name and text 
        {below=of sphinx{-}search} % node placement
        {sphinx{-}search}          % target
      \gitbranch
        {dev{-}hobby}     % node name and text 
        {below=of http{://}mcuhq{.}com} % node placement
        {http{://}mcuhq{.}com}          % target
      \gitbranch
        {dev{-}hobby}     % node name and text 
        {below=of http{://}bauerjj{.}github{.}io} % node placement
        {http{://}bauerjj{.}github{.}io}          % target
    \end{tikzpicture}
  \end{subfigure}


 
\end{figure}

\end{document}

Fix tearing for NVIDIA in Ubuntu 18.04 Mate

2018-10-22T00:00:00-07:00

I noticed terrible tearing inside firefox after upgrading to 18.04 and getting new 2k monitors finally. I had a guess that it was related to vsync not being enabled, however the NVIDIA X Server Settings indicated that “Sync to VBlank” was already enabled and I took that to mean that vsync was enabled. I still had the problem until I tried this solution which was to enable vsync inside the proprietary driver. I changed my driver for my Quadro K2100M integrated graphics to using the “NVIDIA driver metapackage from nvidia-driver-390 (proprietary, tested)” inside of “Software and Updates”. In summary, do the following:

$ sudo echo "options nvidia-drm modeset=1" >> /etc/modprobe.d/nvidia-drm-nomodeset.conf
$ sudo update-initramfs -u
$ sudo reboot

Check with:

sudo cat /sys/module/nvidia_drm/parameters/modeset

Now you can scroll vertically with no noticeable tearing.

Setup Leger Nano S on Ubuntu Linux

2018-03-20T00:00:00-07:00

This is a quick HOW-TO for getting your new Ledger Nano S running in Ubuntu

Install

Choose a PIN on your Nano S
Record the 24-word seed on the supplied papers
Create a new udev rule so that ubuntu will recognize the USB device.
```
 sudo subl /etc/udev/rules.d/ledger.rules
```

Paste the following into the udev rules file. Be sure to replace your username:

 SUBSYSTEMS=="usb", ATTRS{idVendor}=="2c97", ATTRS{idProduct}=="0000", MODE="0660", TAG+="uaccess", TAG+="udev-acl" OWNER="<UNIX username>"
 SUBSYSTEMS=="usb", ATTRS{idVendor}=="2c97", ATTRS{idProduct}=="0001", MODE="0660", TAG+="uaccess", TAG+="udev-acl" OWNER="<UNIX username>"

Reload the rules. udevadm control --reload-rules && udevadm trigger. Optionally just unplug and replug your Nano S.
Your Nano S should now present you with its public key on its screen. See the usb listing:
```
 lsusb -d 2c97:0001 -v
```

Verify Authenticity

The following will ensure that you are using a valid Nano S. Sources: Ledger Nano S help page and Python Tools for Ledger Nano S

sudo apt-get install libudev-dev libusb-1.0.0-dev python-dev virtualenv
virtualenv ledger
source ledger/bin/activiate
pip install ECPy==0.8.1
pip install --no-cache-dir ledgerblue
For firmware 1.3.1 or below: python -m ledgerblue.checkGenuine --targetId 0x31100002 else python -m ledgerblue.checkGenuine --targetId 0x31100003

You should now be confident in your device and be able to load apps using their ledger manager

Mpow Bluetooth Receiver Streambot Car Modification

2018-03-12T00:00:00-07:00

WORK IN PROGRESS

I received an Mpow Bluetooth Receiver as a gift for use in my car. It quickly became apparent that I would have to manually turn ON the device every time I got in my car to have it connect to my phone. This required a 2-3 second hold on the play/pause button. I also had to turn it OFF once I arrived at my apartment since my phone would stay connected to it after I left my car. I found this tedious, so I created a simple modification that would no longer require any turning ON/OFF the adapter. The bluetooth receiver would turn ON automatically with the car and connect to your phone. It would then turn OFF with the car battery.

Modification:

Parts

VN2222LL-G-ND MOSFET N-CH 60V 0.23A TO92-3
445-2873-ND CAP CER 4.7UF 16V X7R RADIAL
100KXBK-ND RES 100K OHM 1/4W 1% AXIAL
RNF14FTD1K00CT-ND RES 1K OHM 1/4W 1% AXIAL

The basic premise is as follows:

Car turns ON, button press is simulated as pressed immediately. Bluetooth search sequence initiated on the Mpow.
Capacitor chargers for approximately 2-3 seconds until a threshold of between 0.6-2.5V is reached. The exact turn ON voltage depends on the transistor
Button press is simulated as being lifted. Mpow should be connected to phone now.

R1 and C1 create a classic low-pass filter with a charging rate equivalent to the resistance multiplied by the capacitance. We want to carefully tune these values to turn ON transistor Q1 after 3 seconds. This should put the Mpow in its discovery mode so that our phone can connect to it automatically when the car is started. R2 needs to be chosen so that the microcontroller on the Mpow sees a logic 1 (3.7V) when Q1 is OFF. I experimented with a few different values here and arrived at 1k.

I used LTspice to simulate the circuit before I built it. Q1 will start turning ON around 0.6V. The exact turn ON voltage varies between the silicon, so some expermientation may be required. I found a value of XXX to work with the simulation and in real-life.

Open the case up

Terminator Setup in Ubuntu

2017-10-19T00:00:00-07:00

I have found that terminator is one of the best terminal programs available for managing multiple terminals. I was tired of switching between contexts until I stumbled upon terminator. It makes it easy to spawn multiple terminal instances within a single window by creating another tab or by splitting the existing terminal.

Install:

sudo add-apt-repository ppa:gnome-terminator
sudo apt-get update
sudo apt-get install terminator

Here is my example config. This will create a 4 window pane. Paste this inside of ~/.config/terminator/config. You may need to create the file if it isn’t there. Restart terminator to see the new setup. Be sure to replace jbauer with your username.

[global_config]
  inactive_color_offset = 0.99
  suppress_multiple_term_dialog = True
[keybindings]
  copy = <Control>
  paste = <Control>v
[layouts]
  [[default]]
    [[[child0]]]
      fullscreen = False
      last_active_term = 87bdb8ee-fa88-4131-97c9-2209607d2fed
      last_active_window = True
      maximised = False
      order = 0
      parent = ""
      position = 525:100
      size = 1249, 733
      title = jbauer@ubuntu: ~
      type = Window
    [[[child1]]]
      order = 0
      parent = child0
      position = 594
      ratio = 0.477582065653
      type = HPaned
    [[[child2]]]
      order = 0
      parent = child1
      position = 366
      ratio = 0.50272851296
      type = VPaned
    [[[child5]]]
      order = 1
      parent = child1
      position = 366
      ratio = 0.50272851296
      type = VPaned
    [[[terminal3]]]
      directory = /home/jbauer/Desktop
      order = 0
      parent = child2
      profile = default
      type = Terminal
      uuid = d1af43fc-c268-4e1d-a53d-dd501827ac55
    [[[terminal4]]]
      order = 1
      parent = child2
      profile = default
      type = Terminal
      uuid = f25f1048-779f-4c96-a7c4-fd63554cb278
    [[[terminal6]]]
      order = 0
      parent = child5
      profile = default
      type = Terminal
      uuid = 87bdb8ee-fa88-4131-97c9-2209607d2fed
    [[[terminal7]]]
      directory = /home/jbauer/Desktop
      order = 1
      parent = child5
      profile = default
      type = Terminal
      uuid = f281f00c-958e-40d3-84d5-a87294fbb75f
  [[cool]]
    [[[child0]]]
      fullscreen = False
      last_active_term = 87bdb8ee-fa88-4131-97c9-2209607d2fed
      last_active_window = True
      maximised = False
      order = 0
      parent = ""
      position = 525:100
      size = 1249, 733
      title = jbauer@ubuntu: ~
      type = Window
    [[[child1]]]
      order = 0
      parent = child0
      position = 594
      ratio = 0.477582065653
      type = HPaned
    [[[child2]]]
      order = 0
      parent = child1
      position = 366
      ratio = 0.50272851296
      type = VPaned
    [[[child5]]]
      order = 1
      parent = child1
      position = 366
      ratio = 0.50272851296
      type = VPaned
    [[[terminal3]]]
      order = 0
      parent = child2
      profile = default
      type = Terminal
      uuid = d1af43fc-c268-4e1d-a53d-dd501827ac55
    [[[terminal4]]]
      order = 1
      parent = child2
      profile = default
      type = Terminal
      uuid = f25f1048-779f-4c96-a7c4-fd63554cb278
    [[[terminal6]]]
      order = 0
      parent = child5
      profile = default
      type = Terminal
      uuid = 87bdb8ee-fa88-4131-97c9-2209607d2fed
    [[[terminal7]]]
      order = 1
      parent = child5
      profile = default
      type = Terminal
      uuid = f281f00c-958e-40d3-84d5-a87294fbb75f
  [[defaultold]]
    [[[child1]]]
      parent = window0
      profile = default
      type = Terminal
    [[[window0]]]
      parent = ""
      type = Window
[plugins]
[profiles]
  [[default]]
    background_image = None
    font = Sans 10
    scroll_on_output = False
    scrollback_infinite = True

Three Phase Vector Diagram in Qt QML

2017-10-12T00:00:00-07:00

I needed to draw a phasor diagram that is typical of a three-phase power system. I chose Qt because I was most comfortable with the framework. I quickly realized that there exists no such readily available QML element, so I decided to write my own. The code requires QtQuick 2 and Qt 5.5+

It uses the Context2D object to grab the context and draw vectors along with the arrow head. I override the onPaint method to perform all of the math and drawing required. The graph does not appear to cause any performance issues on an iMX6Q processor. I use some trigonometry to calculate the length and displacement of each vector. There is a dynamically loaded Text element where I place descriptive text such as “V1” or “I1” to designate voltage or current. There is also a timer that increments the angles through its full range of motion for testing purposes.

I included a few links at the top of the source that helped me with the mathematics. Please let me know if you have any questions.

VectorDia.qml

import QtQuick 2.0
import "qrc:/utility"

/*
 * Inspiration:
 *
 *   https://woboq.com/blog/animations-using-the-qtquick-canvas.html
 *   http://stackoverflow.com/questions/26044801/draw-na-arc-circle-sector-in-qml
 *   https://forum.qt.io/topic/56628/qml-canvas-dashed-dotted-lines/2
*/

Canvas {
    id: canvas
    width: 480
    height: 272 - 20

    signal rightMove()
    signal leftMove()
    signal loaded()

    Component.onCompleted: {
        canvas.onLoaded()
    }

    property int vVectorLength: 90
    property int iVectorLength: (.75 * vVectorLength)
    property real start_x: width/2
    property real start_y: 15
    property real end_x: width/2
    property real end_y: height - 15
    property bool dashed: true
    property real dash_length: 3
    property real dash_space: 4
    property real line_width: 0.9
    property real stipple_length: (dash_length + dash_space) > 0 ? (dash_length + dash_space) : 16
    property color draw_color: "black"

    property variant vectors: [0,30,120,120,240,210] // test vectors

    property variant alt: [0,0,0,0,0,0]
    property int i: 0

    property var comp;
    property   var text;


    Timer{ // test timer to paint random stuff
        interval: 500; running: true; repeat: true;
        onTriggered: {
            canvas.requestPaint()
        }
    }




    onPaint: {
        // Get the drawing context
        var ctx = canvas.getContext('2d')
        canvas.i = 0;
        for(var j = 0; j <canvas.alt.length; j++){
            if(alt[j]!== 0)
                alt[j].destroy();
        }

        ctx.fillStyle = "#ffffff"; // "erase" the previously drawn stuff
        ctx.fillRect(0,0,canvas.width,canvas.height,"#000000")

        // set line color
        ctx.strokeStyle = draw_color;
        ctx.lineWidth = line_width;
        ctx.beginPath();


        var centreX = canvas.width / 2;
        var centreY = canvas.height / 2;

        // draw the circle
        ctx.beginPath();
        ctx.lineWidth = 2
        ctx.fillStyle = "black";
        ctx.arc(centreX, centreY, (width / 4) - 10, 0, Math.PI * 2, false);
        ctx.stroke();

        // make the dashed lines
        drawDashed(ctx,start_x, start_y, end_x, end_y);
        drawDashed(ctx,130, height/2, width - 130, height/2);

        // draw the vectors
        drawVector(ctx, true, 1, vectors[0], "V<sub>1</sub>");
        drawVector(ctx, false, 1, vectors[1], "I<sub>1</sub>");
        drawVector(ctx, true, 2, vectors[2], "V<sub>2</sub>");
        drawVector(ctx, false, 2, vectors[3], "I<sub>2</sub>");
        drawVector(ctx, true, 3, vectors[4], "V<sub>3</sub>");
        drawVector(ctx, false, 3, vectors[5], "I<sub>3</sub>");

        var i;
        for(i = 0; i < vectors.length; i++){
            vectors[i] += 5; // add some degrees for demo
            if(vectors[i] > 360)
                vectors[i] -= 360
        }

    }

    // QML Math library uses radians and not degrees
    function degToRad(deg){
        return deg * (Math.PI/180);
    }




    function drawVector(ctx, isVoltage, phase, angle, label){ // no guards in place for parameters

        var centreX = canvas.width / 2;
        var centreY = canvas.height / 2;
        var vectorLength = isVoltage === true ? vVectorLength : iVectorLength; // current and voltage vectors diff length
        var color; // line color determined from which vector is being drawn

        if(phase === 1)
            color = "red";
        else if(phase === 2)
            color = "#e5e500";
        else if(phase === 3)
            color = "green";
        else
            color = "black";


        // draw the line
        ctx.strokeStyle = color;
        ctx.fillStyle= color;
        ctx.beginPath()
        var x = Math.cos(degToRad(angle)) * vectorLength;
        var y = Math.sin(degToRad(angle)) * vectorLength;
        ctx.moveTo(centreX, centreY)
        ctx.lineTo(x + centreX, y + centreY);
        ctx.stroke();

        // now draw the triangle
        // Derive the two points that make the triangle from the center point
        // by making a slighly short radius at a few degrees to the left and right
        // from the center point
        ctx.beginPath();
        var triCenterX = x + centreX;
        var triCenterY = y + centreY
        var leftX = Math.cos(degToRad(angle + 3)) * (vectorLength - 7);
        var leftY = Math.sin(degToRad(angle + 3)) * (vectorLength - 7);
        var rightX = Math.cos(degToRad(angle - 3)) * (vectorLength - 7);
        var rightY = Math.sin(degToRad(angle - 3)) * (vectorLength - 7);

        ctx.moveTo(triCenterX,triCenterY);
        ctx.lineTo(leftX + centreX, leftY + centreY);
        ctx.lineTo(rightX + centreX, rightY + centreY);
        ctx.closePath();
        ctx.fill(); // fill the triangle


        comp = Qt.createComponent("qrc:/utility/MyLabel.qml")

        if (comp.status === Component.Ready)
            finishCreation(angle,label,triCenterX,triCenterY);
        else
            comp.statusChanged.connect(finishCreation(angle,label,triCenterX,triCenterY));

    }

    // Now draw the text next to the arrows
    // Check which of the 4 quadrants we are in so that text placement
    // is optimal
    function finishCreation(angle,label,triCenterX,triCenterY) {
        if (comp.status === Component.Ready) {

            if(angle > 180 && angle < 360 )
                text = comp.createObject(canvas,{"x": triCenterX , "y": triCenterY -15});
               // text = comp.createObject(canvas,{"x": triCenterX, "y": triCenterY - 15});
            //if(angle > 270 && angle <= 360 )
              //  text = comp.createObject(canvas,{"x": triCenterX + 10, "y": triCenterY - 15});
            else //if(angle > 0 && angle <= 180 )
                text = comp.createObject(canvas,{"x": triCenterX, "y": triCenterY + 2});
            text.name = label;

            canvas.alt[canvas.i++] = text;

            if (text === null) {
                // Error Handling
                console.log("Error creating object");
            }
        } else if (comp.status === Component.Error) {
            // Error Handling
            console.log("Error loading component:", comp.errorString());
        }
    }


    function drawDashed(ctx,startX, startY, endX, endY){
        // make the dashed line
        var dashLen = stipple_length;
        var dX = endX - startX;
        var dY = endY - startY;
        var dashes = Math.floor(Math.sqrt(dX * dX + dY * dY) / dashLen);

        if (dashes == 0)
        {
            dashes = 1;
        }
        var dash_to_length = dash_length/dashLen
        var space_to_length = 1 - dash_to_length
        var dashX = dX / dashes;
        var dashY = dY / dashes;
        var x1 = startX;
        var y1 = startY;

        ctx.moveTo(x1,y1);

        var q = 0;
        while (q++ < dashes) {
            x1 += dashX*dash_to_length;
            y1 += dashY*dash_to_length;
            ctx.lineTo(x1, y1);
            x1 += dashX*space_to_length;
            y1 += dashY*space_to_length;
            ctx.moveTo(x1, y1);

        }
        ctx.stroke();
    }

    Text {
        id: text1
        x: 100
        y: 119
        text: qsTr("180°")
        font.pixelSize: 10
    }

    Text {
        id: text2
        x: 355
        y: 119
        width: 20
        height: 12
        text: qsTr("0°")
        font.pixelSize: 10
    }

    Text {
        id: text3
        x: 231
        y: 239
        text: qsTr("-90°")
        font.pixelSize: 10
    }



    Text {
        id: text4
        x: 233
        y: 2
        text: qsTr("90°")
        font.pixelSize: 10
    }


    Text {
        id: update
        x: 8
        y: 13
        text: qsTr("|")
        font.pixelSize: 20
        //verticalAlignment: Text.verticalCenter
        horizontalAlignment: Text.horizontalCenter
    }

    Timer{
        interval: 500 //500ms
        repeat: true
        running: true
        onTriggered: {
            if(update.text == "|")
                update.text = "/";
            else if(update.text == "/")
                update.text = "--";
            else if(update.text == "--")
                update.text = "\\"
            else if(update.text == "\\")
                update.text = "|"

        }
    }


}

MyLabel.qml

import QtQuick 2.0

Text{
    id: textId
    property string name: "";
    text: textId.name
    textFormat: Text.RichText
    font.pixelSize: 12

    function destoryMe(){
        textId.destory()
    }
}

Installing jekyll on Linux

2017-07-27T00:00:00-07:00

I use jekyll on some of my projects to produce a static html web page, like this one. I can easily edit the source and have an OK looking frontend without doing much CSS work. I find myself googling a few things from the errors I get inside the terminal as I try to install jekyll and all the necessary components needed to serve my web page. Here is a condensed version of what needs to be installed to have your github page served locally.

sudo apt-get install ruby gem ruby-dev ruby-bundler zlib1g-dev nodejs
sudo gem install jekyll nokogiri
bundle install

Finally, in your github pages repo, you can now run bundle exec jekyll serve

Automate Jekyll Production

2017-07-27T00:00:00-07:00

The main benefit I see of using jekyll is being able to edit a plain markdown file and have it appear live on the Internet in just a few seconds. In order for this to happen, I have to perform the following:

Make an edit
Build the website
Commit and push the changes to gh-pages branch
Copy the contents under _site from the gh-pages folder into the production folder
CD into the production-ready folder
Commit and push the changes to the master branch
Wait 5 seconds for github to publish the changes live on github.io.

I wanted a way to automate this.

I have to perform the above steps since I am using jekyll-maps which is not one of the approved plugins that I can use on github pages. This forces me to NOT have github automatically build my jekyll site. I must therefore upload all of the static HTML content on my master branch and have my source files in a gh-pages branch. Github pages will serve the static content from the master branch live for you for free!

I created two folders, one for production and one for source edits. I did the following after already creating the gh-pages branch previously:

cd ~/Documents/github
mkdir production source
cd production; git pull <my_git_repo>.git; git checkout master
cd ../source; git pull <my_git_repo>.git; git checkout gh-pages

I have already forked a jekyll theme that includes all of the scaffolding. I can CD into the source folder, make an edit, and push my changes. I can see the website live on my localhost by running bundle exec jekyll serve. All of the links are relative to my localhost, so I now need to export JEKYLL_ENV=production so that jekyll will produce links with my http://bauerjj.github.io baseurl.

This is where I encounter a jekyll bug that causes a double slash (//) in place of where a single slash should be (/). For example, links will show up as http://bauerjj.github.io//blog instead of http://bauerjj.github.io/blog. I followed jira 6057 and its proposed solution of using URLFilters, however I was not able to resolve my problem. I created a simple script instead that fixes the slashes in the _site directory by iteratiing through all of the files and performing a replace. My config has this: baseurl : "/". Notice how I put multiple slahes. This was so that the script could look for 5 slashes and do the replace since some valid // occur such as those in an http:// url.

#!/bin/bash
# Small script that replaces \\\\\ with a single \ 
FILES=$(find ./ -type f -name '*')
for file in $FILES; do
   sed -i -e 's/\/\/\/\/\//\//g' $file
done

I then needed a method to monitor the source directory for any changes and then commit, push, and deploy the static content up to github for me. I used gitwatch and forked it so that I could customize it do run my replace.sh script, copy the static contents to my production folder, and then commit/push everything to github. You can see my simple changes to the script on my own fork. Now, just execute ./gitwatch and watch it do its magic whenever you edit a source file!

Please let me know if you have any problems.

UD-3900 Pluggable Docking Station with Ubuntu Dual-Monitors

2017-07-11T01:03:00-07:00

I struggled for a bit to get my UD-3900 working under Ubuntu MATE 16.04.2. Here are the steps I took:

1) Ensure that the kernel is AT LEAST 4.8 by running uname -r. I tried to downgrade my kernel to 4.4 after failing a few times to no avail.

2) Update your system. sudo apt-get update and sudo apt-get dist-upgrade

3) Download the DisplayLink Driver

4) If you haven’t already, install dkms sudo apt-get install dkms

5) chmod a+x displaylink-driver-xxxx

6) ./displaylink-driver-xx

7) nano /usr/share/X11/xorg.cong.d/20-displaylink.conf Paste this into that file:

Section "Device" 
  Identifier "Intel Graphics"
  Driver "intel"
EndSection

8) reboot

After a reboot, I had to wait 50 seconds before Ubuntu recognized the screens. If something went wrong, you can uninstall the driver sudo displaylink-installer uninstall

Use lsusb to see if the driver is installed or not.

DisplyLink Troubleshoot Article