-

Qlik Sense App Icon Generator

+

Qlik Sense App Icon Builder v2.0

This tool is designed to help you produce standardised, repeatable app icons.

+ +
@@ -60,8 +65,10 @@

Icon Config

- - + +

@@ -81,9 +88,13 @@

Generated Icon

Tool configuration

To use this tool effectively:

    -
  • Create a background image of ratio 8:5 (optionally of size 164x108 to match the size the image is rescaled for the Hub, or alternatively of size 190x116 to match the size the image is rescaled to in-app) and store this in the mashup directory as "icon_background.png".
    • -
  • Set the default opacity for the background image, by changing the default value in this HTML file. By default this is fully opaque (1).
    • -
  • Change the default app types, if needed. The defaults are "Dashboard", "Transform", "Extract" and "Trigger" to signify the purpose of the application the icon is being generated for.
    • +
  • Create a background image of 164x108px (as per Qlik help this should be ratio 8:5, however this doesn't + match to match the size the image is rescaled for the Hub, or alternatively of size 190x116 to match the + size the image is rescaled to in-app) and store this in the mashup directory as "icon_background.png".
    • +
  • Set the default opacity for the background image, by changing the default value in this HTML file. By + default this is fully opaque (1).
    • +
  • Change the default app types, if needed. The defaults are "N/A" (blank), "Dashboard", "Transform", + "Extract" and "Trigger" to signify the purpose of the application the icon is being generated for.
diff --git a/src/AppIconBuilder/backgrounds/.DS_Store b/src/AppIconBuilder/backgrounds/.DS_Store new file mode 100644 index 0000000000000000000000000000000000000000..5008ddfcf53c02e82d7eee2e57c38e5672ef89f6 GIT binary patch literal 6148 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 literal 0 HcmV?d00001 diff --git a/src/AppIconBuilder/icon_background.png b/src/AppIconBuilder/backgrounds/qlik_white.png similarity index 100% rename from src/AppIconBuilder/icon_background.png rename to src/AppIconBuilder/backgrounds/qlik_white.png diff --git a/src/AppIconBuilder/config.json b/src/AppIconBuilder/config.json new file mode 100644 index 0000000..7ebeb9a --- /dev/null +++ b/src/AppIconBuilder/config.json @@ -0,0 +1,50 @@ +{ + "templates": { + "qlik_green": { + "background": { + "image": "qlik_green.png", + "imageAlpha": 1, + "colour": "#009844" + }, + "appName": { + "font": "Sans-Serif", + "fontSize": 14, + "colour": "#fff", + "align": "left", + "locX": 10, + "locY": 27 + }, + "appType": { + "font": "Sans-Serif", + "fontSize": 8, + "colour": "#333", + "align": "left", + "locX": 10, + "locY": 96 + } + }, + "qlik_white": { + "background": { + "image": "qlik_white.png", + "imageAlpha": 1, + "colour": "#fff" + }, + "appName": { + "font": "Sans-Serif", + "fontSize": 14, + "colour": "#333", + "align": "left", + "locX": 10, + "locY": 27 + }, + "appType": { + "font": "Sans-Serif", + "fontSize": 8, + "colour": "#333", + "align": "left", + "locX": 10, + "locY": 96 + } + } + } +} \ No newline at end of file diff --git a/src/AppIconBuilder/js/script.js b/src/AppIconBuilder/js/script.js index ca74775..6aa654e 100644 --- a/src/AppIconBuilder/js/script.js +++ b/src/AppIconBuilder/js/script.js @@ -1,9 +1,34 @@ // withdave // Simple script to build icons the right size for Qlik Sense +// Update reminder: Readme (change log and version), version on HTML H1 // Primary page functions (function ($) { + // Create a variable to hold the loaded configuration within the parent function + var templateList; + + // Hide javascript error as we initialise + $("div#qsi-error").hide(); + + // Load config from config.json + $.getJSON('config.json', function (data) { + // Just in case we want to take a peek + // console.log(data); + }).done(function (data) { + // Assign object to templateList + templateList = data; + // Populate the template with options + $.each(data.templates, function (template) { + $("