made add feed and add folder dialog client side to speed up displaying

6 files changed, 114 insertions, 99 deletions

diff --git a/css/news.css b/css/news.css
index d5637403b..1ad758805 100644
--- a/css/news.css
+++ b/css/news.css
@@ -77,7 +77,7 @@ div.add_parentfolder {
     position: relative;
     top: 0;
     height: 100%;
-    padding-bottom: 2.8em;
+    padding-bottom: 3em;
     box-sizing: border-box;
     -moz-box-sizing: border-box;
 }
@@ -515,6 +515,10 @@ div.add_parentfolder {
                 margin-left: 3em;
             }
 
+            .timestamp {
+                display: none;
+            }
+
             /**
              * Feed timestamp
              */
@@ -645,7 +649,7 @@ div.dialog {
     overflow: visible; 
 }
 
-#dropdownBtn { 
+.dropdownBtn { 
     width: 12.5em; 
     padding-left: 0; 
     padding-right:20px; 
@@ -654,7 +658,7 @@ div.dialog {
     overflow: hidden;
 }
 
-ul#dropdownmenu { 
+ul.dropdownmenu { 
     left: 0em; 
 }
 
diff --git a/js/main.js b/js/main.js
index 740e429cb..8032987ae 100644
--- a/js/main.js
+++ b/js/main.js
@@ -29,17 +29,40 @@ $(document).ready(function(){
     /* first run script ends */
 
     $('#addfeed').click(function() {
-        News.UI.overview('#addfeed_dialog','feeddialog.php');
+        $('#addfeed_dialog').dialog('open');
+        $('#feed_add_url').html('');
+
+        // populate folderlist
+        $('#addfeed_dialog .menu').empty();
+        
+        // http://9gag.com/trending
+
+        var $rootFolder = $('<li>').addClass('menuItem').html($('<b>').html(t('News', 'None')));
+        $rootFolder.click(function(){
+            News.DropDownMenu.selectItem(this, 0);
+        });
+        $('#addfeed_dialog .menu').append($rootFolder);        
+
+        $('#feeds .folder').each(function(){
+            var title = $(this).children('.title').html();
+            var id = parseInt($(this).data('id'));
+            var $folder = $('<li>').addClass('menuItem').html(title);
+            $folder.click(function(){
+                News.DropDownMenu.selectItem(this, id);
+            });
+            $('#addfeed_dialog .menu').append($folder);
+        });
     });
     
+    $('#addfolder').click(function() {
+        $('#addfolder_dialog').dialog('open');
+        $('#folder_add_name').val('');
+    });
+
     $('#addfeedbtn').click(function() {
         $(this).hide();
         $('#addfeed_dialog_firstrun').show();
     });
-    
-    $('#addfolder').click(function() {
-        News.UI.overview('#addfolder_dialog','folderdialog.php');
-    });
 
     $('#addfeedfolder').click(function(event) {
         News.DropDownMenu.fade($(this).children('ul'));
@@ -54,6 +77,24 @@ $(document).ready(function(){
         }
     });
 
+    $('#addfolder_dialog,#addfeed_dialog').dialog({
+        dialogClass:'dialog',
+        minWidth: 600,
+        autoOpen: false
+    }).css('overflow','visible');
+
+    $('#folder_add_submit').click(function(){
+        News.Folder.submit(this);
+    });
+
+    $('.dropdownBtn').click(function(){
+        News.DropDownMenu.dropdown(this);
+    });
+
+    $('#feed_add_submit').click(function(){
+        News.Feed.submit(this);
+    });
+
     $('#view').click(function(){
         var data = {};
         if($(this).hasClass('show_all')){
diff --git a/js/news.js b/js/news.js
index 2db512560..9ca511360 100644
--- a/js/news.js
+++ b/js/news.js
@@ -5,7 +5,7 @@ News = {
 			return false;
 		},
 		dropdown:function(button){
-			var list = $(button).parent().find('ul#dropdownmenu');
+			var list = $(button).parent().find('ul.dropdownmenu');
 			if (list.css('display') == 'none')
 				list.slideDown('fast').show();
 			else
@@ -15,31 +15,9 @@ News = {
 		},
 		selectItem:function(item, folderid){
 			var parent = $(item).parent().parent();
-			parent.find('#dropdownBtn').text($(item).text());
+			parent.find('.dropdownBtn').text($(item).text());
 			parent.find(':input[name="folderid"]').val(folderid);
-			parent.find('ul#dropdownmenu').slideUp('fast');
-		}
-	},
-	UI: {
-		overview:function(dialogtype, dialogfile){
-		    if($(dialogtype).dialog('isOpen') == true){
-				$(dialogtype).dialog('moveToTop');
-			}else{
-				$('#dialog_holder').load(OC.filePath('news', 'ajax', dialogfile), function(jsondata){
-					if(jsondata.status != 'error'){
-						$(dialogtype).dialog({
-							dialogClass:'dialog',
-							minWidth: 600,
-							close: function(event, ui) {
-								$(this).dialog('destroy').remove();
-							}
-						}).css('overflow','visible');
-					} else {
-						alert(jsondata.data.message);
-					}
-				});
-			}
-			return false;
+			parent.find('ul.dropdownmenu').slideUp('fast');
 		}
 	},
 	Folder: {
@@ -54,7 +32,7 @@ News = {
 			$(button).attr("disabled", true);
 			$(button).prop('value', t('news', 'Adding...'));
 
-			var folderid = $('#inputfolderid:input[name="folderid"]').val();
+			var folderid = 0;
 
 			var url;
 			url = OC.filePath('news', 'ajax', 'createfolder.php');
@@ -70,7 +48,7 @@ News = {
 							title: title
 						};
 						News.Objects.Menu.addNode(0, News.MenuNodeType.Folder, id, data);
-						$('#addfolder_dialog').dialog('destroy').remove();
+						$('#addfolder_dialog').dialog('close');
 					} else {
 						OC.dialogs.alert(jsondata.data.message, t('news', 'Error'));
 					}
@@ -96,9 +74,9 @@ News = {
 			
 			var folderid = 0;
 			if($('#firstrun').length == 0){
-				folderid = $('#inputfolderid:input[name="folderid"]').val();
+				folderid = $('#addfeed_dialog .inputfolderid').val();
 			}
-			console.log(folderid);
+
 			$.ajax({
 				type: "POST",
 				url: OC.filePath('news', 'ajax', 'createfeed.php'),
@@ -113,7 +91,6 @@ News = {
 							var $feed = $(jsondata.data.listfeed);
 							var title = $feed.children('.title').html();
 							var icon = $feed.children('.title').css('background-image').replace(/"/g,"").replace(/url\(|\)$/ig, "");;
-							console.log(icon);
 							var unreadCount = $feed.children('.unread_items_count').html();
 							var id = $feed.data('id');
 							var data = { 
@@ -124,7 +101,7 @@ News = {
 							News.Objects.Menu.addNode(folderid, News.MenuNodeType.Feed, id, data);
 							News.Objects.Menu.load(News.MenuNodeType.Feed, jsondata.data.feedid);
 
-							$('#addfeed_dialog').dialog('destroy').remove();
+							$('#addfeed_dialog').dialog('close');
 						} else {
 							OC.dialogs.alert(jsondata.data.message, t('news', 'Error'));
 						}
diff --git a/templates/main.php b/templates/main.php
index c0747066e..0e5680ce8 100644
--- a/templates/main.php
+++ b/templates/main.php
@@ -27,29 +27,25 @@ if($showAll){
 			</ul>
 		</div>
 	</div>
+	<div id="feed_settings">
+		<ul class="controls">
+			<li id="addfeedfolder" title="<?php echo $l->t('Add feed or folder'); ?>">
+				<button><img class="svg" src="<?php echo OCP\Util::linkTo('news', 'img/add.svg'); ?>" alt="<?php echo $l->t('Add Feed/Folder'); ?>" /></button>
+				<ul class="menu" id="feedfoldermenu">
+					<li id="addfeed"><?php echo $l->t('Feed'); ?></li>
+					<li id="addfolder"><?php echo $l->t('Folder'); ?></li>
+				</ul>
+			</li>
+			<li id="view" title="<?php echo $viewButtonTitle; ?>" class="<?php echo $viewButtonClass; ?>">
+				<button></button>
+			</li>
+			<li style="float: right">
+				<button id="settingsbtn" title="<?php echo $l->t('Settings'); ?>"><img class="svg" src="<?php echo OCP\Util::imagePath('core','actions/settings.png'); ?>" alt="<?php echo $l->t('Settings'); ?>"   /></button>
+			</li>
+		</ul>
+	</div>
 </div>
 
-<div id="feed_settings">
-	<ul class="controls">
-		<li id="addfeedfolder" title="<?php echo $l->t('Add feed or folder'); ?>">
-			<button><img class="svg" src="<?php echo OCP\Util::linkTo('news', 'img/add.svg'); ?>" alt="<?php echo $l->t('Add Feed/Folder'); ?>" /></button>
-			<ul class="menu" id="feedfoldermenu">
-				<li id="addfeed"><?php echo $l->t('Feed'); ?></li>
-				<li id="addfolder"><?php echo $l->t('Folder'); ?></li>
-			</ul>
-		</li>
-		<li id="view" title="<?php echo $viewButtonTitle; ?>" class="<?php echo $viewButtonClass; ?>">
-			<button></button>
-		</li>
-		<li style="float: right">
-			<button id="settingsbtn" title="<?php echo $l->t('Settings'); ?>"><img class="svg" src="<?php echo OCP\Util::imagePath('core','actions/settings.png'); ?>" alt="<?php echo $l->t('Settings'); ?>"   /></button>
-		</li>
-	</ul>
-</div>
-
-
-
-
 <div id="rightcontent" class="rightcontent" data-id="<?php echo $_['feedid']; ?>">
 	<?php
 			echo '<div id="feed_items">';
@@ -66,3 +62,39 @@ if($showAll){
 		echo $this->inc("part.nofeeds");
 	}
 ?>
+
+<div id="addfolder_dialog" title="<?php echo $l->t("Add Folder"); ?>">
+	<table width="100%" style="border: 0;">
+	<tr>
+		<td>Add new folder</td>
+		<td></td>
+	</tr>
+	<tr>
+		<td><input type="text" id="folder_add_name" placeholder="<?php echo $l->t('Folder name'); ?>" class="news_input" /></td>
+		<td><input type="submit" value="<?php echo $l->t('Add folder'); ?>" id="folder_add_submit" /></td>
+	</tr>
+	</table>
+</div>
+
+
+<div id="addfeed_dialog" title="<?php echo $l->t("Add Subscription"); ?>">
+	<table width="100%" style="border: 0;">
+	<tr>
+		<td>Add new feed</td>
+		<td>
+			<div class="add_parentfolder">
+				<button class="dropdownBtn">
+				    <?php echo $l->t('Choose folder'); ?>
+				</button>
+				<input class="inputfolderid" type="hidden" name="folderid" value="0" />
+				<ul class="menu dropdownmenu">
+				</ul>
+			</div>
+		</td>
+	</tr>
+	<tr>
+		<td><input type="text" id="feed_add_url" placeholder="<?php echo $l->t('Address'); ?>" class="news_input" /></td>
+		<td><input type="submit" value="<?php echo $l->t('Add'); ?>" id="feed_add_submit" /></td>
+	</tr>
+	</table>
+</div>
\ No newline at end of file
diff --git a/templates/part.feeddialog.php b/templates/part.feeddialog.php
deleted file mode 100644
index d03f04f24..000000000
--- a/templates/part.feeddialog.php
+++ /dev/null
@@ -1,23 +0,0 @@
-
-<div id="addfeed_dialog" title="<?php echo $l->t("Add Subscription"); ?>">
-<table width="100%" style="border: 0;">
-<tr>
-	<td>Add new feed</td>
-	<td>
-		<div class="add_parentfolder">
-			<button id="dropdownBtn" onclick="News.DropDownMenu.dropdown(this)">
-			    <?php echo $l->t('Choose folder'); ?>
-			</button>
-			<input id="inputfolderid" type="hidden" name="folderid" value="0" />
-			<ul class="menu" id="dropdownmenu">
-				<li style="margin-left: 0;" class="menuItem" onclick="News.DropDownMenu.selectItem(this, 0)"><b><?php echo $l->t('None'); ?></b></li>
-				<?php echo $this->inc("part.folderlist"); ?>
-			</ul>
-		</div>
-	</td>
-</tr>
-<tr>
-	<td><input type="text" id="feed_add_url" placeholder="<?php echo $l->t('Address'); ?>" class="news_input" /></td>
-	<td><input type="submit" value="<?php echo $l->t('Add'); ?>" onclick="News.Feed.submit(this)" id="feed_add_submit" /></td>
-</tr>
-</table>
\ No newline at end of file
diff --git a/templates/part.folderdialog.php b/templates/part.folderdialog.php
deleted file mode 100644
index e441e90a8..000000000
--- a/templates/part.folderdialog.php
+++ /dev/null
@@ -1,16 +0,0 @@
-
-<div id="addfolder_dialog" title="<?php echo $l->t("Add Folder"); ?>">
-<table width="100%" style="border: 0;">
-<tr>
-	<td>Add new folder</td>
-	<td>
-		<div class="add_parentfolder">
-			<input id="inputfolderid" type="hidden" name="folderid" value="0" />
-		</div>
-	</td>
-</tr>
-<tr>
-	<td><input type="text" id="folder_add_name" placeholder="<?php echo $l->t('Folder name'); ?>" class="news_input" /></td>
-	<td><input type="submit" value="<?php echo $l->t('Add folder'); ?>" onclick="News.Folder.submit(this)" id="folder_add_submit" /></td>
-</tr>
-</table>
\ No newline at end of file