From 24af2e8078147578bd435983c1d9a11f13dae8c1 Mon Sep 17 00:00:00 2001
From: Thomas Tanghus <thomas@tanghus.net>
Date: Sat, 4 Aug 2012 20:12:18 +0200
Subject: [PATCH] Load OCS apps in an ajax call to avoid blocking the WUI.
---
settings/apps.php | 5 +-
settings/css/settings.css | 8 ++-
settings/js/apps.js | 99 +++++++++++++++++++++++++++----------
settings/templates/apps.php | 7 +--
4 files changed, 86 insertions(+), 33 deletions(-)
diff --git a/settings/apps.php b/settings/apps.php
index 27c71da0da8..d34b6468838 100644
--- a/settings/apps.php
+++ b/settings/apps.php
@@ -60,6 +60,7 @@ function app_sort($a, $b){
}
usort($apps, 'app_sort');
+/*
// apps from external repo via OCS
$catagoryNames=OC_OCSClient::getCategories();
if(is_array($catagoryNames)){
@@ -70,7 +71,7 @@ usort($apps, 'app_sort');
// show only external apps that are not exist yet
$local=false;
foreach($apps as $a){
- if($a['name']==$app['name']) $local=true;
+ if($a['name']==$app['name']) $local=true;
}
if(!$local) {
@@ -89,7 +90,7 @@ usort($apps, 'app_sort');
}
}
}
-
+*/
$tmpl = new OC_Template( "settings", "apps", "user" );
diff --git a/settings/css/settings.css b/settings/css/settings.css
index d5634eec81f..e79029ddbfa 100644
--- a/settings/css/settings.css
+++ b/settings/css/settings.css
@@ -43,11 +43,17 @@ div.quota>span { position:absolute; right:0em; white-space:nowrap; top: 0.7em }
select.quota.active { background: #fff; }
/* APPS */
-li { color:#888; }
+li { color:#888; white-space: nowrap; }
li.active { color:#000; }
small.externalapp { color:#FFF; background-color:#BBB; font-weight:bold; font-size:6pt; padding:4px; border-radius: 4px;}
+small.externalapp.list { float: right; }
span.version { margin-left:3em; color:#ddd; }
+.app { position: relative; display: inline-block; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; z-index: 100; transition: .2s max-width linear; -o-transition: .2s max-width linear; -moz-transition: .2s max-width linear; -webkit-transition: .2s max-width linear; -ms-transition: .2s max-width linear; }
+.app.externalapp { max-width: 10em; }
+/* Transition to complete width! */
+.app:hover, .app:active { max-width: inherit; }
+
/* LOG */
#log { white-space:normal; }
diff --git a/settings/js/apps.js b/settings/js/apps.js
index 7b608956ed3..3f6ff66c6dd 100644
--- a/settings/js/apps.js
+++ b/settings/js/apps.js
@@ -1,13 +1,51 @@
/**
* Copyright (c) 2011, Robin Appelman <icewind1991@gmail.com>
+ * Copyright (c) 2012, Thomas Tanghus <thomas@tanghus.net>
* This file is licensed under the Affero General Public License version 3 or later.
* See the COPYING-README file.
*/
+OC.Settings = OC.Settings || {};
+OC.Settings.Apps = OC.Settings.Apps || {
+ loadOCS:function() {
+ $.getJSON(OC.filePath('settings', 'ajax', 'apps/ocs.php'), function(jsondata) {
+ if(jsondata.status == 'success'){
+ var apps = jsondata.data;
+ $.each(apps, function(b, appdata) {
+ OC.Settings.Apps.insertApp(appdata);
+ });
+ } else {
+ OC.dialogs.alert(jsondata.data.message, t('core', 'Error'));
+ }
+ });
+ },
+ insertApp:function(appdata) {
+ var applist = $('#leftcontent li');
+ var app =
+ $('<li data-id="'+appdata.id+'" data-type="external" data-installed="0">'
+ + '<a class="app externalapp" href="'+OC.filePath('settings', 'apps', 'index.php')+'&appid=' + appdata.id+'">'
+ + appdata.name+'</a><small class="externalapp list">3rd party</small></li>');
+ app.data('app', appdata);
+ var added = false;
+ applist.each(function() {
+ if(!parseInt($(this).data('installed')) && $(this).find('a').text().toLowerCase() > appdata.name.toLowerCase()) {
+ $(this).before(app);
+ added = true;
+ return false; // dang, remember this to get out of loop
+ }
+ });
+ if(!added) {
+ applist.last().after(app);
+ }
+ return app;
+ }
+}
+
$(document).ready(function(){
$('#leftcontent li').each(function(index,li){
- var app=$.parseJSON($(this).children('span').text());
+ var app = $.parseJSON($(this).children('span').text());
$(li).data('app',app);
+ $(this).find('span.hidden').remove();
});
$('#leftcontent li').keydown(function(event) {
if (event.which == 13 || event.which == 32) {
@@ -15,31 +53,36 @@ $(document).ready(function(){
}
return false;
});
- $('#leftcontent li').click(function(){
- var app=$(this).data('app');
- $('#rightcontent p.license').show();
- $('#rightcontent span.name').text(app.name);
- $('#rightcontent small.externalapp').text(app.internallabel);
- if (app.version) {
- $('#rightcontent span.version').text(app.version);
- } else {
- $('#rightcontent span.version').text('');
- }
- $('#rightcontent p.description').text(app.description);
- $('#rightcontent img.preview').attr('src',app.preview);
- $('#rightcontent small.externalapp').attr('style','visibility:visible');
- $('#rightcontent span.author').text(app.author);
- $('#rightcontent span.licence').text(app.licence);
-
- $('#rightcontent input.enable').show();
- $('#rightcontent input.enable').val((app.active)?t('settings','Disable'):t('settings','Enable'));
- $('#rightcontent input.enable').data('appid',app.id);
- $('#rightcontent input.enable').data('active',app.active);
- if ( app.internal == false ) {
- $('#rightcontent p.appslink').show();
- $('#rightcontent a').attr('href','http://apps.owncloud.com/content/show.php?content='+app.id);
- } else {
- $('#rightcontent p.appslink').hide();
+
+ $(document).on('click', '#leftcontent', function(event){
+ var tgt = $(event.target);
+ if (tgt.is('li') || tgt.is('a')) {
+ var item = tgt.is('li') ? $(tgt) : $(tgt).parent();
+ var app = item.data('app');
+ $('#rightcontent p.license').show();
+ $('#rightcontent span.name').text(app.name);
+ $('#rightcontent small.externalapp').text(app.internallabel);
+ if (app.version) {
+ $('#rightcontent span.version').text(app.version);
+ } else {
+ $('#rightcontent span.version').text('');
+ }
+ $('#rightcontent p.description').text(app.description);
+ $('#rightcontent img.preview').attr('src',app.preview);
+ $('#rightcontent small.externalapp').attr('style','visibility:visible');
+ $('#rightcontent span.author').text(app.author);
+ $('#rightcontent span.licence').text(app.licence);
+
+ $('#rightcontent input.enable').show();
+ $('#rightcontent input.enable').val((app.active)?t('settings','Disable'):t('settings','Enable'));
+ $('#rightcontent input.enable').data('appid',app.id);
+ $('#rightcontent input.enable').data('active',app.active);
+ if ( app.internal == false ) {
+ $('#rightcontent p.appslink').show();
+ $('#rightcontent a').attr('href','http://apps.owncloud.com/content/show.php?content='+app.id);
+ } else {
+ $('#rightcontent p.appslink').hide();
+ }
}
return false;
});
@@ -77,7 +120,7 @@ $(document).ready(function(){
}
}
});
-
+
if(appid) {
var item = $('#leftcontent li[data-id="'+appid+'"]');
if(item) {
@@ -86,4 +129,6 @@ $(document).ready(function(){
$('#leftcontent').animate({scrollTop: $(item).offset().top-70}, 'slow','swing');
}
}
+
+ OC.Settings.Apps.loadOCS();
});
diff --git a/settings/templates/apps.php b/settings/templates/apps.php
index 6edaf6c5848..66350e5539c 100644
--- a/settings/templates/apps.php
+++ b/settings/templates/apps.php
@@ -11,12 +11,13 @@
</div>
<ul id="leftcontent">
<?php foreach($_['apps'] as $app):?>
- <li <?php if($app['active']) echo 'class="active"'?> data-id="<?php echo $app['id'] ?>">
- <a href="?appid=<?php echo $app['id'] ?>"><?php echo htmlentities($app['name']) ?></a>
+ <li <?php if($app['active']) echo 'class="active"'?> data-id="<?php echo $app['id'] ?>"
+ data-type="<?php echo $app['internal'] ? 'internal' : 'external' ?>" data-installed="1">
+ <a class="app<?php if(!$app['internal']) echo ' externalapp' ?>" href="?appid=<?php echo $app['id'] ?>"><?php echo htmlentities($app['name']) ?></a>
<span class="hidden">
<?php OC_JSON::encodedPrint($app,false) ?>
</span>
- <?php if(!$app['internal']) echo '<small class="externalapp">3rd party</small>' ?>
+ <?php if(!$app['internal']) echo '<small class="externalapp list">3rd party</small>' ?>
</li>
<?php endforeach;?>
</ul>