Changes for page ExternalApps

Last modified by bougault on 2019/09/12 12:46

From 2.195 to 2.194 From 3.1 to 2.208

From version 2.208

edited by hbpadmin
on 2019/07/10 08:33

Change comment: There is no comment for this version

To version 2.195

edited by bougault
on 2019/05/17 10:51

Change comment: There is no comment for this version

Raw
Rendered

Summary

Page properties (2 modified, 0 added, 0 removed)

Details

Page properties

Author

@@ -1,1 +1,1 @@
--XWiki.hbpadmin
++XWiki.bougault

Content

@@ -1,462 +1,281 @@
--{{include reference="Collaboratory.Apps.Apps.Code.AppsMacros"/}}
++{{velocity}}
++#set ($discard = $doc.use('InstalledApp.Code.InstalledAppClass'))
++#set($query = 'select doc from Document doc, doc.object(ExternalApps.Code.ExternalAppsClass) as app')
++#set($applications = $services.query.xwql($query).addFilter('hidden').execute())
++#if ($xcontext.action == 'edit')
++#set ($discard = $xwiki.ssx.use('Collaboratory.Apps.IFrameApp.Code.IFrameAppCss'))
++#set ($discardjs = $xwiki.jsx.use('Collaboratory.Apps.IFrameApp.Code.IFrameAppJs'))
--(% class="applications" %)
--(((
--(% class="application" %)
--(((
--(% class="application-content" %)
--(((
--(% class="app-logo" %)
--(((
--
--)))
++#macro( applications $applications)
++<div class="applications">
++  #foreach($application in $applications)
++    #set($selectField = $application.toString().concat('-selected'))
++    #set($detailsField = $application.toString().concat('-details'))
++    <div class="application">
++      ## TODO: if not in edit mode, do not define the input + fieldname
++      <input type="radio" data-type="select" name="InstalledApp.Code.InstalledAppClass_0_app" id="$selectField" value="$application" />
++      <input type="checkbox" data-type="details" name="detailedView" id="$detailsField" />
++      <label for="$detailsField" class="details-overlay"></label>
++      #application( $application $selectField $detailsField)
++    </div>
++  #end
++</div>
++#end
--(% class="tags" %)
--(((
--Brain Simulation Platform
--)))
++#macro( application $application $selectField $detailsField)
++    #set($app = $xwiki.getDocument($application))
++    #set($title = $app.getDisplayTitle())
++    <div class="application-content">
++       #if($app.getAttachment('logo.png').isImage())
++        <img src="$app.getAttachmentURL('logo.png')" width="75" height="75" alt="$app.getValue('title').replace('"', '\"')">
++       #else
++         <img
++           src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAQAAAC1HAwCAAAAC0lEQVR42mN89x8AAuEB74Y0o2cAAAAASUVORK5CYII="
++           width="75"
++           height="75"
++           alt=""
++         >
++      #end
++      <div class="tags"><span>$app.getValue('category')</span></div>
++      <h3 class="title">$title</h3>
++      <p class="description">$!app.getValue('description')</p>
++      <div class="application-buttons">
++        <label for="$detailsField" class="btn label-more"></label>
++        <label for="$selectField" class="btn btn-primary choose-app">Choose this App</label>
++      </div>
++      <div class="details">
++        <h4>Maintainers</h4>
++        [list of maintainers]
++        <h4>Documentation</h4>
++        App documentation link
++        <h4>URL</h4>
++        $app.getValue('url')
++      </div>
++    </div>
++#end
--(% class="title" %)
--=== Model Catalog ===
--
--(% class="description" %)
--A catalog of models developed and/or used in HBP
--
--(% class="application-buttons" %)
++{{html wiki="true"}}
++(% class="xform" %)
  (((
--
++  ; <label#if ($xcontext.action == 'edit') for="ExternalApps.Code.ExternalAppsClass_0_title"#end>$escapetool.xml($doc.displayPrettyName('title', false, false))</label>##
++    (% class="xHint" %)$services.localization.render('Required. This is how the item will be displayed in the navigation')
++  : $doc.display('title')
  )))
++{{/html}}
--(% class="details" %)
--(((
--==== Maintainers ====
++{{html clean="false"}}
--* [[$user.getValue('first_name') $user.getValue('last_name')>>path:/bin/view/ExternalApps/]]
++##{{html clean="false"}}
++##set ($displayDocExtra = false)
++<style>
++#document-title {
++  visibility: hidden;
++}
--==== Documentation ====
++.applications {
++  display: grid;
++  grid-gap: 20px;
++}
--[[$app.getValue('documentation')>>path:$app.getValue('documentation')]]
++@media screen and (min-width: 640px) {
++  .applications {
++    grid-template-columns: 1fr 1fr;
++   }
++}
++/*
++@media screen and (min-width: 900px) {
++  .applications {
++    grid-template-columns: 1fr 1fr 1fr;
++  }
++}
++*/
--==== URL ====
++@media screen and (min-width: 1200px) {
++  .applications {
++    grid-template-columns: 1fr 1fr 1fr;
++  }
++}
--[[https:~~/~~/validation-v1.brainsimulation.eu/>>url:https://validation-v1.brainsimulation.eu/]]
--)))
--)))
--)))
++@media screen and (min-width: 1800px) {
++  .applications {
++    grid-template-columns: 1fr 1fr 1fr 1fr;
++  }
++}
++.application {
++background: var(--color-support-light);
++}
--(% class="application" %)
--(((
--(% class="application-content" %)
--(((
--(% class="app-logo" %)
--(((
--
--)))
++.application-content {
++  border: 1px solid var(--color-support-light);
++  background: var(--color-white);
++  padding: 1rem;
++  height: 100%;
++  font-weight: normal;
++  display: block;
++  position: relative;
++  padding-bottom: 3rem;
++}
--(% class="tags" %)
--(((
--Neuromorphic
--)))
++.application-content .details {
++  display: none;
++}
--(% class="title" %)
--=== PyNN model builder (staging) ===
--(% class="description" %)
--A graphical interface for building and simulating spiking network models
++.application .application-buttons {
++  display: flex;
++  position: absolute;
++  bottom: 0px;
++  left: 0;
++  right:0;
++}
--(% class="application-buttons" %)
--(((
--
--)))
++.application .application-buttons .btn {
++  width: 50%;
++  margin: 0;
++  border-radius: 0 !important;
++}
--(% class="details" %)
--(((
--==== Maintainers ====
++.application img {
++  display: block;
++  margin: 0 auto 1.5rem auto;
++}
--* [[$user.getValue('first_name') $user.getValue('last_name')>>path:/bin/view/ExternalApps/]]
++.application .title {
++  text-align: center;
++  height: 3em;
++}
--==== Documentation ====
++.application .tags {
++  display: flex;
++  justify-content: space-around;
++  margin-bottom: 1.5rem;
++}
--[[$app.getValue('documentation')>>path:$app.getValue('documentation')]]
++.application .tags span {
++  font-size: .8rem;
++  border: 1px solid var(--color-support-dark);
++  padding: .2rem .3rem;
++  border-radius: var(--border-radius-default);
++}
--==== URL ====
++.application .description {
++  text-align: center;
++}
--[[https:~~/~~/nmpi-staging.hbpneuromorphic.eu/gui/app.html#!/home>>url:https://nmpi-staging.hbpneuromorphic.eu/gui/app.html#!/home]]
--)))
--)))
--)))
++.applications input[type="radio"],
++.applications input[type="checkbox"]{
++display: none;
++}
--(% class="application" %)
--(((
--(% class="application-content" %)
--(((
--(% class="app-logo" %)
--(((
--
--)))
--(% class="tags" %)
--(((
--Neuromorphic
--)))
++.applications input[data-type="select"]:checked ~ div.application-content {
++  border: 1px solid var(--color-primary);
++}
--(% class="title" %)
--=== Neuromorphic Computing Platform Resource Manager ===
--(% class="description" %)
--An application for requesting access to the HBP Neuromorphic Computing Systems and for tracking quota usage once access is granted.
++.applications input[data-type="details"]:checked ~ div.application-content {
++  position: fixed;
++  top: 50%;
++  left: 50%;
++  width: 80vw;
++  height: 80vh;
++  margin-left:-40vw;
++  margin-top: -40vh;
++  background: #FFF;
++  z-index: 255;
++  overflow: auto;
++}
--(% class="application-buttons" %)
--(((
--
--)))
++.label-more {
++  cursor: zoom-in;
++}
++.label-more::before {
++  content: "More";
++}
++.applications input[data-type="details"]:checked ~ .application-content .details {
++  display: block;
++}
--(% class="details" %)
--(((
--==== Maintainers ====
++.details-overlay {
++  display: none;
++  cursor: zoom-out;
++}
--* [[$user.getValue('first_name') $user.getValue('last_name')>>path:/bin/view/ExternalApps/]]
++.applications input[data-type="details"]:checked ~ .details-overlay {
++  width:100vw;
++  height: 100vh;
++  background: var(--color-support-dark);
++  opacity: .7;
++  content: '';
++  display: block;
++  position: fixed;
++  margin: 0;
++  top:0;
++  left:0;
++  z-index: 254;
++}
--==== Documentation ====
++.applications input[data-type="details"]:checked ~ div .label-more {
++ cursor: zoom-out;
++}
++.applications input[data-type="details"]:checked ~ div .label-more::before {
++  content:"Close";
++}
++</style>
--[[$app.getValue('documentation')>>path:$app.getValue('documentation')]]
--==== URL ====
--[[https:~~/~~/quotas.hbpneuromorphic.eu/app/>>url:https://quotas.hbpneuromorphic.eu/app/]]
--)))
--)))
--)))
++<div class="xform">
++<dl>
++<dt>
++<label>Choose an application in the list below</label>
++<dt>
++</dl>
++</div>
--(% class="application" %)
--(((
--(% class="application-content" %)
--(((
--(% class="app-logo" %)
--(((
--
--)))
++#applications( $applications )
--(% class="tags" %)
--(((
--Neuromorphic
--)))
++<script>
++document.addEventListener('DOMContentLoaded', function() {
++  let saveAndView = document.querySelector('input[name="action_save"]');
++  Array.from(document.querySelectorAll('label.choose-app')).forEach(function(button){
++    button.addEventListener('click', function() { setTimeout(function() { saveAndView.click() }, 250)});
++  });
++});
++</script>
--(% class="title" %)
--=== Neuromorphic Computing Platform Job Manager (staging) ===
++{{/html}}
++#else
++##set($discard = $doc.use('InstalledApp.Code.InstalledAppClass'))
++#set($appId = $doc.display('app'))
++#set($app = $xwiki.getDocument($appId))
++#*{{html clean="false"}}
++<style>
++#external-app {
++width: 100%;
++height: 100vh;
++}
++</style>
++<iframe id="external-app" src="$app.getValue('url')"></iframe>
++{{/html}}
++*#
--(% class="description" %)
--Staging version of Job Manager app
++{{html clean="false"}}
++#set ($discard = $xwiki.ssx.use('Collaboratory.Apps.IFrameApp.Code.IFrameAppCss'))
++#set ($discardjs = $xwiki.jsx.use('Collaboratory.Apps.IFrameApp.Code.IFrameAppJs'))
++<style>
++#iframeApp-container {
++background: #FFF;
++}
++</style>
--(% class="application-buttons" %)
--(((
--
--)))
++<div id="iframeApp-container">
++    <div class="app-toolbar">
++        <button id="iframeApp-fullscreen"><span class="fa fa-arrows-alt"></span></button>
++    </div>
++    <iframe id="iframeApp" src="$app.get('url')"></iframe>
++</div>
++{{/html}}
++#end
--(% class="details" %)
--(((
--==== Maintainers ====
--
--* [[$user.getValue('first_name') $user.getValue('last_name')>>path:/bin/view/ExternalApps/]]
--
--==== Documentation ====
--
--[[$app.getValue('documentation')>>path:$app.getValue('documentation')]]
--
--==== URL ====
--
--[[https:~~/~~/nmpi-staging.hbpneuromorphic.eu/app/#/queue>>url:https://nmpi-staging.hbpneuromorphic.eu/app/#/queue]]
--)))
--)))
--)))
--
--(% class="application" %)
--(((
--(% class="application-content" %)
--(((
--(% class="app-logo" %)
--(((
--
--)))
--
--(% class="tags" %)
--(((
--
--)))
--
--(% class="title" %)
--=== TestNewApp ===
--
--
--(% class="application-buttons" %)
--(((
--
--)))
--
--(% class="details" %)
--(((
--==== Maintainers ====
--
--* [[$user.getValue('first_name') $user.getValue('last_name')>>path:/bin/view/ExternalApps/]]
--
--==== Documentation ====
--
--[[$app.getValue('documentation')>>path:$app.getValue('documentation')]]
--
--==== URL ====
--)))
--)))
--)))
--
--(% class="application" %)
--(((
--(% class="application-content" %)
--(((
--(% class="app-logo" style="background-image:url('/bin/download/ExternalApps/Unicorn%20App/logo.png')" %)
--(((
--
--)))
--
--(% class="tags" %)
--(((
--Tasks
--)))
--
--(% class="title" %)
--=== Dragon App ===
--
--(% class="description" %)
--This is a fake app for testing purpose.
--
--(% class="application-buttons" %)
--(((
--
--)))
--
--(% class="details" %)
--(((
--==== Maintainers ====
--
--* [[François Bougault>>path:/bin/view/XWiki/bougault]]
--
--==== Documentation ====
--
--[[$app.getValue('documentation')>>path:$app.getValue('documentation')]]
--
--==== URL ====
--
--[[something that should not be display as an iframe>>path:something that should not be display as an iframe]]
--)))
--)))
--)))
--
--(% class="application" %)
--(((
--(% class="application-content" %)
--(((
--(% class="app-logo" %)
--(((
--
--)))
--
--(% class="tags" %)
--(((
--
--)))
--
--(% class="title" %)
--=== Toto ===
--
--(% class="description" %)
--Lorem ipsim
--
--(% class="application-buttons" %)
--(((
--
--)))
--
--(% class="details" %)
--(((
--==== Maintainers ====
--
--* [[$user.getValue('first_name') $user.getValue('last_name')>>path:/bin/view/ExternalApps/]]
--
--==== Documentation ====
--
--[[$app.getValue('documentation')>>path:$app.getValue('documentation')]]
--
--==== URL ====
--)))
--)))
--)))
--
--(% class="application" %)
--(((
--(% class="application-content" %)
--(((
--(% class="app-logo" %)
--(((
--
--)))
--
--(% class="tags" %)
--(((
--Neuroinformatics
--)))
--
--(% class="title" %)
--=== Neural Activity Resource ===
--
--(% class="description" %)
--An app for browsing, viewing and searching neural activity datasets (e.g. electrophysiology, calcium imaging, simulation results, etc.)
--
--(% class="application-buttons" %)
--(((
--
--)))
--
--(% class="details" %)
--(((
--==== Maintainers ====
--
--* [[$user.getValue('first_name') $user.getValue('last_name')>>path:/bin/view/ExternalApps/]]
--
--==== Documentation ====
--
--[[$app.getValue('documentation')>>path:$app.getValue('documentation')]]
--
--==== URL ====
--
--[[https:~~/~~/nar-browser-app.brainsimulation.eu/app/>>url:https://nar-browser-app.brainsimulation.eu/app/]]
--)))
--)))
--)))
--
--(% class="application" %)
--(((
--(% class="application-content" %)
--(((
--(% class="app-logo" %)
--(((
--
--)))
--
--(% class="tags" %)
--(((
--Neuromorphic
--)))
--
--(% class="title" %)
--=== Neuromorphic Computing Platform Job Manager v2 ===
--
--(% class="description" %)
--Neuromorphic Computing Platform Job Manager (version 2)
--
--(% class="application-buttons" %)
--(((
--
--)))
--
--(% class="details" %)
--(((
--==== Maintainers ====
--
--* [[$user.getValue('first_name') $user.getValue('last_name')>>path:/bin/view/ExternalApps/]]
--
--==== Documentation ====
--
--[[$app.getValue('documentation')>>path:$app.getValue('documentation')]]
--
--==== URL ====
--
--[[https:~~/~~/nmpi.hbpneuromorphic.eu/app/#/queue>>url:https://nmpi.hbpneuromorphic.eu/app/#/queue]]
--)))
--)))
--)))
--
--(% class="application" %)
--(((
--(% class="application-content" %)
--(((
--(% class="app-logo" %)
--(((
--
--)))
--
--(% class="tags" %)
--(((
--Neuromorphic
--)))
--
--(% class="title" %)
--=== Neuromorphic Computing Platform Guidebook ===
--
--(% class="description" %)
--A manual for users of the HBP Neuromorphic Computing Platform
--
--(% class="application-buttons" %)
--(((
--
--)))
--
--(% class="details" %)
--(((
--==== Maintainers ====
--
--* [[$user.getValue('first_name') $user.getValue('last_name')>>path:/bin/view/ExternalApps/]]
--
--==== Documentation ====
--
--[[$app.getValue('documentation')>>path:$app.getValue('documentation')]]
--
--==== URL ====
--
--[[https:~~/~~/electronicvisions.github.io/hbp-sp9-guidebook/>>url:https://electronicvisions.github.io/hbp-sp9-guidebook/]]
--)))
--)))
--)))
--
--(% class="application" %)
--(((
--(% class="application-content" %)
--(((
--(% class="app-logo" %)
--(((
--
--)))
--
--(% class="tags" %)
--(((
--Neuroinformatics
--)))
--
--(% class="title" %)
--=== KnowledgeSpace ===
--
--(% class="description" %)
--A community encyclopedia linking brain research concepts to data, models, and literature.
--
--(% class="application-buttons" %)
--(((
--
--)))
--
--(% class="details" %)
--(((
--==== Maintainers ====
--
--* [[$user.getValue('first_name') $user.getValue('last_name')>>path:/bin/view/ExternalApps/]]
--
--==== Documentation ====
--
--[[$app.getValue('documentation')>>path:$app.getValue('documentation')]]
--
--==== URL ====
--
--[[https:~~/~~/knowledge-space.org/>>url:https://knowledge-space.org/]]
--)))
--)))
--)))
--)))
--
--
++{{/velocity}}