← Back to branch summary

~azzar1/unity/add-show-desktop-key

« back to all changes in this revision

Viewing changes to www/media/browser/browser.js

  • Committer: mattgiuca
  • Date: 2008-01-11 07:10:18 UTC
  • Revision ID: svn-v3-trunk0:2b9c9e99-6f39-0410-b283-7f802c844ae2:trunk:185
Integrated the (second) Prototype browser (HTML+CSS but no code) into the main
filebrowser app. Note that this still is non-functional - it looks the same as
the original prototype.
browser: Added the full HTML source (including example rows) into the Python
code. (Note this will be a lot cleaner once example rows are removed).
media: Added "images" directory (copied from the demo). This contains all the
icons needed for the demo.
       browser.css: Pasted the entire CSS from the demo. This styles the
        browser interface.

Show diffs side-by-side

added added

removed removed

Lines of Context:
www/media/browser/browser.js
20
20
 * Date: 11/1/2008
21
21
 */
22
22
 
23
 
/* Url names for apps */
24
 
this_app = "files";
25
 
edit_app = "edit";
26
 
service_app = "fileservice";
27
 
serve_app = "serve";
28
 
download_app = "download";
29
 
 
30
23
/* Mapping MIME types onto handlers.
31
24
 * "text" : When navigating to a text file, the text editor is opened.
32
25
 * "image" : When navigating to an image, the image is displayed (rather than
46
39
    "application/xml" : "text",
47
40
};
48
41
 
49
 
/* Mapping MIME types to icons, just the file's basename */
50
 
type_icons = {
51
 
    "text/directory": "dir.png",
52
 
    "text/x-python": "py.png",
53
 
};
54
 
 
55
 
default_type_icon = "txt.png";
56
 
 
57
 
/* Relative to IVLE root */
58
 
type_icons_path = "media/images/mime";
59
 
type_icons_path_large = "media/images/mime/large";
60
 
 
61
 
/* Mapping SVN status to icons, just the file's basename */
62
 
svn_icons = {
63
 
    "unversioned": null,
64
 
    "normal": "normal.png",
65
 
    "added": "added.png",
66
 
    "missing": "missing.png",
67
 
    "deleted": "deleted.png",
68
 
    "modified": "modified.png",
69
 
};
70
 
 
71
 
/* Mapping SVN status to "nice" strings */
72
 
svn_nice = {
73
 
    "unversioned": "Temporary file",
74
 
    "normal": "Permanent file",
75
 
    "added": "Temporary file (scheduled to be added)",
76
 
    "missing": "Permanent file (missing)",
77
 
    "deleted": "Permanent file (scheduled for deletion)",
78
 
    "replaced": "Permanent file (replaced)",
79
 
    "modified": "Permanent file (modified)",
80
 
    "merged": "Permanent file (merged)",
81
 
    "conflicted": "Permanent file (conflicted)",
82
 
};
83
 
 
84
 
default_svn_icon = null;
85
 
default_svn_nice = "Unknown status";
86
 
 
87
 
svn_icons_path = "media/images/svn";
88
 
 
89
42
/* List of MIME types considered "executable" by the system.
90
43
 * Executable files offer a "run" link, implying that the "serve"
91
44
 * application can interpret them.
94
47
    "text/x-python",
95
48
];
96
49
 
97
 
 
98
 
/* Global variables */
99
 
 
100
 
current_path = "";
101
 
 
102
50
/** Calls the server using Ajax, performing an action on the server side.
103
51
 * Receives the response from the server and performs a refresh of the page
104
52
 * contents, updating it to display the returned data (such as a directory
122
70
{
123
71
    args.action = action;
124
72
    /* Call the server and perform the action. This mutates the server. */
125
 
    response = ajax_call(service_app, path, args, "POST", content_type);
 
73
    response = ajax_call("fileservice", path, args, "POST", content_type);
126
74
    /* Check for action errors reported by the server, and report them to the
127
75
     * user */
128
76
    error = response.getResponseHeader("X-IVLE-Action-Error");
139
87
 * Called "navigate", can also be used for a simple refresh.
140
88
 * Always makes a GET request.
141
89
 * No return value.
142
 
 * \param editmode Optional boolean. If true, then the user navigated here
143
 
 * with an "edit" URL so we should favour using the editor.
144
90
 */
145
 
function navigate(path, editmode)
 
91
function navigate(path)
146
92
{
147
93
    /* Call the server and request the listing. This mutates the server. */
148
 
    response = ajax_call(service_app, path, null, "GET");
 
94
    response = ajax_call("fileservice", path, null, "GET");
149
95
    /* Now read the response and set up the page accordingly */
150
 
    handle_response(path, response, editmode);
151
 
}
152
 
 
153
 
/** Determines the "handler type" from a MIME type.
154
 
 * The handler type is a string, either "text", "image", "audio" or "binary".
155
 
 */
156
 
function get_handler_type(content_type)
157
 
{
158
 
    if (!content_type)
159
 
        return null;
160
 
    if (content_type in type_handlers)
161
 
        return type_handlers[content_type];
162
 
    else
163
 
    {   /* Based on the first part of the MIME type */
164
 
        var handler_type = content_type.split('/')[0];
165
 
        if (handler_type != "text" && handler_type != "image" &&
166
 
            handler_type != "audio")
167
 
            handler_type = "binary";
168
 
        return handler_type;
169
 
    }
 
96
    handle_response(path, response);
170
97
}
171
98
 
172
99
/** Given an HTTP response object, cleans up and rebuilds the contents of the
179
106
 * things) be used to update the URL in the location bar.
180
107
 * \param response XMLHttpRequest object returned by the server. Should
181
108
 * contain all the response data.
182
 
 * \param editmode Optional boolean. If true, then the user navigated here
183
 
 * with an "edit" URL so we should favour using the editor.
184
109
 */
185
 
function handle_response(path, response, editmode)
 
110
function handle_response(path, response)
186
111
{
187
112
    /* TODO: Set location bar to "path" */
188
 
    current_path = path;
189
 
 
190
 
    /* Clear away the existing page contents */
191
 
    clearpage();
192
 
    /* Display the path at the top, for navigation */
193
 
    presentpath(path);
194
 
 
195
113
    /* Check the status, and if not 200, read the error and handle this as an
196
114
     * error. */
197
115
    if (response.status != 200)
204
122
    }
205
123
 
206
124
    /* Check if this is a directory listing or file contents */
207
 
    var isdir = response.getResponseHeader("X-IVLE-Return") == "Dir";
208
 
    if (!editmode && isdir)
 
125
    if (response.getResponseHeader("X-IVLE-Return") == "Dir")
209
126
    {
210
127
        var listing = response.responseText;
211
128
        /* The listing SHOULD be valid JSON text. Parse it into an object. */
224
141
    {
225
142
        /* Treat this as an ordinary file. Get the file type. */
226
143
        var content_type = response.getResponseHeader("Content-Type");
227
 
        var handler_type = get_handler_type(content_type);
228
 
        /* If we're in "edit mode", always treat this file as text */
229
 
        would_be_handler_type = handler_type;
230
 
        if (editmode) handler_type = "text";
 
144
        var handler_type;
 
145
        if (content_type in type_handlers)
 
146
            handler_type = type_handlers[content_type];
 
147
        else
 
148
        {   /* Based on the first part of the MIME type */
 
149
            handler_type = content_type.split('/')[0];
 
150
            if (handler_type != "text" && handler_type != "image" &&
 
151
                handler_type != "audio")
 
152
                handler_type = "binary";
 
153
        }
231
154
        /* handler_type should now be set to either
232
155
         * "text", "image", "audio" or "binary". */
233
156
        switch (handler_type)
234
157
        {
235
158
        case "text":
236
 
            if (isdir)
237
 
            {
238
 
                handle_text(path_join(path, "untitled"), "",
239
 
                    would_be_handler_type);
240
 
            }
241
 
            else
242
 
            {
243
 
                handle_text(path, response.responseText,
244
 
                    would_be_handler_type);
245
 
            }
 
159
            handle_text(path, response.responseText);
246
160
            break;
247
161
        case "image":
248
162
            /* TODO: Custom image handler */
259
173
    }
260
174
}
261
175
 
262
 
/** Deletes all "dynamic" content on the page.
263
 
 * This returns the page back to the state it is in when the HTML arrives to
264
 
 * the browser, ready for another handler to populate it.
265
 
 */
266
 
function clearpage()
267
 
{
268
 
    dom_removechildren(document.getElementById("path"));
269
 
    dom_removechildren(document.getElementById("filesbody"));
270
 
}
271
 
 
272
 
/** Deletes all "dynamic" content on the page necessary to navigate from
273
 
 * one directory listing to another (does not clear as much as clearpage
274
 
 * does).
275
 
 * This is the equivalent of calling clearpage() then
276
 
 * setup_for_dir_listing(), assuming the page is already on a dir listing.
277
 
 */
278
 
function clearpage_dir()
279
 
{
280
 
    dom_removechildren(document.getElementById("path"));
281
 
    dom_removechildren(document.getElementById("files"));
282
 
    dom_removechildren(document.getElementById("sidepanel"));
283
 
}
284
 
 
285
 
/** Sets the mode to either "file browser" or "text editor" mode.
286
 
 * This modifies the window icon, and selected tab.
287
 
 * \param editmode If True, editor mode. Else, file browser mode.
288
 
 */
289
 
function setmode(editmode)
290
 
{
291
 
    /* Find the DOM elements for the file browser and editor tabs */
292
 
    var tabs = document.getElementById("apptabs");
293
 
    var tab_files = null;
294
 
    var tab_edit = null;
295
 
    var a;
296
 
    var href;
297
 
    for (var i=0; i<tabs.childNodes.length; i++)
298
 
    {
299
 
        /* Find the href of the link within */
300
 
        if (!tabs.childNodes[i].getElementsByTagName) continue;
301
 
        a = tabs.childNodes[i].getElementsByTagName("a");
302
 
        if (a.length == 0) continue;
303
 
        href = a[0].getAttribute("href");
304
 
        if (href == null) continue;
305
 
        if (endswith(href, this_app))
306
 
            tab_files = tabs.childNodes[i];
307
 
        else if (endswith(href, edit_app))
308
 
            tab_edit = tabs.childNodes[i];
309
 
    }
310
 
 
311
 
    if (editmode)
312
 
    {
313
 
        tab_files.removeAttribute("class");
314
 
        tab_edit.setAttribute("class", "thisapp");
315
 
    }
316
 
    else
317
 
    {
318
 
        tab_edit.removeAttribute("class");
319
 
        tab_files.setAttribute("class", "thisapp");
320
 
    }
321
 
}
322
 
 
323
176
/*** HANDLERS for different types of responses (such as dir listing, file,
324
177
 * etc). */
325
178
 
326
179
function handle_error(message)
327
180
{
328
 
    setmode(false);
329
 
    var files = document.getElementById("filesbody");
330
 
    var txt_elem = dom_make_text_elem("div", "Error: "
331
 
        + message.toString() + ".")
332
 
    txt_elem.setAttribute("class", "padding error");
333
 
    files.appendChild(txt_elem);
334
 
}
335
 
 
336
 
/** Presents a path list (address bar inside the page) for clicking.
337
 
 */
338
 
function presentpath(path)
339
 
{
340
 
    var dom_path = document.getElementById("path");
341
 
    var href_path = make_path(this_app);
342
 
    var nav_path = "";
343
 
    var dir;
344
 
 
345
 
    /* Also set the document title */
346
 
    document.title = path_basename(path) + " - IVLE";
347
 
    /* Create all of the paths */
348
 
    var pathlist = path.split("/");
349
 
    for (var i=0; i<pathlist.length; i++)
350
 
    {
351
 
        dir = pathlist[i];
352
 
        if (dir == "") continue;
353
 
        /* Make an 'a' element */
354
 
        href_path = path_join(href_path, dir);
355
 
        nav_path = path_join(nav_path, dir);
356
 
        var link = dom_make_link_elem("a", dir, "Navigate to " + nav_path,
357
 
                href_path/*, "navigate(" + repr(href_path) + ")"*/);
358
 
        dom_path.appendChild(link);
359
 
        dom_path.appendChild(document.createTextNode("/"));
360
 
    }
361
 
    dom_path.removeChild(dom_path.lastChild);
362
 
}
363
 
 
364
 
/** Given a mime type, returns the path to the icon.
365
 
 * \param type String, Mime type.
366
 
 * \param sizelarge Boolean, optional.
367
 
 * \return Path to the icon. Has applied make_path, so it is relative to site
368
 
 * root.
369
 
 */
370
 
function mime_type_to_icon(type, sizelarge)
371
 
{
372
 
    var filename;
373
 
    if (type in type_icons)
374
 
        filename = type_icons[type];
375
 
    else
376
 
        filename = default_type_icon;
377
 
    if (sizelarge)
378
 
        return make_path(path_join(type_icons_path_large, filename));
379
 
    else
380
 
        return make_path(path_join(type_icons_path, filename));
381
 
}
382
 
 
383
 
/** Given an svnstatus, returns the path to the icon.
384
 
 * \param type String, svn status.
385
 
 * \return Path to the icon. Has applied make_path, so it is relative to site
386
 
 * root. May return null to indicate no SVN icon.
387
 
 */
388
 
function svnstatus_to_icon(svnstatus)
389
 
{
390
 
    var filename;
391
 
    if (svnstatus in svn_icons)
392
 
        filename = svn_icons[svnstatus];
393
 
    else
394
 
        filename = default_svn_icon;
395
 
    if (filename == null) return null;
396
 
    return make_path(path_join(svn_icons_path, filename));
397
 
}
398
 
 
399
 
/** Given an svnstatus, returns the "nice" string.
400
 
 */
401
 
function svnstatus_to_string(svnstatus)
402
 
{
403
 
    if (svnstatus in svn_nice)
404
 
        return svn_nice[svnstatus];
405
 
    else
406
 
        return default_svn_nice;
 
181
    /* TODO: Rather than alert, rebuild the page into a page showing an error
 
182
     * message */
 
183
    alert("Error: " + message.toString() + ".");
 
184
}
 
185
 
 
186
/** Presents the directory listing.
 
187
 */
 
188
function handle_dir_listing(path, listing)
 
189
{
 
190
    /* TODO */
 
191
    alert(listing);
 
192
}
 
193
 
 
194
/** Presents the text editor.
 
195
 */
 
196
function handle_text(path, text)
 
197
{
 
198
    /* TODO */
 
199
    alert(text);
407
200
}
408
201
 
409
202
/** Displays a download link to the binary file.
410
203
 */
411
204
function handle_binary(path)
412
205
{
413
 
    setmode(false);
414
 
    var files = document.getElementById("filesbody");
415
 
    var div = document.createElement("div");
416
 
    files.appendChild(div);
417
 
    div.setAttribute("class", "padding");
418
 
    var download_link = app_path(download_app, path);
419
 
    var par1 = dom_make_text_elem("p",
420
 
        "The file " + path + " is a binary file. To download this file, " +
421
 
        "click the following link:");
422
 
    var par2 = dom_make_link_elem("p",
423
 
        "Download " + path, "Download " + path, download_link);
424
 
    div.appendChild(par1);
425
 
    div.appendChild(par2);
 
206
    /* TODO */
 
207
    alert(path);
426
208
}
427
209
 
428
210
/** Called when the page loads initially.
429
211
 */
430
212
window.onload = function()
431
213
{
432
 
    /* Navigate (internally) to the path in the URL bar.
433
 
     * This causes the page to be populated with whatever is at that address,
434
 
     * whether it be a directory or a file.
435
 
     */
436
 
    var path = parse_url(window.location.href).path;
437
 
    /* Strip out root_dir + "/files" from the front of the path */
438
 
    var strip = make_path(this_app);
439
 
    var editmode = false;
440
 
    if (path.substr(0, strip.length) == strip)
441
 
        path = path.substr(strip.length+1);
442
 
    else
443
 
    {
444
 
        /* See if this is an edit path */
445
 
        strip = make_path(edit_app);
446
 
        if (path.substr(0, strip.length) == strip)
447
 
        {
448
 
            path = path.substr(strip.length+1);
449
 
            editmode = true;
450
 
        }
451
 
    }
452
 
 
453
 
    if (path.length == 0)
454
 
    {
455
 
        /* Navigate to the user's home directory by default */
456
 
        /* TEMP? */
457
 
        path = username;
458
 
    }
459
 
 
460
 
    navigate(path, editmode);
461
214
}