Wavyzz/dolibarr-fork
2
0
Fork 0
forked from Wavyzz/dolibarr
Code Pull Requests Activity

QUAL group all flag images into 1 sprite file. (#26459)

Browse Source 
* add flag sprite

* add missing

* wip

* wip

* add script used to generate flags sprite

* add script used to generate flags sprite

---------

Co-authored-by: Laurent Destailleur <eldy@destailleur.fr>
This commit is contained in:
Frédéric FRANCE
2023-11-07 18:52:08 +01:00
committed by GitHub
parent edac1bb6cc
commit 22a37bf36a
7 changed files with 2619 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

57
dev/tools/make_sprite.sh Normal file
View File

@@ -0,0 +1,57 @@
#!/bin/bash
# Based of: https://gist.github.com/jaymzcd/342399 and https://github.com/buren/flag-sprite-maker
# uses imagemagick to stich together all images in a folder and
# then writes a css file with the correct offsets along with a
# test html page for verification that its all good
# Usage:
# $ ./make_sprite.sh path class_name image_extension
set -euo pipefail
IFS=$'\n\t'
name='output'; # output will be placed in a folder named this
path="${1:-}" # Path to flag images
classname=${2:-flag}"-sprite"
ext="."${3:-png}; # the extension to iterate over for input files
css="$name/$classname.css";
html="$name/test.html";
rm -fr $name;
mkdir $name;
touch $css $html;
echo "Generating sprite file...";
convert $path*$ext -append $name/$classname$ext;
echo "Sprite complete! - Creating css & test output...";
echo -e "<html>\n<head>\n\t<link rel=\"stylesheet\" href=\"`basename $css`\" />\n</head>\n<body>\n\t<h1>Sprite test page</h1>\n" >> $html
echo -e ".$classname {\n\tbackground:url('$classname$ext') no-repeat top left; display:inline-block;\n}" >> $css;
counter=0;
offset=0;
for file in $path*$ext
do
width=`identify -format "%[fx:w]" "$file"`;
height=`identify -format "%[fx:h]" "$file"`;
idname=`basename "$file" $ext`;
clean=${idname// /-}
echo -e ".$classname.$clean {" >> $css;
echo -e "\tbackground-position:0 -${offset}px;" >> $css;
echo -e "\twidth: ${width}px;" >> $css;
echo -e "\theight: ${height}px;\n}" >> $css;
echo -e "<div style=\"display:inline-block;width:100px;\"><div style=\"overflow-x:hidden;text-overflow:ellipsis;white-space:nowrap;\">$clean</div> <a href=\"#\" class=\"$classname $clean\"></a></div>\n" >> $html;
let offset+=$height;
let counter+=1;
echo -e "\t#$counter done";
done
echo -e "<h2>Full sprite:</h2>\n<img src=\"$classname$ext\" />" >> $html;
echo -e "</body>\n</html>" >> $html;
echo -e "\nComplete! - $counter sprites created, css written & test page output.";

3
htdocs/core/lib/functions.lib.php
View File

@@ -9627,7 +9627,8 @@ function picto_from_langcode($codelang, $moreatt = '', $notitlealt = 0)
$flagImage = empty($tmparray[1]) ? $tmparray[0] : $tmparray[1];
}
return img_picto_common($codelang, 'flags/'.strtolower($flagImage).'.png', $moreatt, 0, $notitlealt);
// return img_picto_common($codelang, 'flags/'.strtolower($flagImage).'.png', $moreatt, 0, $notitlealt);
return '<span class="flag-sprite '.strtolower($flagImage).'"'.($moreatt ? ' '.$moreatt : '').(!$notitlealt ? ' title="'.$codelang.'"' : '').'></span>';
}
/**

BIN
htdocs/theme/common/flags/flag-sprite.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 78 KiB

1279
htdocs/theme/eldy/flags-sprite.inc.php Normal file
View File

File diff suppressed because it is too large Load Diff

1
htdocs/theme/eldy/global.inc.php
View File

@@ -1068,6 +1068,7 @@ span.fa.fa-plus-circle.paddingleft {
/* Themes for badges */
<?php include dol_buildpath($path.'/theme/'.$theme.'/badges.inc.php', 0); ?>
<?php include dol_buildpath($path.'/theme/'.$theme.'/flags-sprite.inc.php', 0); ?>
.borderrightlight
{

1279
htdocs/theme/md/flags-sprite.inc.php Normal file
View File

File diff suppressed because it is too large Load Diff

2
htdocs/theme/md/style.css.php
View File

@@ -1322,6 +1322,7 @@ span.fa.fa-plus-circle.paddingleft {
/* Themes for badges */
<?php include dol_buildpath($path.'/theme/'.$theme.'/badges.inc.php', 0); ?>
<?php include dol_buildpath($path.'/theme/'.$theme.'/flags-sprite.inc.php', 0); ?>
.borderrightlight
{
@@ -7959,4 +7960,3 @@ if (is_object($db)) {
div.flot-text .flot-tick-label .tickLabel, .fa-color-unset {
color: unset;
}