Falcon Space. Working with resources

Resource management

A resource is a photo or document attached to an entity (by entityCode and itemID).
The component allows you to display a gallery of resources (photos or documents), edit them, and upload new resources.& nbsp;
Resources are attached to certain entities (entityCode). 

Output and functions depend on 2 modes: 
isSingle - determines whether 1 resource for this entity (for example, a person's avatar) or an entire collection of resources will be linked.
read/write - whether the user can manage the resource collection (upload, edit, delete) or not.

How to work with resources

1. Adding a snippet of the component to the page:

<div class="as-resourceManager" data-code="{typeCode}" data-itemid="falcon-space--rabota-s-resursami"></div>

2.Creating and configuring the resource type:

Code - resource type code (used in the snippet)

Object code - the code of an object in the system (not tied rigidly to any table).
  & nbsp;Do not confuse the entity code (product) and the resource Type code (setting how the component will work).
  & nbsp;multiple resource types can eventually be assigned to a single entity. 

Read roles - who can view images

Roles for uploading and editing - Who can upload and edit entries. 

   Jackdaw Single image - if Yes, we only work with 1 resource for the entity.

Show upload settings - display additional upload options (for images) when Uploading.

Upload option - if Yes, you can upload files (for upload roles)

   Show immediately in full size - if Yes, the Manager loads full-size images immediately and not thumb.

Upload without transformation. If so, the images do not change size when loading. 

Show gallery - if Yes, you can view the list of resources.

Maximum file size in MB - how large a file can be uploaded. Attention! There is a system restriction on files in 12Mb

File Filter - regular expression for file filtering (Regex). 

Image Height and width - sets the rectangle that the image should fit into.

Thumbnail Height and width - sets the rectangle where the image's thumb should be inserted.

  Ratio for cropping - aspect ratio for manual photo cropping.

Default image - add to the photo that will be displayed when there are no elements to display in the Manager. 

Watermark - URL path to the watermark image (will put it in the middle of each image when Uploading).
Attention! It does not affect previously uploaded images during installation. 

Image saving quality - image saving quality from 10 to 100. 

Add fields to the image (and thumbnail) when loading - if the proportions and sizes do not match, the image will be supplemented with white fields. 

Save path - specifies the shortest path in/uploads to a file or folder. If it is a folder, a file with its own name will be saved to it.
  & nbsp;If the file is the file name will be hard - defined by this parameter. Eg. If you specified/docs, then saving files will go to/uploads/docs/

Additional parameters for the resource snippet (as-resourceManager):

• data-title="Product 1" - setting the external caption for the image. If omitted, the signature associated with the resource is used (by default, this is the file name). 
  This field is also used in the title of the dialog box (when displaying a full-screen image). 

•  data-hideTitle= "1" & nbsp; - hiding the caption of the image (located under the image)

• data-link= "/product/1" - if a link is set, then clicking on the image leads to the link. If there is no link, the full image is displayed in the dialog box. 

•  data-carouselEnabled= "1" - if 1 is specified, clicking on an image will display a slider of images in the dialog box. 

•  data-bigFirst= "1" - if 1, the first image in the display will be large, and all the others will be small (for example, for use on the product page).

•  data-compact= "1" - if 1, the gallery of images (or documents) will be shown in a reduced format.

•  data-ultracompact= "1" - if 1, the gallery of images (or documents) will be shown in a very reduced form. Usually used for output in tables.

•  data-emptyText= "No photo" - If there are no elements, this label will be displayed.

•  data-uploadTitle - sets the title of the file upload window

Additional actions after a resource operation

You can perform some actions after uploading (upload), deleting (delete), or updating the resource fields (edit).& nbsp;
to do this, you need to implement the procedures rs_{entityCode}_{action}_callback (you can edit them in the resource type management). 
action - upload, delete, edit.
accepts as input: TypeCode(resource type),Itemid, resourceid (if uploading multiple files, the first file), username.
output: ResultModel(Result, Msg). 

Note

1. Files are stored in the folder /uploads/rs/{entiyCode}/{itemID}

2. Don't confuse entityCode (entity code, such as product) and typeCode (component output settings, such as manageProdyctImages)

3. If you need to check access rights additionally (based on itemID), you must create a stored procedure named  resources_{entityCode}_hasAccess.
    At the input, typeCode, username, itemID, right (read or write). The output is the ResultModel model(the Result bit, Msg nvarchar (256) fields).

4. For non - images, standard icons of the types pdf, excel, word, text, and other are used. 

5. You can set the default image for the option when no resources are loaded. 
   To do this, specify the path to the image in the  defaultImagePath for ResourceType.

6. You can crop images. Set The width and Height in pixels for the resource types. The image will eventually fit into this rectangle in size and be saved in jpg.

7. The thumbUrl is also saved for images. Its size is controlled via the resource type-thumbWidth, thumbHeight.
    For other types, the file type icon acts as a preview. 

8. To get the image URL in SQL, you can use the [dbo] function.[rs_resourceLink] (entityCode, itemID, isThumb)

Example: 

SELECT [dbo].[rs_resourceLink] ('product', 1014, 0)

Output of static files via the upload file system (Robots.txt and others). 

You can configure getting any file to a specific address. 
/Controls/Resource/GetFile?code={code} you can request a file at this address and pass additional parameters. 
The file content is generated in the stored procedure rs_{code}_getFile
Management of stored procedures is implemented in the sectionTypes of uploaded files.

CREATE PROCEDURE [dbo].[rs_example_getFile]
    @urlParameters DictionaryParameter READONLY,
    @username nvarchar(32),
    @lang int = 0
AS
BEGIN
   /*The procedure outputs a file based on the URL parameters
      (the file content can be taken from the settings or generated 
       directly in the procedure)*/

   /*How to recieve parameters from URL
      DECLARE @s nvarchar(128)
      DECLARE @s value from @urlParameters where [key] = 'itemID'*/

    -- output the result
    SELECT top 1 1 Result,
                 '' Msg,
                 value Text, -- тело файла
                 'text/css' MimeType -- Mime Тип
    FROM as_settings
    WHERE code = 'globalCss'
END

The following files are managed by default in the system: 

• Robots.txt - /Controls/Resource/GetFile?code=robots
• global JS file - /Controls/Resource/GetFile?code=globalJS 
• global CSS file - /Controls/Resource/GetFile?code=globalCSS.
• default product image in the catalog-/Controls/Resource/GetFile?code=defaultProductImage.

If necessary, you can configure redirects in the rewrite URL on IIS for easier file paths. 

Working with graphic files

To work with image files, specify them in encoding  Base64 (Use the  https://www.base64-image.de/ for converting images to a string). 
File types image/png, image/jpeg, image/gif

 IMPORTANT. Files are cached. Therefore, to get the latest version of the file, just change the link, for example /Controls/Resource/GetFile?code=defaultProductImage&prefix=1
In the future, you can specify this link to the file.
Type of procedure. You can also specify a link to a file on the server if necessary instead of data in Text, for example, '/uploads/user…'. 

ALTER PROCEDURE [dbo].[rs_defaultProductImage_getFile]
    @urlParameters DictionaryParameter READONLY,
    @username nvarchar(32),
    @langID int = 0
AS
BEGIN
    SELECT top 1 1 Result,
                 '' Msg,
                 'data:image/png;base64,GB4bh8GDtOT7Ow2uh3P6xsGoH7mJ-
                  mR3i_0pwyO_qA2gNfCqgoTRiEQQmoiVS_0vgo-
                  tuWpP5Zhk8f1a5qlQuVCznYYJy3YvsrPA
                  hi9g2OTPeOJ2MMbNydw4Oxo9Illjjcvf' text,
                 'image/png' MimeType
END

If you need a user photo: /Controls/Resource/GetFile?code=userPhoto&user=demo1
If the preview is a user's photo: /Controls/Resource/GetFile?code=userPhoto&user=demo1&thumb=1

File Manager

The system has a file Manager (/fileManager), which allows you to navigate through folders, upload files, and edit text files. 

You can also create separate file managers with the beginning in a specific folder, specifying which roles can view files, upload, edit. 
to do this, use the snippet:

<div class="as-fm" data-code="{code}"></div>

File manager settings are stored in the table as_fileManagers.

HowTo by resources and images

The user image is not displayed at the top right
Make sure that you have 2 procedures installed: 

• rs_userPhoto_getFile

• rs_defaultUserPhoto_getFile

How do I change the text when there are no uploaded images?
To do this, specify the data-emptyText attribute in the resource Manager snippet. 

<div class= "as-resourceManager" data-text= "No photo"></div>