diff options
author | Pacien TRAN-GIRARD | 2014-08-10 17:28:37 +0200 |
---|---|---|
committer | Pacien TRAN-GIRARD | 2014-08-10 17:28:37 +0200 |
commit | e7bf5952d0729b37e677168b6e8fbd1ce58ed1a2 (patch) | |
tree | 189988e3e272b806262d1df6b87f1da089ef4af8 /point/plugins/autoscale | |
parent | a32e898c8d7ad3774f5654e88bb24d5c26482137 (diff) | |
download | whatsthepoint-master.tar.gz |
Diffstat (limited to 'point/plugins/autoscale')
-rw-r--r-- | point/plugins/autoscale/autoscale.js | 70 |
1 files changed, 70 insertions, 0 deletions
diff --git a/point/plugins/autoscale/autoscale.js b/point/plugins/autoscale/autoscale.js new file mode 100644 index 0000000..25ed39b --- /dev/null +++ b/point/plugins/autoscale/autoscale.js | |||
@@ -0,0 +1,70 @@ | |||
1 | /* | ||
2 | * This file is part of "What's The Point" <https://github.com/Pacien/WhatsThePoint> | ||
3 | * Copyright (C) 2014 Pacien TRAN-GIRARD | ||
4 | * | ||
5 | * "What's The Point" is free software: you can redistribute it and/or modify | ||
6 | * it under the terms of the GNU Affero General Public License as | ||
7 | * published by the Free Software Foundation, either version 3 of the | ||
8 | * License, or (at your option) any later version. | ||
9 | * | ||
10 | * "What's The Point" is distributed in the hope that it will be useful, | ||
11 | * but WITHOUT ANY WARRANTY; without even the implied warranty of | ||
12 | * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the | ||
13 | * GNU Affero General Public License for more details. | ||
14 | * | ||
15 | * You should have received a copy of the GNU Affero General Public License | ||
16 | * along with this program. If not, see <http://www.gnu.org/licenses/>. | ||
17 | */ | ||
18 | |||
19 | define([], function () { | ||
20 | |||
21 | var autoscale = { | ||
22 | |||
23 | init: function () { | ||
24 | this.container = document.body; | ||
25 | this.reference = document.getElementsByTagName("p-screen")[0]; | ||
26 | this.target = this.reference; | ||
27 | |||
28 | this.centerTarget(); | ||
29 | this.bindEvent(); | ||
30 | this.resize(); | ||
31 | }, | ||
32 | |||
33 | centerTarget: function () { | ||
34 | this.target.style.position = "absolute"; | ||
35 | this.target.style.top = "50%"; | ||
36 | this.target.style.left = "50%"; | ||
37 | this.target.style.marginTop = -this.target.offsetHeight / 2 + "px"; | ||
38 | this.target.style.marginLeft = -this.target.offsetWidth / 2 + "px"; | ||
39 | document.body.style.overflow = "hidden"; | ||
40 | }, | ||
41 | |||
42 | applyTransformation: function (transformation) { | ||
43 | this.target.style.MozTransform = transformation; | ||
44 | this.target.style.WebkitTransform = transformation; | ||
45 | this.target.style.OTransform = transformation; | ||
46 | this.target.style.msTransform = transformation; | ||
47 | this.target.style.transform = transformation; | ||
48 | }, | ||
49 | |||
50 | resize: function () { | ||
51 | var widthRatio = this.container.offsetWidth / this.reference.offsetWidth; | ||
52 | var heightRatio = this.container.offsetHeight / this.reference.offsetHeight; | ||
53 | |||
54 | var scaleRatio = Math.min(widthRatio, heightRatio); | ||
55 | scaleRatio = scaleRatio < 1 ? scaleRatio : 1; | ||
56 | |||
57 | this.applyTransformation("scale(" + scaleRatio + ")"); | ||
58 | }, | ||
59 | |||
60 | bindEvent: function () { | ||
61 | window.addEventListener("resize", function () { | ||
62 | autoscale.resize(); | ||
63 | }); | ||
64 | }, | ||
65 | |||
66 | }; | ||
67 | |||
68 | return autoscale; | ||
69 | |||
70 | }); | ||