diff options
author | Pierre Frisch | 2011-12-22 07:25:50 -0800 |
---|---|---|
committer | Valerio Virgillito | 2012-01-27 11:18:17 -0800 |
commit | b89a7ee8b956c96a1dcee995ea840feddc5d4b27 (patch) | |
tree | 0f3136ab0ecdbbbed6a83576581af0a53124d6f1 /js/components/ui/file-input.reel | |
parent | 2401f05d1f4b94d45e4568b81fc73e67b969d980 (diff) | |
download | ninja-b89a7ee8b956c96a1dcee995ea840feddc5d4b27.tar.gz |
First commit of Ninja to ninja-internal
Signed-off-by: Valerio Virgillito <rmwh84@motorola.com>
Diffstat (limited to 'js/components/ui/file-input.reel')
-rw-r--r-- | js/components/ui/file-input.reel/file-input.css | 34 | ||||
-rw-r--r-- | js/components/ui/file-input.reel/file-input.html | 31 | ||||
-rw-r--r-- | js/components/ui/file-input.reel/file-input.js | 65 |
3 files changed, 130 insertions, 0 deletions
diff --git a/js/components/ui/file-input.reel/file-input.css b/js/components/ui/file-input.reel/file-input.css new file mode 100644 index 00000000..6bc1d13f --- /dev/null +++ b/js/components/ui/file-input.reel/file-input.css | |||
@@ -0,0 +1,34 @@ | |||
1 | /* <copyright> | ||
2 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> | ||
3 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> | ||
4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | ||
5 | </copyright> */ | ||
6 | |||
7 | .fileInput { | ||
8 | float: left; | ||
9 | } | ||
10 | |||
11 | .fileInput .file-path { | ||
12 | width: 80% !important; | ||
13 | float: left; | ||
14 | } | ||
15 | |||
16 | .fileInput .browse-button { | ||
17 | display: block; | ||
18 | width: 20px; | ||
19 | height: 20px; | ||
20 | float: left; | ||
21 | background-color: transparent !important; | ||
22 | border: 0 !important; | ||
23 | text-indent: -9999px; | ||
24 | padding: 0 !important; | ||
25 | background: url(../../../../images/tools/zoom_up.png) transparent no-repeat right !important; | ||
26 | |||
27 | opacity: 0.7; | ||
28 | margin: 1px 0 0 4px; | ||
29 | cursor: pointer; | ||
30 | } | ||
31 | |||
32 | .fileInput .browse-button:hover { | ||
33 | opacity: 1; | ||
34 | } | ||
diff --git a/js/components/ui/file-input.reel/file-input.html b/js/components/ui/file-input.reel/file-input.html new file mode 100644 index 00000000..5cdd8f9e --- /dev/null +++ b/js/components/ui/file-input.reel/file-input.html | |||
@@ -0,0 +1,31 @@ | |||
1 | <!DOCTYPE HTML> | ||
2 | <!-- <copyright> | ||
3 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> | ||
4 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> | ||
5 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | ||
6 | </copyright> --> | ||
7 | <html> | ||
8 | <head> | ||
9 | <meta http-equiv="content-type" content="text/html; charset=utf-8" /> | ||
10 | <link rel="stylesheet" type="text/css" href="file-input.css"> | ||
11 | <script type="text/montage-serialization"> | ||
12 | { | ||
13 | "owner": { | ||
14 | "module": "js/components/ui/file-input", | ||
15 | "name": "FileInput", | ||
16 | "properties": { | ||
17 | "element": {"#": "fileInput"}, | ||
18 | "inputField": {"#": "fileInputControl"}, | ||
19 | "filePathField": {"#": "fileInputTextField"} | ||
20 | } | ||
21 | } | ||
22 | } | ||
23 | </script> | ||
24 | </head> | ||
25 | <body> | ||
26 | <div id="fileInput"> | ||
27 | <input id="fileInputTextField" class="file-path" type="text" /> | ||
28 | <input id="fileInputControl" class="browse-button" type="file" /> | ||
29 | </div> | ||
30 | </body> | ||
31 | </html> \ No newline at end of file | ||
diff --git a/js/components/ui/file-input.reel/file-input.js b/js/components/ui/file-input.reel/file-input.js new file mode 100644 index 00000000..2ea38162 --- /dev/null +++ b/js/components/ui/file-input.reel/file-input.js | |||
@@ -0,0 +1,65 @@ | |||
1 | /* <copyright> | ||
2 | This file contains proprietary software owned by Motorola Mobility, Inc.<br/> | ||
3 | No rights, expressed or implied, whatsoever to this software are provided by Motorola Mobility, Inc. hereunder.<br/> | ||
4 | (c) Copyright 2011 Motorola Mobility, Inc. All Rights Reserved. | ||
5 | </copyright> */ | ||
6 | |||
7 | var Montage = require("montage/core/core").Montage, | ||
8 | Component = require("montage/ui/component").Component; | ||
9 | |||
10 | var FileInput = exports.FileInput = Montage.create(Component, { | ||
11 | |||
12 | _filePath: { | ||
13 | enumerable: false, | ||
14 | value: "" | ||
15 | }, | ||
16 | |||
17 | filePath: { | ||
18 | enumerable: true, | ||
19 | serializable: true, | ||
20 | get: function () { | ||
21 | return this._filePath; | ||
22 | }, | ||
23 | set: function (value) { | ||
24 | if (value !== this._filePath) { | ||
25 | this._filePath = value; | ||
26 | this.needsDraw = true; | ||
27 | } | ||
28 | } | ||
29 | }, | ||
30 | |||
31 | draw: { | ||
32 | value: function() { | ||
33 | this.filePathField.value = this._filePath; | ||
34 | } | ||
35 | }, | ||
36 | |||
37 | handleChange: | ||
38 | { | ||
39 | value:function(event) | ||
40 | { | ||
41 | if(event.currentTarget.id === "fileInputControl") | ||
42 | { | ||
43 | this.filePath = this.inputField.value; | ||
44 | } | ||
45 | else | ||
46 | { | ||
47 | this.filePath = this.filePathField.value; | ||
48 | } | ||
49 | |||
50 | var e = document.createEvent("CustomEvent"); | ||
51 | e.initEvent("change", true, true); | ||
52 | e.type = "change"; | ||
53 | e.filePath = this.filePath; | ||
54 | this.dispatchEvent(e); | ||
55 | } | ||
56 | }, | ||
57 | |||
58 | prepareForDraw: { | ||
59 | value: function() { | ||
60 | this.inputField.addEventListener("change", this, false); | ||
61 | this.filePathField.addEventListener("change", this, false); | ||
62 | } | ||
63 | } | ||
64 | |||
65 | }); | ||