Skip to content

Commit

Permalink
Merge pull request #68 from fleetbase/dev-v0.2.27
Browse files Browse the repository at this point in the history
v0.2.27
  • Loading branch information
roncodes authored Sep 16, 2024
2 parents d959575 + 1e68d74 commit 3378cd0
Show file tree
Hide file tree
Showing 17 changed files with 376 additions and 13 deletions.
1 change: 1 addition & 0 deletions .eslintrc.js
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,7 @@ module.exports = {
'error',
{
allowModules: [
'resolve',
'postcss-import',
'postcss-preset-env',
'postcss-each',
Expand Down
2 changes: 1 addition & 1 deletion addon/components/checkbox.hbs
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
{{#if this.visible}}
<div class="relative flex items-{{or @alignItems 'start'}} {{if @disabled 'disabled opacity-75'}} {{@wrapperClass}}">
<div class="relative flex items-{{or @alignItems 'start'}} {{if @disabled 'disabled opacity-75'}} {{@wrapperClass}}" {{did-update this.trackValue @value}}>
<div class="flex items-center h-4">
<Input
@type="checkbox"
Expand Down
11 changes: 11 additions & 0 deletions addon/components/checkbox.js
Original file line number Diff line number Diff line change
Expand Up @@ -94,4 +94,15 @@ export default class CheckboxComponent extends Component {
onChange(checked, event);
}
}

/**
* Track when the value argument changes
*
* @param {HTMLElement} el
* @param {Array} [value = false]
* @memberof CheckboxComponent
*/
@action trackValue(el, [value = false]) {
this.checked = value;
}
}
4 changes: 2 additions & 2 deletions addon/components/input-info.hbs
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
<div class="ui-input-info bg-opacity-{{or @opacity 100}}" ...attributes>
<FaIcon @icon={{or @icon "info-circle"}} class={{@iconClass}} />
<span class="text-left {{@spanClass}}">
<div class="text-left {{@spanClass}} {{@yieldClass}}">
{{#if (has-block)}}
{{yield}}
{{else}}
Expand All @@ -9,5 +9,5 @@
<pre class="break-text subpixel-antialiased">{{@exampleText}}</pre>
{{/if}}
{{/if}}
</span>
</div>
</div>
2 changes: 1 addition & 1 deletion addon/components/table/cell/checkbox.hbs
Original file line number Diff line number Diff line change
@@ -1 +1 @@
<Checkbox @id={{this.id}} @onToggle={{this.onToggle}} @value={{@value}} />
<Checkbox @id={{this.id}} @onToggle={{this.onToggle}} @value={{this.checked}} {{did-update this.trackValue @value}} />
22 changes: 22 additions & 0 deletions addon/components/table/cell/checkbox.js
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,17 @@ export default class TableCellCheckboxComponent extends Component {
*/
@tracked checked = false;

/**
* Creates an instance of TableCellCheckboxComponent.
* @param {ApplicationInstance} owner
* @param {...Arguments} { value = false }
* @memberof TableCellCheckboxComponent
*/
constructor(owner, { value = false }) {
super(...arguments);
this.checked = value;
}

/**
* Toggles the checkbox and sends up an action
*
Expand All @@ -52,4 +63,15 @@ export default class TableCellCheckboxComponent extends Component {
onToggle(checked, row);
}
}

/**
* Track when the value argument changes
*
* @param {HTMLElement} el
* @param {Array} [value = false]
* @memberof TableCellCheckboxComponent
*/
@action trackValue(el, [value = false]) {
this.checked = value;
}
}
4 changes: 2 additions & 2 deletions addon/components/table/cell/vehicle-name.hbs
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
@fallbackSrc={{config "defaultValues.vehicleAvatar"}}
data-vehicle={{@row.id}}
alt={{this.altText}}
class="w-6 h-6 rounded-md {{if @column.hasOnline 'mx-2' 'mr-2'}}"
class="w-5 h-5 rounded-md {{if @column.hasOnline 'mx-2' 'mr-2'}}"
/>
<span class="relative block">
<a href="javascript:;" class="relative block" {{on "click" this.onClick}} disabled={{and @column.permission (cannot @column.permission)}}>
Expand All @@ -18,6 +18,6 @@
</a>
</span>
{{#if @column.showOnlineIndicator}}
<FaIcon @icon="circle" class="absolute left-0 top-0 {{if @row.online 'text-green-500' 'text-yellow-200'}}" />
<FaIcon @icon="circle" @size="2xs" class="absolute left-0 top-0 -ml-1 -mt-1 {{if @row.online 'text-green-500' 'text-yellow-200'}}" />
{{/if}}
</div>
42 changes: 42 additions & 0 deletions addon/utils/load-assets.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
import { later } from '@ember/runloop';

export default function loadAssets(assets = { basePath: '', scripts: [], stylesheets: [], globalIndicatorKey: null }) {
// Set global indicator key if applicable
if (assets.globalIndicatorKey && typeof assets.globalIndicatorKey === 'string') {
window[assets.globalIndicatorKey] = false;
}

// Prepare base path
const path = `/${assets.basePath ? assets.basePath + '/' : ''}`;

// Define exports on window
const exportsScript = document.createElement('script');
exportsScript.innerHTML = 'window.exports = window.exports || {};';
document.body.appendChild(exportsScript);

// Insert scripts
for (let i = 0; i < assets.scripts.length; i++) {
const script = document.createElement('script');
script.src = path + assets.scripts[i];
document.body.appendChild(script);
}

// Insert stylesheets
for (let i = 0; i < assets.stylesheets.length; i++) {
const link = document.createElement('link');
link.rel = 'stylesheet';
link.href = path + assets.stylesheets[i];
document.body.appendChild(link);
}

// Update global indicator key
later(
this,
() => {
if (assets.globalIndicatorKey && typeof assets.globalIndicatorKey === 'string') {
window[assets.globalIndicatorKey] = true;
}
},
300
);
}
6 changes: 6 additions & 0 deletions addon/utils/load-leaflet-plugins.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
import loadAssets from './load-assets';

export default function loadLeafletPlugins(assets = { basePath: null, scripts: [], stylesheets: [], globalIndicatorKey: null }) {
const basePath = assets.basePath ?? 'engines-dist/leaflet';
loadAssets({ basePath, ...assets });
}
1 change: 1 addition & 0 deletions app/utils/load-assets.js
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
export { default } from '@fleetbase/ember-ui/utils/load-assets';
1 change: 1 addition & 0 deletions app/utils/load-leaflet-plugins.js
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
export { default } from '@fleetbase/ember-ui/utils/load-leaflet-plugins';
56 changes: 51 additions & 5 deletions index.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
const { name } = require('./package');
const Funnel = require('broccoli-funnel');
const MergeTrees = require('broccoli-merge-trees');
const resolve = require('resolve');
const path = require('path');
const postcssImport = require('postcss-import');
const postcssPresetEnv = require('postcss-preset-env');
Expand Down Expand Up @@ -60,12 +61,40 @@ module.exports = {
this.import('node_modules/intl-tel-input/build/css/intlTelInput.min.css');
},

treeForPublic: function () {
const publicTree = this._super.treeForPublic.apply(this, arguments);
treeForLeaflet: function () {
const trees = [];
const leafletImagesPath = path.join(this.pathBase('leaflet'), 'dist', 'images');
const alwaysExclude = ['LICENSE', 'package.json', 'example.html'];
const leafletAddons = [{ package: 'leaflet', include: ['leaflet-src.js'], exclude: [...alwaysExclude], path: ['dist'] }];

for (let i = 0; i < leafletAddons.length; i++) {
const leafletAdddon = leafletAddons[i];
const leafletAddonDist = path.join(this.pathBase(leafletAdddon.package), ...leafletAdddon.path);

// Use a Funnel to copy the `utils.js` file to `assets/libphonenumber`
trees.push(
new Funnel(leafletAddonDist, {
destDir: 'leaflet',
include: leafletAdddon.include,
exclude: leafletAdddon.exclude,
getDestinationPath: leafletAdddon.getDestinationPath,
})
);
}

trees.push(
new Funnel(leafletImagesPath, {
srcDir: '/',
destDir: '/leaflet-images',
allowEmpty: true,
})
);

return trees;
},

treeForIntlTelInput: function () {
const intlTelInputPath = path.dirname(require.resolve('intl-tel-input')).replace(/build\/js$/, '');
const addonTree = [
const trees = [
new Funnel(`${intlTelInputPath}/build/js`, {
include: ['utils.js'],
destDir: 'assets/libphonenumber',
Expand All @@ -82,10 +111,27 @@ module.exports = {
}),
];

// Merge the addon tree with the existing tree
return trees;
},

mergeWithPublicTree: function (publicTree) {
const intlTelInputTree = this.treeForIntlTelInput();
const leafletTree = this.treeForLeaflet();
const addonTree = [...intlTelInputTree, ...leafletTree];

return publicTree ? new MergeTrees([publicTree, ...addonTree], { overwrite: true }) : new MergeTrees([...addonTree], { overwrite: true });
},

treeForPublic: function () {
const publicTree = this._super.treeForPublic.apply(this, arguments);

return this.mergeWithPublicTree(publicTree);
},

pathBase(packageName) {
return path.dirname(resolve.sync(packageName + '/package.json', { basedir: __dirname }));
},

isDevelopingAddon: function () {
return true;
},
Expand Down
8 changes: 6 additions & 2 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "@fleetbase/ember-ui",
"version": "0.2.26",
"version": "0.2.27",
"description": "Fleetbase UI provides all the interface components, helpers, services and utilities for building a Fleetbase extension into the Console.",
"keywords": [
"fleetbase-ui",
Expand Down Expand Up @@ -91,6 +91,7 @@
"ember-get-config": "^2.1.1",
"ember-gridstack": "^4.0.0",
"ember-inflector": "^4.0.2",
"ember-leaflet": "^5.1.3",
"ember-loading": "^2.0.0",
"ember-math-helpers": "^4.0.0",
"ember-modifier": "^4.1.0",
Expand All @@ -106,6 +107,7 @@
"gridstack": "^7.3.0",
"imask": "^6.4.3",
"intl-tel-input": "^22.0.2",
"leaflet": "^1.9.4",
"postcss-at-rules-variables": "^0.3.0",
"postcss-conditionals-renewed": "^1.0.0",
"postcss-each": "^1.1.0",
Expand Down Expand Up @@ -152,6 +154,7 @@
"prettier": "^3.0.3",
"qunit": "^2.20.0",
"qunit-dom": "^2.0.0",
"resolve": "^1.22.8",
"stylelint": "^15.11.0",
"stylelint-config-standard": "^34.0.0",
"stylelint-prettier": "^4.0.2",
Expand Down Expand Up @@ -186,7 +189,8 @@
},
"pnpm": {
"patchedDependencies": {
"ember-gridstack@4.0.0": "patches/ember-gridstack@4.0.0.patch"
"ember-gridstack@4.0.0": "patches/ember-gridstack@4.0.0.patch",
"ember-leaflet@5.1.3": "patches/ember-leaflet@5.1.3.patch"
}
}
}
111 changes: 111 additions & 0 deletions patches/ember-leaflet@5.1.3.patch
Original file line number Diff line number Diff line change
@@ -0,0 +1,111 @@
diff --git a/index.js b/index.js
index 7361871adfe0b79c70a3699e38cc435f3741cb33..fe08a429d35283691de28f3dc73ef7ec8bec76cb 100644
--- a/index.js
+++ b/index.js
@@ -1,36 +1,18 @@
-'use strict';
-const resolve = require('resolve');
-const path = require('path');
-const mergeTrees = require('broccoli-merge-trees');
-const Funnel = require('broccoli-funnel');
-const fastbootTransform = require('fastboot-transform');
+'use strict'
+const resolve = require('resolve')
+const path = require('path')
+const mergeTrees = require('broccoli-merge-trees')
+const Funnel = require('broccoli-funnel')
+const fastbootTransform = require('fastboot-transform')

module.exports = {
name: require('./package').name,

- treeForVendor() {
- let dist = path.join(this.pathBase('leaflet'), 'dist');
-
- let leafletJs = fastbootTransform(
- new Funnel(dist, {
- files: ['leaflet-src.js'],
- destDir: 'leaflet'
- })
- );
-
- let leafletFiles = new Funnel(dist, {
- exclude: ['leaflet.js', 'leaflet-src.js', '*.html'],
- destDir: 'leaflet'
- });
-
- return mergeTrees([leafletJs, leafletFiles]);
- },
-
- included(app) {
- this._super.included.apply(this, arguments);
+ included (app) {
+ this._super.included.apply(this, arguments)

// Addon options from the apps ember-cli-build.js
- let options = app.options[this.name] || {};
+ let options = app.options[this.name] || {}

// If the addon has the _findHost() method (in ember-cli >= 2.7.0), we'll just
// use that.
@@ -42,46 +24,22 @@ module.exports = {
// method in ember-cli.
// Keep iterating upward until we don't have a grandparent.
// Has to do this grandparent check because at some point we hit the project.
- let current = this;
+ let current = this
do {
- if (current.lazyLoading === true || (current.lazyLoading && current.lazyLoading.enabled === true)) {
- app = current;
- break;
+ if (
+ current.lazyLoading === true ||
+ (current.lazyLoading && current.lazyLoading.enabled === true)
+ ) {
+ app = current
+ break
}
- app = current.app || app;
- } while (current.parent.parent && (current = current.parent));
-
- if (!options.excludeJS) {
- app.import('vendor/leaflet/leaflet-src.js');
- }
-
- // Import leaflet css
- if (!options.excludeCSS) {
- app.import('vendor/leaflet/leaflet.css');
- }
-
- // Import leaflet images
- if (!options.excludeImages) {
- let imagesDestDir = '/assets/images';
- app.import('vendor/leaflet/images/layers-2x.png', {
- destDir: imagesDestDir
- });
- app.import('vendor/leaflet/images/layers.png', {
- destDir: imagesDestDir
- });
- app.import('vendor/leaflet/images/marker-icon-2x.png', {
- destDir: imagesDestDir
- });
- app.import('vendor/leaflet/images/marker-icon.png', {
- destDir: imagesDestDir
- });
- app.import('vendor/leaflet/images/marker-shadow.png', {
- destDir: imagesDestDir
- });
- }
+ app = current.app || app
+ } while (current.parent.parent && (current = current.parent))
},

- pathBase(packageName) {
- return path.dirname(resolve.sync(packageName + '/package.json', { basedir: __dirname }));
+ pathBase (packageName) {
+ return path.dirname(
+ resolve.sync(packageName + '/package.json', { basedir: __dirname })
+ )
}
-};
+}
Loading

0 comments on commit 3378cd0

Please sign in to comment.