Skip to content

Instantly share code, notes, and snippets.

View upalexgill's full-sized avatar

Alex Gill upalexgill

View GitHub Profile
@upalexgill
upalexgill / custom.js
Created May 2, 2024 09:37
Convert array-of-objects to CSV
// array-of-objects
const dataset = [
{
id: 1,
name: 'Foo',
timestamp: new Date()
},
{
id: 2,
name: 'Bar',
@upalexgill
upalexgill / custom;js
Created March 12, 2024 09:16
Find property by key in nested object
function findByKey(obj, keyToFind) {
return Object.entries(obj)
.reduce((acc, [key, value]) => (key === keyToFind)
? acc.concat(value)
: (typeof value === 'object')
? acc.concat(findByKey(value, keyToFind))
: acc
, [])
}
@upalexgill
upalexgill / scripts.js
Created October 27, 2023 16:32
Parse XML data to string array
const xmlData = ``;
function getCommaSeparatedUrls(xml) {
const parser = new DOMParser();
const xmlDoc = parser.parseFromString(xml, 'text/xml');
const sitemapNodes = xmlDoc.getElementsByTagName('loc');
const urls = [];
for (let i = 0; i < sitemapNodes.length; i++) {
urls.push(sitemapNodes[i].textContent);
@upalexgill
upalexgill / main.yml
Created July 26, 2023 20:22
Github Actions / Workflow: Create env file with secrets
name: Create Environment Variables
on: push
jobs:
dev-build:
runs-on: ubuntu-latest
if: github.ref == 'refs/heads/develop'
steps:
- name: Git checkout
uses: actions/checkout@v2
- name: Create develop env file
@upalexgill
upalexgill / useFetch.vue
Created June 9, 2023 18:32
Fetch API wrapper with error handler for Vue
import { toRefs } from 'vue'
import { reactive } from '@vue/reactivity'
import { IFetch } from '@/interfaces'
export default function useFetch() {
const state: IFetch = reactive({
data: null,
isLoading: false,
errorMessage: '',
isFinished: false,
@upalexgill
upalexgill / custom.js
Created May 5, 2023 16:19
Importing styles into a web component
const webComponent = document.querySelector(<COMPONENT>);
const shadow = webComponent && webComponent.shadowRoot;
const frame = shadow && shadow.querySelector('iframe');
if (frame) {
const sheet = new CSSStyleSheet;
sheet.replaceSync('iframe { height: 100vh !important; width: 100vw !important; }');
shadow.adoptedStyleSheets = [sheet];
}
@upalexgill
upalexgill / variables.scss
Created April 11, 2023 21:44
Vue 3 and Vuetify 3 SASS variable overrides
// src/scss/variables.scss
$body-font-family: 'Noto Sans', sans-serif;
@use 'vuetify' with (
$body-font-family: $body-font-family,
$heading-font-family: $body-font-family
);
@upalexgill
upalexgill / testing.yml
Created January 30, 2023 20:12
GitHub Actions: Build Vue, Run Unit Tests and Lint Files
name: Run Unit Tests and Lint Files
on: push
jobs:
testing:
name: "Automated tests"
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
- run: |
npm ci
@upalexgill
upalexgill / vue.config.js
Created November 23, 2022 09:48
Vue 2: change output directory for vue-cli
const { defineConfig } = require('@vue/cli-service');
const CopyWebpackPlugin = require('copy-webpack-plugin');
const path = require('path');
module.exports = defineConfig({
transpileDependencies: true,
devServer: {
server: 'https',
host: 'localhost',
},
@upalexgill
upalexgill / custom.js
Created April 27, 2022 10:35
Slick JS - Position arrows vertically centered
function debounce(callback, timeout = 300){
let timer
return (...args) => {
clearTimeout(timer)
timer = setTimeout(() => { callback.apply(this, args); }, timeout)
};
}
function positionSlickArrows (e) {
const $slick = $('.slick-slider')