-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Changed to local copy of opentype.js
- Loading branch information
1 parent
082f9cf
commit e7dea64
Showing
4 changed files
with
16,343 additions
and
86 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,75 +1,76 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="UTF-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<link rel="manifest" href="/manifest.webmanifest"> | ||
<link rel="icon" href="/favicon.ico" sizes="32x32"> | ||
<link rel="icon" href="/icon.svg" type="image/svg+xml"> | ||
<link rel="apple-touch-icon" href="/apple-touch-icon.png"> | ||
<title>Galley Proof BX90000 Zenith</title> | ||
<!-- Import the OpenType.js library first --> | ||
<script src="https://cdnjs.cloudflare.com/ajax/libs/opentype.js/1.3.4/opentype.min.js"></script> | ||
<!-- Import our modular JavaScript as a module --> | ||
<script type="module" src="./galleyproof/GalleyProof.js"></script> | ||
<!-- Original CSS remains the same --> | ||
<link rel="stylesheet" href="styles.css"> | ||
<link rel="stylesheet" href="./galleyproof/GalleyProof.css"> | ||
<meta charset="UTF-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<link rel="manifest" href="/manifest.webmanifest"> | ||
<link rel="icon" href="/favicon.ico" sizes="32x32"> | ||
<link rel="icon" href="/icon.svg" type="image/svg+xml"> | ||
<link rel="apple-touch-icon" href="/apple-touch-icon.png"> | ||
<title>Galley Proof BX90000 Zenith</title> | ||
<!-- Import the OpenType.js library first --> | ||
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/opentype.js/1.3.4/opentype.min.js"></script> --> | ||
<script src="./opentypejs/opentype.js"></script> | ||
<!-- Import our modular JavaScript as a module --> | ||
<script type="module" src="./galleyproof/GalleyProof.js"></script> | ||
<!-- Original CSS remains the same --> | ||
<link rel="stylesheet" href="styles.css"> | ||
<link rel="stylesheet" href="./galleyproof/GalleyProof.css"> | ||
</head> | ||
<body> | ||
<div id="fullScreen"> | ||
<button>Fullscreen</button> | ||
<button>Fullscreen</button> | ||
</div> | ||
|
||
<div id="drop-text"> | ||
Drop your TTF or OTF font here | ||
Drop your TTF or OTF font here | ||
</div> | ||
|
||
<div class="display-container"> | ||
<div id="galley"></div> | ||
<div id="glyph-display" class="glyph-buffer"></div> | ||
<div id="galley"></div> | ||
<div id="glyph-display" class="glyph-buffer"></div> | ||
</div> | ||
|
||
<div id="font-info" style="display: none;"> | ||
<div id="font-info-content"></div> | ||
<div id="font-info-content"></div> | ||
</div> | ||
|
||
<div id="controls"> | ||
<div class="buttons-container"> | ||
<button id="font-info-toggle">Show font info</button> | ||
<button id="background-toggle">Swap colours</button> | ||
<button id="font-info-toggle">Show font info</button> | ||
<button id="background-toggle">Swap colours</button> | ||
</div> | ||
|
||
<div class="slider-container"> | ||
<label>Font size</label> | ||
<input type="range" min="0.3" max="8" step="0.01" value="1"> | ||
<span class="value">1 rem</span> | ||
<label>Font size</label> | ||
<input type="range" min="0.3" max="8" step="0.01" value="1"> | ||
<span class="value">1 rem</span> | ||
</div> | ||
|
||
<div class="slider-container"> | ||
<label>Leading</label> | ||
<input type="range" min="0.5" max="4" step="0.01" value="1.20"> | ||
<span class="value">1.20×</span> | ||
<label>Leading</label> | ||
<input type="range" min="0.5" max="4" step="0.01" value="1.20"> | ||
<span class="value">1.20×</span> | ||
</div> | ||
|
||
<div class="slider-container"> | ||
<label>Column width</label> | ||
<input type="range" min="20" max="100" value="60"> | ||
<span class="value">60%</span> | ||
<label>Column width</label> | ||
<input type="range" min="20" max="100" value="60"> | ||
<span class="value">60%</span> | ||
</div> | ||
|
||
<div class="slider-container"> | ||
<label>Letter spacing</label> | ||
<input type="range" min="-0.2" max="0.5" step="0.001" value="0"> | ||
<span class="value">0 em</span> | ||
<label>Letter spacing</label> | ||
<input type="range" min="-0.2" max="0.5" step="0.001" value="0"> | ||
<span class="value">0 em</span> | ||
</div> | ||
|
||
<div class="slider-container"> | ||
<label>Word spacing</label> | ||
<input type="range" min="-1" max="2" step="0.001" value="0"> | ||
<span class="value">0 em</span> | ||
<label>Word spacing</label> | ||
<input type="range" min="-1" max="2" step="0.001" value="0"> | ||
<span class="value">0 em</span> | ||
</div> | ||
</div> | ||
</div> | ||
</div> | ||
</body> | ||
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,57 +1,58 @@ | ||
<!DOCTYPE html> | ||
<html lang="en"> | ||
<head> | ||
<meta charset="UTF-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<link rel="manifest" href="/manifest.webmanifest"> | ||
<link rel="icon" href="/favicon.ico" sizes="32x32"> | ||
<link rel="icon" href="/icon.svg" type="image/svg+xml"> | ||
<link rel="apple-touch-icon" href="/apple-touch-icon.png"> | ||
<title>WordMaster BX90000 Excelsior</title> | ||
<!-- Import the OpenType.js library first --> | ||
<script src="https://cdnjs.cloudflare.com/ajax/libs/opentype.js/1.3.4/opentype.min.js"></script> | ||
<!-- Import our modular JavaScript as a module --> | ||
<script type="module" src="./wordmaster/WordMaster.js"></script> | ||
<!-- Original CSS remains the same --> | ||
<link rel="stylesheet" href="styles.css"> | ||
<meta charset="UTF-8"> | ||
<meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
<link rel="manifest" href="/manifest.webmanifest"> | ||
<link rel="icon" href="/favicon.ico" sizes="32x32"> | ||
<link rel="icon" href="/icon.svg" type="image/svg+xml"> | ||
<link rel="apple-touch-icon" href="/apple-touch-icon.png"> | ||
<title>WordMaster BX90000 Excelsior</title> | ||
<!-- Import the OpenType.js library first --> | ||
<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/opentype.js/1.3.4/opentype.min.js"></script> --> | ||
<script src="./opentypejs/opentype.js"></script> | ||
<!-- Import our modular JavaScript as a module --> | ||
<script type="module" src="./wordmaster/WordMaster.js"></script> | ||
<!-- Original CSS remains the same --> | ||
<link rel="stylesheet" href="styles.css"> | ||
</head> | ||
<body> | ||
<div id="fullScreen"> | ||
<button>Fullscreen</button> | ||
</div> | ||
<div id="fullScreen"> | ||
<button>Fullscreen</button> | ||
</div> | ||
|
||
<div id="drop-text"> | ||
Drop your TTF or OTF font here | ||
</div> | ||
<div id="drop-text"> | ||
Drop your TTF or OTF font here | ||
</div> | ||
|
||
<div class="display-container"> | ||
<div id="word"></div> | ||
<div id="glyph-display" class="glyph-buffer"></div> | ||
</div> | ||
<div class="display-container"> | ||
<div id="word"></div> | ||
<div id="glyph-display" class="glyph-buffer"></div> | ||
</div> | ||
|
||
<div id="font-info" style="display: none;"> | ||
<div id="font-info-content"></div> | ||
</div> | ||
<div id="font-info" style="display: none;"> | ||
<div id="font-info-content"></div> | ||
</div> | ||
|
||
<div id="font-metrics-overlay"></div> | ||
<div id="font-metrics-overlay"></div> | ||
|
||
<div id="controls"> | ||
<div class="buttons-container"> | ||
<button id="font-info-toggle">Show font info</button> | ||
<button id="background-toggle">Swap colours</button> | ||
<!-- Here the OpenType feature buttons are placed --> | ||
</div> | ||
<div id="controls"> | ||
<div class="buttons-container"> | ||
<button id="font-info-toggle">Show font info</button> | ||
<button id="background-toggle">Swap colours</button> | ||
<!-- Here the OpenType feature buttons are placed --> | ||
</div> | ||
|
||
<div class="slider-container"> | ||
<label>Font size</label> | ||
<input type="range" min="10" max="1000" value="600"> | ||
<span class="value">600px</span> | ||
</div> | ||
<div class="slider-container"> | ||
<label>Font size</label> | ||
<input type="range" min="10" max="1000" value="600"> | ||
<span class="value">600px</span> | ||
</div> | ||
|
||
<div class="slider-container"> | ||
<label>Animation delay</label> | ||
<input type="range" min="100" max="10000" value="3000"> | ||
<span class="value">3000ms</span> | ||
</div> | ||
</body> | ||
</html> | ||
<div class="slider-container"> | ||
<label>Animation delay</label> | ||
<input type="range" min="100" max="10000" value="3000"> | ||
<span class="value">3000ms</span> | ||
</div> | ||
</body> | ||
</html> |
Oops, something went wrong.