English

Generating SVG Barcodes

While barcodes have been around for decades, and we all know how fundamental they are to everyday life, it doesn't mean your last implementation is still the best way to integrate them. Technology is always changing and it's moving forward while new technologies replace older ones. A barcode which used to be in JPEG format can now be in the scalable SVG format.

In this video, I walk through the use of a JavaScript library which allows for the easy creation of SVG barcodes. This works without a specific font and allows for a scalable file which can be integrated into a PDF or any other type of output. Need barcode support on FileMaker Go on iOS? Need to generate barcodes client side on either Mac or Windows?

If you're building a solution which needs to use barcodes, and you're looking for the least expensive option, then you can't get much better than a commercially free JavaScript library. All it takes is a little bit of know-how and you're creating barcodes in very little time!

Tags:
SVG
AttachmentSize
SVGBarcodes.zip1.61 MB

JavaScripting PDFs

FileMaker Pro has a wonderful PDF generator. In fact, one of the biggest benefits of using FileMaker for the purpose of output is that you can make any layout look exactly how you'd like and with a few script steps, you've got PDF output which will fit 95% of the situations you'll come across.

There are, however, certain situations where knowing how to generate a PDF using JavaScript, from within a Web Viewer, will give you the exact results you're looking for.

There are a number of advantages with this approach. First, it can be SUPER fast when generating the PDF and second, you can selectively decide what you want to output from within the whole of your HTML. So, if you're using HTML to present a lot of information, but only want a PDF of a portion of that HTML, then you can certainly accomplish that with this technique.

Even if you don't need the exact functionality of HTML -> PDF output there's a lot to learn from this video if you've never used JavaScript in order to call a FileMaker script and pass in some data.

Tags:
PDF
AttachmentSize
JavaScripting_PDFs.zip1.75 MB

Pivoting data

While FileMaker's own Layout Mode provides excellent tools for formatting data for display and output, it isn't always the most convenient for certain types of output. A prime example is a pivot table. Or, the output of data which is normally columnar formatted into a horizontal format.

When attempting to do this with native FileMaker functionality, it quickly becomes a bit of a hassle, typically including more relationships than should be otherwise necessary.

There are solutions which can make use of repeating horizontal fields, but these typically have a hard limit and the width of the data does not dictate the largest column width. If you work creatively with HTML/CSS and the other available features within FileMaker, you can realize a more flexible solution for horizontal data display and output!

Tags:
AttachmentSize
PivotingData.zip1.62 MB

Basic JavaScripting - Adding a color picker

If you've been learning and using FileMaker for any amount of time, then you'll likely know that FileMaker also has access to JavaScript. It does this through the Web Viewer object which can easily be added to any layout.

For some FileMaker developer's they may answer the question of "Why don't you know/learn Javascript?" with a response of it either being too hard or not being able to take the time to learn it. It' only when FileMaker can't do what what needs to be done when some developers start to look outside of FileMaker's core set of available tools.

The cool thing about JavaScript is that like many tools, it can do a variety of things better than FileMaker alone. I've never come across a single tool which can do it all the best way possible.

If you've never implemented any JavaScript within your FileMaker solution, then this video may be the best way to start that journey. The implementation of a JavaScript based color picker is so easy you'll be craving more and more JavaScript by the end of the video. Whether you need a color picker or the ability to draw content on top of an image file, JavaScript will offer a lot more extensibility than just sticking it out with FileMaker alone!

Tags:
AttachmentSize
BasicJavascripting.zip505.08 KB

Cool looking process indicators

Most everyone likes to know what's going on when something is happening. Being kept in the dark is something which causes possible anxiety and certainly a fair amount of impatience. So, it's always nice to provider your user with a little bit of status when there's some type of progress happening.

Fortunately, this is a very easy thing to solve when a lot of the work is already done for you. All you need to do is wire things up within a FileMaker web viewer.

Using the information within this video you can easily present your users with an indeterminate progress indicator. At least letting them know that something is happening rather than nothing.

Tags:
UI

Web Scraping Data

FileMaker can be such a wonderful desktop tool for harvesting and managing a lot of data. It’s because the user interface is baked right there into the backend database. You can whip up a powerful data parsing solution in no time. Can it handle the data? Yep! Can you build the interface right there? Yep! This sense of “data power” can be compounded even more with a little bit of know-how.

When you’re not afraid to step, just a bit, outside of FileMaker’s user interface and simply plug-in to another technology or programming language, you’ll find BIG benefits when seeking the holy grail of code leverage.

In this video, I walk you through some serious insight into how the big boys and girls like to parse their web data. If there’s ever a source of content you simply can’t access in an importable format, then you have to know how to web scrape like a pro within FileMaker - Pro, that is.

Tags:
AttachmentSize
WebScrapingData.zip383.91 KB

Dynamic SVG Interaction

When you attempt to translate human interaction from the real world into a database, that translation isn’t always the most ideal.

Within a database, you’re storing data within rows and columns and the real world isn’t always laid out so neatly. This is where using an image or graphic fills the gap and shortens that bridge of understanding for the user.

A good example would be a dental office and scheduling appointments within 2 hour blocks of time throughout the day. The office has a physical layout and a fixed number of stations. True, your standard calendaring application can take care of this, however, the person interacting with that data has to interpret it and translate it into understanding which relates to the physical world in which they are interacting with the chairs and equipment. What if certain procedures require certain facilities - as they most often do?

The ideal solution then, in many cases, is to allow a person to interact with that data in the most visually accurate way - with an image or graphic. The problem is, people move things around. But, what if this process can be accomplished super easily - why not go for the image?

In this video, I showcase how you can easily take the output of a standard SVG graphic and provide a level of interaction which allows for solving a lot of real-world data translation issues. If you like making “easy-to-use” solutions, then make sure and add this knowledge to your FileMaker tool belt!

Tags:
SVG
AttachmentSize
DynamicSVGInteraction.zip293.42 KB

QR Code Login Systems

When QR codes started gaining traction, the world’s developers were full of ideas about how they could be used. Large real-world multi-player games were even created and they started showing up on all kinds of packaging, products and marketing.

It was thought that the world would communicate via their mobile devices and go scan crazy when it came to QR codes.

The reality, however, was that while they are used quite a bit within industry and in many different ways, their general use is still somewhat lackluster.

Regardless, however, of how the general public feels about QR codes, we can take full advantage of them within our own FileMaker solutions. When you think a bit creatively, and you use knowledge about cryptographic hashing recently released within FileMaker 13, you can devise some pretty useful systems for interaction amongst groups of people.

In this video, I showcase a system being put in place for helping people to register for events or even log into FileMaker systems in order to update their personal information. With the content shown in this video, the sky’s the limit in terms of how you start to use QR codes in your own FileMaker solutions!

Tags:
AttachmentSize
QRLoginSystem.zip311.86 KB

Web Viewer Image Cropping

When it comes to solving problems within FileMaker, there's nothing quite so satisfying as visually seeing the result of a cool technique. Especially if it includes a picture of yourself!

Ok, vanity aside, this video and its technique file are just such a solution I had an immediate need, and put the technique to the test. It was all about collecting a variety of images from all kinds of different sources and making their presentation unified. Images were emailed to me which came from cell phones, high quality DSLR cameras and more.

I needed to manipulate theses images by cropping them to a specific size and storing them in an optimized fashion.

Limited to only native FileMaker functionality, this is a hard thing to do. You can't drag and image around to position, you can't choose the starting point and how much of an image to crop. You also can't zoom in or out in order to achieve the ideal size.

You can, however, do all these things with the tools FileMaker provides plus a little help from either a plugin or server side installed library.

This video will walk you through all the parts and pieces in order to understand how to both implement and use some pretty cool tech for cropping images right within FileMaker!

Tags:
AttachmentSize
WebViewerCropping.zip254.51 KB

Converting HTML to PDF

Outside of plain text, you can't get much more standard than HTML and PDF. They're pretty much agreed up by all major operating systems and the users who use them. FileMaker certainly supports embedding PDFs within container fields and HTML is quite easily integrated into Web Viewers. Using HTML within FileMaker is one of the most flexible ways to present information.

About the only thing you could wish for, (Yes, I'm sure you could wish for a lot of things) is any easy way to convert your HTML into a PDF. Here's the cool thing, it's already been done!

Using the open source tool wkhtmltopdf, you can populate your web viewer with whatever information you wish. Need a pivot table? Need more display control for your printed Invoices than FileMaker's native Layout mode? Need to integrate information from multiple sources out on the web? Need to just attach a simple PDF to an outbound email?

You've got the solution now. This video and the provided technique file will get you up and running within a very short period of time. With FileMaker 13 and its Perform Script on Server, this solution is bound to be one of your most powerful tools available!

Tags:
PDF
AttachmentSize
ConvertHTML2PDF.zip163.55 KB

Pages