Install / build docker squash on OS X to reduce docker image size

Recently while I was trying to install a Docker related app called docker-squash on OSX El Capitan.

For those who are not familiar with the utility; docker squash is a nice utility that reduces the size of docker images by removing the layers

However when running the command

go get github.com/docker/docker/pkg/units

I was getting the following error message :

Building docker-squash
export.go:19:2: cannot find package "github.com/docker/docker/pkg/units" in any of:
        /usr/lib/go/src/pkg/github.com/docker/docker/pkg/units (from $GOROOT)
        /root/t/docker-squash/src/github.com/docker/docker/p

Below I will show you how to build docker squash step by step (some steps can be omitted i.e. installing go if you already have installed)

Install go and set-up variables

brew install go
mkdir $HOME/.go
export GOPATH=$HOME/.go
export PATH=$PATH:$GOPATH/bin

Clone the docker squash repo

I'm not sure this is required but clone the repo under ~/.go/src/github.com/jwilder/docker-squash/

git clone https://github.com/jwilder/docker-squash.git

Install glock and sync your repo

under the folder ~/.go/src/github.com/jwilder/docker-squash/ run the following command

go get github.com/robfig/glock

Once the command finished sync your local repo with glock

glock sync github.com/jwilder/docker-squash

Install the units package

go get github.com/docker/docker/pkg/units

Build docker squash

GOBIN=$(pwd) make

Install gnu-tar and added to the path

brew install gnu-tar
PATH="/usr/local/opt/gnu-tar/libexec/gnubin:$PATH"

Move the executable to a bin folder

You should now have a docker-squash executable in your local repository; move the executable to a bin folder of your choice for example /usr/local/bin/

You should now be able to run docker-squash from your mac

Final thoughts and remarks

If you use docker-squash frequently you should change your .bashrc to do this automatically

Jaspersoft Studio OSX jdk 8/7 not starting

Recently I downloaded Jaspersoft studio on my Mac OSX but I was having trouble laughing the app as the system kept telling me I needed the older runtime version of Java, as you can see from the screenshot below (sorry in french)

Luckily this is solved pretty easy head up to your Applications folder and right click on Jaspersoft Studio.app then on the pop-up menu show package contents then inside the Contents folder you should find an info.plist file; edit the file and add the following line (or change the Current in the path with the JDK version you want) :

-vm/System/Library/Frameworks/JavaVM.framework/Versions/Current/Commands/java

Save the edited file; you should now be able to launch the software without problems

HSQLDB Query log - Output SQL statements to log file

It's sometimes useful (especially for debbuging) to be able to see all the SQL statements that the database runs

Lots of RDBMS have this very useful feature (MySQL for example calls it query log)

The HSQLDB is one of those and it can be accomplished in several ways, here I will show you how to do it within the db url and using a SQL statement :

1.- In the DB url

Just add the following parameter to your db url :

hsqldb.sqllog=3

For example :

jdbc:hsqldb:file:c:/dev/db/my_db;shutdown=true;hsqldb.sqllog=3

2.- Through a SQL statement

SET DATABASE EVENT LOG SQL LEVEL 3

Once this is done you will find a log file in the same folder as your database with the naming convention like ${dbname}.sql.log like so :

my_db.sql.log

More info here : hsqldb monitoring documentation

Content disposition duplicate headers solution for google chrome

Recently I had a problem while serving dynamic content in a Spring MVC application; (more details here) when attempting to open some of the dynamic content with Chrome I was having a weird error message :

Duplicate headers received from server The response from the server contained duplicate headers. This problem is generally the result of a misconfigured website or proxy. Only the website or proxy administrator can fix this issue. Error 349 (net::ERR_RESPONSE_HEADERS_MULTIPLE_CONTENT_DISPOSITION): Multiple distinct Content-Disposition headers received. This is disallowed to protect against HTTP response splitting attacks.

I wasn't sure why I was having this problem, since some dynamic content was working properly and I was setting only once the Content-Disposition header on my code

So after searching around a bit I stumbled upon the HTTP specs it turns out the Content-Disposition header should not contain a coma since it will be treated as a header separator

Multiple message-header fields with the same field-name MAY be present in a message if and only if the entire field-value for that header field is defined as a comma-separated list [i.e., #(values)]. It MUST be possible to combine the multiple header fields into one "field-name: field-value" pair, without changing the semantics of the message, by appending each subsequent field-value to the first, each separated by a comma.

Personally I decided to create slugs for all my file names using the Slugify library :

    com.github.slugify
    slugify
    2.1.3

  public String slugify(String originalFileName){

      String extension = FilenameUtils.getExtension(originalFileName);
      return new Slugify(true).slugify(FilenameUtils.removeExtension(originalFileName)) +"."+extension;;

  }

Spring mvc send binary content from controller

Sometimes binary files such as images, documents are stored in the database; these binary files need then to be served dynamically

Below I'll show a code snippet showing how to handle this easily with Spring MVC

Before we begin just in case this is the list of libraries I used when coding this example :

• Spring 3+
• Spring Data JPA
• Eclipselink 2.4+
• Apache Tika
• Slugify

@Entity
public class Resouce{

    @Id @Column(name = "ID")
    @GeneratedValue(strategy = GenerationType.IDENTITY)
    private Long id;

    @Column(name = "FILE_NAME", length = 200)
    private String fileName;


   @Column(name = "FILE")
    @Lob
    private byte[] file;

   //SETTERS - GETTERS OMMITED
}

@ResponseStatus(value = HttpStatus.NOT_FOUND)
public class ResourceNotFoundException extends RuntimeException {

}

/**
 * @author ulf
 */
@Controller
@RequestMapping("/resource")
public class ResourceController{

    // a basic Spring data repository
    @Autowired
    private ResourceRepostiory resourceRepository;

    
    // simple tika instance for handling mimetype resolution
    @Autowired
    private Tika tika;

    @RequestMapping(method = RequestMethod.GET)
    public ResponseEntity resource(@RequestParam("resourceId") Long resourceId) throws IOException {

        byte[] binary = null;
        String fileName = "";


            Resouce resource= resourceRepository.findOne(resourceId);

            if (resource!= null  && section.getFile() !=null ) {
                binary = section.getFile();
                fileName = section.getFileName();
            }


        if (binary == null) {
            throw new ResourceNotFoundException();
        } else {

            String extension = FilenameUtils.getExtension(fileName);

            // slugify the fileName to handle the Google Chrome error complaining of duplicate content disposition headers whenever the file name contains a ,
            fileName = new Slugify(true).slugify(FilenameUtils.removeExtension(fileName)) +"."+extension;

            HttpHeaders headers = new HttpHeaders();
            headers.setContentType(MediaType.parseMediaType(mimetype(fileName)));
            headers.setContentDispositionFormData(fileName, fileName);
            headers.setCacheControl("must-revalidate, post-check=0, pre-check=0");
            ResponseEntity responseEntity = new ResponseEntity(binary, headers, HttpStatus.OK);
            return responseEntity;


        }


    }

    private String mimetype(String fileName) {
        return ConfigurableMimeFileTypeMap.getDefaultFileTypeMap().getContentType(fileName);
    }


}

And that's it you should now be able to serve resources dynamically based on their id

Jasper Reports PDF image quality (blurry and poor) solution

Recently I had to create a PDF Jasper Report that contained a lot of small images (I needed to represent checkboxes); however upon generating the PDF the image quality was really awful since for some reason they were been scaled (even though I had configured the report to show them in real size and the image was the same dimensions as its placeholder)

I spent quite some time searching for a solutions, one popular one was to add the following parameter either to the report as a property or in the jasperreports.properties in the CLASSPATH to be picked up by the engine but to no avail.

In the end after searching and reading different threads I found 2 solutions that work :

1. Convert your PNG to SVG

You can convert your PNGs to SVGs either by using something like Adobe Ilustrator or something similar or you can also head up to this website : PNG to SVG converter and follow the instructions

You can then place your SVGs in the appropriate folder in your application where you can pass the path of the image as a parameter when filling the report; you will also have to modify the source of your JRXML like so to use the SVG format in your report :

However this approach stopped working when I upgraded to JasperReports 5.6.1

2. Create a larger version of your PNG

This is the final solution I used since the previous one stopped working when I upgraded

This one is pretty straight-forward just create an image 400% larger than the image place-holder (hopping you have an original image that is bigger otherwise you'll end up loosing quality in the process).

For example if you take the example before where the image place holder dimensions where 15px - 15px I created an image whose dimensions where 60px - 60px and that was it.

Creating custom font icons

FontIcons have become really popular in the past few years and they have a lot of advantages such as :

• They are vector based so no loss in quality when re-sizing
• The ability to easily change their size/color/shade ; without involving an image editor (they are just fonts!)
• The ability to combine font-icons or add text-decorations, gradients, textures (depending on browser support)

When creating FontIcons you have a few options, here I will discuss how to create them from PNG files

1. Converting your png to svg

Sorry I lied you cannot directly create a FontIcon from a PNG; you need to convert it first to a vectorial format SVG

Once again you have various options when it comes to converting a PNG; if you are lucky you might have an Adobe Illustrator licence where you can perform the conversion (or maybe another program I'm not aware of), otherwise you will have to use another approach, in my case I use PNG to SVG converter.

The site is pretty straightforward, just upload your PNG store somewhere the generated SVG for later use on the FontIcon website.

2. Uploading your SVG to the FontIcon generator

Head up to fontastic.me and create an account; and once the account created login.

We can now start creating our Font

Click on the "new font" button :

Once the pop-up opens provide a name for your font (whatever you like) :

With your new font selected click on "Add more Icons" and then on "Import Icons":

Upload your SVG(s) :

Once your SVG(s) are uploaded they will appear under the "Custom Icons" category; you can now select the icons you would like to include in your Font; you can create a mix between your custom icons and icons present in other well known fonts such as FontAwesome or Octicons to create your custom Font

Finally you can either download your Font or publish it on the Font Cloud :

At the bottom of the page you can also see the CSS class mapping as well as the Character mapping

For this tutorial we will not publish the Font in the cloud but we will download the bundle by clicking on the "Download" button

3. Installing and using your Font and FontIcons

Once you clicked on the download button you should have a zip file containing all the fonts, and styles like so :

You can now add your FontIcons in 3 easy steps :

1. Add the styles.css file to your HTML page(s)
2. Copy the fontsfolder to a path accessible to your application
3. Insert the icon class name into an HTML tag to add the corresponding icon (prefixed with 'icon-' if you chose the default options) e.g. icon-eraser and you're done