Skip to content
GitLab
Menu
Projects
Groups
Snippets
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
LQDN Adminsys
generateur-slogans
Commits
97d7eb6f
Verified
Commit
97d7eb6f
authored
Sep 25, 2017
by
Thibaut Broggi
Browse files
Add fonts selector
parent
44da5be7
Changes
16
Hide whitespace changes
Inline
Side-by-side
canvas.js
View file @
97d7eb6f
...
...
@@ -19,6 +19,7 @@ let draw = function() {
let
bgColor
=
document
.
querySelector
(
'
.colorpicker input[type="radio"][name="bg-color"]:checked
'
).
value
;
let
fgColor
=
document
.
querySelector
(
'
.colorpicker input[type="radio"][name="fg-color"]:checked
'
).
value
;
let
fillText
=
document
.
getElementById
(
'
step2value
'
).
value
.
trim
();
let
font
=
document
.
querySelector
(
'
#step3 input[type="radio"]:checked
'
).
value
;
let
signature
=
document
.
getElementById
(
'
signature
'
).
value
.
trim
();
// Clear canvas
...
...
@@ -30,7 +31,7 @@ let draw = function() {
ctx
.
fill
();
// Write text
ctx
.
font
=
fontSize
+
'
px
Arial
'
;
ctx
.
font
=
fontSize
+
'
px
'
+
font
;
ctx
.
fillStyle
=
'
white
'
;
ctx
.
textBaseline
=
'
top
'
;
ctx
.
fillText
(
'
Internet,
'
,
width
*
0.08
,
height
*
0.2
);
...
...
@@ -67,7 +68,7 @@ let draw = function() {
ctx
.
fillText
(
'
La Quadrature du Net !
'
,
offset
,
height
*
0.9
);
}
let
bgColorElems
=
document
.
querySelectorAll
(
'
.colorpicker input[type="radio"]
'
);
let
bgColorElems
=
document
.
querySelectorAll
(
'
.colorpicker
input[type="radio"], #step3
input[type="radio"]
'
);
let
i
;
for
(
i
in
bgColorElems
)
{
...
...
F
onts/.gitkeep
→
f
onts/.gitkeep
View file @
97d7eb6f
File moved
F
onts/BilboINC.ttf
→
f
onts/BilboINC.ttf
View file @
97d7eb6f
File moved
F
onts/BluuNext-Bold.otf
→
f
onts/BluuNext-Bold.otf
View file @
97d7eb6f
File moved
F
onts/Boeticher-Roman.otf
→
f
onts/Boeticher-Roman.otf
View file @
97d7eb6f
File moved
F
onts/Combat.otf
→
f
onts/Combat.otf
View file @
97d7eb6f
File moved
F
onts/Gulax.otf
→
f
onts/Gulax.otf
View file @
97d7eb6f
File moved
F
onts/Lineal.otf
→
f
onts/Lineal.otf
View file @
97d7eb6f
File moved
F
onts/Resistance
générale
.otf
→
f
onts/Resistance.otf
View file @
97d7eb6f
File moved
F
onts/SolideMirageMono.otf
→
f
onts/SolideMirageMono.otf
View file @
97d7eb6f
File moved
F
onts/Steps-Mono.otf
→
f
onts/Steps-Mono.otf
View file @
97d7eb6f
File moved
F
onts/font-awesome-4.7.0.zip
→
f
onts/font-awesome-4.7.0.zip
View file @
97d7eb6f
File moved
F
onts/savate-regular.otf
→
f
onts/savate-regular.otf
View file @
97d7eb6f
File moved
F
onts/terminal-grotesque_open.otf
→
f
onts/terminal-grotesque_open.otf
View file @
97d7eb6f
File moved
index.html
View file @
97d7eb6f
...
...
@@ -142,9 +142,17 @@
<div
id=
"step3"
>
<h2>
Choisissez votre police
</h2>
<div>
<input
type=
"radio"
id=
"radio-font-1"
name=
"font"
value=
"1"
/><label
for=
"radio-font-1"
>
Font 1
</label>
<input
type=
"radio"
id=
"radio-font-2"
name=
"font"
value=
"2"
checked
/><label
for=
"radio-font-2"
>
Font 2
</label>
<input
type=
"radio"
id=
"radio-font-3"
name=
"font"
value=
"3"
/><label
for=
"radio-font-3"
>
Font 3
</label>
<input
type=
"radio"
id=
"radio-font-1"
name=
"font"
value=
"bilbo-inc"
/><label
for=
"radio-font-1"
style=
"font-family: bilbo-inc"
>
Bilbo inc
</label>
<input
type=
"radio"
id=
"radio-font-2"
name=
"font"
value=
"bluu-next"
checked
/><label
for=
"radio-font-2"
style=
"font-family: bluu-next"
>
Bluu Next
</label>
<input
type=
"radio"
id=
"radio-font-3"
name=
"font"
value=
"boeticher"
/><label
for=
"radio-font-3"
style=
"font-family: boeticher"
>
Boeticher
</label>
<input
type=
"radio"
id=
"radio-font-4"
name=
"font"
value=
"combat"
/><label
for=
"radio-font-4"
style=
"font-family: combat"
>
Combat
</label>
<input
type=
"radio"
id=
"radio-font-5"
name=
"font"
value=
"gulax"
/><label
for=
"radio-font-5"
style=
"font-family: gulax"
>
Gulax
</label>
<input
type=
"radio"
id=
"radio-font-6"
name=
"font"
value=
"lineal"
/><label
for=
"radio-font-6"
style=
"font-family: lineal"
>
Lineal
</label>
<input
type=
"radio"
id=
"radio-font-7"
name=
"font"
value=
"resistance"
/><label
for=
"radio-font-7"
style=
"font-family: resistance"
>
Resistance
</label>
<input
type=
"radio"
id=
"radio-font-8"
name=
"font"
value=
"savate"
/><label
for=
"radio-font-8"
style=
"font-family: savate"
>
Savate
</label>
<input
type=
"radio"
id=
"radio-font-9"
name=
"font"
value=
"solid-mirage"
/><label
for=
"radio-font-9"
style=
"font-family: solid-mirage"
>
Solid Mirage
</label>
<input
type=
"radio"
id=
"radio-font-10"
name=
"font"
value=
"steps-mono"
/><label
for=
"radio-font-10"
style=
"font-family: steps-mono"
>
Steps-Mono
</label>
<input
type=
"radio"
id=
"radio-font-11"
name=
"font"
value=
"terminal"
/><label
for=
"radio-font-11"
style=
"font-family: terminal"
>
Terminal
</label>
</div>
<div
class=
"navButtons"
>
<a
href=
"#step2"
class=
"prevButton"
>
‹
</a>
...
...
style.css
View file @
97d7eb6f
...
...
@@ -188,4 +188,81 @@ textarea, input[type="text"] {
font-size
:
16px
;
border
:
none
;
resize
:
none
;
}
@font-face
{
font-family
:
'bilbo-inc'
;
src
:
url('/fonts/BilboINC.ttf')
format
(
'truetype'
);
font-weight
:
normal
;
font-style
:
normal
;
}
@font-face
{
font-family
:
'bluu-next'
;
src
:
url('/fonts/BluuNext-Bold.otf')
format
(
'truetype'
);
font-weight
:
normal
;
font-style
:
normal
;
}
@font-face
{
font-family
:
'boeticher'
;
src
:
url('/fonts/Boeticher-Roman.otf')
format
(
'truetype'
);
font-weight
:
normal
;
font-style
:
normal
;
}
@font-face
{
font-family
:
'combat'
;
src
:
url('/fonts/Combat.otf')
format
(
'truetype'
);
font-weight
:
normal
;
font-style
:
normal
;
}
@font-face
{
font-family
:
'gulax'
;
src
:
url('/fonts/Gulax.otf')
format
(
'truetype'
);
font-weight
:
normal
;
font-style
:
normal
;
}
@font-face
{
font-family
:
'lineal'
;
src
:
url('/fonts/Lineal.otf')
format
(
'truetype'
);
font-weight
:
normal
;
font-style
:
normal
;
}
@font-face
{
font-family
:
'resistance'
;
src
:
url('/fonts/Resistance.otf')
format
(
'truetype'
);
font-weight
:
normal
;
font-style
:
normal
;
}
@font-face
{
font-family
:
'savate'
;
src
:
url('/fonts/savate-regular.otf')
format
(
'truetype'
);
font-weight
:
normal
;
font-style
:
normal
;
}
@font-face
{
font-family
:
'solid-mirage'
;
src
:
url('/fonts/SolideMirageMono.otf')
format
(
'truetype'
);
font-weight
:
normal
;
font-style
:
normal
;
}
@font-face
{
font-family
:
'steps-mono'
;
src
:
url('/fonts/Steps-Mono.otf')
format
(
'truetype'
);
font-weight
:
normal
;
font-style
:
normal
;
}
@font-face
{
font-family
:
'terminal'
;
src
:
url('/fonts/terminal-grotesque_open.otf')
format
(
'truetype'
);
font-weight
:
normal
;
font-style
:
normal
;
}
\ No newline at end of file
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment