summaryrefslogtreecommitdiff
path: root/js/view/packages.js
diff options
context:
space:
mode:
Diffstat (limited to 'js/view/packages.js')
-rw-r--r--js/view/packages.js256
1 files changed, 70 insertions, 186 deletions
diff --git a/js/view/packages.js b/js/view/packages.js
index fde0fde..245677a 100644
--- a/js/view/packages.js
+++ b/js/view/packages.js
@@ -16,207 +16,91 @@
// <http://www.gnu.org/licenses/>.
(function() {
- var packages = guix.packages;
- var spinner = m(".spinner-container", m(".spinner"));
-
- packages.view = function(ctrl) {
- function renderName(package) {
- var name = package.name;
-
- return m("a", {
- config: m.route,
- href: "/package/".concat(name)
- }, name);
- }
-
- function renderHomepage(package) {
- if(package.homepage) {
- return m("a", { href: package.homepage }, package.homepage);
- } else {
- return "";
- }
- }
-
- function renderInstallLink(package) {
- return m("a", {
- href: "#",
- onclick: function() {
- ctrl.selectedPackage(package);
- ctrl.phase(packages.PHASE_PROMPT);
- return false;
- }
- }, "install");
- }
-
- function renderPackageTable() {
- return m("table.table", [
- m("thead", [
- m("tr", [
- ctrl.columns.map(function(column) {
- return m("th", {
- class: columnHeaderClass(column),
- onclick: function() {
- ctrl.sortBy(column.sortField);
- }
- }, column.header);
- }).concat([m("th", "")])
+ var view = guix.packages.view = {};
+
+ view.installModal = function(package, phase, phaseStream) {
+ function renderPromptModal() {
+ var body = [
+ m("p", "Do you want to install the following packages?"),
+ m("ul", [
+ m("li", [
+ package.name,
+ " ",
+ package.version
])
- ]),
- m("tbody", [
- ctrl.pager().currentPage().map(function(package) {
- return m("tr", [
- m("td", renderName(package)),
- m("td", package.version),
- m("td", package.synopsis),
- m("td", renderHomepage(package)),
- m("td", guix.ui.licenseList(package)),
- m("td", renderInstallLink(package))
- ]);
- })
])
- ]);
- }
-
- function renderPagination() {
- function renderPage(text, opts) {
- return m("li", {
- class: opts.class || "",
- onclick: opts.onclick
- }, m("a", { href: "#" }, text));
- }
-
- return m("div", m("ul.pagination", [
- // Back page
- renderPage("«", {
- class: ctrl.pager().isFirstPage() ? "disabled" : "",
+ ];
+ var buttons = [
+ m(".btn.btn-default", {
+ onclick: guix.withEmit(phaseStream, guix.packages.PHASE_NONE)
+ }, "Cancel"),
+ m(".btn.btn-primary", {
onclick: function() {
- ctrl.pager().previousPage();
- return false;
+ phaseStream.emit(guix.packages.PHASE_DERIVATION);
+ guix.packages.installPackage(package).then(function() {
+ phaseStream.emit(guix.packages.PHASE_SUCCESS);
+ }, function() {
+ phaseStream.emit(guix.packages.PHASE_ERROR);
+ });
}
- })
- ].concat(ctrl.pager().pages.map(function(page, i) {
- // Jump to page
- return renderPage(i + 1, {
- class: ctrl.pager().isCurrentPage(i) ? "active" : "",
- onclick: function() {
- ctrl.pager().gotoPage(i);
- return false;
- }
- });
- })).concat([
- // Forward page
- renderPage("»", {
- class: ctrl.pager().isLastPage() ? "disabled" : "",
- onclick: function() {
- ctrl.pager().nextPage();
- return false;
- }
- })
- ])));
- }
+ }, "Install"),
+ ];
- function renderSearchBox() {
- return m("input.form-control", {
- type: "text",
- placeholder: "Search",
- oninput: m.withAttr("value", function(value) {
- ctrl.searchTerm(value);
- ctrl.doSearch();
- }),
- value: ctrl.searchTerm()
- });
+ return guix.ui.modal("Install Packages", body, buttons);
}
- function columnHeaderClass(column) {
- var sorter = ctrl.sorter();
-
- if(column.sortField === sorter.field) {
- return sorter.isDescending ? "sorter sort-descend" : "sorter sort-ascend";
- }
+ function renderDerivationModal() {
+ var body = [
+ m("p", [
+ "Installing ",
+ package.name,
+ " ",
+ package.version,
+ "..."
+ ]),
+ m(".progress", [
+ m(".progress-bar.progress-bar-striped.active", {
+ role: "progressbar",
+ style: { width: "100%" }
+ })
+ ])
+ ];
+ var buttons = m(".btn.btn-danger", {
+ onclick: guix.withEmit(phaseStream, guix.packages.PHASE_NONE)
+ }, "Abort");
- return "sorter";
+ return guix.ui.modal("Install Packages", body, buttons);
}
- function renderModal() {
- function renderBody() {
- switch(ctrl.phase()) {
- case packages.PHASE_PROMPT:
- return [
- m("p", "Do you want to install the following packages?"),
- m("ul", [
- m("li", [
- ctrl.selectedPackage().name,
- " ",
- ctrl.selectedPackage().version
- ])
- ])
- ];
- case packages.PHASE_DERIVATION:
- return [
- m("p", [
- "Installing ",
- ctrl.selectedPackage().name,
- " ",
- ctrl.selectedPackage().version,
- "..."
- ]),
- m(".progress", [
- m(".progress-bar.progress-bar-striped.active", {
- role: "progressbar",
- style: { width: "100%" }
- })
- ])
- ];
- case packages.PHASE_SUCCESS:
- return m(".alert.alert-success", "Installation complete!");
- case packages.PHASE_ERROR:
- return m(".alert.alert-danger", "Installation failed!");
- }
+ function renderSuccessModal() {
+ var body = m(".alert.alert-success", "Installation complete!");
+ var buttons = m(".btn.btn-primary", {
+ onclick: guix.withEmit(phaseStream, guix.packages.PHASE_NONE)
+ }, "Close");
- return null;
- }
-
- function renderButtons() {
- switch(ctrl.phase()) {
- case packages.PHASE_PROMPT:
- return [
- m(".btn.btn-default", "Cancel"),
- m(".btn.btn-primary", {
- onclick: function() {
- ctrl.installSelectedPackage();
- m.redraw();
- }
- }, "Install"),
- ];
- case packages.PHASE_DERIVATION:
- return m(".btn.btn-danger", "Abort");
- case packages.PHASE_SUCCESS:
- case packages.PHASE_ERROR:
- return m(".btn.btn-primary", {
- onclick: function() {
- ctrl.phase(packages.PHASE_NONE);
- }
- }, "Close");
- }
+ return guix.ui.modal("Install Packages", body, buttons);
+ }
- return null;
- }
+ function renderErrorModal() {
+ var body = m(".alert.alert-danger", "Installation failed!");
+ var buttons = m(".btn.btn-primary", {
+ onclick: guix.withEmit(phaseStream, guix.packages.PHASE_NONE)
+ }, "Close");
- if(ctrl.phase() != packages.PHASE_NONE) {
- return guix.ui.modal("Install Packages",
- renderBody(),
- renderButtons());
- }
+ return guix.ui.modal("Install Packages", body, buttons);
+ }
- return null;
+ switch(phase) {
+ case guix.packages.PHASE_PROMPT:
+ return renderPromptModal();
+ case guix.packages.PHASE_DERIVATION:
+ return renderDerivationModal();
+ case guix.packages.PHASE_SUCCESS:
+ return renderSuccessModal();
+ case guix.packages.PHASE_ERROR:
+ return renderErrorModal();
}
- return guix.withLayout(_.isEmpty(ctrl.packages()) ? spinner : [
- guix.ui.headerWithBadge("Packages", ctrl.packageCount()),
- renderModal(),
- renderSearchBox(),
- renderPackageTable(),
- renderPagination()
- ]);
+ return null;
};
})();