diff --git a/InvenTree/InvenTree/urls.py b/InvenTree/InvenTree/urls.py index 71f6388c68..7d51c6a4cf 100644 --- a/InvenTree/InvenTree/urls.py +++ b/InvenTree/InvenTree/urls.py @@ -111,6 +111,7 @@ translated_javascript_urls = [ url(r'^company.js', DynamicJsView.as_view(template_name='js/translated/company.js'), name='company.js'), url(r'^filters.js', DynamicJsView.as_view(template_name='js/translated/filters.js'), name='filters.js'), url(r'^forms.js', DynamicJsView.as_view(template_name='js/translated/forms.js'), name='forms.js'), + url(r'^helpers.js', DynamicJsView.as_view(template_name='js/translated/helpers.js'), name='helpers.js'), url(r'^label.js', DynamicJsView.as_view(template_name='js/translated/label.js'), name='label.js'), url(r'^model_renderers.js', DynamicJsView.as_view(template_name='js/translated/model_renderers.js'), name='model_renderers.js'), url(r'^modals.js', DynamicJsView.as_view(template_name='js/translated/modals.js'), name='modals.js'), diff --git a/InvenTree/templates/base.html b/InvenTree/templates/base.html index 6f0cbe4acd..c2316ce4b0 100644 --- a/InvenTree/templates/base.html +++ b/InvenTree/templates/base.html @@ -160,6 +160,7 @@ + diff --git a/InvenTree/templates/js/dynamic/inventree.js b/InvenTree/templates/js/dynamic/inventree.js index a93d6efc0f..9813c30207 100644 --- a/InvenTree/templates/js/dynamic/inventree.js +++ b/InvenTree/templates/js/dynamic/inventree.js @@ -1,6 +1,6 @@ {% load inventree_extras %} -export function attachClipboard(selector, containerselector, textElement) { +function attachClipboard(selector, containerselector, textElement) { // set container if (containerselector){ containerselector = document.getElementById(containerselector); @@ -28,7 +28,7 @@ export function attachClipboard(selector, containerselector, textElement) { } -export function inventreeDocReady() { +function inventreeDocReady() { /* Run this function when the HTML document is loaded. * This will be called for every page that extends "base.html" */ @@ -132,7 +132,7 @@ export function inventreeDocReady() { }); } -export function isFileTransfer(transfer) { +function isFileTransfer(transfer) { /* Determine if a transfer (e.g. drag-and-drop) is a file transfer */ @@ -140,106 +140,7 @@ export function isFileTransfer(transfer) { } -export function makeIconBadge(icon, title) { - // Construct an 'icon badge' which floats to the right of an object - - var html = ``; - - return html; -} - - -export function makeIconButton(icon, cls, pk, title, options={}) { - // Construct an 'icon button' using the fontawesome set - - var classes = `btn btn-default btn-glyph ${cls}`; - - var id = `${cls}-${pk}`; - - var html = ''; - - var extraProps = ''; - - if (options.disabled) { - extraProps += "disabled='true' "; - } - - html += ``; - - return html; -} - -export function makeProgressBar(value, maximum, opts={}) { - /* - * Render a progessbar! - * - * @param value is the current value of the progress bar - * @param maximum is the maximum value of the progress bar - */ - - var options = opts || {}; - - value = parseFloat(value); - - var percent = 100; - - // Prevent div-by-zero or null value - if (maximum && maximum > 0) { - maximum = parseFloat(maximum); - percent = parseInt(value / maximum * 100); - } - - if (percent > 100) { - percent = 100; - } - - var extraclass = ''; - - if (value > maximum) { - extraclass='progress-bar-over'; - } else if (value < maximum) { - extraclass = 'progress-bar-under'; - } - - var style = options.style || ''; - - var text = ''; - - if (style == 'percent') { - // Display e.g. "50%" - - text = `${percent}%`; - } else if (style == 'max') { - // Display just the maximum value - text = `${maximum}`; - } else if (style == 'value') { - // Display just the current value - text = `${value}`; - } else if (style == 'blank') { - // No display! - text = ''; - } else { - /* Default style - * Display e.g. "5 / 10" - */ - - text = `${value} / ${maximum}`; - } - - var id = options.id || 'progress-bar'; - - return ` -
-
-
${text}
-
- `; -} - - -export function enableDragAndDrop(element, url, options) { +function enableDragAndDrop(element, url, options) { /* Enable drag-and-drop file uploading for a given element. Params: @@ -296,26 +197,8 @@ export function enableDragAndDrop(element, url, options) { }); } -export function imageHoverIcon(url) { - /* Render a small thumbnail icon for an image. - * On mouseover, display a full-size version of the image - */ - if (!url) { - url = '/static/img/blank_image.png'; - } - - var html = ` - - - - - `; - - return html; -} - -export function inventreeSave(name, value) { +function inventreeSave(name, value) { /* * Save a key:value pair to local storage */ @@ -324,7 +207,7 @@ export function inventreeSave(name, value) { localStorage.setItem(key, value); } -export function inventreeLoad(name, defaultValue) { +function inventreeLoad(name, defaultValue) { /* * Retrieve a key:value pair from local storage */ diff --git a/InvenTree/templates/js/dynamic/settings.js b/InvenTree/templates/js/dynamic/settings.js index 21ae8b5330..49d2650bef 100644 --- a/InvenTree/templates/js/dynamic/settings.js +++ b/InvenTree/templates/js/dynamic/settings.js @@ -2,16 +2,14 @@ // InvenTree settings {% user_settings request.user as USER_SETTINGS %} - -export const user_settings = { +const user_settings = { {% for key, value in USER_SETTINGS.items %} {{ key }}: {% primitive_to_javascript value %}, {% endfor %} }; {% global_settings as GLOBAL_SETTINGS %} - -export const global_settings = { +const global_settings = { {% for key, value in GLOBAL_SETTINGS.items %} {{ key }}: {% primitive_to_javascript value %}, {% endfor %} diff --git a/InvenTree/templates/js/translated/helpers.js b/InvenTree/templates/js/translated/helpers.js new file mode 100644 index 0000000000..446df773fe --- /dev/null +++ b/InvenTree/templates/js/translated/helpers.js @@ -0,0 +1,158 @@ +/* + * A set of simple helper functions + */ + + +function blankImage() { + return `/static/img/blank_image.png`; +} + +/* Render a small thumbnail icon for an image. + * On mouseover, display a full-size version of the image + */ +function imageHoverIcon(url) { + + if (!url) { + url = blankImage(); + } + + var html = ` + + + + + `; + + return html; +} + + +// Render a select2 thumbnail image +function select2Thumbnail(image) { + if (!image) { + image = blankImage(); + } + + return ``; +} + + +function makeIconBadge(icon, title) { + // Construct an 'icon badge' which floats to the right of an object + + var html = ``; + + return html; +} + + +function makeIconButton(icon, cls, pk, title, options={}) { + // Construct an 'icon button' using the fontawesome set + + var classes = `btn btn-default btn-glyph ${cls}`; + + var id = `${cls}-${pk}`; + + var html = ''; + + var extraProps = ''; + + if (options.disabled) { + extraProps += "disabled='true' "; + } + + html += ``; + + return html; +} + + +/* + * Render a progessbar! + * + * @param value is the current value of the progress bar + * @param maximum is the maximum value of the progress bar + */ +function makeProgressBar(value, maximum, opts={}) { + + var options = opts || {}; + + value = parseFloat(value); + + var percent = 100; + + // Prevent div-by-zero or null value + if (maximum && maximum > 0) { + maximum = parseFloat(maximum); + percent = parseInt(value / maximum * 100); + } + + if (percent > 100) { + percent = 100; + } + + var extraclass = ''; + + if (value > maximum) { + extraclass='progress-bar-over'; + } else if (value < maximum) { + extraclass = 'progress-bar-under'; + } + + var style = options.style || ''; + + var text = ''; + + if (style == 'percent') { + // Display e.g. "50%" + + text = `${percent}%`; + } else if (style == 'max') { + // Display just the maximum value + text = `${maximum}`; + } else if (style == 'value') { + // Display just the current value + text = `${value}`; + } else if (style == 'blank') { + // No display! + text = ''; + } else { + /* Default style + * Display e.g. "5 / 10" + */ + + text = `${value} / ${maximum}`; + } + + var id = options.id || 'progress-bar'; + + return ` +
+
+
${text}
+
+ `; +} + + +function renderLink(text, url, options={}) { + if (url === null || url === undefined || url === '') { + return text; + } + + var max_length = options.max_length || -1; + + // Shorten the displayed length if required + if ((max_length > 0) && (text.length > max_length)) { + var slice_length = (max_length - 3) / 2; + + var text_start = text.slice(0, slice_length); + var text_end = text.slice(-slice_length); + + text = `${text_start}...${text_end}`; + } + + return '' + text + ''; +} \ No newline at end of file diff --git a/InvenTree/templates/js/translated/table_filters.js b/InvenTree/templates/js/translated/table_filters.js index cb8d9047d7..423c3c989f 100644 --- a/InvenTree/templates/js/translated/table_filters.js +++ b/InvenTree/templates/js/translated/table_filters.js @@ -11,7 +11,7 @@ import { global_settings } from '{% url "settings.js" %}'; {% include "status_codes.html" with label='salesOrder' options=SalesOrderStatus.list %} -export function getAvailableTableFilters(tableKey) { +function getAvailableTableFilters(tableKey) { tableKey = tableKey.toLowerCase(); diff --git a/InvenTree/templates/js/translated/tables.js b/InvenTree/templates/js/translated/tables.js index 2b817f1bd9..a1249d0176 100644 --- a/InvenTree/templates/js/translated/tables.js +++ b/InvenTree/templates/js/translated/tables.js @@ -3,22 +3,22 @@ import { inventreeLoad, inventreeSave } from '{% url "inventree.js" %}'; -export function reloadtable(table) { +function reloadtable(table) { $(table).bootstrapTable('refresh'); } -export function editButton(url, text='{% trans "Edit" %}') { +function editButton(url, text='{% trans "Edit" %}') { return ""; } -export function deleteButton(url, text='{% trans "Delete" %}') { +function deleteButton(url, text='{% trans "Delete" %}') { return ""; } -export function renderLink(text, url, options={}) { +function renderLink(text, url, options={}) { if (url === null || url === undefined || url === '') { return text; } @@ -39,14 +39,14 @@ export function renderLink(text, url, options={}) { } -export function enableButtons(elements, enabled) { +function enableButtons(elements, enabled) { for (let item of elements) { $(item).prop('disabled', !enabled); } } -export function linkButtonsToSelection(table, buttons) { +function linkButtonsToSelection(table, buttons) { /* Link a bootstrap-table object to one or more buttons. * The buttons will only be enabled if there is at least one row selected */ @@ -74,7 +74,7 @@ function isNumeric(n) { * Reload a table which has already been made into a bootstrap table. * New filters can be optionally provided, to change the query params. */ -export function reloadTableFilters(table, filters) { +function reloadTableFilters(table, filters) { // Simply perform a refresh if (filters == null) { @@ -263,7 +263,7 @@ $.fn.inventreeTable = function(options) { } } -export function customGroupSorter(sortName, sortOrder, sortData) { +function customGroupSorter(sortName, sortOrder, sortData) { var order = sortOrder === 'desc' ? -1 : 1;