avoid http links. new files
This commit is contained in:
j
parent
be3296e472
commit
4055215553
15 changed files with 172 additions and 82 deletions
|
|
@ -1,4 +1,4 @@
|
|||
@import url(http://fonts.googleapis.com/css?family=Droid+Sans:400,700|Droid+Sans+Mono|Droid+Serif:400,700,400italic,700italic);
|
||||
@import url(//fonts.googleapis.com/css?family=Droid+Sans:400,700|Droid+Sans+Mono|Droid+Serif:400,700,400italic,700italic);
|
||||
|
||||
body {
|
||||
/*
|
||||
|
|
@ -182,15 +182,13 @@ div.text {
|
|||
margin: 8px 0 32px 0;
|
||||
}
|
||||
|
||||
div.tour {
|
||||
#page div.tour {
|
||||
width: 576px;
|
||||
height: 360px;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 0 2px rgba(64, 64, 32, 0.5);
|
||||
overflow: hidden;
|
||||
}
|
||||
img.tour {
|
||||
}
|
||||
|
||||
.large {
|
||||
font-size: 18px;
|
||||
|
|
|
|||
24
index.html
24
index.html
|
|
@ -1,25 +1,7 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Pando the Panda</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<meta http-equiv="refresh" content="10;url=ra">
|
||||
<link rel="shortcut icon" type="image/png" href="ra/png/pan.do/ra-16.png">
|
||||
<link rel="stylesheet" type="text/css" href="ra/css/pan.do/ra.css"/>
|
||||
</head>
|
||||
<head></head>
|
||||
<body>
|
||||
<img id="logo" src="pando.jpg"/>
|
||||
<div id="title">
|
||||
<br/>
|
||||
<span class="bold large mono">Pando</span><br/>
|
||||
<span class="sans small">the Panda<br/>
|
||||
</div>
|
||||
<div id="dictionary">
|
||||
Hi, I'm Pando the Panda, and this is my homepage. You can also send me an e-mail, to <a href="mailto:pan.do@pan.do">pan.do@pan.do</a>.<br/><br/>Most likely though, you will be more interested in <a href="/ra">pan.do/ra</a>, the open media archive. You will be redirected in a moment...
|
||||
</div>
|
||||
<script>eval(atob('KGZ1bmN0aW9uKCl7dmFyIGQ9ZG9jdW1lbnQsbD1kLmNyZWF0ZUVsZW1lbnQoJ2xpbmsnKTtwPVtbJ1BhbmRvIHRoZSBQYW5kYScsJ3BhbmRvLmpwZycsJ3BhbmRvLmh0bWwnXSxbJ1Bhbi1Eb21pbmljYW4gQWlybGluZXMgTHRkLicsJ3Bhbi1kby5qcGcnLCdwYW4tZG8uaHRtbCddLFsncGFuLmRvIC0gRG9tYWluIFBhcmtpbmcnLCdwYW4uZG8ucG5nJywncGFuLmRvLmh0bWwnXSxbJ0Rvd25sb2FkIGFuZCBTaGFyZSAuLi4gQklHIHwgUGFuZG8nLCdodHRwOi8vcGFuZG8uY29tL3NpdGVzL3d3dy5wYW5kby5jb20vZmlsZXMvZmF2aWNvbi5pY28nLCdodHRwOi8vcGFuZG8uY29tJ11dW01hdGguZmxvb3IoTWF0aC5yYW5kb20oKSo0KV0sZC50aXRsZT1wWzBdO2wucmVsPSdzaG9ydGN1dCBpY29uJztsLmhyZWY9cFsxXTtkLmdldEVsZW1lbnRzQnlUYWdOYW1lKCdoZWFkJylbMF0uYXBwZW5kQ2hpbGQobCk7ZC5ib2R5LnN0eWxlLm1hcmdpbj0wO2QuYm9keS5pbm5lckhUTUw9JzxpZnJhbWUgc3JjPSInK3BbMl0rJyIgc3R5bGU9ImRpc3BsYXk6YmxvY2s7cG9zaXRpb246YWJzb2x1dGU7d2lkdGg6MTAwJTtoZWlnaHQ6MTAwJTtib3JkZXI6MCI+J30oKSk='))</script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
||||
|
||||
<!-- -->
|
||||
</html>
|
||||
|
|
@ -1,4 +1,5 @@
|
|||
Ox.getJSON('json/pandora.json', function(pandora) {
|
||||
|
||||
$(function() {
|
||||
|
||||
var $body = $('body'),
|
||||
|
|
@ -25,6 +26,7 @@ Ox.getJSON('json/pandora.json', function(pandora) {
|
|||
.appendTo($body);
|
||||
} else {
|
||||
$element = $('<div>')
|
||||
.addClass(page)
|
||||
.html(page)
|
||||
.appendTo($menu);
|
||||
}
|
||||
|
|
@ -40,7 +42,9 @@ Ox.getJSON('json/pandora.json', function(pandora) {
|
|||
loadPage();
|
||||
|
||||
function loadPage() {
|
||||
var page = window.location.hash.substr(1),
|
||||
var hash = window.location.hash.substr(1).split('.'),
|
||||
page = hash[0],
|
||||
part = parseInt(hash[1], 10) || 1,
|
||||
text;
|
||||
if (pandora.pages[page]) {
|
||||
$('#menu > div').removeClass('selected');
|
||||
|
|
@ -67,7 +71,7 @@ Ox.getJSON('json/pandora.json', function(pandora) {
|
|||
$('<img>')
|
||||
.addClass('tour')
|
||||
.attr({
|
||||
src: pandora.pages.tour[tourIndex][0]
|
||||
src: pandora.pages.tour[part - 1][0]
|
||||
})
|
||||
)
|
||||
.bind({
|
||||
|
|
@ -172,7 +176,7 @@ Ox.getJSON('json/pandora.json', function(pandora) {
|
|||
.append($('<br>'))
|
||||
.append($('<br>'))
|
||||
.append(
|
||||
$('<p>').html(pandora.pages.tour[tourIndex][1])
|
||||
$('<p>').html(pandora.pages.tour[part - 1][1])
|
||||
);
|
||||
} else {
|
||||
text = pandora.pages[page];
|
||||
|
|
@ -180,31 +184,31 @@ Ox.getJSON('json/pandora.json', function(pandora) {
|
|||
$head.empty().append(
|
||||
page == '' ? 'pan.do/ra — open media archive'
|
||||
: page == 'tour' ? $('<span>')
|
||||
.addClass('button disabled')
|
||||
.addClass('button' + (page == 1 ? 'disabled' : ''))
|
||||
.attr({title: 'first'})
|
||||
.html('tour')
|
||||
.click(function() {
|
||||
loadTour(0);
|
||||
window.location.hash = 'tour';
|
||||
})
|
||||
: page
|
||||
);
|
||||
$text.empty().append(text);
|
||||
if (page == 'tour') {
|
||||
$prevButton
|
||||
if (page == 'tour') {
|
||||
$prevButton[
|
||||
part == 1 ? 'addClass' : 'removeClass'
|
||||
]('disabled')
|
||||
.click(function() {
|
||||
loadTour(-1);
|
||||
window.location.hash = 'tour.' + (part - 1);
|
||||
})
|
||||
.appendTo($head);
|
||||
$nextButton
|
||||
$nextButton[
|
||||
part == pandora.pages.tour.length
|
||||
? 'addClass' : 'removeClass'
|
||||
]('disabled')
|
||||
.click(function() {
|
||||
loadTour(1);
|
||||
window.location.hash = 'tour.' + (part + 1);
|
||||
})
|
||||
.appendTo($head);
|
||||
if (tourIndex == 0) {
|
||||
$prevButton.addClass('disabled');
|
||||
} else if (tourIndex == pandora.pages.tour.length - 1) {
|
||||
$nextButton.addClass('disabled');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -233,13 +237,6 @@ Ox.getJSON('json/pandora.json', function(pandora) {
|
|||
$p.css({opacity: 0.25});
|
||||
}
|
||||
|
||||
function zoomIn($element, event) {
|
||||
|
||||
}
|
||||
|
||||
function zoomOut($element, e) {
|
||||
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
});
|
||||
|
|
|
|||
|
|
@ -22,7 +22,15 @@
|
|||
"faq": [
|
||||
[
|
||||
"Q: What can I do with <b>pan.do/ra</b>, and how?",
|
||||
"A: With <b>pan.do/ra</b> you can browse, annotate, search and watch videos - be it your own archive, or someone else's. <b>pan.do/ra</b> is a web site that runs in your browser, so you can either put your collection online, or just use it in your local network. All you have to do is download <b>pan.do/ra</b> and install it on a Linux machine, or just get it pre-installed on a Virtual Machine that will run on most other computers too, quite likely including your laptop. And if you don't have your own video collection, you can use it to explore <a href=\"https://0xDB.org\">someone</a> <a href=\"https://pad.ma\">else's</a>."
|
||||
"A: With <b>pan.do/ra</b> you can browse, annotate, search and watch videos - be it your own archive, or someone else's. <b>pan.do/ra</b> is a web site that runs in your browser, so you can either put your collection online, or just use it in your local network. All you have to do is <a href=\"#download\">download</a> <b>pan.do/ra</b> and install it on a Linux machine, or get it pre-installed on a virtual machine that will run on most other computers too, quite likely including your laptop. And if you don't have your own video collection, you can use it to explore <a href=\"https://0xDB.org\">someone</a> <a href=\"https://pad.ma\">else's</a>."
|
||||
],
|
||||
[
|
||||
"Q: Is <b>pan.do/ra</b> a server or a client?",
|
||||
"A: Both. In a nutshell, <b>pan.do/ra</b> is a python backend, based on <b>Django</b>, a JavaScript frontend, using <b>OxJS</b>, a variety of tools around it, and a JSON API in between. This API is 100% public, and apart from static files, like images or videos, nothing but JSON ever crosses the wire. Anything more web-specific, in fact anything that has to do with resolving URLs and rendering HTML, happens on the client. This means that there is virtually no limit to what you can do with <b>pan.do/ra</b>: Use it as it comes out of the box, deploy it as an internal tool and put a completely different public website in front of it, run bots or command-line clients to automate specific tasks, just script it from the console, or even build a native application on top of it."
|
||||
],
|
||||
[
|
||||
"Q: What are the technical requirements?",
|
||||
"A: <b>pan.do/ra</b> can be installed on most Linux distributions, preferably Ubuntu, but also on other operating systems, as a virtual machine. To browse <b>pan.do/ra</b>, you'll need an up-to-date, HTML5-compliant browser. This includes the latest versions of <a href=\"http://www.google.com/chrome/\">Chrome</a>, <a href=\"http://www.mozilla.org/firefox/\">Firefox</a> and <a href=\"http://www.apple.com/safari/\">Safari</a>, or <a href=\"http://windows.microsoft.com/en-US/internet-explorer/products/ie/home\">Internet Explorer</a> with <a href=\"http://www.google.com/chromeframe/\">Chrome Frame</a> installed. We hope to be able to support <a href=\"http://www.opera.com/\">Opera</a> soon."
|
||||
],
|
||||
[
|
||||
"Q: What does <b>pan.do/ra</b> cost?",
|
||||
|
|
@ -30,115 +38,115 @@
|
|||
],
|
||||
[
|
||||
"Q: Is <b>pan.do/ra</b> ready for production?",
|
||||
"A: It depends. It's already being used in production, but as of now, there is no \"official\" or \"stable\" first release. There will be one, later this year. The <a href=\"#download\">latest version</a> should work fine, so you can already try it out, but if you really need to use it immediately for something important, you should <a href=\"#contact\">get in touch</a> with us before, just to make sure that whatever you put into it now doesn't just go up in flames once there is a first proper release."
|
||||
"A: It depends. It's already being used in production, but there is no \"official\" or \"stable\" first release yet. There will be one, later this year. The <a href=\"#download\">latest version</a> should work fine, so you can already try it out, but if you really need to use it immediately for something important, you should <a href=\"#contact\">get in touch</a> with us before, just to make sure that whatever you put into it now doesn't just go up in flames once there is a first proper release."
|
||||
]
|
||||
],
|
||||
"tour": [
|
||||
[
|
||||
"png/tour/01.png",
|
||||
"<b>pan.do/ra</b> home screen"
|
||||
"This is the <b>pan.do/ra</b> home screen. What you see here can be fully customized."
|
||||
],
|
||||
[
|
||||
"png/tour/02.png",
|
||||
"Videos can be browsed in many views: as a list ..."
|
||||
"Your archive can be browsed in a variety of views. In list view, you see a lot of information at a glance. The individual columns can be resized, reordered, added or removed, and <b>pan.do/ra</b> will remember your preferences. The same applies to the filters, on top. They are ideal if you want to find something real fast, but if you need more space, just resize or collapse them."
|
||||
],
|
||||
[
|
||||
"png/tour/03.png",
|
||||
"... in a grid ..."
|
||||
"In grid view, each video is displayed as an icon — a movie poster, for example. Each view has full keyboard navigation, and if you want to add videos to one of your personal lists, you can either copy & paste or drag & drop them. Also, there is no pagination, ever, so if you want to look at the 10,000th item, you don't have to click \"next\" a hundred times — just scroll all the way down."
|
||||
],
|
||||
[
|
||||
"png/tour/04.png",
|
||||
"... with different icons ..."
|
||||
"These are the default icons. They are rendered automatically, but you can pick your favorite frame, and visitors can switch between frames and posters — just as they can switch between themes, for the whole application."
|
||||
],
|
||||
[
|
||||
"png/tour/05.png",
|
||||
"... with timelines ..."
|
||||
"In timeline view, each video comes with its own visual signature. These timelines are great if you want to get an immediate visual impression of what's happening in a video, and they are great for navigation. The technologies we're trying to match are the book and the bookshelf: just looking at and flipping through items gives should instantly give you an idea of what you're dealing with."
|
||||
],
|
||||
[
|
||||
"png/tour/06.png",
|
||||
"... with clips ..."
|
||||
"In clips view, you can instantly preview search results. Each of the stills is actually a video player. Just click to play, or doubleclick to open the video."
|
||||
],
|
||||
[
|
||||
"png/tour/07.png",
|
||||
"... or just as a list of clips ..."
|
||||
"Alternatively, you can view all results <i>as</i> clips. Since these clips are no longer grouped by video, they can be sorted in more interesting ways."
|
||||
],
|
||||
[
|
||||
"png/tour/08.png",
|
||||
"... or even on a map ..."
|
||||
"You can also view results on a map. For any query or filter, the map will show all places referenced in your results, and for each place, you get a list of matching clips. Click to play, doubleclick to open."
|
||||
],
|
||||
[
|
||||
"png/tour/09.png",
|
||||
"... or on a calendar."
|
||||
"And finally, there's a calendar view. It works just like the map: you can zoom all the way out to the Stone Age, or all the way in to a single second. Unlike places on a map though, events on a calendar can be fuzzy: something as imprecise as \"1789-today\" works just fine."
|
||||
],
|
||||
[
|
||||
"png/tour/10.png",
|
||||
"Each video has many views as well: an info page ..."
|
||||
"Each video has a variety of views as well. The info page shows all kinds of metadata, and if you have write permissions (for example because you're an administrator, or you have uploaded the video — all this can be customized), you can edit everything inline."
|
||||
],
|
||||
[
|
||||
"png/tour/11.png",
|
||||
"... with custom metadata ..."
|
||||
"The specific set of metadata that comes with each video can be customized as well. And the browser on top allows you to quickly switch between videos, without having to return to your search results."
|
||||
],
|
||||
[
|
||||
"png/tour/12.png",
|
||||
"... a fullscreen player ..."
|
||||
"Each video has a player view, including a fullscreen mode. You can search right in the player, and the results will be highlighted on the timeline. You don't even need to move your mouse: For the above, you can just type F road ENTER G G G SHIFT+G and so on."
|
||||
],
|
||||
[
|
||||
"png/tour/13.png",
|
||||
"... an annotation editor ..."
|
||||
"Then there's the annotation editor, which looks and behaves a lot like a video editing application. You can set in and out points and add keywords or descriptions. Again, the specific types of annotations one can make, and who can make them, is customizable."
|
||||
],
|
||||
[
|
||||
"png/tour/14.png",
|
||||
"... that allows for full-text search ..."
|
||||
"The editor includes full-text search, with as-you-type highlighting of matches: in subtitles, on the timeline, and in the actual annotations. While you can only search for text, and not for \"images with a puff of smoke\" — did you notice that you can actually see the smoke on the timeline?"
|
||||
],
|
||||
[
|
||||
"png/tour/15.png",
|
||||
"... in time-based annotations ..."
|
||||
"You can also navigate the video by browsing its annotations, which can be filtered and sorted in different ways."
|
||||
],
|
||||
[
|
||||
"png/tour/16.png",
|
||||
"... including places and events."
|
||||
"Annotations don't have to be just text, they can also be places or events. In fact, when you're watching a video that has places, the map will follow as you play."
|
||||
],
|
||||
[
|
||||
"png/tour/17.png",
|
||||
"There is also a timeline view ..."
|
||||
"Each video has a timeline view as well. At your current position, you can see the full frame (which, in the image above, is in the third line from the top, with a timecode as a tooltip). This is a video player, and it will move along the timeline as you play."
|
||||
],
|
||||
[
|
||||
"png/tour/18.png",
|
||||
"... and a clips view"
|
||||
"For each video, you can also view all time-based metadata on a single page, as clips. Again, these are video players, and you can search and sort them as you like."
|
||||
],
|
||||
[
|
||||
"png/tour/19.png",
|
||||
"<b>pan.do/ra</b> is a full-fledged application, with proper menus ..."
|
||||
"<b>pan.do/ra</b> looks, feels and works more like a desktop application than like a website. (No worries though: URLs are short and simple, and the back and forward buttons work.) It comes with proper menus, keyboard navigation, ..."
|
||||
],
|
||||
[
|
||||
"png/tour/20.png",
|
||||
"... and dialogs ..."
|
||||
"... dialogs you can resize and move around, tabbed interfaces, ..."
|
||||
],
|
||||
[
|
||||
"png/tour/21.png",
|
||||
"... and forms."
|
||||
"... and form fields for user input. Above, you can see how to make a smart list (a saved search), in this case a list of all videos with both 1968 as their year of production and either France, East Germany, West Germany or Italy as their country of origin. It's that simple."
|
||||
],
|
||||
[
|
||||
"png/tour/22.png",
|
||||
"As an administator, you can browse various statistcs ..."
|
||||
"User management is built right into the application, and for administrators, there is an extensive statistics section. (As you may notice in the image above, they even get a debug menu. Whenever something goes wrong in JavaScript or on the server, you'll find it there, in the error logs.)"
|
||||
],
|
||||
[
|
||||
"png/tour/23.png",
|
||||
"... and edit places ..."
|
||||
"Also, administrators — and others, depending on your custom configuration — get their own map to define places..."
|
||||
],
|
||||
[
|
||||
"png/tour/24.png",
|
||||
"... and events."
|
||||
"... and their own calendar to define events."
|
||||
],
|
||||
[
|
||||
"png/tour/25.png",
|
||||
"For a more in-depth walkthrough, check out the first <a href=\"http://camputer.org/tmp/screencast_webm/screenCast_ffmpeg_1.webm\">Pad.ma Screencast</a>"
|
||||
"And that's it for now. We hope to add more slides in the near future. If you want to see more right now, check out the first <a href=\"http://camputer.org/tmp/screencast_webm/screenCast_ffmpeg_1.webm\">Pad.ma screencast</a>."
|
||||
]
|
||||
],
|
||||
"demo": "<p>While we're still working on a sandbox to demonstrate <b>pan.do/ra</b>'s admin features, you can already try out the sites below to see how <b>pan.do/ra</b> works as a regular user:</p><p><a href=\"https:0xDB.org\"><img class=\"logo\" src=\"png/0xdb256.png\"></a><a href=\"https:0xDB.org\">0xDB</a> is an experimental online movie database. At its core, it provides full text search for more than a hundred years of cinema.</p><br clear=\"all\"><br><p><a href=\"https:Pad.ma\"><img class=\"logo\" src=\"png/padma256.png\"></a><a href=\"https:Pad.ma\">Pad.ma</a>, short for Public Access Digital Media Archive, is an online repository of densely annotated video materials, primarily documentary footage.<br></p>",
|
||||
"download": "<b>pan.do/ra</b> will be officially released later in 2012. Until then, you can download and install the latest version <a href=\"https://wiki.0x2620.org/browser/pandora\">here</a>.</p><p><b>pan.do/ra</b> can be installed on most Linux distributions, preferably Ubuntu. It works fine on many other systems, for example on a MacBook, using a virtual machine.</p>",
|
||||
"documentation": "<p>As <b>pan.do/ra</b> has not yet been released, documentation is still a work in progress.</p><p>A lot of information can be found on our <a href=\"https://wiki.0x2620.org\">Wiki</a>. If you need instructions for setting up <b>pan.do/ra</b>, check out the <a href=\"https://wiki.0x2620.org/browser/pandora/README\">readme</a> file that comes with it.</p><p><b>pan.do/ra</b>'s public API includes its own documentation. You can browse it at any live instance of <b>pan.do/ra</b>, for example at <a href=\"http://0xdb.org/api\">0xDB.org/api</a>.</p><p>Detailed documentation of <b>OxJS</b>, the JavaScript library used to build <b>pan.do/ra</b>'s frontend, can be found at <a href=\"https://OxJS.org\">OxJS.org</a>.</p>",
|
||||
"development": "<p>In a nutshell, <b>pan.do/ra</b> is a python backend, based on <b>Django</b>, a JavaScript frontend, using <b>OxJS</b>, a variety of tools around it, and a JSON API in between. This API is 100% public, and apart from static files, like images or videos, nothing but JSON ever crosses the wire. Anything more web-specific, in fact anything that has to do with resolving URLs and rendering HTML, happens on the client.</p><p>This means that there is virtually no limit to what you can do with <b>pan.do/ra</b>: Use it as it comes out of the box, deploy it as an internal tool and put a completely different public website in front of it, run bots or command-line clients to automate specific tasks, just script it from the console, or even build a native application on top of it.</p><p>To browse or check out the source, take a look at our <a href=\"https://wiki.0x2620.org/browser/pandora\">repository</a>. If you want to report bugs or request features, please use our <a href=\"https://wiki.0x2620.org/report\">tracker</a>. For everything else, there's <a href=\"irc://irc.freenode.net#pan.do/ra\">IRC</a>, and our <a href=\"https://mailb.org/cgi-bin/mailman/listinfo/dev\">development mailing list</a>. Your feedback is welcome.</p><p><a href=\"https://OxJS.org\"><img src=\"png/oxjs256.png\" class=\"logo\"></a><b>pan.do/ra</b>'s interface was made with <b>OxJS</b>, a new JavaScript library for web applications. To learn more about <b>OxJS</b>, check out <a href=\"https://OxJS.org\">OxJS.org</a>.</p><br><br><p><a href=\"https://firefogg.org\"><img src=\"png/firefogg256.png\" class=\"logo\" style=\"width: 128px\"></a><b>pan.do/ra</b> comes with <b>Firefogg</b>, a browser extension for client-side video encoding and upload. Please visit <a href=\"https://firefogg.org\">firefogg.org</a> for more information.</p><br>",
|
||||
"demo": "<p>While we're still working on a sandbox to demonstrate <b>pan.do/ra</b>'s admin features, you can already try out the sites below to see how <b>pan.do/ra</b> works as a regular user:</p><p><a href=\"https://0xDB.org\"><img class=\"logo\" src=\"png/0xdb256.png\"></a><a href=\"https://0xDB.org\">0xDB</a> is an experimental online movie database. At its core, it provides full text search for more than a hundred years of cinema.</p><br clear=\"all\"><br><p><a href=\"https://Pad.ma\"><img class=\"logo\" src=\"png/padma256.png\"></a><a href=\"https//:Pad.ma\">Pad.ma</a>, short for Public Access Digital Media Archive, is an online repository of densely annotated video materials, primarily documentary footage.<br></p>",
|
||||
"download": "<p><b>pan.do/ra</b> will be officially released later in 2012.</p><p><a href=\"https://wiki.0x2620.org/browser/pandora\"><img src=\"png/icon256.png\" class=\"logo\" style=\"width: 64px\"></a>Until then, you can check out and install the latest version from our <a href=\"https://wiki.0x2620.org/browser/pandora\">repository</a>. It runs on most Linux distributions, preferably Ubuntu.</p><br><p><img src=\"png/icon256.png\" class=\"logo\" style=\"width: 64px; opacity: 0.666\">In the very near future, you will also be able to download <b>pan.do/ra</b> pre-installed on a virtual machine, which works fine on many other systems, for example on a MacBook.</p><p>There is also a growing list of tools that have been built for <b>pan.do/ra</b>.</p><p><a href=\"https://firefogg.org\"><img src=\"png/firefogg256.png\" class=\"logo\" style=\"width: 64px\"></a><b>pan.do/ra</b> comes with <b>Firefogg</b>, a browser extension for client-side video encoding and upload. Please visit <a href=\"https://firefogg.org\">firefogg.org</a> for more information.</p><br><p><a href=\"http://files.pad.ma/speedtrans/\"><img src=\"png/speedtrans256.png\" class=\"logo\" style=\"width: 48px; padding: 0 8px 16px 8px\"></a><b>SpeedTrans</b> is a lightweight but powerful video transcription client that runs in your browser. You can get it at <a href=\"http://files.pad.ma/speedtrans/\">Pad.ma</a>.</p><br>",
|
||||
"documentation": "<p>As <b>pan.do/ra</b> has not yet been released, documentation is still a work in progress.</p><p>A lot of information can be found on our <a href=\"https://wiki.0x2620.org\">Wiki</a>. If you need instructions for setting up <b>pan.do/ra</b>, check out the <a href=\"https://wiki.0x2620.org/browser/pandora/README\">readme</a> file that comes with it.</p><p><a href=\"https://0xDB.org/api\"><img src=\"png/0xdb256.png\" class=\"logo\" style=\"width: 80px\"></a><b>pan.do/ra</b>'s public API includes its own documentation. You can browse it at any live instance of <b>pan.do/ra</b>, for example at <a href=\"http://0xdb.org/api\">0xDB.org/api</a>.</p><p><a href=\"https://OxJS.org/#doc\"><img src=\"png/oxjs256.png\" class=\"logo\" style=\"width: 80px; border-radius: 10px; box-shadow: 0 0 1px black\"></a>Detailed documentation of <b>OxJS</b>, the JavaScript library used to build <b>pan.do/ra</b>'s frontend, can be found at <a href=\"https://OxJS.org/#doc\">OxJS.org/#doc</a>.</p>",
|
||||
"development": "<p>To browse or check out the source, take a look at our <a href=\"https://wiki.0x2620.org/browser/pandora\">repository</a>. If you want to report bugs or request features, please use our <a href=\"https://wiki.0x2620.org/report\">tracker</a>. For everything else, there's <a href=\"irc://irc.freenode.net#pan.do/ra\">IRC</a>, and our <a href=\"https://mailb.org/cgi-bin/mailman/listinfo/dev\">development mailing list</a>. Your feedback is welcome.</p><p><a href=\"https://OxJS.org\"><img src=\"png/oxjs256.png\" class=\"logo\" style=\"border-radius: 32px; box-shadow: 0 0 1px black\"></a><b>pan.do/ra</b>'s interface was made with <b>OxJS</b>, a new JavaScript library for web applications. To learn more about <b>OxJS</b>, check out <a href=\"https://OxJS.org\">OxJS.org</a>.</p><br><br><p><a href=\"https://wiki.0x2620.org/wiki/python-ox\"><img src=\"png/python-ox256.png\" class=\"logo\"></a>A lot of <b>pan.do/ra</b>'s server-side functionality has been packaged as a stand-alone library as well. You can get <b>python-ox</b> <a href=\"https://wiki.0x2620.org/wiki/python-ox\">here</a>.</p>",
|
||||
"support": "<img class=\"logo\" src=\"png/box256.png\"><p>In case you just need help with installing, configuring or running <b>pan.do/ra</b> yourself, don't hesitate to <a href=\"#contact\">get in touch</a> with us.</p><p>Beyond that, we provide support and offer hosting for individual instances of <b>pan.do/ra</b>. For more details, please <a href=\"#contact\">send us an e-mail</a>.<br><br><br><br></p>",
|
||||
"credits": "<p><b>pan.do/ra</b> is being developed and maintained by Jan Gerber and Sebastian Lütgert at <a href=\"https://0x2620.org\">0x2620</a> in Berlin and Sanjay Bhangar at <a href=\"http://camputer.org\">CAMP</a> in Bombay.</p><p>From its early stages on, <b>pan.do/ra</b> has received valuable feedback, especially from Zinnia Ambarpardiwala, Shaina Anand and Ashok Sukumaran.</p><p><a href=\"http://bohen.org\"><img class=\"logo\" src=\"png/bohen256.png\"></a>Last but not least, <b>pan.do/ra</b> would not have been possible without the support of the <a href=\"http://bohen.org\">Bohen Foundation</a>.<br><br></p>",
|
||||
"contact": "<p><img class=\"logo\" src=\"png/0x2620256.png\" style=\"width: 128px\">E-mail: <a mailto:\"0x2620@0x2620.org\">0x2620@0x2620.org</a></p><p>IRC: <a href=\"irc://irc.freenode.net#pan.do/ra\">irc.freenode.net#pan.do/ra</a></p><p>Twitter: <a href=\"https://twitter.com/#!/0x2620\">@0x2620</a></p><p>0x2620<br>Memhardtstrasse 2<br>10178 Berlin<br>Germany</p>"
|
||||
|
|
|
|||
21
pan-do.html
Normal file
21
pan-do.html
Normal file
|
|
@ -0,0 +1,21 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Pan-Dominican Airlines Ltd.</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<link rel="shortcut icon" type="image/jpeg" href="pan-do.jpg"/>
|
||||
</head>
|
||||
<body style="background-color: rgb(0, 112, 160);">
|
||||
<div style="position: absolute; left: 32px; right: 32px; top: 32px; height: 424px; border-radius: 32px; background-color: white; overflow: hidden">
|
||||
<div style="position: absolute; right: 32px; top: 32px">
|
||||
<img src="https://maps.googleapis.com/maps/api/staticmap?center=Dominican%20Republic&zoom=5&size=640x360&maptype=hybrid&sensor=false"/ style="right: 32px; top: 32px; border-radius: 16px"/>
|
||||
<div style="position: absolute; right: 256px; top: 116px; width: 96px; height: 96px; border: 16px solid rgba(0, 112, 160, 0.75); border-radius: 64px"></div>
|
||||
</div>
|
||||
<div style="position: absolute; left: 0; top: 32px; width: 360px; border-bottom-left-radius: 16px; border-bottom-right-radius: 16px; background-color: white; font-family: Verdana, Segoe UI, Lucida Grande, Helvetiva, Arial, sans-serif; font-size: 16px; text-align: center">
|
||||
<img src="pan-do.jpg"/>
|
||||
<div style="margin: 16px auto 16px auto; color: rgb(0, 112, 160)">Cheap flights from and to<br>the Dominican Republic</div>
|
||||
<div style="width: 128px; padding: 4px; margin: 16px auto 16px auto; background-color: rgb(0, 112, 160); color: rgb(255, 255, 255); -moz-transform: rotate(-3deg); -webkit-transform: rotate(-3deg)">Coming soon...</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
BIN
pan-do.jpg
Normal file
BIN
pan-do.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 55 KiB |
66
pan.do.html
Normal file
66
pan.do.html
Normal file
|
|
@ -0,0 +1,66 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>pan.do - Domain Parking</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<link rel="shortcut icon" type="image/png" href="pan.do.png"/>
|
||||
<style>
|
||||
a, a:visited {color: white}
|
||||
.box {position: absolute; right: 32px; width: 256px; padding: 16px; border: 2px solid white; background: rgba(0, 0, 128, 0.5); font-size: 16px; line-height: 24px; color: white; box-shadow: 0 0 4px rgba(0, 0, 128, 1)}
|
||||
</style>
|
||||
<script src="https://www.google.com/jsapi"></script>
|
||||
<script type="text/javascript">
|
||||
|
||||
// This code generates a "Raw Searcher" to handle search queries. The Raw
|
||||
// Searcher requires you to handle and draw the search results manually.
|
||||
google.load('search', '1');
|
||||
|
||||
var newsSearch;
|
||||
|
||||
function searchComplete() {
|
||||
|
||||
// Check that we got results
|
||||
document.getElementById('news').innerHTML = '<b style="font-size: 20px">News for Pando</b><br><br>';
|
||||
if (newsSearch.results && newsSearch.results.length > 0) {
|
||||
for (var i = 0; i < newsSearch.results.length; i++) {
|
||||
|
||||
// Create HTML elements for search results
|
||||
var p = document.createElement('p');
|
||||
var a = document.createElement('a');
|
||||
a.href = decodeURIComponent(newsSearch.results[i].url);
|
||||
a.innerHTML = newsSearch.results[i].title;
|
||||
|
||||
// Append search results to the HTML nodes
|
||||
p.appendChild(a);
|
||||
document.getElementById('news').appendChild(p);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function onLoad() {
|
||||
|
||||
// Create a News Search instance.
|
||||
newsSearch = new google.search.NewsSearch();
|
||||
|
||||
// Set searchComplete as the callback function when a search is
|
||||
// complete. The newsSearch object will have results in it.
|
||||
newsSearch.setSearchCompleteCallback(this, searchComplete, null);
|
||||
|
||||
// Specify search quer(ies)
|
||||
newsSearch.execute('Pando');
|
||||
|
||||
// Include the required Google branding
|
||||
google.search.Search.getBranding('branding');
|
||||
}
|
||||
|
||||
// Set a callback to call your code when the page loads
|
||||
google.setOnLoadCallback(onLoad);
|
||||
</script>
|
||||
</head>
|
||||
<body style="background: url(pan.do.jpg) no-repeat fixed; background-color: black; font-family: sans-serif">
|
||||
<div style="position: absolute; left: 32px; top: 32px; padding: 2px 8px 6px 8px; border: 4px solid white; background: rgba(0, 0, 128, 0.5); font-size: 32px; font-weight: bold; color: white; box-shadow: 0 0 4px rgba(0, 0, 128, 1)">pan.do</div>
|
||||
<div class="box" style="top: 32px"><b style="font-size: 20px">Related Searches</b><br><br><input type="text" style="width: 128px"/><input type="button" value="Find" style="width: 64px; margin-left: 8px" onclick="document.location.href='https://pan.do/ra'"/><br><br><a href="https://pan.do/ra" target="_top">Online Video</a><br><a href="https://pan.do/ra" target="_top">Media Archive</a><br><a href="https://pan.do/ra" target="_top">Open Source</a><br><a href="https://pan.do/ra" target="_top">Greek Mythology</a></div>
|
||||
<div id="news" class="box" style="top: 288px">Loading...</div>
|
||||
<div id="branding" style="position: absolute; right: 48px; top: 340px; color: white"></div>
|
||||
</body>
|
||||
</html>
|
||||
BIN
pan.do.jpg
Normal file
BIN
pan.do.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 78 KiB |
BIN
pan.do.png
Normal file
BIN
pan.do.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.5 KiB |
18
pando.html
Normal file
18
pando.html
Normal file
|
|
@ -0,0 +1,18 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Pando the Panda</title>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<link rel="shortcut icon" type="image/jpeg" href="pando.jpg"/>
|
||||
</head>
|
||||
<body style="background-color: cyan; color: purple; text-align: center">
|
||||
<img id="pando" src="pando.jpg" style="height: 256px"><br><br>
|
||||
Hi, I'm Pando the Panda, and this is my homepage.<br><br>
|
||||
You can also send me an e-mail, to <a href="mailto:pan.do@pan.do">pan.do@pan.do</a>.<br/><br/>
|
||||
<b>+ + + + + + + + + N E W S + + + + + + + + +</b><br><br>
|
||||
<b>March 15, 2012</b><br>Recently, I met two guys from Germany. They asked me<br>if they can use a part of my website for their video archive.<br>Sounded cool to me, so they have <a href="https://pan.do/ra">pan.do/ra</a> now.<br>(I still have all the rest.)<br><br>
|
||||
<b>December 1, 2010</b><br>Sorry, I haven't been updating this for a while...<br>But did you hear about that <a href="http://wikileaks.org">WikiLeaks</a> thing? So cool!<br><br>
|
||||
<b>January 17, 2010</b><br>I CAN HAZ <a href="javascript:document.getElementById('pando').style.borderRadius='64px'">ROUNDED CORNERS</a>!!!<br><br>
|
||||
<b>December 18, 2009</b><br>Today I'm featured on The Daily Panda! <a href="http://thedailypanda.tumblr.com">Take a look!!</a><br><br>
|
||||
</body>
|
||||
</html>
|
||||
BIN
png/box256.png
BIN
png/box256.png
Binary file not shown.
|
Before Width: | Height: | Size: 58 KiB After Width: | Height: | Size: 64 KiB |
BIN
png/oxjs256.png
BIN
png/oxjs256.png
Binary file not shown.
|
Before Width: | Height: | Size: 860 B After Width: | Height: | Size: 16 KiB |
BIN
png/python-ox256.png
Normal file
BIN
png/python-ox256.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3 KiB |
BIN
png/speedtrans256.png
Normal file
BIN
png/speedtrans256.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 12 KiB |
6
ra
6
ra
|
|
@ -5,9 +5,9 @@
|
|||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||||
<link rel="shortcut icon" type="image/png" href="png/icon256.png"/>
|
||||
<link rel="stylesheet" type="text/css" href="css/pandora.css"/>
|
||||
<script type="text/javascript" src="http://OxJS.org/latest/Ox.js"></script>
|
||||
<script type="text/javascript" src="http://OxJS.org/latest/Ox.UI/jquery/jquery.js"></script>
|
||||
<script type="text/javascript" src="//OxJS.org/latest/Ox.js"></script>
|
||||
<script type="text/javascript" src="//OxJS.org/latest/Ox.UI/jquery/jquery.js"></script>
|
||||
<script type="text/javascript" src="js/pandora.js"></script>
|
||||
</head>
|
||||
<body></body>
|
||||
</html>
|
||||
</html>
|
||||
|
|
|
|||
Loading…
Reference in a new issue