~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-15 03:06:54 UTC
  • Revision ID: svn-v3-trunk0:2b9c9e99-6f39-0410-b283-7f802c844ae2:trunk:229
Images: Reduced "small" icons from 22x22 to 16x16. Reduced "large" icons from
    128x128 to 96x96.
Changed some of the icons for Subversion so they make a bit more sense.
    (Missing and deleted are now distinct).
Modified JavaScript and CSS so the interface flows with 16x16 icons instead of
22. This makes each file vertically a lot shorter.
Made the bands of colour in the file listing much closer together in colour.

Show diffs side-by-side

added added

removed removed

Lines of Context:
 
1
/* IVLE - Informatics Virtual Learning Environment
 
2
 * Copyright (C) 2007-2008 The University of Melbourne
 
3
 *
 
4
 * This program is free software; you can redistribute it and/or modify
 
5
 * it under the terms of the GNU General Public License as published by
 
6
 * the Free Software Foundation; either version 2 of the License, or
 
7
 * (at your option) any later version.
 
8
 *
 
9
 * This program is distributed in the hope that it will be useful,
 
10
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 
11
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 
12
 * GNU General Public License for more details.
 
13
 *
 
14
 * You should have received a copy of the GNU General Public License
 
15
 * along with this program; if not, write to the Free Software
 
16
 * Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA  02110-1301  USA
 
17
 *
 
18
 * Module: File Browser (client)
 
19
 * Author: Matt Giuca
 
20
 * Date: 11/1/2008
 
21
 */
 
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
/* Mapping MIME types onto handlers.
 
31
 * "text" : When navigating to a text file, the text editor is opened.
 
32
 * "image" : When navigating to an image, the image is displayed (rather than
 
33
 *              going to the text editor).
 
34
 * "audio" : When navigating to an audio file, a "play" button is presented.
 
35
 * "binary" : When navigating to a binary file, offer it as a download through
 
36
 *              "serve".
 
37
 *
 
38
 * If a file is not on the list, its default action is determined by the first
 
39
 * part of its content type, where "text/*", "image/*" and "audio/*" are
 
40
 * treated as above, and other types are simply treated as binary.
 
41
 */
 
42
type_handlers = {
 
43
    "application/x-javascript" : "text",
 
44
    "application/javascript" : "text",
 
45
    "application/json" : "text",
 
46
    "application/xml" : "text",
 
47
};
 
48
 
 
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": "unversioned.png",
 
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 = "modified.png";
 
85
default_svn_nice = "Unknown status";
 
86
 
 
87
svn_icons_path = "media/images/svn";
 
88
 
 
89
/* List of MIME types considered "executable" by the system.
 
90
 * Executable files offer a "run" link, implying that the "serve"
 
91
 * application can interpret them.
 
92
 */
 
93
types_exec = [
 
94
    "text/x-python",
 
95
];
 
96
 
 
97
 
 
98
/* Global variables */
 
99
 
 
100
current_path = "";
 
101
 
 
102
/** Calls the server using Ajax, performing an action on the server side.
 
103
 * Receives the response from the server and performs a refresh of the page
 
104
 * contents, updating it to display the returned data (such as a directory
 
105
 * listing, file preview, or editor pane).
 
106
 * Always makes a POST request.
 
107
 * No return value.
 
108
 *
 
109
 * \param action String. Name of the action to perform, as defined in the
 
110
 *     fileservice API.
 
111
 * \param path URL path to make the request to, within the application.
 
112
 * \param args Argument object, as described in util.parse_url and friends.
 
113
 *      This should contain the arguments to the action, but NOT the action
 
114
 *      itself. (Also a minor side-effect; the "args" object will be mutated
 
115
 *      to include the action attribute).
 
116
 * \param content_type String, optional.
 
117
 *      May be "application/x-www-form-urlencoded" or "multipart/form-data".
 
118
 *      Defaults to "application/x-www-form-urlencoded".
 
119
 *      "multipart/form-data" is recommended for large uploads.
 
120
 */
 
121
function do_action(action, path, args, content_type)
 
122
{
 
123
    args.action = action;
 
124
    /* Call the server and perform the action. This mutates the server. */
 
125
    response = ajax_call(service_app, path, args, "POST", content_type);
 
126
    /* Check for action errors reported by the server, and report them to the
 
127
     * user */
 
128
    error = response.getResponseHeader("X-IVLE-Action-Error");
 
129
    if (error != null)
 
130
        alert("Error: " + error.toString() + ".");
 
131
    /* Now read the response and set up the page accordingly */
 
132
    handle_response(path, response);
 
133
}
 
134
 
 
135
/** Calls the server using Ajax, requesting a directory listing. This should
 
136
 * not modify the server in any way. Receives the response from the server and
 
137
 * performs a refresh of the page contents, updating it to display the
 
138
 * returned data (such as a directory listing, file preview, or editor pane).
 
139
 * Called "navigate", can also be used for a simple refresh.
 
140
 * Always makes a GET request.
 
141
 * 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
 */
 
145
function navigate(path, editmode)
 
146
{
 
147
    /* Call the server and request the listing. This mutates the server. */
 
148
    response = ajax_call(service_app, path, null, "GET");
 
149
    /* 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
    }
 
170
}
 
171
 
 
172
/** Given an HTTP response object, cleans up and rebuilds the contents of the
 
173
 * page using the response data. This does not navigate away from the page, it
 
174
 * merely rebuilds most of the data.
 
175
 * Note that depending on the type of data returned, this could result in a
 
176
 * directory listing, an image preview, an editor pane, etc.
 
177
 * Figures out the type and calls the appropriate function.
 
178
 * \param path URL path which the request was made for. This can (among other
 
179
 * things) be used to update the URL in the location bar.
 
180
 * \param response XMLHttpRequest object returned by the server. Should
 
181
 * 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
 */
 
185
function handle_response(path, response, editmode)
 
186
{
 
187
    /* 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
    /* Check the status, and if not 200, read the error and handle this as an
 
196
     * error. */
 
197
    if (response.status != 200)
 
198
    {
 
199
        var error = response.getResponseHeader("X-IVLE-Return-Error");
 
200
        if (error == null)
 
201
            error = response.statusText;
 
202
        handle_error(error);
 
203
        return;
 
204
    }
 
205
 
 
206
    /* Check if this is a directory listing or file contents */
 
207
    var isdir = response.getResponseHeader("X-IVLE-Return") == "Dir";
 
208
    if (!editmode && isdir)
 
209
    {
 
210
        var listing = response.responseText;
 
211
        /* The listing SHOULD be valid JSON text. Parse it into an object. */
 
212
        try
 
213
        {
 
214
            listing = JSON.parse(listing);
 
215
        }
 
216
        catch (e)
 
217
        {
 
218
            handle_error("The server returned an invalid directory listing");
 
219
            return;
 
220
        }
 
221
        handle_dir_listing(path, listing);
 
222
    }
 
223
    else
 
224
    {
 
225
        /* Treat this as an ordinary file. Get the file type. */
 
226
        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";
 
231
        /* handler_type should now be set to either
 
232
         * "text", "image", "audio" or "binary". */
 
233
        switch (handler_type)
 
234
        {
 
235
        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
            }
 
246
            break;
 
247
        case "image":
 
248
            /* TODO: Custom image handler */
 
249
            handle_binary(path, response.responseText);
 
250
            break;
 
251
        case "audio":
 
252
            /* TODO: Custom audio handler */
 
253
            handle_binary(path, response.responseText);
 
254
            break;
 
255
        case "binary":
 
256
            handle_binary(path);
 
257
            break;
 
258
        }
 
259
    }
 
260
}
 
261
 
 
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
/*** HANDLERS for different types of responses (such as dir listing, file,
 
324
 * etc). */
 
325
 
 
326
function handle_error(message)
 
327
{
 
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
 
 
344
    /* Also set the document title */
 
345
    document.title = path_basename(path) + " - IVLE";
 
346
    /* Create all of the paths */
 
347
    for each (var dir in path.split("/"))
 
348
    {
 
349
        if (dir == "") continue;
 
350
        /* Make an 'a' element */
 
351
        href_path = path_join(href_path, dir);
 
352
        nav_path = path_join(nav_path, dir);
 
353
        var link = dom_make_link_elem("a", dir, "Navigate to " + nav_path,
 
354
                href_path/*, "navigate(" + repr(href_path) + ")"*/);
 
355
        dom_path.appendChild(link);
 
356
        dom_path.appendChild(document.createTextNode("/"));
 
357
    }
 
358
    dom_path.removeChild(dom_path.lastChild);
 
359
}
 
360
 
 
361
/** Given a mime type, returns the path to the icon.
 
362
 * \param type String, Mime type.
 
363
 * \param sizelarge Boolean, optional.
 
364
 * \return Path to the icon. Has applied make_path, so it is relative to site
 
365
 * root.
 
366
 */
 
367
function mime_type_to_icon(type, sizelarge)
 
368
{
 
369
    var filename;
 
370
    if (type in type_icons)
 
371
        filename = type_icons[type];
 
372
    else
 
373
        filename = default_type_icon;
 
374
    if (sizelarge)
 
375
        return make_path(path_join(type_icons_path_large, filename));
 
376
    else
 
377
        return make_path(path_join(type_icons_path, filename));
 
378
}
 
379
 
 
380
/** Given an svnstatus, returns the path to the icon.
 
381
 * \param type String, svn status.
 
382
 * \return Path to the icon. Has applied make_path, so it is relative to site
 
383
 * root.
 
384
 */
 
385
function svnstatus_to_icon(svnstatus)
 
386
{
 
387
    var filename;
 
388
    if (svnstatus in svn_icons)
 
389
        filename = svn_icons[svnstatus];
 
390
    else
 
391
        filename = default_svn_icon;
 
392
    return make_path(path_join(svn_icons_path, filename));
 
393
}
 
394
 
 
395
/** Given an svnstatus, returns the "nice" string.
 
396
 */
 
397
function svnstatus_to_string(svnstatus)
 
398
{
 
399
    if (svnstatus in svn_nice)
 
400
        return svn_nice[svnstatus];
 
401
    else
 
402
        return default_svn_nice;
 
403
}
 
404
 
 
405
/** Displays a download link to the binary file.
 
406
 */
 
407
function handle_binary(path)
 
408
{
 
409
    setmode(false);
 
410
    var files = document.getElementById("filesbody");
 
411
    var div = document.createElement("div");
 
412
    files.appendChild(div);
 
413
    div.setAttribute("class", "padding");
 
414
    var download_link = app_path(download_app, path);
 
415
    var par1 = dom_make_text_elem("p",
 
416
        "The file " + path + " is a binary file. To download this file, " +
 
417
        "click the following link:");
 
418
    var par2 = dom_make_link_elem("p",
 
419
        "Download " + path, "Download " + path, download_link);
 
420
    div.appendChild(par1);
 
421
    div.appendChild(par2);
 
422
}
 
423
 
 
424
/** Called when the page loads initially.
 
425
 */
 
426
window.onload = function()
 
427
{
 
428
    /* Navigate (internally) to the path in the URL bar.
 
429
     * This causes the page to be populated with whatever is at that address,
 
430
     * whether it be a directory or a file.
 
431
     */
 
432
    var path = parse_url(window.location.href).path;
 
433
    /* Strip out root_dir + "/files" from the front of the path */
 
434
    var strip = make_path(this_app);
 
435
    var editmode = false;
 
436
    if (path.substr(0, strip.length) == strip)
 
437
        path = path.substr(strip.length+1);
 
438
    else
 
439
    {
 
440
        /* See if this is an edit path */
 
441
        strip = make_path(edit_app);
 
442
        if (path.substr(0, strip.length) == strip)
 
443
        {
 
444
            path = path.substr(strip.length+1);
 
445
            editmode = true;
 
446
        }
 
447
    }
 
448
 
 
449
    if (path.length == 0)
 
450
    {
 
451
        /* Navigate to the user's home directory by default */
 
452
        /* TEMP? */
 
453
        path = username;
 
454
    }
 
455
 
 
456
    navigate(path, editmode);
 
457
}