Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(219)

Issues Search
    My Issues | Starred     Open | Closed | All

Side by Side Diff: chrome/browser/resources/file_manager/slideshow.html

Issue 6873100: Moving slideshow to the filebrowser. (Closed) Base URL: svn://svn.chromium.org/chrome/trunk/src/
Patch Set: '' Created 9 years, 8 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch | Annotate | Revision Log
« chrome/browser/resources/file_manager/js/file_manager.js ('K') | « chrome/browser/resources/file_manager/manifest.json ('k') | chrome/browser/resources/shared_resources.grd » ('j') | chrome/browser/resources/shared_resources.grd » ('J')
Toggle Intra-line Diffs ('i') | Expand Comments ('e') | Collapse Comments ('c') | Show Comments Hide Comments ('s')
OLDNEW
1 <!DOCTYPE HTML> 1 <!DOCTYPE HTML>
2 <html i18n-values="dir:textdirection;"> 2 <html i18n-values="dir:textdirection;">
3 <head> 3 <head>
4 <meta charset="utf-8"> 4 <meta charset="utf-8">
5 <title>Slideshow</title> 5 <title>Slideshow</title>
6 <style> 6 <style>
7 7
8 body { 8 body {
9 overflow: hidden; 9 overflow: hidden;
10 background: black; 10 background: black;
(...skipping 27 matching lines...) Expand all
38 right: 0; 38 right: 0;
39 align:center; 39 align:center;
40 -webkit-box-align: center; 40 -webkit-box-align: center;
41 -webkit-box-pack: center; 41 -webkit-box-pack: center;
42 display: -webkit-box; 42 display: -webkit-box;
43 position: absolute; 43 position: absolute;
44 background: -webkit-linear-gradient(#323232, #070707); 44 background: -webkit-linear-gradient(#323232, #070707);
45 } 45 }
46 46
47 #prevbutton > div { 47 #prevbutton > div {
48 background: url('shared/images/mediaplayer_prev.png'); 48 background: url('chrome://resources/images/mediaplayer_prev.png');
zel 2011/04/23 07:42:46 this resource should be part of this extension, no
49 background-repeat: no-repeat; 49 background-repeat: no-repeat;
50 background-position: 4px 8px; 50 background-position: 4px 8px;
51 width: 100%; 51 width: 100%;
52 height: 30px; 52 height: 30px;
53 z-index: 9999; 53 z-index: 9999;
54 } 54 }
55 55
56 .currentpicture { 56 .currentpicture {
57 width: 100%; 57 width: 100%;
58 height: 100%; 58 height: 100%;
59 position: absolute; 59 position: absolute;
60 top: 0; 60 top: 0;
61 -webkit-transition-property: left; 61 -webkit-transition-property: left;
62 -webkit-transition-duration: 1s; 62 -webkit-transition-duration: 1s;
63 display: -webkit-box; 63 display: -webkit-box;
64 -webkit-box-align: center; 64 -webkit-box-align: center;
65 -webkit-box-pack: center; 65 -webkit-box-pack: center;
66 pointer-events: none; 66 pointer-events: none;
67 } 67 }
68 68
69 .comingfromleft { 69 .comingfromleft {
70 left: -100%; 70 left: -100%;
71 } 71 }
72 72
73 .comingfromright { 73 .comingfromright {
74 left: 100%; 74 left: 100%;
75 } 75 }
76 76
77 #nextbutton > div { 77 #nextbutton > div {
78 background: url('shared/images/mediaplayer_next.png'); 78 background: url('chrome://resources/images/mediaplayer_next.png');
79 background-repeat: no-repeat; 79 background-repeat: no-repeat;
80 background-position: 4px 8px; 80 background-position: 4px 8px;
81 width: 100%; 81 width: 100%;
82 height: 30px; 82 height: 30px;
83 z-index: 9999; 83 z-index: 9999;
84 } 84 }
85 85
86 button { 86 button {
87 z-index: 9999; 87 z-index: 9999;
88 cursor: pointer; 88 cursor: pointer;
89 width: 28px; 89 width: 28px;
90 height: 30px; 90 height: 30px;
91 webkit-appearance: none; 91 webkit-appearance: none;
92 padding: 0; 92 padding: 0;
93 border: 0; 93 border: 0;
94 background: transparent; 94 background: transparent;
95 } 95 }
96 96
97 button:hover { 97 button:hover {
98 background: -webkit-linear-gradient(#6a7eac, #000000); 98 background: -webkit-linear-gradient(#6a7eac, #000000);
99 } 99 }
100 100
101 </style> 101 </style>
102 <script src="shared/js/local_strings.js"></script> 102 <script src="chrome://resources/js/local_strings.js"></script>
103 <script src="shared/js/media_common.js"></script> 103 <script src="chrome://resources/js/media_common.js"></script>
104 <script> 104 <script>
105 105
106 document.addEventListener('DOMContentLoaded', load); 106 document.addEventListener('DOMContentLoaded', load);
107 107
108 document.onselectstart = function(e) { 108 document.onselectstart = function(e) {
109 e.preventDefault(); 109 e.preventDefault();
110 }; 110 };
111 111
112 function $(o) { 112 function $(o) {
113 return document.getElementById(o); 113 return document.getElementById(o);
114 } 114 }
115 115
116 /////////////////////////////////////////////////////////////////////////////// 116 ///////////////////////////////////////////////////////////////////////////////
117 // Document Functions: 117 // Document Functions:
118 118
119 var currentPicture = null; 119 var currentPicture = null;
120 var prevPicture = null; 120 var prevPicture = null;
121 var currentFileOffset = 0; 121 var currentFileOffset = 0;
122 var filelist; 122 var filelist = [];
123 var moveRight = false; 123 var moveRight = false;
124 var lastimg = null; 124 var lastimg = null;
125 125
126 function loadedPicture() { 126 function loadedPicture() {
127 if (prevPicture) { 127 if (prevPicture) {
128 if (moveRight) { 128 if (moveRight) {
129 prevPicture.style.left = '-100%'; 129 prevPicture.style.left = '-100%';
130 } else { 130 } else {
131 prevPicture.style.left = '100%'; 131 prevPicture.style.left = '100%';
132 } 132 }
133 } 133 }
134 if (window.innerHeight < lastimg.height || 134 if (window.innerHeight < lastimg.height ||
135 window.innerWidth < lastimg.width) { 135 window.innerWidth < lastimg.width) {
136 if (lastimg.width > lastimg.height) { 136 if (lastimg.width > lastimg.height) {
137 lastimg.style.height = 'auto'; 137 lastimg.style.height = 'auto';
138 lastimg.style.width = '100%'; 138 lastimg.style.width = '100%';
139 } else { 139 } else {
140 lastimg.style.width = 'auto'; 140 lastimg.style.width = 'auto';
141 lastimg.style.height = '100%'; 141 lastimg.style.height = '100%';
142 } 142 }
143 } 143 }
144 setTimeout(function() { 144 setTimeout(function() {
145 currentPicture.style.left = '0'; 145 currentPicture.style.left = '0';
146 }, 10); 146 }, 10);
147 } 147 }
148 148
149 function transitionTo(path, fromTheRight) { 149 function transitionTo(filePath, fromTheRight) {
150 if (currentPicture) { 150 if (currentPicture) {
151 if (prevPicture) { 151 if (prevPicture) {
152 $('main').removeChild(prevPicture); 152 $('main').removeChild(prevPicture);
153 } 153 }
154 prevPicture = currentPicture; 154 prevPicture = currentPicture;
155 } 155 }
156 156
157 currentPicture = document.createElement('div'); 157 currentPicture = document.createElement('div');
158 158
159 $('main').appendChild(currentPicture); 159 $('main').appendChild(currentPicture);
160 if (fromTheRight) { 160 if (fromTheRight) {
161 currentPicture.className = 'currentpicture comingfromright'; 161 currentPicture.className = 'currentpicture comingfromright';
162 } else { 162 } else {
163 currentPicture.className = 'currentpicture comingfromleft'; 163 currentPicture.className = 'currentpicture comingfromleft';
164 } 164 }
165 var image = document.createElement('img'); 165 var image = document.createElement('img');
166 lastimg = image; 166 lastimg = image;
167 image.onload = loadedPicture; 167 image.onload = loadedPicture;
168 image.onerror = loadedPicture; 168 image.onerror = loadedPicture;
169 document.location.hash = path; 169 image.src = filePath;
170 image.src = 'file://' + path;
171 currentPicture.appendChild(image); 170 currentPicture.appendChild(image);
172 moveRight = fromTheRight; 171 moveRight = fromTheRight;
173 } 172 }
174 173
175 function browseFileResult(info, results) { 174 function browseFileResult() {
176 filelist = results; 175 currentFileOffset = 0;
177 if (info.currentOffset) { 176 if (filelist.length > 0) {
178 currentFileOffset = info.currentOffset; 177 transitionTo(filelist[currentFileOffset], true);
179 } else {
180 currentFileOffset = 0;
181 } 178 }
182 transitionTo(filelist[currentFileOffset].path, true);
183 } 179 }
184 180
185 function keyPressed(e) { 181 function keyPressed(e) {
186 // Left Pressed 182 // Left Pressed
187 if (e.keyCode == 37) { 183 if (e.keyCode == 37) {
188 if (currentFileOffset > 0) { 184 if (currentFileOffset > 0) {
189 currentFileOffset--; 185 currentFileOffset--;
190 transitionTo(filelist[currentFileOffset].path, false); 186 transitionTo(filelist[currentFileOffset], false);
191 } 187 }
192 } 188 }
193 // Right Pressed 189 // Right Pressed
194 if (e.keyCode == 39) { 190 if (e.keyCode == 39) {
195 if (currentFileOffset < (filelist.length - 1)) { 191 if (currentFileOffset < (filelist.length - 1)) {
196 currentFileOffset++; 192 currentFileOffset++;
197 transitionTo(filelist[currentFileOffset].path, true); 193 transitionTo(filelist[currentFileOffset], true);
198 } 194 }
199 } 195 }
200 } 196 }
201 197
202 function load() { 198 function load() {
203 localStrings = new LocalStrings(); 199 localStrings = new LocalStrings();
204 200
205 document.onkeydown = keyPressed; 201 var views = chrome.extension.getViews();
206 if (document.location.href.indexOf('#') != -1) { 202 for (var i = 0; i < views.length; i++) {
207 var currentpathArray = document.location.href.split('#'); 203 if (views[i].g_slideshow_data) {
208 var path = currentpathArray[1]; 204 filelist = views[i].g_slideshow_data;
209 chrome.send('getChildren', [path]); 205 views[i].g_slideshow_data = null;
206 }
210 } 207 }
208
209 browseFileResult();
211 } 210 }
212 211
213 function prevButtonClick() { 212 function prevButtonClick() {
214 if (currentFileOffset > 0) { 213 if (currentFileOffset > 0) {
215 currentFileOffset--; 214 currentFileOffset--;
216 transitionTo(filelist[currentFileOffset].path, false); 215 transitionTo(filelist[currentFileOffset], false);
217 } 216 }
218 } 217 }
219 218
220 function nextButtonClick() { 219 function nextButtonClick() {
221 if (currentFileOffset < (filelist.length - 1)) { 220 if (currentFileOffset < (filelist.length - 1)) {
222 currentFileOffset++; 221 currentFileOffset++;
223 transitionTo(filelist[currentFileOffset].path, true); 222 transitionTo(filelist[currentFileOffset], true);
224 } 223 }
225 } 224 }
226 225
227 function toggleFullscreen() {
228 chrome.send('toggleFullscreen', ['']);
229 }
230
231 </script> 226 </script>
232 <body> 227 <body onkeydown="keyPressed(event)">
233 <div id="main"></div> 228 <div id="main"></div>
234 <div id="glow"></div> 229 <div id="glow"></div>
235 <div id="playercontrols"> 230 <div id="playercontrols">
236 <button id="prevbutton" onclick="prevButtonClick()"> 231 <button id="prevbutton" onclick="prevButtonClick()">
237 <div></div> 232 <div></div>
238 </button> 233 </button>
239 <button id="nextbutton" onclick="nextButtonClick()"> 234 <button id="nextbutton" onclick="nextButtonClick()">
240 <div></div> 235 <div></div>
241 </button> 236 </button>
242 </div> 237 </div>
243 </body> 238 </body>
244 </html> 239 </html>
OLDNEW
« chrome/browser/resources/file_manager/js/file_manager.js ('K') | « chrome/browser/resources/file_manager/manifest.json ('k') | chrome/browser/resources/shared_resources.grd » ('j') | chrome/browser/resources/shared_resources.grd » ('J')

Powered by Google App Engine
This is Rietveld 408576698