/
dialog.html
109 lines (108 loc) · 2.22 KB
/
dialog.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Example of jQuery Browse</title>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script src="../js/jquery.filebrowser-src.js"></script>
<script src="http://code.jquery.com/ui/1.12.0/jquery-ui.js"></script>
<link href="http://code.jquery.com/ui/1.12.1/themes/dark-hive/jquery-ui.css" rel="stylesheet"/>
<link href="../css/jquery.filebrowser-src.css" rel="stylesheet"/>
<style>
body {
font-size: 10px;
}
.ui-dialog .ui-dialog-content {
padding: 0;
}
</style>
<script>
$(function() {
var env = {
'bin': {
'bash': 'bash content',
'python': 'python content',
'perl': 'perl content',
'find': 'find content',
'share': {
'foo': 'hello foo',
'bar': 'hello bar',
'lib': {
'asd': 'foo bar'
}
}
},
/*
'C:': {
'foo': 'hello foo'
},
//*/
'foo': {
'page.html': '<html></html>',
'style.css': 'body { overflow: scroll; }'
},
'bar.svg': 'Foo',
'baz.txt': 'Hello',
'1.json': '',
'2.js': '',
'3.css': '',
'4.doc': '',
'5.html': '',
'6.pdf': '',
'7.jpg': '',
'8.gif': '',
'9.php': '',
'10.xls': '',
'11.ppt': ''
}
var settings = {
separator: '/',
root: '/'
};
function get(path) {
var current = env;
browse.walk(path, function(file) {
current = current[file];
});
return current;
}
var browse = $('#browser').dialog().browse({
root: '/',
separator: '/',
dir: function(path, callback) {
dir = get(path);
if ($.isPlainObject(dir)) {
var result = {files:[], dirs: []};
Object.keys(dir).forEach(function(key) {
if (typeof dir[key] == 'string') {
result.files.push(key);
} else if ($.isPlainObject(dir[key])) {
result.dirs.push(key);
}
});
callback(result);
}
},
item_class: function(path, name) {
return name.match(/[A-Z]:/) ? 'drive' : '';
},
open: function(filename) {
var file = get(filename);
if (typeof file == 'string') {
alert(file);
} else {
throw new Error('Invalid filename');
}
},
on_change: function() {
$('#path').val(this.path());
}
});
});
</script>
</head>
<input id="path"/>
<div id="browser"></div>
<body>
</body>
</html>