The Package Details screen is now pure HTML/JS.

6 files changed, 751 insertions, 0 deletions

diff --git a/Cydia.app/menes/listArrow.png b/Cydia.app/menes/listArrow.png
new file mode 100644
index 0000000..6421a16
--- /dev/null
+++ b/Cydia.app/menes/listArrow.png
diff --git a/Cydia.app/menes/menes.js b/Cydia.app/menes/menes.js
new file mode 100644
index 0000000..1d153bb
--- /dev/null
+++ b/Cydia.app/menes/menes.js
@@ -0,0 +1,371 @@
+var _assert = function (expr) {
+    if (!expr) {
+        var message = "_assert(" + expr + ")";
+        alert(message);
+        throw message;
+    }
+}
+
+// Compatibility {{{
+if (typeof Array.prototype.push != "function")
+    Array.prototype.push = function (value) {
+        this[this.length] = value;
+    };
+// }}}
+
+var $ = function (arg, doc) {
+    if (this.magic_ != $.prototype.magic_)
+        return new $(arg);
+
+    var type = $.type(arg);
+
+    if (type == "function")
+        $.ready(arg);
+    else if (type == "string") {
+        if (doc == undefined)
+            doc = document;
+        if (arg.charAt(0) == '#')
+            return new $([doc.getElementById(arg.substring(1))]);
+        else if (arg.charAt(0) == '.')
+            return new $(doc.getElementsByClassName(arg.substring(1)));
+        else
+            return $([doc]).descendants(arg);
+    } else {
+        _assert(doc == undefined);
+        this.set($.array(arg));
+        return this;
+    }
+};
+
+$.type = function (value) {
+    var type = typeof value;
+
+    if (
+        type == "function" &&
+        value.toString != null &&
+        value.toString().substring(0, 8) == "[object "
+    )
+        return "object";
+    else
+        return type;
+};
+
+(function () {
+    var ready_ = null;
+
+    $.ready = function (_function) {
+        if (ready_ == null) {
+            ready_ = [];
+
+            document.addEventListener("DOMContentLoaded", function () {
+                for (var i = 0; i != ready_.length; ++i)
+                    ready_[i]();
+            }, false);
+        }
+
+        ready_.push(_function);
+    };
+})();
+
+/* XXX: verify arg3 overflow */
+$.each = function (values, _function, arg0, arg1, arg2) {
+    for (var i = 0, e = values.length; i != e; ++i)
+        _function(values[i], arg0, arg1, arg2);
+};
+
+/* XXX: verify arg3 overflow */
+$.map = function (values, _function, arg0, arg1, arg2) {
+    var mapped = [];
+    for (var i = 0, e = values.length; i != e; ++i)
+        mapped.push(_function(values[i], arg0, arg1, arg2));
+    return mapped;
+};
+
+$.array = function (values) {
+    if (values.constructor == Array)
+        return values;
+    var array = [];
+    for (var i = 0; i != values.length; ++i)
+        array.push(values[i]);
+    return array;
+};
+
+$.document = function (node) {
+    for (;;) {
+        var parent = node.parentNode;
+        if (parent == null)
+            return node;
+        node = parent;
+    }
+};
+
+$.prototype = {
+    magic_: 2041085062,
+
+    add: function (nodes) {
+        Array.prototype.push.apply(this, nodes);
+    },
+
+    set: function (nodes) {
+        this.length = 0;
+        this.add(nodes);
+    },
+
+    css: function (name, value) {
+        $.each(this, function (node) {
+            node.style[name] = value;
+        });
+    },
+
+    append: function (html) {
+        $.each(this, function (node) {
+            var doc = $.document(node);
+
+            // XXX: implement wrapper system
+            var div = doc.createElement("div");
+            div.innerHTML = html;
+
+            while (div.childNodes.length != 0) {
+                var child = div.childNodes[0];
+                node.appendChild(child);
+            }
+        });
+    },
+
+    descendants: function (expression) {
+        var descendants = $([]);
+
+        $.each(this, function (node) {
+            descendants.add(node.getElementsByTagName(expression));
+        });
+
+        return descendants;
+    },
+
+    remove: function () {
+        $.each(this, function (node) {
+            node.parentNode.removeChild(node);
+        });
+    },
+
+    parent: function () {
+        return $($.map(this, function (node) {
+            return node.parentNode;
+        }));
+    }
+};
+
+$.scroll = function (x, y) {
+    window.scrollTo(x, y);
+};
+
+// XXX: document.all?
+$.all = function (doc) {
+    if (doc == undefined)
+        doc = document;
+    return $(doc.getElementsByTagName("*"));
+};
+
+$.inject = function (a, b) {
+    if ($.type(a) == "string") {
+        $.prototype[a] = function (value) {
+            if (value == undefined)
+                return $.map(this, function (node) {
+                    return b.get(node);
+                });
+            else
+                $.each(this, function (node, value) {
+                    b.set(node, value);
+                }, value);
+        };
+    } else for (var name in a)
+        $.inject(name, a[name]);
+};
+
+$.inject({
+    html: {
+        get: function (node) {
+            return node.innerHTML;
+        },
+        set: function (node, value) {
+            node.innerHTML = value;
+        }
+    },
+
+    href: {
+        get: function (node) {
+            return node.href;
+        },
+        set: function (node, value) {
+            node.href = value;
+        }
+    },
+
+    value: {
+        get: function (node) {
+            return node.value;
+        },
+        set: function (node, value) {
+            node.value = value;
+        }
+    }
+});
+
+// Event Registration {{{
+// XXX: unable to remove registration
+$.prototype.event = function (event, _function) {
+    $.each(this, function (node) {
+        // XXX: smooth over this pointer ugliness
+        if (node.addEventListener)
+            node.addEventListener(event, _function, false);
+        else if (node.attachEvent)
+            node.attachEvent("on" + event, _function);
+        else
+            // XXX: multiple registration SNAFU
+            node["on" + event] = _function;
+    });
+};
+
+$.each([
+    "click", "load", "submit"
+], function (event) {
+    $.prototype[event] = function (_function) {
+        if (_function == undefined)
+            _assert(false);
+        else
+            this.event(event, _function);
+    };
+});
+// }}}
+// Timed Animation {{{
+$.interpolate = function (duration, event) {
+    var start = new Date();
+
+    var next = function () {
+        setTimeout(update, 0);
+    };
+
+    var update = function () {
+        var time = new Date() - start;
+
+        if (time >= duration)
+            event(1);
+        else {
+            event(time / duration);
+            next();
+        }
+    };
+
+    next();
+};
+// }}}
+// AJAX Requests {{{
+// XXX: abstract and implement other cases
+$.xhr = function (url, method, headers, data, events) {
+    var xhr = new XMLHttpRequest();
+    xhr.open(method, url, true);
+
+    for (var name in headers)
+        xhr.setRequestHeader(name.replace(/_/, "-"), headers[name]);
+
+    if (events == null)
+        events = {};
+
+    xhr.onreadystatechange = function () {
+        if (xhr.readyState == 4)
+            if (events.complete != null)
+                events.complete(xhr.responseText);
+    };
+
+    xhr.send(data);
+};
+
+$.call = function (url, post, onsuccess) {
+    var events = {};
+
+    if (onsuccess != null)
+        events.complete = function (text) {
+            onsuccess(eval(text));
+        };
+
+    if (post == null)
+        $.xhr(url, "POST", null, null, events);
+    else
+        $.xhr(url, "POST", {
+            Content_Type: "application/json"
+        }, $.json(post), events);
+};
+// }}}
+// WWW Form URL Encoder {{{
+$.form = function (parameters) {
+    var data = "";
+
+    var ampersand = false;
+    for (var name in parameters) {
+        if (!ampersand)
+            ampersand = true;
+        else
+            data += "&";
+
+        var value = parameters[name];
+
+        data += escape(name);
+        data += "=";
+        data += escape(value);
+    }
+
+    return data;
+};
+// }}}
+// JSON Serializer {{{
+$.json = function (value) {
+    if (value == null)
+        return "null";
+
+    var type = $.type(value);
+
+    if (type == "number")
+        return value;
+    else if (type == "string")
+        return "\"" + value
+            .replace(/\\/, "\\\\")
+            .replace(/\t/, "\\t")
+            .replace(/\r/, "\\r")
+            .replace(/\n/, "\\n")
+            .replace(/"/, "\\\"")
+        + "\"";
+    else if (value.constructor == Array) {
+        var json = "[";
+        var comma = false;
+
+        for (var i = 0; i != value.length; ++i) {
+            if (!comma)
+                comma = true;
+            else
+                json += ",";
+
+            json += $.json(value[i]);
+        }
+
+        return json + "]";
+    } else if (
+        value.constructor == Object &&
+        value.toString() == "[object Object]"
+    ) {
+        var json = "{";
+        var comma = false;
+
+        for (var name in value) {
+            if (!comma)
+                comma = true;
+            else
+                json += ",";
+
+            json += name + ":" + $.json(value[name]);
+        }
+        return json + "}";
+    } else {
+        return value;
+    }
+};
+// }}}
diff --git a/Cydia.app/menes/pinstripes.png b/Cydia.app/menes/pinstripes.png
new file mode 100644
index 0000000..c997775
--- /dev/null
+++ b/Cydia.app/menes/pinstripes.png
diff --git a/Cydia.app/menes/style.css b/Cydia.app/menes/style.css
new file mode 100644
index 0000000..ffae721
--- /dev/null
+++ b/Cydia.app/menes/style.css
@@ -0,0 +1,215 @@
+/* .clearfix {{{ */
+.clearfix:after {
+    content: ".";
+    display: block;
+    clear: both;
+    visibility: hidden;
+    line-height: 0;
+    height: 0;
+}
+
+.clearfix {
+    display: inline-block;
+}
+
+html[xmlns] .clearfix {
+    display: block;
+}
+
+* html .clearfix {
+    height: 1%;
+}
+/* }}} */
+
+* {
+    box-sizing: border-box;
+    -moz-box-sizing: border-box;
+}
+
+body {
+    font-family: Helvetica;
+    margin: 0;
+    padding: 0;
+    -webkit-text-size-adjust: none;
+    -webkit-user-select: none;
+}
+
+#page {
+    position: relative;
+}
+
+.dialog {
+    position: absolute;
+    width: 100%;
+}
+
+hr {
+    margin-top: 10px;
+}
+
+.dialog > .panel {
+    background: #c8c8c8 url(pinstripes.png);
+    padding: 1px 0 1px 0;
+}
+
+p {
+    margin: 0px;
+    padding: 0px;
+}
+
+a {
+    text-decoration: none;
+    text-underline-style: dotted;
+}
+
+strong {
+    font-weight: bold
+}
+
+/* #toolbar {{{ */
+.dialog > .toolbar {
+    background: url(toolbar.png) #6d84a2 repeat-x;
+    border-bottom: 1px solid #2d3642;
+    height: 45px;
+    padding: 10px;
+}
+
+.dialog > .toolbar > h1 {
+    color: #ffffff;
+    font-size: 20px;
+    font-weight: bold;
+    height: 100%;
+    margin: 1px auto 0 auto;
+    text-shadow: rgba(0, 0, 0, 0.4) 0px -1px 0;
+    text-align: center;
+    white-space: nowrap;
+}
+/* }}} */
+/* (back|forward)-button {{{ */
+.dialog > .toolbar > a.back-button,
+.dialog > .toolbar > a.forward-button {
+    color: #ffffff;
+    font-size: 12px;
+    font-weight: bold;
+    height: 30px;
+    line-height: 30px;
+    margin-top: -28px;
+    padding: 0 3px;
+    text-decoration: none;
+    text-shadow: rgba(0, 0, 0, 0.6) 0px -1px 0;
+    white-space: nowrap;
+}
+
+.dialog > .toolbar > a.back-button {
+    -webkit-border-image: url(backButton.png) 0 8 0 14;
+    border-width: 0 8px 0 14px;
+    float: left;
+}
+
+.dialog > .toolbar > a.forward-button {
+    -webkit-border-image: url(toolButton.png) 0 5 0 5;
+    border-width: 0 5px;
+    float: right;
+}
+/* }}} */
+/* fieldset {{{ */
+.dialog > .panel > fieldset {
+    background: #ffffff;
+    border: 1px solid #999999;
+    -webkit-border-radius: 10px;
+    font-size: 16px;
+    margin: 9px;
+    padding: 0;
+}
+
+.dialog > .panel > label {
+    display: block;
+    margin: 13px 0 -4px 27px;
+    line-height: 24px;
+    font-size: inherit;
+    font-weight: bold;
+    color: #4d4d70;
+    text-shadow: rgba(255, 255, 255, 0.75) 1px 1px 0;
+}
+
+.dialog > .panel > fieldset > a,
+.dialog > .panel > fieldset > div {
+    border-top: 1px solid #999999;
+    min-height: 19px;
+    padding: 11px 17px;
+}
+
+.dialog > .panel > fieldset > a:first-child,
+.dialog > .panel > fieldset > div:first-child {
+    border-top: none;
+}
+
+.dialog > .panel > fieldset > a img.icon,
+.dialog > .panel > fieldset > div img.icon {
+    height: auto;
+    margin: -13px 5px -10px -10px;
+    max-height: 30px;
+    min-width: 30px;
+    vertical-align: middle;
+    width: 30px;
+}
+
+.dialog > .panel > fieldset > div > p {
+    margin-top: .5em;
+    text-align: center;
+}
+
+.dialog > .panel > fieldset > div > p:first-child {
+    margin-top: 0;
+}
+
+.dialog > .panel > fieldset > a {
+    background: 275px 11px no-repeat url(listArrow.png);
+    color: inherit;
+    display: block;
+}
+
+.dialog > .panel > fieldset > div > select {
+    font-size: 16px;
+    margin: -4px -10px -5px 86px;
+    width: 190px;
+}
+
+.dialog > .panel > fieldset > div > input {
+    background: none;
+    border: none;
+    color: #193250;
+    font-size: 16px;
+    height: 45px;
+    margin: -12px -18px;
+    padding: 12px 10px 0 111px;
+    width: 302px;
+}
+
+.dialog > .panel > fieldset > div > input[type="submit"] {
+    border-width: 0 12px;
+    color: #000000;
+    display: block;
+    font-size: 20px;
+    font-weight: bold;
+    padding: 10px;
+    text-align: center;
+    -webkit-border-image: url(whiteButton.png) 0 12 0 12;
+}
+
+.dialog > .panel > fieldset > a > label,
+.dialog > .panel > fieldset > div > label {
+    font-weight: bold;
+    position: absolute;
+}
+
+.dialog > .panel > fieldset > a > label + div {
+    margin-right: 16px;
+}
+
+.dialog > .panel > fieldset > a > label + div,
+.dialog > .panel > fieldset > div > label + div {
+    color: #335588;
+    text-align: right;
+}
+/* }}} */
diff --git a/Cydia.app/package.html b/Cydia.app/package.html
new file mode 100644
index 0000000..a80177d
--- /dev/null
+++ b/Cydia.app/package.html
@@ -0,0 +1,78 @@
+<?xml version="1.0" encoding="UTF-16"?>
+<html><head>
+    <title>Details</title>
+    <meta name="viewport" content="width=320, minimum-scale=1.0, maximum-scale=1.0"/>
+    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
+    <link rel="stylesheet" type="text/css" href="menes/style.css"/>
+    <script type="text/javascript" src="menes/menes.js"></script>
+    <script type="text/javascript" src="package.js"></script>
+    <base target="_blank"/>
+</head><body><div class="page">
+<div class="dialog">
+    <div class="panel">
+
+<fieldset>
+    <div>
+        <label id="name"></label>
+        <div id="latest"></div>
+    </div>
+
+    <a id="author-link" class="author">
+        <label>Author</label>
+        <div id="author"></div>
+    </a>
+
+    <div id="description"></div>
+
+    <a id="homepage-link" class="homepage">
+        <label>More Information</label>
+    </a>
+</fieldset>
+
+<label class="installed">Installed Package</label>
+<fieldset class="installed">
+    <div>
+        <label>Version</label>
+        <div id="installed"></div>
+    </div>
+
+    <a id="files-link"><label>Filesystem Content</label></a>
+</fieldset>
+
+<label>Package Details</label>
+<fieldset>
+    <div>
+        <label>ID</label>
+        <div id="id"></div>
+    </div>
+
+    <div class="section">
+        <label>Section</label>
+        <div id="section"></div>
+    </div>
+
+    <div class="size">
+        <label>Expanded Size</label>
+        <div id="size"></div>
+    </div>
+
+    <a id="maintainer-link" class="maintainer">
+        <label>Maintainer</label>
+        <div id="maintainer"></div>
+    </a>
+
+    <div class="trusted">
+        <img src="trusted.png" style="margin-top: 2px; position: absolute">
+        <label></label>
+        <div>This package has been signed.</div>
+    </div>
+</fieldset>
+
+<label class="source">Source Infomation</label>
+<fieldset class="source">
+    <a id="origin-link"><label id="origin"></label></a>
+</fieldset>
+
+    </div>
+</div>
+</div></body></html>
diff --git a/Cydia.app/package.js b/Cydia.app/package.js
new file mode 100644
index 0000000..63ba4d3
--- /dev/null
+++ b/Cydia.app/package.js
@@ -0,0 +1,87 @@
+/*var package = {
+    "name": "MobileTerminal",
+    "latest": "286u-5",
+    "author": {
+        "name": "Allen Porter",
+        "address": "allen.porter@gmail.com"
+    },
+    "description": "this is a sample description",
+    "homepage": "http://cydia.saurik.com/terminal.html",
+    "installed": "286u-4",
+    "id": "mobileterminal",
+    "section": "Terminal Support",
+    "size": 552*1024,
+    "maintainer": {
+        "name": "Jay Freeman",
+        "address": "saurik@saurik.com"
+    },
+    "source": {
+        "name": "Telesphoreo Tangelo"
+    }
+};*/
+
+$(function () {
+    var id = package.id;
+    var name = package.name;
+    var regarding = encodeURIComponent("Cydia/APT: " + name);
+
+    $("#name").html(name);
+    $("#latest").html(package.latest);
+
+    var author = package.author;
+    if (author == null)
+        $(".author").remove();
+    else {
+        $("#author").html(author.name);
+        $("#author-link").href("mailto:" + author.address + "?subject=" + regarding);
+    }
+
+    var description = package.description;
+    if (description == null)
+        description = package.tagline;
+    else
+        description = description.replace(/\n/g, "<br/>");
+    $("#description").html(description);
+
+    var homepage = package.homepage;
+    if (homepage == null)
+        $(".homepage").remove();
+    else
+        $("#homepage-link").href(homepage);
+
+    var installed = package.installed;
+    if (installed == null)
+        $(".installed").remove();
+    else {
+        $("#installed").html(installed);
+        $("#files-link").href("cydia://files/" + id);
+    }
+
+    $("#id").html(id);
+
+    var section = package.section;
+    if (section == null)
+        $(".section").remove();
+    else
+        $("#section").html(package.section);
+
+    var size = package.size;
+    if (size == 0)
+        $(".size").remove();
+    else
+        $("#size").html(size / 1024 + " kB");
+
+    var maintainer = package.maintainer;
+    if (maintainer == null)
+        $(".maintainer").remove();
+    else {
+        $("#maintainer").html(maintainer.name);
+        $("#maintainer-link").href("mailto:" + maintainer.address + "?subject=" + regarding);
+    }
+
+    var source = package.source;
+    if (source == null)
+        $(".source").remove();
+    else
+        $("#origin").html(source.name);
+});