Skip to content

Commit 2a484c1

Browse files
committed
examples: separated css and js from html
1 parent bc817ec commit 2a484c1

4 files changed

Lines changed: 228 additions & 264 deletions

File tree

examples/basic.htm

Lines changed: 2 additions & 230 deletions
Original file line numberDiff line numberDiff line change
@@ -2,40 +2,11 @@
22
<html>
33
<head>
44
<title>jsPDF</title>
5-
<style type="text/css">
6-
* { padding: 0; margin: 0; }
7-
body {
8-
padding: 30px;
9-
font-family: Arial, Helvetica, sans-serif;
10-
}
11-
h1 {
12-
margin-bottom: 1em;
13-
border-bottom: 1px solid #ccc;
14-
}
15-
16-
h2 {
17-
margin-bottom: 1em;
18-
border-bottom: 1px solid #ccc;
19-
}
20-
21-
pre {
22-
border: 1px dotted #ccc;
23-
background: #f7f7f7;
24-
padding: 10px;
25-
margin-bottom: 1em;
26-
}
27-
28-
h1 {
29-
margin-bottom: 0.7em;
30-
}
31-
32-
h2 {
33-
margin-top: 1em;
34-
}
35-
</style>
5+
<link rel="stylesheet" type="text/css" href="css/main.css">
366
<script type="text/javascript" src="../libs/base64.js"></script>
377
<script type="text/javascript" src="../libs/sprintf.js"></script>
388
<script type="text/javascript" src="../jspdf.js"></script>
9+
<script type="text/javascript" src="js/basic.js"></script>
3910
</head>
4011

4112
<body>
@@ -239,205 +210,6 @@ <h2>Draw circles and ellipses: lines</h2>
239210
doc.output('datauri');</pre>
240211
<a href="javascript:demoCircles()">Run Code</a>
241212

242-
<script type="text/javascript">
243-
244-
function demoTwoPageDocument() {
245-
var doc = new jsPDF();
246-
doc.text(20, 20, 'Hello world!');
247-
doc.text(20, 30, 'This is client-side Javascript, pumping out a PDF.');
248-
doc.addPage();
249-
doc.text(20, 20, 'Do you like that?');
250-
251-
// Output as Data URI
252-
doc.output('datauri');
253-
}
254-
255-
function demoLandscape() {
256-
var doc = new jsPDF('landscape');
257-
doc.text(20, 20, 'Hello landscape world!');
258-
259-
// Output as Data URI
260-
doc.output('datauri');
261-
}
262-
263-
function demoFontSizes() {
264-
var doc = new jsPDF();
265-
doc.setFontSize(22);
266-
doc.text(20, 20, 'This is a title');
267-
268-
doc.setFontSize(16);
269-
doc.text(20, 30, 'This is some normal sized text underneath.');
270-
271-
// Output as Data URI
272-
doc.output('datauri');
273-
}
274-
275-
function demoFontTypes() {
276-
var doc = new jsPDF();
277-
278-
doc.text(20, 20, 'This is the default font.');
279-
280-
doc.setFont("courier");
281-
doc.setFontType("normal");
282-
doc.text(20, 30, 'This is courier normal.');
283-
284-
doc.setFont("times");
285-
doc.setFontType("italic");
286-
doc.text(20, 40, 'This is times italic.');
287-
288-
doc.setFont("helvetica");
289-
doc.setFontType("bold");
290-
doc.text(20, 50, 'This is helvetica bold.');
291-
292-
doc.setFont("courier");
293-
doc.setFontType("bolditalic");
294-
doc.text(20, 60, 'This is courier bolditalic.');
295-
296-
// Output as Data URI
297-
doc.output('datauri');
298-
}
299-
300-
function demoTextColors() {
301-
var doc = new jsPDF();
302-
303-
doc.setTextColor(100);
304-
doc.text(20, 20, 'This is gray.');
305-
306-
doc.setTextColor(150);
307-
doc.text(20, 30, 'This is light gray.');
308-
309-
doc.setTextColor(255,0,0);
310-
doc.text(20, 40, 'This is red.');
311-
312-
doc.setTextColor(0,255,0);
313-
doc.text(20, 50, 'This is green.');
314-
315-
doc.setTextColor(0,0,255);
316-
doc.text(20, 60, 'This is blue.');
317-
318-
// Output as Data URI
319-
doc.output('datauri');
320-
}
321-
322-
function demoMetadata() {
323-
var doc = new jsPDF();
324-
doc.text(20, 20, 'This PDF has a title, subject, author, keywords and a creator.');
325-
326-
// Optional - set properties on the document
327-
doc.setProperties({
328-
title: 'Title',
329-
subject: 'This is the subject',
330-
author: 'James Hall',
331-
keywords: 'generated, javascript, web 2.0, ajax',
332-
creator: 'MEEE'
333-
});
334-
335-
// Output as Data URI
336-
doc.output('datauri');
337-
}
338-
339-
function demoUserInput() {
340-
var name = prompt('What is your name?');
341-
var multiplier = prompt('Enter a number:');
342-
multiplier = parseInt(multiplier);
343-
344-
var doc = new jsPDF();
345-
doc.setFontSize(22);
346-
doc.text(20, 20, 'Questions');
347-
doc.setFontSize(16);
348-
doc.text(20, 30, 'This belongs to: ' + name);
349-
350-
for(var i = 1; i <= 12; i ++) {
351-
doc.text(20, 30 + (i * 10), i + ' x ' + multiplier + ' = ___');
352-
}
353-
354-
doc.addPage();
355-
doc.setFontSize(22);
356-
doc.text(20, 20, 'Answers');
357-
doc.setFontSize(16);
358-
359-
for(var i = 1; i <= 12; i ++) {
360-
doc.text(20, 30 + (i * 10), i + ' x ' + multiplier + ' = ' + (i * multiplier));
361-
}
362-
doc.output('datauri');
363-
364-
}
365-
366-
function demoRectangles() {
367-
var doc = new jsPDF();
368-
369-
doc.rect(20, 20, 10, 10); // empty square
370-
371-
doc.rect(40, 20, 10, 10, 'F'); // filled square
372-
373-
doc.setDrawColor(255,0,0);
374-
doc.rect(60, 20, 10, 10); // empty red square
375-
376-
doc.setDrawColor(255,0,0);
377-
doc.rect(80, 20, 10, 10, 'FD'); // filled square with red borders
378-
379-
doc.setDrawColor(0);
380-
doc.setFillColor(255,0,0);
381-
doc.rect(100, 20, 10, 10, 'F'); // filled red square
382-
383-
doc.setDrawColor(0);
384-
doc.setFillColor(255,0,0);
385-
doc.rect(120, 20, 10, 10, 'FD'); // filled red square with black borders
386-
387-
// Output as Data URI
388-
doc.output('datauri');
389-
}
390-
391-
function demoLines() {
392-
var doc = new jsPDF();
393-
394-
doc.line(20, 20, 60, 20); // horizontal line
395-
396-
doc.setLineWidth(0.5);
397-
doc.line(20, 25, 60, 25);
398-
399-
doc.setLineWidth(1);
400-
doc.line(20, 30, 60, 30);
401-
402-
doc.setLineWidth(1.5);
403-
doc.line(20, 35, 60, 35);
404-
405-
doc.setDrawColor(255,0,0); // draw red lines
406-
407-
doc.setLineWidth(0.1);
408-
doc.line(100, 20, 100, 60); // vertical line
409-
410-
doc.setLineWidth(0.5);
411-
doc.line(105, 20, 105, 60);
412-
413-
doc.setLineWidth(1);
414-
doc.line(110, 20, 110, 60);
415-
416-
doc.setLineWidth(1.5);
417-
doc.line(115, 20, 115, 60);
418-
419-
// Output as Data URI
420-
doc.output('datauri');
421-
}
422-
423-
function demoCircles() {
424-
var doc = new jsPDF();
425-
426-
doc.ellipse(40, 20, 10, 5);
427-
428-
doc.setFillColor(0,0,255);
429-
doc.ellipse(80, 20, 10, 5, 'F');
430-
431-
doc.setLineWidth(1);
432-
doc.setDrawColor(0);
433-
doc.setFillColor(255,0,0);
434-
doc.circle(120, 20, 5, 'FD');
435-
436-
// Output as Data URI
437-
doc.output('datauri');
438-
}
439-
</script>
440-
441213

442214
<script type="text/javascript">
443215
// Google Analytics

examples/css/main.css

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
* {
2+
padding: 0; margin: 0;
3+
}
4+
body {
5+
padding: 30px;
6+
font-family: Arial, Helvetica, sans-serif;
7+
}
8+
h1 {
9+
margin-bottom: 1em;
10+
border-bottom: 1px solid #ccc;
11+
}
12+
h2 {
13+
margin-bottom: 1em;
14+
border-bottom: 1px solid #ccc;
15+
}
16+
pre {
17+
border: 1px dotted #ccc;
18+
background: #f7f7f7;
19+
padding: 10px;
20+
margin-bottom: 1em;
21+
}
22+
h1 {
23+
margin-bottom: 0.7em;
24+
}
25+
h2 {
26+
margin-top: 1em;
27+
}
28+
p {
29+
margin-bottom: 1em;
30+
}

examples/downloadify.htm

Lines changed: 1 addition & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -2,40 +2,7 @@
22
<html>
33
<head>
44
<title>jsPDF</title>
5-
<style type="text/css">
6-
* { padding: 0; margin: 0; }
7-
body {
8-
padding: 30px;
9-
font-family: Arial, Helvetica, sans-serif;
10-
}
11-
h1 {
12-
margin-bottom: 1em;
13-
border-bottom: 1px solid #ccc;
14-
}
15-
16-
h2 {
17-
margin-bottom: 1em;
18-
border-bottom: 1px solid #ccc;
19-
}
20-
21-
pre {
22-
border: 1px dotted #ccc;
23-
background: #f7f7f7;
24-
padding: 10px;
25-
margin-bottom: 1em;
26-
}
27-
28-
h1 {
29-
margin-bottom: 0.7em;
30-
}
31-
32-
h2 {
33-
margin-top: 1em;
34-
}
35-
p {
36-
margin-bottom: 1em;
37-
}
38-
</style>
5+
<link rel="stylesheet" type="text/css" href="css/main.css">
396
<script type="text/javascript" src="../libs/base64.js"></script>
407
<script type="text/javascript" src="../libs/sprintf.js"></script>
418
<script type="text/javascript" src="../jspdf.js"></script>

0 commit comments

Comments
 (0)