G2TT - A Google inspired mobile interface

Development-related discussion, including bundled plugins
G2TT-mobile
Bear Rating Disaster
Bear Rating Disaster
Posts: 52
Joined: 30 Mar 2013, 00:47

G2TT - A Google inspired mobile interface

Postby G2TT-mobile » 13 Apr 2013, 03:53

Update: G2TTRSS is on GitHub: https://github.com/g2ttrss/g2ttrss-mobile Latest version can be found there.

I am a switch over from Google Reader but almost solely used the mobile interface (and an iGoogle module if anyone wants to develop that). I came to these forums looking for a mobile interface that I was already familiar with and while I did not try them all, none of them seemed to be what I wanted.

I was inspired by j0nson's GReader-Like Mobile Version thread/app and started building off that using Google's CSS styles. Then I decided I wanted to do it all in javascript with no PHP and this is what I wrote.

Still to do:
- Search -- I see that the APIs support it and so eventually this will be included

Note: I am not a developer, and this is my first encounter of more than 3 lines of jQuery. As such this was a learning process and some of the later parts are "cleaner" than others and why I don't have a consistent style. Much of my code is built off of examples on the web (such as StackOverflow).
Attachments
g2tt-mobile.zip
Google inspired mobile interface for TT-RSS
(128.29 KiB) Downloaded 666 times
Last edited by G2TT-mobile on 16 Apr 2013, 22:37, edited 2 times in total.

Aldursil
Bear Rating Master
Bear Rating Master
Posts: 106
Joined: 18 Mar 2013, 03:11

Re: G2TT - A Google inspired mobile interface

Postby Aldursil » 13 Apr 2013, 07:13

I just tried this and cannot log in. No error messages are displayed.

G2TT-mobile
Bear Rating Disaster
Bear Rating Disaster
Posts: 52
Joined: 30 Mar 2013, 00:47

Re: G2TT - A Google inspired mobile interface

Postby G2TT-mobile » 13 Apr 2013, 07:44

Do you have external APIs enabled? The interface assumes it is in a subdirectory of tt-rss (such as example.com/tt-rss/m/ or example.com/tt-rss/mobile/). If both of these are true, then do you have enough know-how to look at the requests your browser is sending (such as Developer Tools in Chrome or firebug in FireFox)?

Aldursil
Bear Rating Master
Bear Rating Master
Posts: 106
Joined: 18 Mar 2013, 03:11

Re: G2TT - A Google inspired mobile interface

Postby Aldursil » 13 Apr 2013, 08:59

G2TT-mobile wrote:Do you have external APIs enabled? The interface assumes it is in a subdirectory of tt-rss (such as example.com/tt-rss/m/ or example.com/tt-rss/mobile/).


Yes to the above. I've attached a screenshot of the web console when I tried to log in.
Attachments
web_console.png
web_console.png (77.85 KiB) Viewed 20164 times

murf
Bear Rating Trainee
Bear Rating Trainee
Posts: 3
Joined: 05 Apr 2013, 10:56

Re: G2TT - A Google inspired mobile interface

Postby murf » 13 Apr 2013, 11:28

Please put it up on github, as j0nson did.

levito
Bear Rating Disaster
Bear Rating Disaster
Posts: 77
Joined: 17 Mar 2013, 04:18

Re: G2TT - A Google inspired mobile interface

Postby levito » 13 Apr 2013, 12:18

I see the error. Change lines 45-49 in g2tt.js to:

Code: Select all

var data = {
   'op': 'login',
   'user': values['Username'],
   'password': values['Passwd']
};


Looks nice!

G2TT-mobile
Bear Rating Disaster
Bear Rating Disaster
Posts: 52
Joined: 30 Mar 2013, 00:47

Re: G2TT - A Google inspired mobile interface

Postby G2TT-mobile » 13 Apr 2013, 18:07

Thanks levito! That's what I get for tweaking the login forms last minute. I'll try to get setup on GitHub this weekend.

Aldursil
Bear Rating Master
Bear Rating Master
Posts: 106
Joined: 18 Mar 2013, 03:11

Re: G2TT - A Google inspired mobile interface

Postby Aldursil » 13 Apr 2013, 20:01

That fixed it.

Could you add a log out entry to the menu? I wanted to try this on another account and I do not see how to log out. This looks really nice.

G2TT-mobile
Bear Rating Disaster
Bear Rating Disaster
Posts: 52
Joined: 30 Mar 2013, 00:47

Re: G2TT - A Google inspired mobile interface

Postby G2TT-mobile » 13 Apr 2013, 21:41

Alright, I've put it up on GitHub. https://github.com/g2ttrss/g2ttrss-mobile

Logout sounds like a good thing to have. I'll work on that next.

Thanks for the feedback everyone!

jonb
Bear Rating Trainee
Bear Rating Trainee
Posts: 19
Joined: 28 Mar 2013, 00:38

Re: G2TT - A Google inspired mobile interface

Postby jonb » 14 Apr 2013, 01:00

I posted this in the previous thread, but the problem still exists:

If I click on the Categories button in the upper left, I see a slew of the following error message repeated under the All Items category:

Code: Select all

Notice: Undefined index: type in /my-full-path/index.php on line 792


Any idea what's causing this? Under all these error messages, is my list of categories, which I can click on to get the messages in that category, but it's a long way to scroll.

Also, I would really like it if clicking on a category gave me a list of the threads in that category (that I could then click on) versus the current behavior where I see a list of messages from all the threads mixed together.

Tobi
Bear Rating Trainee
Bear Rating Trainee
Posts: 13
Joined: 17 Mar 2013, 19:35
Location: Hanover, Germany

Re: G2TT - A Google inspired mobile interface

Postby Tobi » 14 Apr 2013, 01:28

wow this theme looks exactly like google reader's one, great!
whats not working is the icon. so if you want to create a webapp out of it (save to homescreen), it's not displaying the icon (.png file you are providing with it).
everything else looks nice and since it's javascript it's loading pretty fast. great work dude!

G2TT-mobile
Bear Rating Disaster
Bear Rating Disaster
Posts: 52
Joined: 30 Mar 2013, 00:47

Re: G2TT - A Google inspired mobile interface

Postby G2TT-mobile » 14 Apr 2013, 04:22

jonb wrote:

Code: Select all

Notice: Undefined index: type in /my-full-path/index.php on line 792



You should definitely not be seeing this in the version I posted in this thread as it is no longer PHP and the main page is index.htm (which is less than 792 lines).

jonb wrote:Also, I would really like it if clicking on a category gave me a list of the threads in that category (that I could then click on) versus the current behavior where I see a list of messages from all the threads mixed together.


This feature is in the current version. The top level shows only categories because there are no category-less feeds in TT-RSS (they are in category Uncategorized). Selecting any of the categories should show subcategories first and then feeds under those.

Let me know if you are still having these issues with the latest version.

G2TT-mobile
Bear Rating Disaster
Bear Rating Disaster
Posts: 52
Joined: 30 Mar 2013, 00:47

Re: G2TT - A Google inspired mobile interface

Postby G2TT-mobile » 14 Apr 2013, 04:28

Tobi wrote:wow this theme looks exactly like google reader's one, great!
whats not working is the icon. so if you want to create a webapp out of it (save to homescreen), it's not displaying the icon (.png file you are providing with it).
everything else looks nice and since it's javascript it's loading pretty fast. great work dude!


Thanks Tobi! The save to homescreen shows the icon on my iPhone. Are you using an iPhone or iPad? I don't know if it is using a cached version on my phone. I'll try to look into it and see if I clear the cache or try on another device.

For anyone using other mobile OSes, another user supplied some code for adding to WIndows Phone for my older version. I'm look into porting it jQuery.

G2TT-mobile
Bear Rating Disaster
Bear Rating Disaster
Posts: 52
Joined: 30 Mar 2013, 00:47

Re: G2TT - A Google inspired mobile interface

Postby G2TT-mobile » 14 Apr 2013, 06:59

GitHub has been updated with logout feature. Any reason to also have the logout on the Category/Feed menu? Currently only when viewing the posts. It deletes all cookies so all your preferences are forgotten since this is not backed by a database.

Edit: I answered my own question and added the logout to Category/Feed.

Tobi
Bear Rating Trainee
Bear Rating Trainee
Posts: 13
Joined: 17 Mar 2013, 19:35
Location: Hanover, Germany

Re: G2TT - A Google inspired mobile interface

Postby Tobi » 14 Apr 2013, 16:44

G2TT-mobile wrote:
Tobi wrote:wow this theme looks exactly like google reader's one, great!
whats not working is the icon. so if you want to create a webapp out of it (save to homescreen), it's not displaying the icon (.png file you are providing with it).
everything else looks nice and since it's javascript it's loading pretty fast. great work dude!


Thanks Tobi! The save to homescreen shows the icon on my iPhone. Are you using an iPhone or iPad? I don't know if it is using a cached version on my phone. I'll try to look into it and see if I clear the cache or try on another device.

For anyone using other mobile OSes, another user supplied some code for adding to WIndows Phone for my older version. I'm look into porting it jQuery.

I'm using iPhone and iPad and it's not display on both devices.
In index.html you have to edit the path from:

Code: Select all

<link rel="apple-touch-icon-precomposed" href="/tt-rss/m/apple-touch-icon-precomposed.png" />

to:

Code: Select all

<link rel="apple-touch-icon-precomposed" href="apple-touch-icon-precomposed.png" />

my ttrss installation is placed in a folder called "rss", thats why it can't find/display the png ;)

another cool feature to add would be retina optimized graphics of your interface, just sayin...


Return to “Development”

Who is online

Users browsing this forum: No registered users and 4 guests