Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Insert excerpt
_Banners
_Banners
nameanalysis
nopaneltrue

Introduction

Users can upload their own files into PhixFlow using actions. This can be done using either a 

Insert excerpt
_action
_action
nopaneltrue
 which links to a 
Insert excerpt
_file_collector
_file_collector
nopaneltrue
, or an
Insert excerpt
_actionflow
_actionflow
nopaneltrue
 containing a file upload node. This can allow users to

  • Upload images/files and store them as a record.
  • Upload files to be used in an analysis model. These files can be made available for users to download.

Example

In a simple contacts application, it is possible using file uploads to

  • Allow an application user to upload their own image against a contact

    Image Modified
  • Bulk upload excel files containing multiple contacts to appear within an application
  • Download and files uploaded at a later date

Solution

Images and files are stored on the server when uploaded by a file collector. These files are placed into a standard directory and need to be moved into an appropriate directory which can be accessed by the front end. To find out how to create these directories on the server, see XXX.

Once the new directory has been created an analysis model is required, containing a file collector and a table. An action will then run this model, the user will upload a file, the file collector will move it to the correct folder and the URL to access this file will be stored in an attribute on the table.

Setting up an analysis model to upload and move a file with an action

This is a worked example to set up a model that collects an uploaded file, moves it, and all the upload subdirectories, to the required new directory using an archive location on a file collector, to tell the collector where to move the file once it has been processed.

When files are uploaded via an action, they are initially stored under the default upload directory:

Code Block
 /opt/phixflow/data/phixflow/upload 

A subdirectory is created for each uploaded file, in the form:

Code Block
/opt/phixflow/data/phixflow/upload/[tag]/in/[uploadDate]/[uploadID]/[filename]

where

  • [tag] is the tag specified by the action or file collector,
  • [uploadDate] is the date of upload represented in a numerical string,
  • [uploadID] is a unique string used to identify each file, and
  • [filename] is the name of the uploaded file.

When uploading files through the front end, we aim to move the files to a location under (either directly or via soft link) the below directory while preserving these subdirectories in order to uniquely reference each file.

Code Block
/opt/phixflow/data/phixflow/datalink

Creating the action

In the File Upload section, tick File Upload and enter a Tag Expression (e.g. "contact"). The exact tag used does not matter but needs to be used later to reference the upload location. Ticking File Upload means that running the action will trigger a file upload prompt, allowing the user to select a file to upload.

Creating the analysis model

Create a new analysis model and create a 

Insert excerpt
_file_collector
_file_collector
nopaneltrue
. Apply the following settings:


PropertySet toNotes
Source TypeSpecified Directory
File Type:File Details OnlyThis means the file collector will not attempt to bring through any data (as it would for eg. an Excel file), but will collect the details of the file (eg. file name, file location).
File Location Strategy:All Files in Folder

Ignore Base Directory

TickedBy default, Ignore Base Directory is unticked, and so PhixFlow assumes that the archive directory location is a subdirectory of the base location specified in System Configuration (normally set to /opt/phixflow/data/phixflow/archive). We want to move files to a location outside of this set default, so Ignore Base Directory must be ticked.
Input Directory Expression


Code Block
"/opt/phixflow/data/phixflow/upload/[tag]/in"

e.g.
"/opt/phixflow/data/phixflow/upload/contacts/in"


  • where [tag] is the tag expression used on the action (e.g. "contacts"
Directory Pattern Expression


Code Block
"." + _context._fileUploadId + "."


The internal variable _context._fileUploadId is available when running a file collector, and returns the unique ID string that has been assigned to each uploaded file.
The expression "." will match for any string of zero or more characters (see Regular Expressions). So the full expression "." + _context._fileUploadId + ".*" matches any directory path that contains the upload ID somewhere in it.
File Pattern Expression


Code Block
".*"


This means the file collector will collect any file it finds. If you want to specify a certain file type, you can do that here – eg. a File Pattern Expression of ".pdf" means only PDF files will be collected.
Archive Directory Expression


Code Block
"/opt/phixflow/data/phixflow/[dir]"

e.g

"/opt/phixflow/data/phixflow/ContactImages



Where [dir] is the directory used to store the uploaded files.
This means that once the file has been processed, the file collector will search in the directory specified by the Input Directory Expression, find all subdirectories that match the Directory Pattern Expression, and move them into the directory used to store the uploaded files. The subdirectory structure will be preserved within the new directory.

For more information on how to create this new directory, see XXX.


Next create a 

Insert excerpt
_table_calculate
_table_calculate
nopaneltrue
 from the 
Insert excerpt
_file_collector
_file_collector
nopaneltrue
.


On the new table, create 4 attributes with the following settings:



Attributes
Property1233
NameUploadDateUploadIDFileNameFileLocation

Type

StringStringStringString
Length105010001000
Expression


Code Block
toString(today(), "YYYYMMdd")



Code Block
_context._fileUploadId



Code Block
in._fileName



Code Block
'url("https:datalink/[dir]/" + _out.UploadDate + "/" + _out.UploadID + "/" + _out.FileName + '")'

where _[dir] is the directory used to store the uploaded files

PurposeConverts today's date
into a string

uses context variable

to return the upload ID string.

The internal variable _fileName is available when running a file collector, and returns the name of the file that has been uploaded. It must be prefixed with a pipe name.

eg. 


Code Block
'url("https:datalink/ContactImages/" + _out.UploadDate + "/" + _out.UploadID + "/" + _out.FileName + '")'


This expression uses the upload date, upload ID and file name to build the URL containing the directory path of the uploaded file after it has been moved by the file collector. The URL is what is referenced by CSS properties to display the image.


Creating the task plan

Create a new taskplan and create an analysis task which runs the above stream. On the created action, in the Run Task Plan section tick Run Selected Task Plan, and add the new task plan.

This means that after the action prompts the user to upload a file, the table will be run, which in turn runs the file collector. The file collector will find the file in the upload location, and move it to the new directory used to store the files. The table will then pull through the file details, and generate its new location in the attribute FileLocation. This attribute can then be used whenever the file needs to be referred to.

Referencing Images on the Server

Once the user has identified the correct directory to store the file, it can be referenced using a URL. This URL must be in the format

Code Block
url("[File Location]")

e.g url("https:datalink/MyProject/MyImage.png")

This URL is the value that needs to be stored and is referenced to display the image using CSS properties. Using the above example, the user stores the url of an image against each user in an attribute called 'ContactImage'. They can display this image on a card container using following style settings:

  • Name: background-image
  • Expression: _form.ContactImage
  • Name: background-repeat
  • Expression: no-repeat
  • Name: background-size
  • Expression: choose size – could be 100%, 20px, auto (see Image Sizing)

Changing Images on the Server

To change the image displayed in PhixFlow, upload a replacement image with the same name. The new image overwrites the original image. The existing URL continues to work and displays the new image. If the image name changes on the server, you need to update all the URLs that point to it.


More Information