diff options
Diffstat (limited to 'js/io/ui')
12 files changed, 2246 insertions, 6 deletions
diff --git a/js/io/ui/file-picker/file-input-field.reel/file-input-field.css b/js/io/ui/file-picker/file-input-field.reel/file-input-field.css new file mode 100755 index 00000000..91e412f8 --- /dev/null +++ b/js/io/ui/file-picker/file-input-field.reel/file-input-field.css | |||
@@ -0,0 +1,28 @@ | |||
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 | .fileInputField{ | ||
8 | display:inline; | ||
9 | } | ||
10 | |||
11 | .fileInputField .newFileDirectory{ | ||
12 | width:70%; | ||
13 | margin-left:5px; | ||
14 | } | ||
15 | |||
16 | |||
17 | .fileInputField .findDirectory{ | ||
18 | display:inline; | ||
19 | width: 17px; | ||
20 | height:17px; | ||
21 | vertical-align: bottom; | ||
22 | background-image: url("data:image/png,%89PNG%0D%0A%1A%0A%00%00%00%0DIHDR%00%00%00%10%00%00%00%10%08%04%00%00%00%B5%FA7%EA%00%00%00%09pHYs%00%00%0B%13%00%00%0B%13%01%00%9A%9C%18%00%00%03%18iCCPPhotoshop%20ICC%20profile%00%00x%DAc%60%60%9E%E0%E8%E2%E4%CA%24%C0%C0PPTR%E4%1E%E4%18%19%11%19%A5%C0~%9E%81%8D%81%99%81%81%81%81%81!1%B9%B8%C01%20%C0%87%81%81%81!%2F%3F%2F%95%01%15020%7C%BB%C6%C0%C8%C0%C0%C0pY%D7%D1%C5%C9%95%814%C0%9A%5CPT%C2%C0%C0p%80%81%81%C1(%25%B58%99%81%81%E1%0B%03%03CzyIA%09%03%03c%0C%03%03%83HRvA%09%03%03c%01%03%03%83HvH%903%03%03c%0B%03%03%13OIjE%09%03%03%03%83s~AeQfzF%89%82%A1%A5%A5%A5%82cJ~R%AABpeqIjn%B1%82g%5Er~QA~QbIj%0A%03%03%03%D4%0E%06%06%06%06%5E%97%FC%12%05%F7%C4%CC%3C%05%23%03U%06*%83%88%C8(%05%08%0B%11%3E%081%04H.-*%83%07%25%03%83%00%83%02%83%01%83%03C%00C%22C%3D%C3%02%86%A3%0Co%18%C5%19%5D%18K%19W0%DEc%12c%0Ab%9A%C0t%81Y%989%92y!%F3%1B%16K%96%0E%96%5B%ACz%AC%AD%AC%F7%D8%2C%D9%A6%B1%7Dc%0Fg%DF%CD%A1%C4%D1%C5%F1%853%91%F3%02%97%23%D7%16nM%EE%05%3CR%3CSy%85x'%F1%09%F3M%E3%97%E1_%2C%A0%23%B0C%D0U%F0%8AP%AA%D0%0F%E1%5E%11%15%91%BD%A2%E1%A2_%C4%26%89%1B%89_%91%A8%90%94%93%3C%26%95%2F--%7DB%A6LV%5D%F6%96%5C%9F%BC%8B%FC%1F%85%AD%8A%85JzJo%95%D7%AA%14%A8%9A%A8%FET%3B%A8%DE%A5%11%AA%A9%A4%F9A%EB%80%F6%24%9DT%5D%2B%3DA%BDW%FAG%0C%16%18%D6%1A%C5%18%DB%9A%C8%9B2%9B%BE4%BB%60%BE%D3b%89%E5%04%AB%3A%EB%5C%9B8%DB%40%3BW%7Bk%07cG%1D'5g%25%17%05Wy7%05we%0FuO%5D%2F%13o%1B%1Fw%DF%60%BF%04%FF%FC%80%FA%C0%89AK%83w%85%5C%0C%7D%19%CE%14!%17i%15%15%11%5D%1133vO%DC%83%04%B6D%DD%A4%B0%E4%86%945%A97%D392%2C23%B3%E6f_%CCe%CF%B3%CF%AF(%D8T%F8%AEX%BB%24%ABtU%D9%9B%0A%FD%CA%92%AA%5D5%8C%B5%5EuS%EB%1F6%EA5%D54%9Fm%95k%2Bl%3F%DA)%DDU%D4%7D%BAW%B5%AF%B1%FF%EED%9BI%B3'%FF%9D%1A%3F%ED%F0%0C%8D%99%FD%B3%BE%CFI%98%7Bz%BE%F9%82%A5%8BD%16%B7.%F9%B6%2Cs%F9%BD%95!%ABN%AFqY%BBo%BD%E5%86m%9BL6o%D9j%B2m%FB%0E%AB%9D%FBw%BB%EE9%BB%2Fl%FF%83%839%87~%1Ei%3F%26~%7C%C5I%EBS%E7%CE%24%9F%FDu~%D2E%EDKG%AF%24%5E%FDw%7D%CEM%9B%5Bw%EF%D4%DFS%BE%7F%E2a%DEc%B1'%FB%9Fe%BE%10yy%F0u%FE%5B%F9w%17%3E4%7D2%FD%FC%EA%EB%82%EF%E1%3F%05~%9D%FA%D3%FA%CF%F1%FF%7F%00%0D%00%0F4%FA%96%F1%5D%00%00%00%20cHRM%00%00z%25%00%00%80%83%00%00%F9%FF%00%00%80%E9%00%00u0%00%00%EA%60%00%00%3A%98%00%00%17o%92_%C5F%00%00%01%3AIDATx%DA%84%91MK%02a%14%85%9Fwf%98%60%C4%CA%24BL%A4%E8%CBV%FD%82V%B5%0A%8A%DAD%05%AD%DA%B5%C9%A0%96%EDBw%FD%82VQ%B8%0C%FFB%CB%3E(%8A%24%A8%C4%5C%18L%86%18%D6%E8%A8o%8B%99a%B0%85%9D%ED%3D%3C%F7%9C%7B%85%A4%BB4%00%81%3D%A1%EE%C9%10%9A%CCh%19%7F(%01%05%C0%9Al%A7%EBa%F3%EA%B3%D8%DA%7F%5ED%ED%40H%24_%C7%D5%F3%D84%B3%CCg%0F%CD%8B%B9%88g%91H%87P%1F%CC%5D%16%A3%18%D8%E9%9B%BA%26F1%10%1E%C0Y%A1%C8qT%0A%3Cl%D5Pr%06%C1%3F!%0B%D9%E1%ED%D3%B7%F2%FBr%5C%EC%98w%BA%86%8E%C0%AD'%24%20%86R%1BK%2BzS%D3%1A%F7%CD)%CB%3A98%BA%A6%ED%B4p%0CA%C6%06%A21%9Br%3C%9CJ%E9%01%EB%E5qw%F5%09%E9%1BT%FA%89%12BAYO%247%03%7D%8D%D2%CC%02%DFR%BA%19hQ%A1%81I%0F%F2%CC%AC%B4%93k%A5Wb%14%F8%F1%08n%1E%04%02%83%11%12%F4%92%E7V~x%04%FF.P%23O%93%08U%9A~%8B%CE%FF(%F4%60%D0%A2%26m%D7%D0M%CA%3Fs~%07%00f%81qU%9E%9B%ECi%00%00%00%00IEND%AEB%60%82"); | ||
23 | background-size:17px 17px; | ||
24 | background-position: -2px -1px; | ||
25 | background-repeat: no-repeat; | ||
26 | padding-right: 12px; | ||
27 | cursor:pointer; | ||
28 | } | ||
diff --git a/js/io/ui/file-picker/file-input-field.reel/file-input-field.html b/js/io/ui/file-picker/file-input-field.reel/file-input-field.html new file mode 100755 index 00000000..2fcaa075 --- /dev/null +++ b/js/io/ui/file-picker/file-input-field.reel/file-input-field.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-field.css"> | ||
11 | <script type="text/montage-serialization"> | ||
12 | { | ||
13 | "owner":{ | ||
14 | "module": "js/io/ui/file-picker/file-input-field.reel", | ||
15 | "name": "FileInputField", | ||
16 | "properties": { | ||
17 | "element": {"#": "fileInputField"}, | ||
18 | "findDirectory": {"#": "findDirectory"}, | ||
19 | "newFileDirectory": {"#": "newFileDirectory"} | ||
20 | } | ||
21 | } | ||
22 | } | ||
23 | </script> | ||
24 | </head> | ||
25 | <body> | ||
26 | <div id="fileInputField" class="fileInputField"> | ||
27 | <input type="search" id="newFileDirectory" class="nj-skinned newFileDirectory" /> | ||
28 | <span id="findDirectory" class="findDirectory"></span> | ||
29 | </div> | ||
30 | </body> | ||
31 | </html> \ No newline at end of file | ||
diff --git a/js/io/ui/file-picker/file-input-field.reel/file-input-field.js b/js/io/ui/file-picker/file-input-field.reel/file-input-field.js new file mode 100755 index 00000000..235be8ad --- /dev/null +++ b/js/io/ui/file-picker/file-input-field.reel/file-input-field.js | |||
@@ -0,0 +1,120 @@ | |||
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 FileInputField = exports.FileInputField = Montage.create(Component, { | ||
11 | |||
12 | hasReel: { | ||
13 | value: true | ||
14 | }, | ||
15 | |||
16 | willDraw: { | ||
17 | enumerable: false, | ||
18 | value: function() {} | ||
19 | }, | ||
20 | draw: { | ||
21 | enumerable: false, | ||
22 | value: function() {} | ||
23 | }, | ||
24 | didDraw: { | ||
25 | enumerable: false, | ||
26 | value: function() { | ||
27 | var that = this; | ||
28 | this.findDirectory.identifier = "findDirectory"; | ||
29 | this.findDirectory.addEventListener("click", function(evt){that.handleFindDirectoryClick(evt);}, false); | ||
30 | |||
31 | this.eventManager.addEventListener("pickerSelectionsDone", function(evt){that.handleFileInputPickerSelectionsDone(evt);}, false); | ||
32 | |||
33 | this.newFileDirectory.addEventListener("keyup", function(evt){that.handleNewFileDirectoryOnkeyup(evt);}, false); | ||
34 | } | ||
35 | }, | ||
36 | |||
37 | /** | ||
38 | * Either selectDirectory OR selectFile can be true | ||
39 | * If both are false then the file picker will default to file selection mode | ||
40 | */ | ||
41 | |||
42 | selectDirectory:{ | ||
43 | writable: true, | ||
44 | enumerable:false, | ||
45 | value: false | ||
46 | }, | ||
47 | |||
48 | pickerName:{ | ||
49 | writable: true, | ||
50 | enumerable:false, | ||
51 | value: null | ||
52 | }, | ||
53 | |||
54 | selectFile:{ | ||
55 | writable: true, | ||
56 | enumerable:false, | ||
57 | value: false | ||
58 | }, | ||
59 | |||
60 | |||
61 | handleFindDirectoryClick: { | ||
62 | value: function(evt){ | ||
63 | var openFilePicker = document.createEvent("Events"); | ||
64 | openFilePicker.initEvent("openFilePicker", false, false); | ||
65 | var settings = {}; | ||
66 | if(this.selectDirectory === true){ | ||
67 | settings.inFileMode = false; | ||
68 | settings.pickerName = this.pickerName || "newFileDirectorySelector"; | ||
69 | }else{ | ||
70 | settings.inFileMode = true; | ||
71 | settings.pickerName = this.pickerName || "fileSelector"; | ||
72 | } | ||
73 | settings.callback = this.filePickerCallback.bind(this); | ||
74 | openFilePicker.settings = settings; | ||
75 | this.eventManager.dispatchEvent(openFilePicker); | ||
76 | } | ||
77 | }, | ||
78 | |||
79 | handleNewFileDirectoryOnkeyup:{ | ||
80 | value:function(evt){ | ||
81 | if(this.newFileDirectory.value !== ""){ | ||
82 | var newFileDirectorySetEvent = document.createEvent("Events"); | ||
83 | newFileDirectorySetEvent.initEvent("newFileDirectorySet", false, false); | ||
84 | newFileDirectorySetEvent.newFileDirectory = this.newFileDirectory.value; | ||
85 | this.eventManager.dispatchEvent(newFileDirectorySetEvent); | ||
86 | } | ||
87 | } | ||
88 | }, | ||
89 | |||
90 | handleFileInputPickerSelectionsDone:{ | ||
91 | value: function(evt){ | ||
92 | var selectedUri = ""; | ||
93 | if(!!evt._event.selectedItems && evt._event.selectedItems.length > 0){ | ||
94 | selectedUri = evt._event.selectedItems[0]; | ||
95 | this.newFileDirectory.value = selectedUri; | ||
96 | |||
97 | var newFileDirectorySetEvent = document.createEvent("Events"); | ||
98 | newFileDirectorySetEvent.initEvent("newFileDirectorySet", false, false); | ||
99 | newFileDirectorySetEvent.newFileDirectory = this.newFileDirectory.value; | ||
100 | this.eventManager.dispatchEvent(newFileDirectorySetEvent); | ||
101 | } | ||
102 | } | ||
103 | }, | ||
104 | |||
105 | filePickerCallback:{ | ||
106 | value: function(obj){ | ||
107 | var selectedUri = ""; | ||
108 | if(!!obj && obj.uri && obj.uri.length > 0){ | ||
109 | selectedUri = obj.uri[0]; | ||
110 | this.newFileDirectory.value = selectedUri; | ||
111 | |||
112 | var newFileDirectorySetEvent = document.createEvent("Events"); | ||
113 | newFileDirectorySetEvent.initEvent("newFileDirectorySet", false, false); | ||
114 | newFileDirectorySetEvent.newFileDirectory = this.newFileDirectory.value; | ||
115 | this.eventManager.dispatchEvent(newFileDirectorySetEvent); | ||
116 | } | ||
117 | } | ||
118 | } | ||
119 | |||
120 | }); \ No newline at end of file | ||