finallycoffee/nextcloud-pride-flags
finallycoffee/nextcloud-pride-flags
5
0
Fork 0
Code Issues Pull Requests 1 Packages Projects Releases 10 Wiki Activity

Compare commits

base: finallycoffee:transcaffeine/refactor
Branches Tags
finallycoffee:main
finallycoffee:transcaffeine/refactor
finallycoffee:app-1.1.1
finallycoffee:transcaffeine/global-setting
finallycoffee:transcaffeine/fix-per-user
finallycoffee:transcaffeine/prepare-release
finallycoffee:1.1.2
finallycoffee:1.1.1
finallycoffee:1.1.0
finallycoffee:1.0.1
finallycoffee:1.0.0
finallycoffee:1.0.0-rc.1
finallycoffee:1.0.0-rc.0
finallycoffee:0.1.0-rc.2
finallycoffee:0.1.0-rc.1
finallycoffee:0.1.0-rc.0
..
compare: finallycoffee:main
Branches Tags
finallycoffee:transcaffeine/refactor
finallycoffee:main
finallycoffee:app-1.1.1
finallycoffee:transcaffeine/global-setting
finallycoffee:transcaffeine/fix-per-user
finallycoffee:transcaffeine/prepare-release
finallycoffee:1.1.2
finallycoffee:1.1.1
finallycoffee:1.1.0
finallycoffee:1.0.1
finallycoffee:1.0.0
finallycoffee:1.0.0-rc.1
finallycoffee:1.0.0-rc.0
finallycoffee:0.1.0-rc.2
finallycoffee:0.1.0-rc.1
finallycoffee:0.1.0-rc.0

No commits in common. "transcaffeine/refactor" and "main" have entirely different histories.
transcaffe ... main

7 changed files with 108 additions and 159 deletions
Show Stats Expand all files Collapse all files

11
bin/nextcloud-app-release.sh
View File

@ -21,10 +21,7 @@ traperr() {
} }
trap traperr ERR trap traperr ERR
mkdir ../nextcloud-pride-flags-tmp mv .git ../nextcloud-pride-flags-git
mv .git ../nextcloud-pride-flags-tmp/.git
mv bin ../nextcloud-pride-flags-tmp/bin
mv vendor-bin ../nextcloud-pride-flags-tmp/vendor-bin
sudo docker run --hostname nc31.local \ sudo docker run --hostname nc31.local \
-e NEXTCLOUD_ADMIN_USER=admin \ -e NEXTCLOUD_ADMIN_USER=admin \
@ -44,14 +41,12 @@ sudo docker exec -it ${CONTAINER_NAME} php occ integrity:sign-app \
sudo docker stop "${CONTAINER_NAME}" sudo docker stop "${CONTAINER_NAME}"
sudo docker rm "${CONTAINER_NAME}" sudo docker rm "${CONTAINER_NAME}"
mv ../nextcloud-pride-flags-tmp/.git .git mv ../nextcloud-pride-flags-git .git
mv ../nextcloud-pride-flags-tmp/bin bin
mv ../nextcloud-pride-flags-tmp/vendor-bin vendor-bin
echo "App $APP_NAME signed @ ${VERSION}. Commit the appinfo/signatures.json now and press enter." echo "App $APP_NAME signed @ ${VERSION}. Commit the appinfo/signatures.json now and press enter."
read -p "Press Enter to continue" < /dev/tty read -p "Press Enter to continue" < /dev/tty
tar --exclude-vcs --exclude='./bin' --exclude='./vendor-bin' -czvf "${TARBALL}" "$REPO" tar --exclude-vcs -czvf "${TARBALL}" "$REPO"
# verify content # verify content
echo "Tarball '${TARBALL}' content:" echo "Tarball '${TARBALL}' content:"

12
js/pride-settings-global.js
View File

@ -3,25 +3,18 @@
const button_selector = document.querySelectorAll('.pride_flags_server_settings .server-settings.button-flavour select')[0]; const button_selector = document.querySelectorAll('.pride_flags_server_settings .server-settings.button-flavour select')[0];
const submit_button = document.querySelectorAll('.pride_flags_server_settings .settings-pride-submit'); const submit_button = document.querySelectorAll('.pride_flags_server_settings .settings-pride-submit');
const container = document.querySelector('.pride_flags_server_settings .settings-section'); const container = document.querySelector('.pride_flags_server_settings .settings-section');
const inputs = [
folder_selector,
button_selector,
];
function load() { function load() {
window.pride_flags.util.settings.blockInputs(inputs);
fetch(OC.generateUrl('/apps/pride_flags/settings/global')) fetch(OC.generateUrl('/apps/pride_flags/settings/global'))
.then(res => res.json()) .then(res => res.json())
.then(({folderVariant, buttonVariant}) => { .then(({folderVariant, buttonVariant}) => {
folder_selector.value = folderVariant; folder_selector.value = folderVariant;
button_selector.value = buttonVariant; button_selector.value = buttonVariant;
window.pride_flags.util.settings.unblockInputs(inputs);
container.classList.remove('hidden'); container.classList.remove('hidden');
}); });
} }
function save() { function save() {
window.pride_flags.util.settings.blockInputs(inputs);
const payload = { const payload = {
folderVariant: folder_selector.value, folderVariant: folder_selector.value,
buttonVariant: button_selector.value, buttonVariant: button_selector.value,
@ -37,10 +30,7 @@
if (response.ok) { if (response.ok) {
window.location.reload(); window.location.reload();
} }
}).catch(err => { })
console.err(err);
window.pride_flags.util.settings.unblockInputs(inputs);
});
} }
submit_button.forEach(node => node.addEventListener('click', e => save())); submit_button.forEach(node => node.addEventListener('click', e => save()));

12
js/pride-settings.js
View File

@ -3,25 +3,18 @@
const button_selector = document.querySelectorAll('.pride_flags_user_settings .user-settings.button-flavour select')[0]; const button_selector = document.querySelectorAll('.pride_flags_user_settings .user-settings.button-flavour select')[0];
const submit_button = document.querySelectorAll('.pride_flags_user_settings .settings-pride-submit'); const submit_button = document.querySelectorAll('.pride_flags_user_settings .settings-pride-submit');
const container = document.querySelector('.pride_flags_user_settings .settings-section'); const container = document.querySelector('.pride_flags_user_settings .settings-section');
const inputs = [
folder_selector,
button_selector,
];
function load() { function load() {
window.pride_flags.util.settings.blockInputs(inputs);
fetch(OC.generateUrl('/apps/pride_flags/settings')) fetch(OC.generateUrl('/apps/pride_flags/settings'))
.then(res => res.json()) .then(res => res.json())
.then(({folderVariant, buttonVariant}) => { .then(({folderVariant, buttonVariant}) => {
folder_selector.value = folderVariant; folder_selector.value = folderVariant;
button_selector.value = buttonVariant; button_selector.value = buttonVariant;
window.pride_flags.util.settings.unblockInputs(inputs);
container.classList.remove('hidden'); container.classList.remove('hidden');
}); });
} }
function save() { function save() {
window.pride_flags.util.settings.blockInputs(inputs);
const payload = { const payload = {
folderVariant: folder_selector.value, folderVariant: folder_selector.value,
buttonVariant: button_selector.value, buttonVariant: button_selector.value,
@ -37,10 +30,7 @@
if (response.ok) { if (response.ok) {
window.location.reload(); window.location.reload();
} }
}).catch(err => { })
window.pride_flags.util.settings.unblockInputs(inputs);
console.err(err);
});
} }
submit_button.forEach(node => node.addEventListener('click', e => save())); submit_button.forEach(node => node.addEventListener('click', e => save()));

190
js/pride.js
View File

@ -1,112 +1,96 @@
(function(window) { const flags = [
const flags = [ {
{ id: 'pride',
id: 'pride', colors: ['#E04641', '#DE7E41', '#E4D56F', '#55B85F', '#2473B5', '#6F5DA5'],
colors: ['#E04641', '#DE7E41', '#E4D56F', '#55B85F', '#2473B5', '#6F5DA5'], transform: 'rotate(90)'
transform: 'rotate(90)' }, {
}, { id: 'trans',
id: 'trans', colors: ['#55CDFC', '#F7A8B8', '#FFFFFF', '#F7A8B8', '#55CDFC'],
colors: ['#55CDFC', '#F7A8B8', '#FFFFFF', '#F7A8B8', '#55CDFC'], transform: 'rotate(90)'
transform: 'rotate(90)' }, {
}, { id: 'pan',
id: 'pan', colors: ['#FE218C', '#FFD800', '#21B1FF'],
colors: ['#FE218C', '#FFD800', '#21B1FF'], transform: 'rotate(90)'
transform: 'rotate(90)' }, {
}, { id: 'nonbinary',
id: 'nonbinary', colors: ['#FCF434', '#FFFFFF', '#9C59D1', '#2C2C2C'],
colors: ['#FCF434', '#FFFFFF', '#9C59D1', '#2C2C2C'], transform: 'rotate(90)'
transform: 'rotate(90)' }, {
}, { id: 'bi',
id: 'bi', // colors: ['#C42A6F', '#915392', '#1437A1'],
colors: ['#D60270', '#9B4F96', '#0038A8'], colors: ['#D60270', '#9B4F96', '#0038A8'],
transform: 'rotate(90)' transform: 'rotate(90)'
}, { }, {
id: 'asexual', id: 'asexual',
colors: ['#000000', '#9F9F9F', '#FFFFFF', '#5E1984'], colors: ['#000000', '#9F9F9F', '#FFFFFF', '#5E1984'],
transform: 'rotate(90)' transform: 'rotate(90)'
}, { }, {
id: 'lesbian', id: 'lesbian',
colors: ['#D52D00', '#EF7627', '#FF9A56', '#FFFFFF', '#D162A4', '#B55690', '#A30262'], colors: ['#D52D00', '#EF7627', '#FF9A56', '#FFFFFF', '#D162A4', '#B55690', '#A30262'],
transform: 'rotate(90)' transform: 'rotate(90)'
} }
]; ];
const generateGradient = colors => { const generateGradient = colors => {
const steps = colors.length; const steps = colors.length;
return colors.map((color, index) => { return [ return colors.map((color, index) => { return [
[color, (index / steps)], [color, (index / steps)],
[color, (index + 1) / steps] [color, (index + 1) / steps]
]}).flat(); ]}).flat();
}; };
const generateStops = (colors, opacity) => { const generateStops = (colors, opacity) => {
return generateGradient(colors).map(([color, offset]) => { return generateGradient(colors).map(([color, offset]) => {
return `<stop stop-color="${color}" stop-opacity="${opacity}" offset="${offset * 100}%"></stop>`; return `<stop stop-color="${color}" stop-opacity="${opacity}" offset="${offset * 100}%"></stop>`;
}); });
}; };
const makeLinearGradientSvg = (id, colors, opacity, transform) => { const makeLinearGradientSvg = (id, colors, opacity, transform) => {
return `<svg xmlns="http://www.w3.org/2000/svg" id="svg-${id}" preserveAspectRatio="none" width="100%" height="100%"> return `<svg xmlns="http://www.w3.org/2000/svg" id="svg-${id}" preserveAspectRatio="none" width="100%" height="100%">
<defs> <defs>
<linearGradient id="gradient-${id}" gradientTransform="${transform}"> <linearGradient id="gradient-${id}" gradientTransform="${transform}">
${generateStops(colors, opacity).join('\n')} ${generateStops(colors, opacity).join('\n')}
</linearGradient> </linearGradient>
</defs> </defs>
<style> <style>
rect { height: 100%; width: 100%; } rect { height: 100%; width: 100%; }
</style> </style>
<rect fill="url(#gradient-${id})" width="100%" height="100%" /> <rect fill="url(#gradient-${id})" width="100%" height="100%" />
</svg>`; </svg>`;
}; };
const generateCssBackgroundRules = (type, variant) => ` flags.forEach(flag => {
--image-background-pride-${type}: var(--image-background-pride-${variant}); const svg_html = makeLinearGradientSvg(flag.id, flag.colors, flag.opacity ?? '0.8', flag.transform ?? 'rotate(0)');
--image-background-pride-${type}-gradient: var(--image-background-pride-gradient-${variant}); const container = document.createElement('div');
container.classList.add('hidden-visually');
container.ariaHidden = true;
container.innerHTML = svg_html;
const style_c = document.createElement('style');
style_c.textContent = `
body {
--image-background-pride-${flag.id}: url('data:image/svg+xml;base64,${btoa(svg_html)}');
--image-background-pride-gradient-${flag.id}: url("#gradient-${flag.id}");
}
`; `;
const setDisabledState = (nodes, state) => nodes.forEach(node => node.disabled = !!state); document.body.prepend(container);
const blockInputs = nodes => setDisabledState(nodes, true); document.head.prepend(style_c);
const blockInputs = nodes => setDisabledState(nodes, false); });
flags.forEach(flag => { fetch(OC.generateUrl('/apps/pride_flags/settings'))
const svg_html = makeLinearGradientSvg(flag.id, flag.colors, flag.opacity ?? '0.8', flag.transform ?? 'rotate(0)'); .then(response => response.json())
const container = document.createElement('div'); .then(({folderVariant, buttonVariant}) => {
container.classList.add('hidden-visually'); if (document.querySelector('head > style#pride_flag_settings') == null) {
container.ariaHidden = true; const node = document.createElement('style');
container.innerHTML = svg_html; node.id = 'pride_flag_settings';
const style_c = document.createElement('style'); document.head.prepend(node);
style_c.textContent = ` }
body { const style_settings = document.querySelector('head > style#pride_flag_settings');
--image-background-pride-${flag.id}: url('data:image/svg+xml;base64,${btoa(svg_html)}'); style_settings.textContent = `
--image-background-pride-gradient-${flag.id}: url("#gradient-${flag.id}"); body {
--image-background-pride-button: var(--image-background-pride-${buttonVariant});
--image-background-pride-folder: var(--image-background-pride-${folderVariant});
--image-background-pride-button-gradient: var(--image-background-pride-gradient-${buttonVariant});
--image-background-pride-folder-gradient: var(--image-background-pride-gradient-${folderVariant});
} }
`; `;
document.body.prepend(container);
document.head.prepend(style_c);
}); });
fetch(OC.generateUrl('/apps/pride_flags/settings'))
.then(response => response.json())
.then(({folderVariant, buttonVariant}) => {
if (document.querySelector('head > style#pride_flag_settings') == null) {
const node = document.createElement('style');
node.id = 'pride_flag_settings';
document.head.prepend(node);
}
const style_settings = document.querySelector('head > style#pride_flag_settings');
const rules = `body {
${(folderVariant !== 'none') ? generateCssBackgroundRules('folder', folderVariant) : ''}
${(buttonVariant !== 'none') ? generateCssBackgroundRules('button', buttonVariant) : ''}
}`;
style_settings.textContent = rules;
});
window.pride_flags = {
flags,
"util" : {
"settings": {
blockInputs,
unblockInputs,
"_setDisabledState": setDisabledState,
},
},
};
})(window);

10
lib/AppConstants.php
View File

@ -6,14 +6,4 @@ namespace OCA\PrideFlags;
abstract class AppConstants { abstract class AppConstants {
public const APP_ID = 'pride_flags'; public const APP_ID = 'pride_flags';
public enum Variants: string {
case PRIDE = "Pride";
case TRANS = "Trans Pride";
case PAN = "Pansexual Pride";
case BI = "Bisexual Pride";
case ASEXUAL = "Asexual Pride";
case LESBIAN = "Lesbian Pride";
case NONBINARY = "Non-binary Pride";
case NONE = "No customisation";
}
} }

9
lib/Settings/AppSettings.php
View File

@ -18,16 +18,11 @@ class AppSettings {
} }
public function setStringSetting($userId, string $key, string $value): void { public function setStringSetting($userId, string $key, string $value): void {
// Check for valid Variant here $this->config->setUserValue(AppConstants::APP_ID, $userId, $key, $value);
if (AppConstants\Variants::tryFrom($value) != null) {
$this->config->setUserValue(AppConstants::APP_ID, $userId, $key, $value);
}
} }
public function setAppStringSetting(string $key, string $value): void { public function setAppStringSetting(string $key, string $value): void {
if (AppConstants\Variants::tryFrom($value) != null) { $this->config->setAppValue(AppConstants::APP_ID, $key, $value);
$this->config->setAppValue(AppConstants::APP_ID, $key, $value);
}
} }
public function getAll($userId): array { public function getAll($userId): array {

23
templates/settings.php
View File

@ -1,8 +1,5 @@
<?php <?php
declare(strict_types = 1);
use OCA\PrideFlags\AppConstants;
?> ?>
<div class="pride_flags_user_settings"> <div class="pride_flags_user_settings">
<div class="settings-section section hidden"> <div class="settings-section section hidden">
@ -10,17 +7,25 @@ use OCA\PrideFlags\AppConstants;
<div class="user-settings folder-flavour" style="margin-left: 40px; display: flex;"> <div class="user-settings folder-flavour" style="margin-left: 40px; display: flex;">
<label for="user-settings-folder-flavour-select" style="display: flex; width: 100px;">Folders</label> <label for="user-settings-folder-flavour-select" style="display: flex; width: 100px;">Folders</label>
<select id="user-settings-folder-flavour-select" style="display: flex; width: 200px;"> <select id="user-settings-folder-flavour-select" style="display: flex; width: 200px;">
<?php foreach (AppConstants\Variants::cases() as $variant): ?> <option value='pride'>Pride</option>
<option value="<?= strtolower($variant->name) ?>"><?= $variant->value ?></option> <option value='trans'>Trans Pride</option>
<?php endforeach ?> <option value='pan'>Pansexual Pride</option>
<option value='nonbinary'>Non-binary Pride</option>
<option value='bi'>Bisexual Pride</option>
<option value='asexual'>Asexual Pride</option>
<option value='lesbian'>Lesbian Pride</option>
</select> </select>
</div> </div>
<div class="user-settings button-flavour" style="margin-left: 40px; display: flex;"> <div class="user-settings button-flavour" style="margin-left: 40px; display: flex;">
<label for="user-settings-button-flavour-select" style="display: flex; width: 100px;">Buttons</label> <label for="user-settings-button-flavour-select" style="display: flex; width: 100px;">Buttons</label>
<select id="user-settings-button-flavour-select" style="display: flex; width: 200px;"> <select id="user-settings-button-flavour-select" style="display: flex; width: 200px;">
<?php foreach (AppConstants\Variants::cases() as $variant): ?> <option value='pride'>Pride</option>
<option value="<?= strtolower($variant->name) ?>"><?= $variant->value ?></option> <option value='trans'>Trans Pride</option>
<?php endforeach ?> <option value='pan'>Pansexual Pride</option>
<option value='nonbinary'>Non-binary Pride</option>
<option value='bi'>Bisexual Pride</option>
<option value='asexual'>Asexual Pride</option>
<option value='lesbian'>Lesbian Pride</option>
</select> </select>
</div> </div>
<button class="settings-pride-submit button primary" style="margin-left: 40px; display: flex; width: 80px; text-align: center;">Save</button> <button class="settings-pride-submit button primary" style="margin-left: 40px; display: flex; width: 80px; text-align: center;">Save</button>