Detailed Configuration

Snapshot A suite of advanced image capture and upload tools. Enhanced drag and drop file uploading. Make screengrabs from within Concrete CMS. Capture images directly from device webcams. Edit images before uploading.

Snapshot tools

Webcam

The Snapshot Webcam tool enables users to capture images from device cameras such as a desktop webcam or the front and back cameras on a mobile phone. Users can edit a file title and description and even edit and annotate the image before uploading each image snapped.

With the user facing camera in mind, the camera image can be switched between a direct image or a mirror reflection of the image.

The tool presents a button using a block on the page or inserted into the dashboard toolbar. Click to open the Webcam dialog.

The Webcam tool requires a site to be https:// or on a localhost. The Webcam tool is available, subject to browser support

Screen Capture

The Snapshot Screengrab tool enables users to capture a screengrab from within the web site. Users can edit a file title and description and even edit and annotate the image before uploading the screengrab.

The dashboard toolbar button can optionally be configured to capture pages in edit mode and any edit dialogs.

The tool presents a button using a block on the page or inserted into the dashboard toolbar. First click will enable Screen Capture; subsequent clicks will initiate Screen Capture.

The Screen Capture tool requires a site to be https:// or on a localhost. The Screen Capture tool is available, subject to browser support

Drag & Drop uploader

The Snapshot Drag & Drop Uploader provides an enhanced uploader where users can edit file title and description and even edit and annotate png and jpeg images before uploading. Uploadable file types can be configured by file extension and are not limited to just image files, any configured file type can be uploaded.

The tool presents a button using a block on the page or inserted into the dashboard toolbar. Click to open the Drag & Drop uploader dialog.

The Drag & Drop uploader tool has no specific security requirements. The Drag & Drop uploader tool is available, subject to browser support

Common capabilities

The Snapshot tools share a number of common capabilities.

Dashboard toolbar and in-page blocks

The functionality provided by each tool can be accessed using an associated block to show an in-page button and by a button shown in the dashboard toolbar. Availability to users can be managed using permissions.

Image/file title and description

The associated title and description may be edited before an image/file is uploaded. On upload, these can be subject to core antispam, banned words and ip address checks.

Image editing

In all Snapshot tools, jpeg and png images may be edited directly to add symbols and annotations and adjust colours prior to upload. Image editing uses an adaptation of the Toast-UI image editor.

Upload destination

Upload destination is fully configurable for filename, folder and fileset. Files can be always added as a new file or replace existing files with the same name, optionally gated by user and folder.

  • Always add a new file
  • Replace files anywhere beneath folder with the same name
  • Replace files anywhere beneath folder with the same name and same owner
  • Replace files anywhere beneath folder with the same title
  • Replace files anywhere beneath folder with the same title and same owner
  • Replace files in subfolder with the same name
  • Replace files in subfolder with the same name and same owner
  • Replace files in subfolder with the same title
  • Replace files in subfolder with the same title and same owner

In addition to access to a snapshot tool, users also need permission to add files to the selected folder in the file manager. For guest uploads such permissions could be assigned to guest users, or alternatively a user can be chosen to be the owner of guest uploads.

Filenames

File names can be taken from the uploaded name or created according to a template string with {placeholders}.

  • {Avatar} - Replace user's avatar (cancels the default upload). Requires either 'Edit User Details' + 'Avatar' in User Permissions (dashboard/system/permissions/users) or 'Security:Relax avatar permissions' to be set in this dialog.
  • {UploadName} - Uploaded file name
  • {AjaxCount} - Count of uploads attempted within this page
  • {SuccessCount} - Count of successful uploads within this page
  • {Timestamp} - Server timestamp (integer in seconds)
  • {Microtime} - Server timestamp (in microseconds)
  • {Seconds} - Seconds 00..59
  • {Minutes} - Minutes 00..59
  • {Hours} - Hours 0..23
  • {SQLTime} - SQL formatted 24 hour time hh:mm:ss
  • {SQLDateTime} - SQL formatted Date/Time time YYYY-MM-DD hh:mm:ss
  • {Day} - Day of month 01..28/29/30/31.
  • {Weekday} - Day of week Monday/Tuesday etc..
  • {ShortWeekday} - Day of week Mon/Tue etc..
  • {Month} - Month January/February etc..
  • {ShortMonth} - Month Jan/Feb etc..
  • {NumMonth} - Month 01/02..12 etc..
  • {Year} - Year 2020/2021
  • {SQLDate} - SQL formatted date YYYY-MM-DD
  • {PageName} - Name of the page the upload was made from
  • {PagePath} - Path of the page the upload was made from
  • {PageBasename} - Just the last section of the page path
  • {PageID} - cID of the page the upload was made from
  • {ParentPageName} - Name ancestor of page the upload was made from
  • {ParentPagePath} - Path of ancestor of page the upload was made from
  • {ParentPageBasename} - Just the last section of the ancestor page path
  • {ParentPageID} - cID of the ancestor of the page the upload was made from
  • {UserName} - Name of uploading user
  • {UserID} - uID of uploading user
  • {UserHomeFolder} - The user's home folder
  • {DeviceType} - Mobile or Desktop
  • {Stream} - Stream label from client
  • {Tool} - Name of tool uploading
  • {Language} - Client language
  • {Locale} - Client locale
  • {ip} - Client IP address
  • {Scheme} - Scheme http or https

{ParentPage...} etc. may optionally be suffixed with a number. Positive numbers count levels down from the home page(0). Negative numbers count levels up from the current page {ParentPageName-1} is the same as {ParentPageName} and is the immediate parent name.

Characters not supported in filenames such as '/' will be substituted with '_' underscores.

Folders

A parent folder for uploads is selected from existing folders. Within that folder, subfolders may optionally be created according to a template string with {placeholders}.

  • {Day} - Day of month 01..28/29/30/31.
  • {Weekday} - Day of week Monday/Tuesday etc..
  • {ShortWeekday} - Day of week Mon/Tue etc..
  • {Month} - Month January/February etc..
  • {ShortMonth} - Month Jan/Feb etc..
  • {NumMonth} - Month 01/02..12 etc..
  • {Year} - Year 2020/2021
  • {SQLDate} - SQL formatted date YYYY-MM-DD
  • {PageName} - Name of the page the upload was made from
  • {PagePath} - Path of the page the upload was made from
  • {PageBasename} - Just the last section of the page path
  • {PageID} - cID of the page the upload was made from
  • {ParentPageName} - Name ancestor of page the upload was made from
  • {ParentPagePath} - Path of ancestor of page the upload was made from
  • {ParentPageBasename} - Just the last section of the ancestor page path
  • {ParentPageID} - cID of the ancestor of the page the upload was made from
  • {UserName} - Name of uploading user
  • {UserID} - uID of uploading user
  • {UserHomeFolder} - The user's home folder
  • {DeviceType} - Mobile or Desktop
  • {Stream} - Stream label from client
  • {Tool} - Name of tool uploading
  • {Language} - Client language
  • {Locale} - Client locale
  • {ip} - Client IP address
  • {Scheme} - Scheme http or https

{ParentPage...} etc. may optionally be suffixed with a number. Positive numbers count levels down from the home page(0). Negative numbers count levels up from the current page {ParentPageName-1} is the same as {ParentPageName} and is the immediate parent name.

Characters not supported in paths such as ' ' spaces will be substituted with '_' underscores.

Take care not to end up with an uncontrolled profligation of folders.

When a file is replaced it will remain in its original folder.

Filesets

Files may be placed in filesets selected from existing filesets or created from a list in a template string with {placeholders}.

  • {Day} - Day of month 01..28/29/30/31.
  • {Weekday} - Day of week Monday/Tuesday etc..
  • {ShortWeekday} - Day of week Mon/Tue etc..
  • {Month} - Month January/February etc..
  • {ShortMonth} - Month Jan/Feb etc..
  • {NumMonth} - Month 01/02..12 etc..
  • {Year} - Year 2020/2021
  • {SQLDate} - SQL formatted date YYYY-MM-DD
  • {PageName} - Name of the page the upload was made from
  • {PagePath} - Path of the page the upload was made from
  • {PageBasename} - Just the last section of the page path
  • {PageID} - cID of the page the upload was made from
  • {ParentPageName} - Name ancestor of page the upload was made from
  • {ParentPagePath} - Path of ancestor of page the upload was made from
  • {ParentPageBasename} - Just the last section of the ancestor page path
  • {ParentPageID} - cID of the ancestor of the page the upload was made from
  • {UserName} - Name of uploading user
  • {UserID} - uID of uploading user
  • {UserHomeFolder} - The user's home folder
  • {DeviceType} - Mobile or Desktop
  • {Stream} - Stream label from client
  • {Tool} - Name of tool uploading
  • {Language} - Client language
  • {Locale} - Client locale
  • {ip} - Client IP address
  • {Scheme} - Scheme http or https

{ParentPage...} etc. may optionally be suffixed with a number. Positive numbers count levels down from the home page(0). Negative numbers count levels up from the current page {ParentPageName-1} is the same as {ParentPageName} and is the immediate parent name.

Take care not to end up with an uncontrolled profligation of filesets.

Files will only be added to sets, never removed. When a file is replaced it will remain in original sets as well as being added to any further sets.

Diagnostics and developer aids

Diagnostics and developer aids can be enabled for individual tools and instances.

Logging

Logging can be enabled for successful and for unsuccessful uploads.

Debug

The snapshot tools are heavy in their use of JavaScript. A debug output option dumps extensive trace and diagnostic information to the browser developer console.

No Upload

To test error handling, tools can be set to force an error on upload. More benignly, file upload can be disabled, so all browser resident functionality will be available, but the file will not be uploaded. This is primarily for demonstration purposes.

Documentation and help

You are reading it!. Snapshot includes a built-in documentation block that has been used to show the information here. Alternate block templates provide end user help for each of the snapshot tools. Much of this information is also available as help within the individual snapshot tools.

Snapshot capabilities are also governed by a user's permission to add files to the file manager and the allowed file types a site is configured to accept.

Additional Pages

Each of the snapshot tool blocks are shown below. Uploading images is disabled, so feel free to have a play with each of the tools and think about how your web sites can benefit from them!