From dd001fd0f6faaf2332cd66cec1833bb36c280cfc Mon Sep 17 00:00:00 2001 From: ceee Date: Tue, 9 Jul 2013 22:57:45 +0200 Subject: [PATCH] add navigation; nuget code; --- .../Assets/Stylesheets/Config/_colors.scss | 2 +- .../Assets/Stylesheets/Interface/_main.scss | 81 ++- .../Assets/Stylesheets/Interface/_side.scss | 23 +- PocketSharp.Website/index.html | 466 ++++++++---------- 4 files changed, 296 insertions(+), 276 deletions(-) diff --git a/PocketSharp.Website/Assets/Stylesheets/Config/_colors.scss b/PocketSharp.Website/Assets/Stylesheets/Config/_colors.scss index 2427b50..3e49868 100644 --- a/PocketSharp.Website/Assets/Stylesheets/Config/_colors.scss +++ b/PocketSharp.Website/Assets/Stylesheets/Config/_colors.scss @@ -5,6 +5,6 @@ $darkColor: #1f2424; $lightColor: #f4f8f8; -$midColor: #5e6161; +$midColor: #d9dcdc; $textColor: white; \ No newline at end of file diff --git a/PocketSharp.Website/Assets/Stylesheets/Interface/_main.scss b/PocketSharp.Website/Assets/Stylesheets/Interface/_main.scss index bb368cb..b05ec1c 100644 --- a/PocketSharp.Website/Assets/Stylesheets/Interface/_main.scss +++ b/PocketSharp.Website/Assets/Stylesheets/Interface/_main.scss @@ -18,7 +18,7 @@ html, body body { - line-height: 1.2; + line-height: 1.3; color: $textColor; height: 100%; width: 100%; @@ -33,29 +33,6 @@ body -ms-touch-action: double-tap-zoom; } -// app area -.app -{ - width: 760px; - max-width: 100%; - margin: 0 auto; - padding: 100px 20px 0; - position: relative; - - @extend %clearfix; - - @media #{$small} - { - padding-top: 40px; - } -} - -.app-main -{ - width: 460px; - float: right; -} - // Get rid of gap under images by making them display: inline-block; by default img { @@ -79,4 +56,60 @@ object, embed .center { text-align: center; +} + +.article +{ + color: $midColor; +} + + +// app area +.app +{ + width: 860px; + max-width: 100%; + margin: 0 auto; + padding: 100px 20px 0; + position: relative; + + @extend %clearfix; + + @media #{$small} + { + padding-top: 40px; + } +} + +.app-main +{ + width: 500px; + float: right; +} + +.app-nav +{ + $height: 50px; + @extend %clearfix; + + margin-bottom: 40px; + + a + { + background: darken($darkColor, 2%); + display: inline-block; + height: $height + 3; + line-height: $height; + padding: 0 15px; + color: white; + float: left; + + &.is-active + { + background: darken($darkColor, 4%); + border-bottom: 3px solid $primaryColor; + } + &:first-child { border-radius: 4px 0 0 4px; } + &:last-child { border-radius: 0 4px 4px 0; } + } } \ No newline at end of file diff --git a/PocketSharp.Website/Assets/Stylesheets/Interface/_side.scss b/PocketSharp.Website/Assets/Stylesheets/Interface/_side.scss index e0c0c87..e8d2dc7 100644 --- a/PocketSharp.Website/Assets/Stylesheets/Interface/_side.scss +++ b/PocketSharp.Website/Assets/Stylesheets/Interface/_side.scss @@ -2,13 +2,28 @@ .app-side { - width: 240px; + width: 280px; float: left; + + h1 + { + //margin-bottom: 10px; + } } .app-description { - background: darken($darkColor, 2%); - border-radius: 4px; - padding: 20px; + margin: 10px 0 30px 0; + //color: $midColor; +} + +.app-nuget +{ + code + { + background: darken($darkColor, 2%); + border-radius: 4px; + padding: 10px 20px; + font-size: 12px; + } } \ No newline at end of file diff --git a/PocketSharp.Website/index.html b/PocketSharp.Website/index.html index 03873a6..ef83336 100644 --- a/PocketSharp.Website/index.html +++ b/PocketSharp.Website/index.html @@ -21,9 +21,9 @@ - + - +
@@ -34,286 +34,258 @@

PocketSharp is a C#.NET class library, that integrates the Pocket API v3

+
+ Install-Package PocketSharp +
-

-PocketSharp

+ +
-
-

This project is work in progress. -PocketSharp will be released as a NuGet package when ready.

-
- -

PocketSharp is a C#.NET class library, that integrates the Pocket API v3 and consists of 4 parts:

- -
    -
  • Authentication
    • -
  • Retrieve
    • -
  • Modify
    • -
  • Add
    • -

If you don't know Pocket, be sure to check it out. It's an awesome service that lets you save articles, videos, ... in the cloud and access it from all your devices.

- -

-Usage Example

- -

Request a Consumer Key on Pocket.

- -

Include the PocketSharp namespace and it's associated models (you will need them later):

- -
using PocketSharp;
-using PocketSharp.Models;
-
- -

Initialize PocketClient with:

- -
PocketClient _client = new PocketClient("[YOUR_CONSUMER_KEY]", "[YOUR_ACCESS_CODE]");
-
- -

Do a simple request - e.g. a search for CSS:

- -
_client.Search("css").ForEach(
-    item => Console.WriteLine(item.ID + " | " + item.Title)
-);
-
- -

Which will output:

- -
330361896 | CSS Front-end Frameworks with comparison : By usabli.ca
+        
PocketSharp and consists of 4 parts:

+        
    
+          
  • Authentication
    • 
+          
  • Retrieve
    • 
+          
  • Modify
    • 
+          
  • Add
    • 
+        

+        

+        
If you don't know Pocket, be sure to check it out. It's an awesome service that lets you save articles, videos, ... in the cloud and access it from all your devices.

+        

+        
Usage Example

+        
Request a Consumer Key on Pocket.

+        
Include the PocketSharp namespace and it's associated models (you will need them later):

+        

+          csharp
+using PocketSharp;
+using PocketSharp.Models;
+        

+        
Initialize PocketClient with:

+        

+          csharp
+PocketClient _client = new PocketClient("[YOUR_CONSUMER_KEY]", "[YOUR_ACCESS_CODE]");
+        

+        
Do a simple request - e.g. a search for CSS:

+        

+          csharp
+_client.Search("css").ForEach(
+	item => Console.WriteLine(item.ID + " | " + item.Title)
+);
+        

+        
Which will output:

+        
330361896 | CSS Front-end Frameworks with comparison : By usabli.ca
 345541438 | Editr - HTML, CSS, JavaScript playground
 251743431 | CSS Architecture
 343693149 | CSS3 Transitions - Thank God We Have A Specification!
 ...
 

 
-

-Create an instance

-
-
Constructor:

-
-
PocketClient(string consumerKey, string accessCode = null, Uri callbackUri = null)
-

-
-
consumerKey: The API key
-
accessCode: Provide an access code if the user is already authenticated
-
callbackUri: The callback URL is called by Pocket after authentication

-
-
Example:

-
-
PocketClient _client = new PocketClient(
-    consumerKey: "123498237423498723498723",
-    callbackUri: new Uri("http://ceecore.com"),
-    accessCode: "097809-oi987-izi8-jk98-oiuu89"
-);
-

-
-
You can change the Access Code after initialization:

-
-
_client.AccessCode = "[YOU_ACCESS_CODE]";
-

-
-
Before authentication you will need to provide the callbackUri for authentication requests.
-
After authentication you will need to provide the accessCode.

-
-

-Authentication

-
-
In order to communicate with a Pocket User, you will need a consumer key (which is generated by creating a new application on Pocket) and an Access Code.

-
-
The authentication is a 3-step process:

-
-

-1) Generate authentication URI

-
-
Receive the request code and authentication URI from the library by calling string GetRequestCode():

-
-
string requestCode = _client.GetRequestCode();
-// 0f453f2d-1605-8584-28fd-39af8e
-Uri authenticationUri = _client.GenerateAuthenticationUri();
-// https://getpocket.com/auth/authorize?request_token=0f453f2d-1605-8584-28fd-39af8e&redirect_uri=http%253a%252f%252fceecore.com
-

-
-
The request code is stored internally, but you can also provide it as param in GenerateAuthenticationUri(string requestCode = null).

-
-

-2) Redirect to Pocket

-
-
Next you need to redirect the user to the authenticationUri, which displays a prompt to grant permissions for the application (see image). After the user granted or denied, he/she is redirected to the callbackUri.

-
-
authentication screen

-
-

-3) Get Access Code

-
-
Call string GetAccessCode(string requestCode = null)

-
-
string accessCode = _client.GetAccessCode();
-// fa8bfc16-69b3-4d22-7db7-84a58d
-

-
-
Again, the received access code is stored internally.
-Note that GetAccessCode can only be called with an existing request code. If you need to re-authenticate a user, start again with Step 1).

-
-

-Important

-
-
Be sure to permanently store the Access Code for your user.
-

-Without it you would always have to redo the authentication process.

-
-

-Retrieve

-
-
Get list of all items:

-
-
List<PocketItem> items = _client.Retrieve();
-// equivalent to: _client.Retrieve(RetrieveFilter.All)
-

-
-
Find items by a tag:

-
-
List<PocketItem> items = _client.SearchByTag("tutorial");
-

-
-
Find items by a search string:

-
-
List<PocketItem> items = _client.Search("css");
-

-
-
Find items by a filter:

-
-
List<PocketItem> items = _client.Retrieve(RetrieveFilter.Favorite); // only favorites
-

-
-
The RetrieveFilter Enum is specified as follows:

-
-
enum RetrieveFilter { All, Unread, Archive, Favorite, Article, Video, Image }
-

-
-

-Custom Parameters

-
-
You can create a completely custom parameter list for retrieval with the POCO RetrieveParameters:

-
-
var parameters = new RetrieveParameters()
-{
-    Count = 50,
-    Offset = 100,
-    Sort = SortEnum.oldest
-    ...
-};
-
-List<PocketItem> items = _client.Retrieve(parameters);
-

-
-

-Add

-
-
Adds a new item to your pocket list.
-Accepts four parameters, with uri being required.

-
-
PocketItem Add(Uri uri, string[] tags = null, string title = null, string tweetID = null)
-

-
-
Example:

-
-
PocketItem newItem = _client.Add(
-    new Uri("http://www.neowin.net/news/full-build-2013-conference-sessions-listing-revealed"),
-    new string[] { "microsoft", "neowin", "build" }
-);
-

-
-
The title can be included for cases where an item does not have a title, which is typical for image or PDF URLs. If Pocket detects a title from the content of the page, this parameter will be ignored.

-
-
If you are adding Pocket support to a Twitter client, please send along a reference to the tweet status id (with the tweetID). This allows Pocket to show the original tweet alongside the article.

-
-

-Modify

-
-
All Modify methods accept either the itemID (as int) or a PocketItem as parameter.

-
-
Archive the specified item:

-
-
bool isSuccess = _client.Archive(myPocketItem);
+        
Create an instance

+        
Constructor:

+        

+          csharp
+PocketClient(string consumerKey, string accessCode = null, Uri callbackUri = null)
+        

+        

+          consumerKey: The API key
+          

+          accessCode: Provide an access code if the user is already authenticated
+          

+          callbackUri: The callback URL is called by Pocket after authentication
+        

+        
Example:

+        

+          csharp
+PocketClient _client = new PocketClient(
+	consumerKey: "123498237423498723498723",
+	callbackUri: new Uri("http://ceecore.com"),
+	accessCode: "097809-oi987-izi8-jk98-oiuu89"
+);
+        

+        
You can change the Access Code after initialization:

+        

+          csharp
+_client.AccessCode = "[YOU_ACCESS_CODE]";
+        

+        

+          Before authentication you will need to provide the callbackUri for authentication requests.
+          

+          After authentication you will need to provide the accessCode.
+        

+        
Authentication

+        
In order to communicate with a Pocket User, you will need a consumer key (which is generated by creating a new application on Pocket) and an Access Code.

+        
The authentication is a 3-step process:

+        
1) Generate authentication URI

+        
Receive the request code and authentication URI from the library by calling string GetRequestCode():

+        

+          csharp
+string requestCode = _client.GetRequestCode();
+// 0f453f2d-1605-8584-28fd-39af8e
+Uri authenticationUri = _client.GenerateAuthenticationUri();
+// https://getpocket.com/auth/authorize?request_token=0f453f2d-1605-8584-28fd-39af8e&redirect_uri=http%253a%252f%252fceecore.com
+        

+        
The request code is stored internally, but you can also provide it as param in GenerateAuthenticationUri(string requestCode = null).

+        
2) Redirect to Pocket

+        
Next you need to redirect the user to the authenticationUri, which displays a prompt to grant permissions for the application (see image). After the user granted or denied, he/she is redirected to the callbackUri.

+        

+          authentication screen

+        
3) Get Access Code

+        
Call string GetAccessCode(string requestCode = null)

+        

+          csharp
+string accessCode = _client.GetAccessCode();
+// fa8bfc16-69b3-4d22-7db7-84a58d
+        

+        

+          Again, the received access code is stored internally.
+Note that GetAccessCode can only be called with an existing request code. If you need to re-authenticate a user, start again with Step 1).
+        

+        
Important

+        

+          Be sure to permanently store the Access Code for your user.
+          

+          Without it you would always have to redo the authentication process.
+        

+        
Retrieve

+        
Get list of all items:

+        

+          csharp
+List<PocketItem> items = _client.Retrieve();
+// equivalent to: _client.Retrieve(RetrieveFilter.All)
+        

+        
Find items by a tag:

+        

+          csharp
+List<PocketItem> items = _client.SearchByTag("tutorial");
+        

+        
Find items by a search string:

+        

+          csharp
+List<PocketItem> items = _client.Search("css");
+        

+        
Find items by a filter:

+        

+          csharp
+List<PocketItem> items = _client.Retrieve(RetrieveFilter.Favorite); // only favorites
+        

+        
The RetrieveFilter Enum is specified as follows:

+        

+          csharp
+enum RetrieveFilter { All, Unread, Archive, Favorite, Article, Video, Image }
+        

+        
Custom Parameters

+        
You can create a completely custom parameter list for retrieval with the POCO RetrieveParameters:

+        

+          ```csharp
+var parameters = new RetrieveParameters()
+{
+	Count = 50,
+	Offset = 100,
+	Sort = SortEnum.oldest
+	...
+};
+        

+        

+          List
+          items = _client.Retrieve(parameters);
+```
+        

+        
Add

+        

+          Adds a new item to your pocket list.
+Accepts four parameters, with uri being required.
+        

+        

+          csharp
+PocketItem Add(Uri uri, string[] tags = null, string title = null, string tweetID = null)
+        

+        
Example:

+        

+          csharp
+PocketItem newItem = _client.Add(
+	new Uri("http://www.neowin.net/news/full-build-2013-conference-sessions-listing-revealed"),
+	new string[] { "microsoft", "neowin", "build" }
+);
+        

+        
The title can be included for cases where an item does not have a title, which is typical for image or PDF URLs. If Pocket detects a title from the content of the page, this parameter will be ignored.

+        
If you are adding Pocket support to a Twitter client, please send along a reference to the tweet status id (with the tweetID). This allows Pocket to show the original tweet alongside the article.

+        
Modify

+        
All Modify methods accept either the itemID (as int) or a PocketItem as parameter.

+        
Archive the specified item:

+        
bool isSuccess = _client.Archive(myPocketItem);
 

 
-
Un-archive the specified item:

-
-
bool isSuccess = _client.Unarchive(myPocketItem);
+        
Un-archive the specified item:

+        
bool isSuccess = _client.Unarchive(myPocketItem);
 

 
-
Favorites the specified item:

-
-
bool isSuccess = _client.Favorite(myPocketItem);
+        
Favorites the specified item:

+        
bool isSuccess = _client.Favorite(myPocketItem);
 

 
-
Un-favorites the specified item:

-
-
bool isSuccess = _client.Unfavorite(myPocketItem);
+        
Un-favorites the specified item:

+        
bool isSuccess = _client.Unfavorite(myPocketItem);
 

 
-
Deletes the specified item:

-
-
bool isSuccess = _client.Delete(myPocketItem);
+        
Deletes the specified item:

+        
bool isSuccess = _client.Delete(myPocketItem);
 

 
-

-Modify tags

-
-
Add tags to the specified item:

-
-
bool isSuccess = _client.AddTags(myPocketItem, new string[] { "css", "2013" });
+        
Modify tags

+        
Add tags to the specified item:

+        
bool isSuccess = _client.AddTags(myPocketItem, new string[] { "css", "2013" });
 

 
-
Remove tags from the specified item:

-
-
bool isSuccess = _client.RemoveTags(myPocketItem, new string[] { "css", "2013" });
+        
Remove tags from the specified item:

+        
bool isSuccess = _client.RemoveTags(myPocketItem, new string[] { "css", "2013" });
 

 
-
Remove all tags from the specified item:

-
-
bool isSuccess = _client.RemoveTags(myPocketItem);
+        
Remove all tags from the specified item:

+        
bool isSuccess = _client.RemoveTags(myPocketItem);
 

 
-
Replaces all existing tags with new ones for the specified item:

-
-
bool isSuccess = _client.ReplaceTags(myPocketItem, new string[] { "css", "2013" });
+        
Replaces all existing tags with new ones for the specified item:

+        
bool isSuccess = _client.ReplaceTags(myPocketItem, new string[] { "css", "2013" });
 

 
-
Renames a tag for the specified item:

-
-
bool isSuccess = _client.RenameTag(myPocketItem, "oldTagName", "newTagName");
+        
Renames a tag for the specified item:

+        
bool isSuccess = _client.RenameTag(myPocketItem, "oldTagName", "newTagName");
 

 
-

-Release History

+        

+        
Release History

+        
    
+          
  • 2013-07-07 v0.3.1 authentication fixes
    • 
+          
  • 2013-07-02 v0.3.0 update authentication process 
    • 
+          
  • 2013-06-27 v0.2.0 add, modify item & modify tags
    • 
+          
  • 2013-06-26 v0.1.0 authentication & retrieve functionality
    • 
+        

+        
Used Packages

+        
+        
Contributors

+        

+          | 
+            twitter/artistandsocial |
+|---|
+| Tobias Klika @ceee |
+        

 
-
    
-
  • 2013-07-07 v0.3.1 authentication fixes
    • 
-
  • 2013-07-02 v0.3.0 update authentication process 
    • 
-
  • 2013-06-27 v0.2.0 add, modify item & modify tags
    • 
-
  • 2013-06-26 v0.1.0 authentication & retrieve functionality
    • 
-

-Used Packages

 
-

-Contributors

-
-
-
-
-
-
-
-
-
twitter/artistandsocial
Tobias Klika @ceee
+
- \ No newline at end of file +