Subversion-Projekte lars-tiefland.cienc

Revision

Details | Letzte Änderung | Log anzeigen | RSS feed

Revision Autor Zeilennr. Zeile
9 lars 1
function demoTwoPageDocument() {
2
	var doc = new jsPDF();
3
	doc.text(20, 20, 'Hello world!');
4
	doc.text(20, 30, 'This is client-side Javascript, pumping out a PDF.');
5
	doc.addPage();
6
	doc.text(20, 20, 'Do you like that?');
7
 
8
	// Save the PDF
9
	doc.save('Test.pdf');
10
}
11
 
12
function demoLandscape() {
13
	var doc = new jsPDF('landscape');
14
	doc.text(20, 20, 'Hello landscape world!');
15
 
16
	// Save the PDF
17
	doc.save('Test.pdf');
18
}
19
 
20
function demoFontSizes() {
21
	var doc = new jsPDF();
22
	doc.setFontSize(22);
23
	doc.text(20, 20, 'This is a title');
24
 
25
	doc.setFontSize(16);
26
	doc.text(20, 30, 'This is some normal sized text underneath.');
27
 
28
	doc.save('Test.pdf');
29
}
30
 
31
function demoFontTypes() {
32
	var doc = new jsPDF();
33
 
34
	doc.text(20, 20, 'This is the default font.');
35
 
36
	doc.setFont("courier");
37
	doc.setFontType("normal");
38
	doc.text(20, 30, 'This is courier normal.');
39
 
40
	doc.setFont("times");
41
	doc.setFontType("italic");
42
	doc.text(20, 40, 'This is times italic.');
43
 
44
	doc.setFont("helvetica");
45
	doc.setFontType("bold");
46
	doc.text(20, 50, 'This is helvetica bold.');
47
 
48
	doc.setFont("courier");
49
	doc.setFontType("bolditalic");
50
	doc.text(20, 60, 'This is courier bolditalic.');
51
 
52
	doc.save('Test.pdf');
53
}
54
 
55
function demoTextColors() {
56
	var doc = new jsPDF();
57
 
58
	doc.setTextColor(100);
59
	doc.text(20, 20, 'This is gray.');
60
 
61
	doc.setTextColor(150);
62
	doc.text(20, 30, 'This is light gray.');
63
 
64
	doc.setTextColor(255,0,0);
65
	doc.text(20, 40, 'This is red.');
66
 
67
	doc.setTextColor(0,255,0);
68
	doc.text(20, 50, 'This is green.');
69
 
70
	doc.setTextColor(0,0,255);
71
	doc.text(20, 60, 'This is blue.');
72
 
73
	// Output as Data URI
74
	doc.output('datauri');
75
}
76
 
77
function demoMetadata() {
78
	var doc = new jsPDF();
79
	doc.text(20, 20, 'This PDF has a title, subject, author, keywords and a creator.');
80
 
81
	// Optional - set properties on the document
82
	doc.setProperties({
83
		title: 'Title',
84
		subject: 'This is the subject',
85
		author: 'James Hall',
86
		keywords: 'generated, javascript, web 2.0, ajax',
87
		creator: 'MEEE'
88
	});
89
 
90
	doc.save('Test.pdf');
91
}
92
 
93
function demoUserInput() {
94
	var name = prompt('What is your name?');
95
	var multiplier = prompt('Enter a number:');
96
	multiplier = parseInt(multiplier);
97
 
98
	var doc = new jsPDF();
99
	doc.setFontSize(22);
100
	doc.text(20, 20, 'Questions');
101
	doc.setFontSize(16);
102
	doc.text(20, 30, 'This belongs to: ' + name);
103
 
104
	for(var i = 1; i <= 12; i ++) {
105
		doc.text(20, 30 + (i * 10), i + ' x ' + multiplier + ' = ___');
106
	}
107
 
108
	doc.addPage();
109
	doc.setFontSize(22);
110
	doc.text(20, 20, 'Answers');
111
	doc.setFontSize(16);
112
 
113
	for (i = 1; i <= 12; i ++) {
114
		doc.text(20, 30 + (i * 10), i + ' x ' + multiplier + ' = ' + (i * multiplier));
115
	}
116
	doc.save('Test.pdf');
117
 
118
}
119
 
120
function demoRectangles() {
121
	var doc = new jsPDF();
122
 
123
	doc.rect(20, 20, 10, 10); // empty square
124
 
125
	doc.rect(40, 20, 10, 10, 'F'); // filled square
126
 
127
	doc.setDrawColor(255, 0, 0);
128
	doc.rect(60, 20, 10, 10); // empty red square
129
 
130
	doc.setDrawColor(255, 0, 0);
131
	doc.rect(80, 20, 10, 10, 'FD'); // filled square with red borders
132
 
133
	doc.setDrawColor(0);
134
	doc.setFillColor(255, 0, 0);
135
	doc.rect(100, 20, 10, 10, 'F'); // filled red square
136
 
137
	doc.setDrawColor(0);
138
	doc.setFillColor(255, 0, 0);
139
	doc.rect(120, 20, 10, 10, 'FD'); // filled red square with black borders
140
 
141
	doc.setDrawColor(0);
142
	doc.setFillColor(255, 255, 255);
143
	doc.roundedRect(140, 20, 10, 10, 3, 3, 'FD'); //  Black sqaure with rounded corners
144
 
145
	doc.save('Test.pdf');
146
}
147
 
148
function demoLines() {
149
	var doc = new jsPDF();
150
 
151
	doc.line(20, 20, 60, 20); // horizontal line
152
 
153
	doc.setLineWidth(0.5);
154
	doc.line(20, 25, 60, 25);
155
 
156
	doc.setLineWidth(1);
157
	doc.line(20, 30, 60, 30);
158
 
159
	doc.setLineWidth(1.5);
160
	doc.line(20, 35, 60, 35);
161
 
162
	doc.setDrawColor(255,0,0); // draw red lines
163
 
164
	doc.setLineWidth(0.1);
165
	doc.line(100, 20, 100, 60); // vertical line
166
 
167
	doc.setLineWidth(0.5);
168
	doc.line(105, 20, 105, 60);
169
 
170
	doc.setLineWidth(1);
171
	doc.line(110, 20, 110, 60);
172
 
173
	doc.setLineWidth(1.5);
174
	doc.line(115, 20, 115, 60);
175
 
176
	// Output as Data URI
177
	doc.output('datauri');
178
}
179
 
180
function demoCircles() {
181
	var doc = new jsPDF();
182
 
183
	doc.ellipse(40, 20, 10, 5);
184
 
185
	doc.setFillColor(0,0,255);
186
	doc.ellipse(80, 20, 10, 5, 'F');
187
 
188
	doc.setLineWidth(1);
189
	doc.setDrawColor(0);
190
	doc.setFillColor(255,0,0);
191
	doc.circle(120, 20, 5, 'FD');
192
 
193
	doc.save('Test.pdf');
194
}
195
 
196
function demoTriangles() {
197
	var doc = new jsPDF();
198
 
199
	doc.triangle(60, 100, 60, 120, 80, 110, 'FD');
200
 
201
	doc.setLineWidth(1);
202
	doc.setDrawColor(255,0,0);
203
	doc.setFillColor(0,0,255);
204
	doc.triangle(100, 100, 110, 100, 120, 130, 'FD');
205
 
206
	doc.save('Test.pdf');
207
}
208
 
209
function demoImages() {
210
	// Because of security restrictions, getImageFromUrl will
211
	// not load images from other domains.  Chrome has added
212
	// security restrictions that prevent it from loading images
213
	// when running local files.  Run with: chromium --allow-file-access-from-files --allow-file-access
214
	// to temporarily get around this issue.
215
	var getImageFromUrl = function(url, callback) {
216
		var img = new Image(), data, ret = {
217
			data: null,
218
			pending: true
219
		};
220
 
221
		img.onError = function() {
222
			throw new Error('Cannot load image: "'+url+'"');
223
		};
224
		img.onload = function() {
225
			var canvas = document.createElement('canvas');
226
			document.body.appendChild(canvas);
227
			canvas.width = img.width;
228
			canvas.height = img.height;
229
 
230
			var ctx = canvas.getContext('2d');
231
			ctx.drawImage(img, 0, 0);
232
			// Grab the image as a jpeg encoded in base64, but only the data
233
			data = canvas.toDataURL('image/jpeg').slice('data:image/jpeg;base64,'.length);
234
			// Convert the data to binary form
235
			data = atob(data);
236
			document.body.removeChild(canvas);
237
 
238
			ret['data'] = data;
239
			ret['pending'] = false;
240
			if (typeof callback === 'function') {
241
				callback(data);
242
			}
243
		};
244
		img.src = url;
245
 
246
		return ret;
247
	};
248
 
249
	// Since images are loaded asyncronously, we must wait to create
250
	// the pdf until we actually have the image data.
251
	// If we already had the jpeg image binary data loaded into
252
	// a string, we create the pdf without delay.
253
	var createPDF = function(imgData) {
254
		var doc = new jsPDF();
255
 
256
		doc.addImage(imgData, 'JPEG', 10, 10, 50, 50);
257
		doc.addImage(imgData, 'JPEG', 70, 10, 100, 120);
258
 
259
		doc.save('output.pdf');
260
 
261
	}
262
 
263
	getImageFromUrl('thinking-monkey.jpg', createPDF);
264
}
265
 
266
function demoStringSplitting() {
267
 
268
	var pdf = new jsPDF('p','in','letter')
269
	, sizes = [12, 16, 20]
270
	, fonts = [['Times','Roman'],['Helvetica',''], ['Times','Italic']]
271
	, font, size, lines
272
	, margin = 0.5 // inches on a 8.5 x 11 inch sheet.
273
	, verticalOffset = margin
274
	, loremipsum = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus id eros turpis. Vivamus tempor urna vitae sapien mollis molestie. Vestibulum in lectus non enim bibendum laoreet at at libero. Etiam malesuada erat sed sem blandit in varius orci porttitor. Sed at sapien urna. Fusce augue ipsum, molestie et adipiscing at, varius quis enim. Morbi sed magna est, vel vestibulum urna. Sed tempor ipsum vel mi pretium at elementum urna tempor. Nulla faucibus consectetur felis, elementum venenatis mi mollis gravida. Aliquam mi ante, accumsan eu tempus vitae, viverra quis justo.\n\nProin feugiat augue in augue rhoncus eu cursus tellus laoreet. Pellentesque eu sapien at diam porttitor venenatis nec vitae velit. Donec ultrices volutpat lectus eget vehicula. Nam eu erat mi, in pulvinar eros. Mauris viverra porta orci, et vehicula lectus sagittis id. Nullam at magna vitae nunc fringilla posuere. Duis volutpat malesuada ornare. Nulla in eros metus. Vivamus a posuere libero.'
275
 
276
	// Margins:
277
	pdf.setDrawColor(0, 255, 0)
278
		.setLineWidth(1/72)
279
		.line(margin, margin, margin, 11 - margin)
280
		.line(8.5 - margin, margin, 8.5-margin, 11-margin)
281
 
282
	// the 3 blocks of text
283
	for (var i in fonts){
284
		if (fonts.hasOwnProperty(i)) {
285
			font = fonts[i]
286
			size = sizes[i]
287
 
288
			lines = pdf.setFont(font[0], font[1])
289
						.setFontSize(size)
290
						.splitTextToSize(loremipsum, 7.5)
291
			// Don't want to preset font, size to calculate the lines?
292
			// .splitTextToSize(text, maxsize, options)
293
			// allows you to pass an object with any of the following:
294
			// {
295
			// 	'fontSize': 12
296
			// 	, 'fontStyle': 'Italic'
297
			// 	, 'fontName': 'Times'
298
			// }
299
			// Without these, .splitTextToSize will use current / default
300
			// font Family, Style, Size.
301
			console.log(lines);
302
			pdf.text(0.5, verticalOffset + size / 72, lines)
303
 
304
			verticalOffset += (lines.length + 0.5) * size / 72
305
		}
306
	}
307
 
308
	pdf.save('Test.pdf');
309
}
310
 
311
function demoFromHTML() {
312
	var pdf = new jsPDF('p', 'in', 'letter');
313
 
314
	// source can be HTML-formatted string, or a reference
315
	// to an actual DOM element from which the text will be scraped.
316
	, source = $('#fromHTMLtestdiv')[0]
317
 
318
	// we support special element handlers. Register them with jQuery-style
319
	// ID selector for either ID or node name. ("#iAmID", "div", "span" etc.)
320
	// There is no support for any other type of selectors
321
	// (class, of compound) at this time.
322
	, specialElementHandlers = {
323
		// element with id of "bypass" - jQuery style selector
324
		'#bypassme': function(element, renderer){
325
			// true = "handled elsewhere, bypass text extraction"
326
			return true
327
		}
328
	}
329
 
330
	// all coords and widths are in jsPDF instance's declared units
331
	// 'inches' in this case
332
	pdf.fromHTML(
333
		source // HTML string or DOM elem ref.
334
		, 0.5 // x coord
335
		, 0.5 // y coord
336
		, {
337
			'width':7.5 // max width of content on PDF
338
			, 'elementHandlers': specialElementHandlers
339
		}
340
	)
341
 
342
	pdf.save('Test.pdf');
343
}