0x2620/cablegates
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity
cablegates/pandora/static/js/ui.js

1156 lines
42 KiB
JavaScript
Raw Normal View History

testing interface, more work on backend
2009-10-04 22:00:08 +00:00
$(function() {
Ox.initLoading();
app is called pandora now
2010-06-24 13:18:33 +00:00
var pandora = new Ox.App({
site.js, cleanup stream names again
2010-02-08 10:26:25 +00:00
requestURL: "/api/"
}),
$dialog = new Ox.Dialog({
title: "Application Error",
buttons: [
{
value: "Change Title",
click: function() {
Ox.print("click to change title")
$dialog.options({
title: "New Title"
});
$dialog.$buttons[0].toggleDisabled();
}
},
{
value: "Close",
click: function() {
$dialog.close();
}
}
]
});
testing interface, more work on backend
2009-10-04 22:00:08 +00:00
var user = {
username: "",
group: "guest", // guest / user / vip / admin
prefs: {
find: "all",
groupMovies: "country",
orderMovies: "ascending",
orderGroups: "descending",
showGroups: true,
showInfo: true,
showMovies: true,
showSidebar: true,
sortMovies: "director",
sortGroups: "items",
useOxdbPosters: false,
useGroups: true,
viewMovies: "list",
viewIcons: "poster",
}
}
Ox.Location.set("find", {
s: user.prefs.sortMovies,
o: user.prefs.orderMovies
})
var $body = $("body");
var aspectRatio = 4 / 3;
var foo = {
id: "foo",
title: ["Show Window", "Hide Window"],
disabled: true,
checked: false,
group: "foo",
shortcut: "ALT ESCAPE", // $(this).bind("OxKeyboardAltEscape", function() { $(this).trigger("click"); })
click: function() {
},
bind: [
["OxUserLogin", function(e) {
$(this).setTitle("User:" + e.user)
}],
["OxResizeWindow", function() {
$(this).toggleChecked();
$(this).toggleDisabled();
$(this).toggleTitle();
}]
],
trigger: true // $("*").trigger("OxMenuUserLogin") // or trigger({ "type: OxMenuGroupname", item: Item })
}
var m = [
app is called pandora now
2010-06-24 13:18:33 +00:00
["pandora", "Pandora", [
["about", "About Pandora", {
testing interface, more work on backend
2009-10-04 22:00:08 +00:00
click: loadPage
}],
[],
["faq", "Frequently Asked Questions", {
click: loadPage
}],
["tos", "Terms of Service", {
click: loadPage
}],
["sas", "Security Advisory System", {
click: loadPage
}],
[],
["contact", "Contact", {
click: loadPage
}],
[],
["technology", "Technology", {
click: loadPage
}],
["source", "Source Code", {
click: loadPage
}],
["report", "Report a Bug...", {
click: loadPage
}]
]],
["user", "User", [
["user", "User: not logged in", {
disabled: true,
bind: [
["OxLogin", function() {
$(this).setTitle("User: " + e.username)
}],
["OxLogout", function() {
$(this).toggleTitle();
}]
]
}],
[],
["account", "Account", {
disabled: true,
click: loadPage
}],
["preferences", "Preferences", {
disabled: true,
shortcut: "CONTROL ,",
click: loadPage
}],
[],
["login", ["Login", "Logout"], {
click: loadDialog,
bind: [
["OxLogin", function() {
$(this).toggleTitle();
}],
["OxLogout", function() {
$(this).toggleTitle();
}]
]
}]
]],
["list", "List", [
["history", "History", [
["All Movies", "All Movies", {}]
]],
["viewFilter", "View Filter", [
["Most Viewed", "Most Viewed", {}],
["Recently Viewed", "Recently Viewed", {}]
]],
["viewList", "View List", [
["Favorites", "Favorites", {}]
]],
["viewFeature", "View Feature", [
["Situationist Film", "Situationist Film", {}],
["Timelines", "Timelines", {}],
]],
[],
["newList", "New List...", {
disabled: true,
shortcut: "CONTROL N",
click: loadDialog
}],
["newListFromSelection", "New List from Selection...", {
disabled: true,
shortcut: "SHIFT CONTROL N",
click: loadDialog
}],
["newFilter", "New Filter...", {
disabled: true,
shortcut: "ALT CONTROL N",
click: loadDialog
}],
[],
["add", "Add Selected Movie to List...", {
disabled: true
}],
[],
["set", "Set Poster Frame", {
disabled: true
}]
]],
["edit", "Edit", [
["undo", "Undo", {
disabled: true,
shortcut: "CONTROL Z"
}],
["redo", "Redo", {
disabled: true,
shortcut: "SHIFT CONTROL Z"
}],
[],
["cut", "Cut", {
disabled: true,
shortcut: "CONTROL X"
}],
["copy", "Copy", {
disabled: true,
shortcut: "CONTROL C"
}],
["paste", "Paste", {
disabled: true,
shortcut: "CONTROL V"
}],
["delete", "Delete", {
disabled: true,
shortcut: "DELETE"
}],
[],
["all", "Select All", {
disabled: true,
shortcut: "CONTROL A"
}],
["none", "Select None", {
disabled: true,
shortcut: "SHIFT CONTROL A"
}],
["invert", "Invert Selection", {
disabled: true,
shortcut: "ALT CONTROL A"
}],
]],
["view", "View", [
["movies", "View Movies", getMenuGroupItems("viewMovies", [
"as List",
"as Icons",
"with Clips",
"with Timelines",
"with Maps",
"",
"as Scenes",
"on Map",
"on Calendar"
])],
["icons", "Icons", getMenuGroupItems("viewIcons", [
"Poster",
"Still",
"Timeline"
])],
["info", "Info", getMenuGroupItems("viewInfo", [
"Poster",
"Video"
])],
[],
["open", "Open Movie", [
["info", "Info", {
shortcut: "CONTROL RETURN"
}],
["poster", "Statistics", {}],
["scenes", "Clips", {}],
["editor", "Timeline", {}],
["map", "Map", {}],
["calendar", "Calendar", {}],
[],
["files", "Files", {}]
]],
["preview", "Preview", { shortcut: "CONTROL SPACE" }],
[],
["toggleSidebar", ["Hide Sidebar", "Show Sidebar"], {
shortcut: "SHIFT S"
}],
["toggleInfo", ["Hide Info", "Show Info"], {
shortcut: "SHIFT I"
}],
["toggleGroups", ["Hide Groups", "Show Groups"], {
shortcut: "SHIFT G"
}],
["toggleMovies", ["Hide Movies", "show Movies"], {
disabled: true,
shortcut: "SHIFT M"
}],
]],
["sort", "Sort", [
["sortMovies", "Sort Movies by", getMenuGroupItems("sortMovies", [
"Title",
"Director",
"Country",
"Year",
"Runtime",
"Language",
"Writer",
"Producer",
"Cinematographer",
"Editor",
"Cast",
"Genre",
"Keywords",
"Release Date",
"Budget",
"Gross",
"Profit",
"Rating",
"Votes",
"Connections",
"Locations",
"ID",
"",
"Aspect Ratio",
"Duration",
"Color",
"Saturation",
"Brightness",
"Volume",
"Clips",
"Cuts",
"Cuts per Minute",
"Words",
"Words per Minute",
"",
"Resolution",
"Pixels",
"Size",
"Bitrate",
"Files",
"Filename",
"Date Published",
"Date Modified"
])],
["orderMovies", "Order Movies", getMenuGroupItems("orderMovies", [
"Ascending",
"Descending"
])],
[],
["groups", "Use Groups", {
checked: true
}],
["groupMovies", "Group Movies by", getMenuGroupItems("groupMovies", [
"Director",
"Country",
"Year",
"Language",
"Genre"
])],
["sortGroups", "Sort Groups by", getMenuGroupItems("sortGroups", [
"Name",
"Number of Movies"
])],
["orderGroups", "Order Groups", getMenuGroupItems("orderGroups", [
"Ascending",
"Descending"
])]
]],
["find", "Find", [
["find", "Find", getMenuGroupItems("find", [
"All",
"Title",
"Director",
"Country",
"Year",
"Language",
"Writer",
"Producer",
"Cinematographer",
"Editor",
"Cast",
"Name",
"Genre",
"Keyword",
"Summary",
"Trivia",
"Dialog"
])],
[],
["advanced", "Advanced Find...", {}]
]],
["help", "Help", [
app is called pandora now
2010-06-24 13:18:33 +00:00
["help", "Pandora Help", {
testing interface, more work on backend
2009-10-04 22:00:08 +00:00
shortcut: "SHIFT ?"
}]
]]
];
function getMenuGroupItems(group, titles) {
var items = [];
$.each(titles, function(i, v) {
if (v) {
//v.replace(/(^[as|on] )/, "");
var id = v.replace("as ", "").replace("with ", "").replace(" of Movies", "").replace(" ", "").toLowerCase();
items.push([id, v, {
group: group,
checked: user.prefs[group] == id,
bind: [group, function(e) {
if (e.sort == id) {
Ox.topMenu.toggleChecked("sort/" + group + "/" + id);
}
}]
}]);
} else {
items.push([]);
}
});
if (group == "viewMovies") {
items.push([]),
items.push(["rss", "RSS", {}]);
items.push(["json", "JSON", {}]);
}
if (group == "viewIcons") {
items.push([]);
app is called pandora now
2010-06-24 13:18:33 +00:00
items.push(["pandora", "Always Use 0xdb Posters", {
group: "pandoraPosters",
testing interface, more work on backend
2009-10-04 22:00:08 +00:00
checked: false
}]);
}
return items;
}
var menus = [
["list", "List", [
["foo", "Foo", { checked: true, shortcut: "ALT ESCAPE" }, function() {}],
["view", "View List", getMenuItemsC()],
["more", "View More", getMenuItemsL()],
[],
["createList", "New List...", { disabled: true, shortcut: "CONTROL N" }, function() { loadDialog("createList"); }],
["createListFromSelection", "New List from Selection...", { disabled: true, shortcut: "SHIFT CONTROL N" }, function() { loadDialog("createListFromSelection"); }],
["createSmartList", "New Filter...", { disabled: true, shortcut: "ALT CONTROL N"}, function() { loadDialog("createList"); }],
[],
["add", "Add Movie to List", { disabled: false }, function() {}],
["remove", "Remove Movie from List", { disabled: true }, function() {}]
]],
["edit", "Edit", [
["undo", "Undo", { shortcut: "CONTROL Z" }, function() {}],
["redo", "Redo", { shortcut: "SHIFT CONTROL Z" }, function() {}],
[],
["cut", "Cut", { shortcut: "CONTROL X" }, function() {}],
["copy", "Copy", { shortcut: "CONTROL C" }, function() {}],
["paste", "Paste", { shortcut: "CONTROL V" }, function() {}],
["delete", "Delete", { shortcut: "DELETE" }, function() {}],
[],
["all", "Select All", { shortcut: "CONTROL A" }, function() {}],
["none", "Select None", { shortcut: "SHIFT CONTROL A" }, function() {}],
["invert", "Invert Selection", { shortcut: "ALT CONTROL A" }, function() {}],
]],
["view", "View", [
["view", "View Movies", [
["viewList", "as List", function() { setPref("view", "list"); }],
["viewGrid", "as Grid", { checked: true }, function() { setPref("view", "grid"); }],
["viewScenes", "as Scenes", function() { setPref("view", "scenes"); }],
["viewTimelines", "as Timelines", function() { setPref("view", "timelines"); }],
["viewMaps", "as Maps", function() { setPref("view", "maps"); }],
[],
["map", "on Map", function() {}],
["calendar", "on Calendar", function() {}],
[],
["viewRSS", "RSS", function() { setPref("view", "maps"); }],
["viewJSON", "JSON", function() { setPref("view", "maps"); }],
[],
["foobar", "foobar", [
["foo", "foo", function() { setPref("view", "maps"); }],
["bar", "bar", function() { setPref("view", "maps"); }]
]]
]],
["icons", "Icons", [
["posters", "Posters", { checked: true }, function() {}],
["stills", "Stills", function() {}],
["timelines", "Timelines", function() {}],
[],
app is called pandora now
2010-06-24 13:18:33 +00:00
["pandora", "Always Use 0xdb Posters", function() {}],
testing interface, more work on backend
2009-10-04 22:00:08 +00:00
]],
[],
["open", "Open Movie", [
["info", "Info", { shortcut: "CONTROL RETURN" }, function() {}],
["poster", "Poster", function() {}],
["scenes", "Scenes", function() {}],
["editor", "Editor", function() {}],
["map", "Map", function() {}],
["calendar", "Calendar", function() {}]
]],
["preview", "Preview Movie", { shortcut: "CONTROL SPACE" }, function() {}],
[],
["lists", "Hide Lists", { shortcut: "SHIFT L" }, function() { $("#sideView").parent().next().trigger("dblclick"); $topMenu.toggleTitle("view/lists", ["Hide Lists", "Show Lists"]) }],
["stills", "Hide Scenes", { shortcut: "SHIFT S" }, function() {} ],
["groups", "Hide Groups", { shortcut: "SHIFT G" }, function() {}],
["movies", "Hide Movies", { disabled: true, shortcut: "SHIFT M" }, function() {}],
]],
["sort", "Sort", [
["sort", "Sort Movies by", [
["id", "ID", { group: "sort", checked: true }, function() { setPref("sort", "id"); }],
["title", "Title", { group: "sort" }, function() { setPref("sort", "title"); }],
["director", "Director", { group: "sort" }, function() { setPref("sort", "director"); }],
["country", "Country", { group: "sort" }, function() { setPref("sort", "country"); }],
["year", "Year", { group: "sort" }, function() { setPref("sort", "year"); }],
["language", "Language", { group: "sort" }, function() { setPref("sort", "language"); }],
["runtime", "Runtime", { group: "sort" }, function() { setPref("sort", "runtime"); }],
["producer", "Producer", { group: "sort" }, function() { setPref("sort", "producer"); }],
["writer", "Writer", { group: "sort" }, function() { setPref("sort", "writer"); }],
["cinematographer", "Cinematographer", { group: "sort" }, function() { setPref("sort", "cinematographer"); }],
["editor", "Editor", { group: "sort" }, function() { setPref("sort", "editor"); }],
["genre", "Genre", { group: "sort" }, function() { setPref("sort", "genre"); }],
["releasedate", "Release Date", { group: "sort" }, function() { setPref("sort", "releasedate"); }],
["rating", "Rating", { group: "sort" }, function() { setPref("sort", "rating"); }],
["votes", "Votes", { group: "sort" }, function() { setPref("sort", "votes"); }]
]],
["order", "Order Movies", [
["ascending", "Ascending", { group: "order", checked: true }, function() { setPref("order", "ascending"); }],
["descending", "Descending", { group: "order" }, function() { setPref("order", "descending"); }]
]],
[],
["groups", "Use Groups", { checked: true }, function() {}],
["group", "Group Movies by", [
["title", "Title", function() { setPref("group", "title"); }],
["director", "Director", { checked: true }, function() { setPref("group", "director"); }],
["country", "Country", function() { setPref("group", "country"); }],
["year", "Year", function() { setPref("group", "year"); }]
]],
["sortGroups", "Sort Groups by", [
["name", "Name", { checked: true }, function() { setPref("sortGroups", "name"); }],
["movies", "Number of Movies", function() { setPref("sortGroups", "movies"); }]
]],
["orderGroups", "Order Groups", [
["ascending", "Ascending", { checked: true }, function() { setPref("orderGroups", "ascending"); }],
["descending", "Descending", function() { setPref("orderGroups", "descending"); }]
]]
]],
["find", "Find", [
["find", "Find", [
["all", "All", { checked: true }, function() {}],
["title", "Title", function() { setPref("find", "title"); }],
["director", "Director", function() { setPref("find", "director"); }],
["country", "Country", function() { setPref("find", "country"); }],
["year", "Year", function() { setPref("find", "year"); }],
["language", "Language", function() { setPref("find", "language"); }],
["producer", "Producer", function() { setPref("find", "producer"); }],
["writer", "Writer", function() { setPref("find", "writer"); }],
["cinematographer", "Cinematographer", function() { setPref("find", "cinematographer"); }],
["editor", "Editor", function() { setPref("find", "editor"); }],
["cast", "Cast", function() { setPref("find", "cast"); }],
["name", "Name", function() { setPref("find", "name"); }],
["genre", "Name", function() { setPref("find", "genre"); }],
["keywords", "Keywords", function() { setPref("find", "keywords"); }],
]],
[],
["advanced", "Advanced Find", function() {}]
]],
["help", "Help", [
app is called pandora now
2010-06-24 13:18:33 +00:00
["help", "Pandora Help", { shortcut: "SHIFT ?" }, function() {}]
testing interface, more work on backend
2009-10-04 22:00:08 +00:00
]],
["test", "Test", [
["me", "Check Me", function() { $topMenu.toggleChecked("test/me"); }],
["disable", "Disable It", function() { $topMenu.toggleDisabled("test/me"); $topMenu.toggleTitle("test/disable", ["Disable It", "Enable It"]); }],
["them", "Check Them", [
["me", "Check Me", { checked: true, group: "them" }, function() { $topMenu.checkItem("test/them/me"); }],
["her", "Check Her", { group: "them" }, function() { $topMenu.checkItem("test/them/her"); }],
["him", "Check Him", { group: "them" }, function() { $topMenu.checkItem("test/them/him"); }],
[],
["disable", "Disable Them", function() { $topMenu.toggleDisabled("test/them/me"); $topMenu.toggleDisabled("test/them/her"); $topMenu.toggleDisabled("test/them/him"); $topMenu.toggleTitle("test/them/disable", ["Disable Them", "Enable Them"]); }]
]],
["1", "1"],
["2", "2"],
["3", "3"],
["4", "4"],
["5", "5"],
["6", "6"],
["7", "7"],
["8", "8"],
["9", "9"],
["10", "10"],
["11", "11"],
["12", "12"],
[],
["add", "Add Item", function() { $topMenu.insertItemAfter("test/12", ["13", "13"]); $topMenu.toggleDisabled("test/add"); $topMenu.toggleDisabled("test/remove"); }],
["remove", "Remove Item", { disabled: true }, function() { $topMenu.removeItem("test/13"); $topMenu.toggleDisabled("test/add"); $topMenu.toggleDisabled("test/remove"); }],
]]
];
function getMenuItemsC() {
var items = [];
var countries = Ox.getCountries();
$.each(countries, function(i, v) {
items.push([v.code, v.name, { icon: Ox.baseUrl + "png/flags/" + v.flag + ".png" }, function() {}]);
});
return items;
}
function getMenuItemsL() {
var items = [];
var languages = Ox.getLanguages();
$.each(languages, function(i, v) {
items.push([v.code, v.name, { icon: Ox.baseUrl + "png/flags/" + v.flag + ".png" }, function() {}]);
});
return items;
}
function getBrowserItems() {
var items = [];
var groups = [{"items": 3093, "title": "United States"}, {"items": 1142, "title": "France"}, {"items": 688, "title": "Germany"}, {"items": 548, "title": "United Kingdom"}, {"items": 296, "title": "Italy"}, {"items": 285, "title": "Japan"}, {"items": 253, "title": "Canada"}, {"items": 94, "title": "Austria"}, {"items": 88, "title": "Spain"}, {"items": 88, "title": "Switzerland"}, {"items": 79, "title": "Soviet Union"}, {"items": 75, "title": "Belgium"}, {"items": 72, "title": "Netherlands"}, {"items": 72, "title": "Sweden"}, {"items": 69, "title": "Unknown"}, {"items": 61, "title": "Poland"}, {"items": 52, "title": "Hong Kong"}, {"items": 50, "title": "Denmark"}, {"items": 46, "title": "Australia"}, {"items": 42, "title": "China"}, {"items": 42, "title": "India"}, {"items": 39, "title": "Finland"}, {"items": 38, "title": "South Korea"}, {"items": 36, "title": "Iran"}, {"items": 36, "title": "Russia"}, {"items": 34, "title": "Mexico"}, {"items": 34, "title": "Taiwan"}, {"items": 30, "title": "Ireland"}, {"items": 28, "title": "Portugal"}, {"items": 27, "title": "Cuba"}, {"items": 27, "title": "Yugoslavia"}, {"items": 26, "title": "Norway"}, {"items": 24, "title": "Argentina"}, {"items": 24, "title": "Brazil"}, {"items": 16, "title": "Czechoslovakia"}, {"items": 16, "title": "Luxembourg"}, {"items": 15, "title": "Thailand"}, {"items": 12, "title": "Chile"}, {"items": 12, "title": "Czech Republic"}, {"items": 11, "title": "Hungary"}, {"items": 10, "title": "Senegal"}, {"items": 9, "title": "Israel"}, {"items": 8, "title": "Greece"}, {"items": 7, "title": "Tunisia"}, {"items": 7, "title": "Turkey"}, {"items": 6, "title": "East Germany"}, {"items": 6, "title": "Egypt"}, {"items": 5, "title": "Algeria"}, {"items": 5, "title": "Burkina Faso"}, {"items": 4, "title": "Cameroon"}, {"items": 4, "title": "South Africa"}, {"items": 3, "title": "Bolivia"}, {"items": 3, "title": "Morocco"}, {"items": 3, "title": "Peru"}, {"items": 3, "title": "Philippines"}, {"items": 3, "title": "Romania"}, {"items": 3, "title": "Slovenia"}, {"items": 3, "title": "Ukraine"}, {"items": 3, "title": "Venezuela"}, {"items": 2, "title": "Armenia"}, {"items": 2, "title": "Bosnia and Herzegovina"}, {"items": 2, "title": "Croatia"}, {"items": 2, "title": "Estonia"}, {"items": 2, "title": "Iceland"}, {"items": 2, "title": "Jamaica"}, {"items": 2, "title": "Kazakhstan"}, {"items": 2, "title": "Lebanon"}, {"items": 2, "title": "Liechtenstein"}, {"items": 2, "title": "Lithuania"}, {"items": 2, "title": "Malaysia"}, {"items": 2, "title": "New Zealand"}, {"items": 2, "title": "Serbia"}, {"items": 2, "title": "Singapore"}, {"items": 2, "title": "Sri Lanka"}, {"items": 2, "title": "Vietnam"}, {"items": 1, "title": "Afghanistan"}, {"items": 1, "title": "Bangladesh"}, {"items": 1, "title": "Belarus"}, {"items": 1, "title": "Botswana"}, {"items": 1, "title": "Bulgaria"}, {"items": 1, "title": "Chad"}, {"items": 1, "title": "Colombia"}, {"items": 1, "title": "Congo"}, {"items": 1, "title": "Ecuador"}, {"items": 1, "title": "Indonesia"}, {"items": 1, "title": "Iraq"}, {"items": 1, "title": "Kenya"}, {"items": 1, "title": "Macau"}, {"items": 1, "title": "Madagascar"}, {"items": 1, "title": "Mali"}, {"items": 1, "title": "Niger"}, {"items": 1, "title": "Palestine"}, {"items": 1, "title": "Puerto Rico"}, {"items": 1, "title": "Serbia and Montenegro"}, {"items": 1, "title": "Slovakia"}, {"items": 1, "title": "Syria"}, {"items": 1, "title": "Tajikistan"}, {"items": 1, "title": "Uruguay"}, {"items": 1, "title": "Yemen"}];
$.each(groups, function(i, v) {
var code = Ox.getCountryCode(v.title.replace("Unknown", "Neutral Zone"));
var flag = Ox.getFlag(v.title.replace("Unknown", "Neutral Zone"));
var strings = v.title.split(" ");
items.push({
size: 64,
id: code,
app is called pandora now
2010-06-24 13:18:33 +00:00
icon: "http://localhost/pandorastatic/flags/" + flag + ".png",
testing interface, more work on backend
2009-10-04 22:00:08 +00:00
title: strings[0] + (strings.length > 1 ? "<br/>" + strings[1] : ""),
info: Ox.formatNumber(v.items) + " Movie" + (v.items > 1 ? "s" : "")
});
});
return items;
}
/*
$element = new Ox.Container().css({
width: "256px",
height: "256px",
background: "red"
}).click(function() {
Ox.print("click");
}).html("foo").appendTo($body);
$bar = new Ox.Bar({
orientation: "horizontal",
height: 16
}).appendTo($body);
*/
var $sideBrowserPlayer = $("<div/>")
.attr({
id: "sideBrowserPlayer"
}).css({
width: "100%",
height: "100%"
}).append(
$("<img/>").attr({
src: '/static/png/frame.png'
}).css({
width: "100%",
height: "100%"
}).click(function() {
var maxWidth = $(document).width(),
maxHeight = $(document).height() - 96,
width = Math.min($(this).data("width"), maxWidth),
height = width * $(this).data("height") / $(this).data("width");
if (height > maxHeight) {
width *= maxHeight / height;
height = maxHeight;
}
app is called pandora now
2010-06-24 13:18:33 +00:00
pandora.$dialog = new Ox.Dialog({
testing interface, more work on backend
2009-10-04 22:00:08 +00:00
title: "Foo",
buttons: [
new Ox.Button()
.val("Close")
.click(function() {
app is called pandora now
2010-06-24 13:18:33 +00:00
pandora.$dialog.close();
testing interface, more work on backend
2009-10-04 22:00:08 +00:00
})
],
width: width,
height: height
}).append(
$("<img/>")
.attr({
src: $(this).attr("src")
})
.css({
display: "block",
width: width + "px",
height: height + "px"
})
).open();
})
);
var $sideBrowser = new Ox.Element().css({
width: "100%",
height: "100%"
}).attr({
id: "sideBrowser" // remove this later
}).append($sideBrowserPlayer);
var $sideBar = new Ox.Container();
var $historyPanel = new Ox.Panel({
title: "History"
}).appendTo($sideBar.$content);
for (var i = 0; i < 10; i++) {
$historyPanel.append("Item #" + (i + 1) + "<br/>")
}
//$("<br/>").appendTo($sideBar.$content);
var $filtersPanel = new Ox.Panel({
title: "Filters"
}).appendTo($sideBar.$content);
for (var i = 0; i < 10; i++) {
$filtersPanel.append("Item #" + (i + 1) + "<br/>")
}
var $listsPanel = new Ox.Panel({
title: "Lists"
}).appendTo($sideBar.$content);
for (var i = 0; i < 10; i++) {
$listsPanel.append("Item #" + (i + 1) + "<br/>")
}
var $featuresPanel = new Ox.Panel({
title: "Features"
}).appendTo($sideBar.$content);
for (var i = 0; i < 10; i++) {
$featuresPanel.append("Item #" + (i + 1) + "<br/>")
}
app is called pandora now
2010-06-24 13:18:33 +00:00
pandora.$sideView = new Ox.SplitView({
testing interface, more work on backend
2009-10-04 22:00:08 +00:00
orientation: "vertical",
elements: [
{
element: $sideBar
},
{
element: $sideBrowser,
size: 145,
resizable: true
}
]
}).attr({
id: "sideView"
});
/*
var $main = new Ox.Container();
var $mainBar = new Ox.Bar({
orientation: "horizontal",
size: 16
});
var $mainBrowser = new Ox.IconList({
size: 64,
items: getBrowserItems()
});
var $mainView = new Ox.SplitView({
orientation: "vertical",
elements: [
{
element: $mainBrowser,
size: 132,
resizable: true
},
{
element: $mainBar,
size: 16
},
{
element: $main
}
]
});
*/
var $mainBrowser = new Ox.IconList({
size: 64,
sort: user.prefs.sortGroups,
order: user.prefs.orderGroups,
url: "/json/find",
update oxjs params and setUrl, some more user functions
2009-10-07 19:43:46 +00:00
params: {g:"country"}
testing interface, more work on backend
2009-10-04 22:00:08 +00:00
}).attr({
id: "groups"
});
var $main = new Ox.Table({
list: "movies",
columns: [
{
id: "id",
title: "ID",
order: "ascending",
width: 60,
align: "left",
checked: true
},
{
id: "title",
title: "Title",
order: "ascending",
width: 240,
align: "left",
checked: true
},
{
id: "director",
title: "Director",
order: "ascending",
width: 180,
align: "left",
checked: true
},
{
id: "country",
title: "Country",
order: "ascending",
width: 120,
align: "left",
checked: true
},
{
id: "year",
title: "Year",
order: "descending",
width: 40,
align: "right",
checked: true
},
{
id: "runtime",
title: "Runtime",
order: "descending",
width: 60,
align: "right",
checked: true
},
{
id: "language",
title: "Language",
order: "ascending",
width: 120,
align: "left",
checked: true
},
{
id: "genre",
title: "Genre",
order: "ascending",
width: 120,
align: "left",
checked: true
},
{
id: "rating",
title: "Rating",
order: "descending",
width: 60,
align: "right",
checked: true
},
{
id: "votes",
title: "Votes",
order: "descending",
width: 60,
align: "right",
checked: true
}
],
sort: user.prefs.sortMovies,
order: user.prefs.orderMovies,
url: "/json/find",
select: selectItem
});
// these should go with their respective Ox Objects
Ox.Event.bind("menu", function(data) {
if (data.menu == "topmenu" && Ox.startsWith(data.item, "sort/sortMovies/")) {
var sort = data.item.split("/").pop();
Ox.Location.set({
s: sort
});
$main.$body.sort(sort);
}
if (data.menu == "topmenu" && Ox.startsWith(data.item, "sort/orderMovies/")) {
var order = data.item.split("/").pop();
Ox.Location.set({
o: order
});
$main.$body.order(order);
}
if (data.menu == "topmenu" && data.item == "view/toggleSidebar") {
app is called pandora now
2010-06-24 13:18:33 +00:00
pandora.$sideView.toggle();
testing interface, more work on backend
2009-10-04 22:00:08 +00:00
$topMenu.toggleDisabled("view/toggleInfo");
}
if (data.menu == "topmenu" && data.item == "view/toggleInfo") {
$sideBrowser.toggle();
}
if (data.menu == "topmenu" && data.item == "view/toggleGroups") {
$mainBrowser.toggle();
}
if (data.menu == "topmenu" && Ox.startsWith(data.item, "find/find/")) {
var find = data.item.split("/").pop();
$find.setPlaceholder("Find: " + Ox.toTitleCase(find));
}
if (data.menu == "topmenu" && data.item == "help/help") {
app is called pandora now
2010-06-24 13:18:33 +00:00
pandora.$dialog = new Ox.Dialog({
title: "Pandora Help",
testing interface, more work on backend
2009-10-04 22:00:08 +00:00
buttons: [
new Ox.Button()
.val("Close")
.click(function() {
app is called pandora now
2010-06-24 13:18:33 +00:00
pandora.$dialog.close();
testing interface, more work on backend
2009-10-04 22:00:08 +00:00
})
],
width: $(document).width() / 2,
height: ($(document).height() / 2) - 48
}).append(
new Ox.Element().html(Ox.repeat("Foo<br/>", 100))
).open();
}
});
var $mainView = new Ox.SplitView({
orientation: "vertical",
elements: [
{
element: $mainBrowser,
size: 132,
resizable: true
},
{
element: $main
}
]
});
var $middleView = new Ox.SplitView({
orientation: "horizontal",
elements: [
{
app is called pandora now
2010-06-24 13:18:33 +00:00
element: pandora.$sideView,
testing interface, more work on backend
2009-10-04 22:00:08 +00:00
size: 192,
resizable: [128, 192, 256],
resize: resizePlayer
},
{
element: $mainView
}
]
});
function resizePlayer(width) {
var height = Math.round((width - 4) / aspectRatio + 4);
//Ox.print(width, height);
$sideBar.css({
bottom: height + "px"
});
$sideBrowser.$element.parent().parent().css({
height: height + "px"
});
app is called pandora now
2010-06-24 13:18:33 +00:00
if (pandora.$sideView.$element.css("bottom") != "0px") {
pandora.$sideView.css({
testing interface, more work on backend
2009-10-04 22:00:08 +00:00
bottom: (4 - height) + "px"
})
}
}
function selectItem(item) {
var url = "http://0xdb.org/" + item.id + "/still.jpg";
var img = $("<img/>").attr({
src: url
}).load(function() {
var img = new Image();
img.src = url;
aspectRatio = img.width / img.height;
var width = $sideBrowser.$element.width() + 4;
resizePlayer(width);
$sideBrowserPlayer.children().eq(0).attr({
src: url
}).data("width", img.width).data("height", img.height);
})
}
var $topMenu = new Ox.MenuBar({
id: "topmenu",
size: "large",
menus: m
});
var b = [
["login", function(data) {
Ox.print("username:", data.username, "this:", this);
$topMenu.toggleChecked("user/login");
}],
["sort", function(data) {
if (data.list == "movies") {
$topMenu.checkItem("sort/sortMovies/" + data.sort);
$topMenu.checkItem("sort/orderMovies/" + data.order);
}
}],
["order", function(data) {
if (data.list == "movies") {
$topMenu.checkItem("sort/orderMovies/" + data.order);
}
}],
["toggle", function(data) {
if (data.id == "sideView") {
$topMenu.toggleTitle("view/toggleSidebar");
$topMenu.toggleDisabled("view/toggleInfo");
} else if (data.id == "sideBrowser") {
$topMenu.toggleTitle("view/toggleInfo");
} else if (data.id == "groups") {
$topMenu.toggleTitle("view/toggleGroups");
}
}],
["space", function(data) {
var height = $(document).height() - 96,
width = height * 5/8;
app is called pandora now
2010-06-24 13:18:33 +00:00
pandora.$dialog = new Ox.Dialog({
testing interface, more work on backend
2009-10-04 22:00:08 +00:00
title: data.items[0].title,
buttons: [
new Ox.Button()
.val("Close")
.click(function() {
app is called pandora now
2010-06-24 13:18:33 +00:00
pandora.$dialog.close();
testing interface, more work on backend
2009-10-04 22:00:08 +00:00
})
],
width: width,
height: height
}).append(
$("<img/>").attr({
src: "http://0xdb.org/" + data.items[0].id + "/poster.large.jpg"
}).css({
display: "block",
width: width + "px",
height: height + "px"
})
).open();
}]
];
$.each(b, function(i, v) {
Ox.Event.bind(v[0], function(data) {
v[1](data);
});
});
var $statusBar = new Ox.Bar({
orientation: "horizontal",
size: 24
}).attr({
id: "statusBar"
});
var loadingInterval;
$loading = $("<img/>").attr({
id: "loading",
src: Ox.baseUrl + "png/themes/ox/loading0.png"
}).ajaxStart(function() {
Ox.print("start")
$(this).attr({
src: Ox.baseUrl + "png/themes/ox/loading0.png"
});
$(this).show();
var loadingStep = 1;
loadingInterval = setInterval(function() {
$loading.attr({
src: Ox.baseUrl + "png/themes/ox/loading" + (loadingStep % 12) + ".png"
});
loadingStep++;
}, 83);
/*
$("body").css({
cursor: "wait"
});
*/
}).ajaxStop(function() {
Ox.print("stop")
clearInterval(loadingInterval);
$(this).hide();
/*
$("body").css({
cursor: "default"
});
*/
}).appendTo($topMenu.$element).trigger("ajaxStart");
var $view = new Ox.SplitView({
orientation: "vertical",
elements: [
{
element: $topMenu,
size: 24
},
{
element: $middleView
},
{
element: $statusBar,
size: 24
}
]
}).appendTo($body);
/*
for (var i = 0; i < 100; i++) {
$main.$container.append("Item #" + (i + 1) + "<br/>");
}
*/
$find = new Ox.Input({
placeholder: "Find: All"
}).attr({
id: "find"
}).appendTo($topMenu.$element).trigger("blur");
update oxjs params and setUrl, some more user functions
2009-10-07 19:43:46 +00:00
$find.change(function(that) {
var q = $(this).val();
$main.setUrl("/json/find", {q:q});
$mainBrowser.setUrl("/json/find", {g:"country", q:q});
});
testing interface, more work on backend
2009-10-04 22:00:08 +00:00
/*
$find = $("<input/>")
.attr({
id: "find",
type: "text",
placeholder: "Find: All"
})
.focus(function() {
if ($(this).hasClass("OxPlaceholder")) {
$(this)
.val("")
.removeClass("OxPlaceholder");
}
})
.blur(function() {
if ($(this).val() === "") {
$(this)
.addClass("OxPlaceholder")
.val($(this).attr("placeholder"));
}
})
.appendTo($topMenu.$element)
.trigger("blur");
function focusFind() {
Ox.print("!!!")
$find.focus();
$find.select();
}
var keyboard = Ox.KeyboardController.setup({
"CONTROL F": focusFind
}, true);
Ox.KeyboardController.enable(keyboard);
*/
//Ox.print($topMenu);
function loadDialog() {}
function loadPage() {}
function setPref(key, value) {
if (key == "sort") {
$topMenu.checkItem("sort/sort/" + value);
}
}
$("<select/>").css({
position: "absolute",
right: "4px",
bottom: "4px",
}).append(
$("<option/>").val("foo").html("Foo")
).append(
$("<option/>").val("bar").html("Bar")
).append(
$("<option/>").val("bar").html($main.$body.width())
).appendTo($statusBar.$element);
});
Reference in a new issue Copy permalink