dotlouis/cardboard

A better New Tab Page with sleek google design and useful features

Card Board

The default New Tab is not Google enough ? Try Cardboard, Now with more Material Design (plus nifty features)

Google + page

v2.1

##Installation

Warning: This is for development purpose and not the right way to get the extension for daily use. If you want the stable version head over the Chrome Web Store and install it from here.

1. bower install
2. Delete the bower_components/chrome-platform-analytics/src/ directory otherwise Chrome will complain about multiple manifest.json
3. Open chrome://extensions/
4. In top-right corner tick Developer Mode
5. Click Load unpack extension and choose the root cardboard folder

Notes on permissions

Some of theses permissions are not optional only due to manifest/API limitations: learn more

• storage: to save user's settings such as background image
• sessions: to retreive chrome sessions linked to your account and display them in a card
• browsingData: to allow the quick-settings card to remove your cache, cookies, history and local storage
• downloads: to display your recent downloads
• downloads.open: to open files you have downloaded from the download card
• system.cpu: to collect and display your computer's cpu usage
• system.memory: to collect and display your computer's memory usage
• system.storage: to collect and display your computer's storage usage
• https://hawttrends.appspot.com/api/terms/: to fetch google trends at this address
• [Optional] tabs: to show your recently closed tabs (session card)
• [Optional] topSites: to display your most visited websites
• [Optional] bookmarks: to display your bookmarks
• [Optional] management: to display your apps
• [Optional] history: to display your history

cardboard's Issues

FAB to add cards

A quicker and cleaner (i.e material) way to add cards to the feed instead of burring toggles into settings

Middle mouse click to open link in new tab

Analytics events are not triggered for links that open in the current tab

Google Analytics Tracker is only triggered if the user ctrl+click the link or app. (ie. in a background tab)
A simple click will open the link/app immediately in the current tab without registering the event.

Because ng-click propagates the $event before having the time to call any code.
The trick would be to remove any ng-href links and to handle the ctrl+click / click behaviour in a ng-click function.

More languages

Packery animation when object is created

Currently, packery animates the cards with a scale animation. A slide up animation would be more appropriate

Google Doodle ?

Find a way to incorporate the daily doodle into the page. Maybe won't worth the work.

[Download Card] Dropdown not initialised when a new download is created

the line that listen for a new download Chrome.downloads.onCreated.addListener() should init the jQuery dropdown but it does not work as expected.

Add shortcuts for chrome pages

A shortcut link or button would be nice for the following pages:

• chrome://settings
• chrome://extensions
• chrome://bookmarks
• chrome://downloads
• chrome://history

Google trend header ?

Like the Mac ScreenSaver

Pan background to choose which part to display in the header

Maybe after selecting the background, a modal appears and allows the user to pan the image to fit the header area represented in the modal. it would induce to calculate background-position.
Not top priority but could be feasible.

Changelog

A nice card that shows up after update like in 0.2.4.

Cards disappear

When I open new tab, cards "Quick Settings" and "Recent Downloads" just disappear.
After that sometimes it show again.

CPU, RAM and Storage data

With the help of these APIs:

• https://developer.chrome.com/extensions/system_cpu
• https://developer.chrome.com/extensions/system_memory
• https://developer.chrome.com/extensions/system_storage

Support touch for Chromebooks (and hopefully other devices in the future)

For example drag and drop of cards for reordering

Trends too high on wide displays

The font-size is a bit too high on wide display, causing some letters like "y" to go below the header.

Blurry font and icons on retina displays

Change CWS category to "productivity"

Current "Developper tools" category is not appropriate at all

Denying optional permission does not disable the card

If the user click deny it should disable the card.
Right now it does not and show a empty card with an error.

Only one toggle to enable and allow a card

Currently the app exposes two different ways to disable a card:

• By revoking the permission it ask for (if possible)
• Via a checkbox.

I think this exposes unnecessary complexity.
A simple toggle would be enough:
The first time the user switch it on, then it asks permission (if any) and (if granted) enables the card.
If the toggle is switched off, the card is disabled. The permission is not revoked.

However it could be a button in settings to revoke all permissions. (not individually)

App card does not update properly after removing an app

When deleting/removing a chrome application through the App Card, the UI does not remove the correct app. Besides it does not actually wait for the remove process to be done. So if you first answer "Yes" to the prompt then "No" to the native Chrome prompt, the app isn't deleted but the UI thinks it is.

Plain colors for header background

Remove redundant search field ?

Is the search field redundant with the omnibar ?
I think so and I don't see any reasons why someone would prefer it over the omnibar. It's slower, has no support for bookmarks, history and more. And does not use the search engine the user set for the browser.

Local and URL backgrounds are not persisted across refresh

When selecting a Local background or an URL background it works for the current session.
But on a new tab or after a refresh, the extension does not pick up the background and display a plain color header.

Click on links (app, bookmarks, topsites ...) opens in a new tab or current ?

Current behaviour is as follow

• on app: new tab
• on link: same tab

Something like left click: same tab and ctr/cmd + left click: new tab is the current behaviour for web links in chrome. it should be that way.
To goal is to unify these behaviours and maybe create a setting to change it.

Clearer, bigger font

Some people find the font size to be too small and without much contrast with the background (light grey on white)

Signed in devices' tabs

A card that shows the other devices signed in and their open tabs for quick and easy access

Add animations/transitions

Using angular animate.
Non exhaustive list:

• Cards staggering effect (see #39)
• Cards dimiss
• ink ripple to wipe screen

Recent history

Add setting system for cards

A settings system for each card to be able to store data of it's own (configurations etc...)

Click the header trend to search for it

More options!

Hey there, I really love your extension. Currently I'm only missing some options like being able to change the width and the amount of items of each container. That would be amazing.

Create a platform for developers to add their own cards ?

That way anyone can develop his favorite card and plug it in Card Board.
Big potential but beware of security issues and chrome web store policy

Recently closed tabs/windows on sync devices

https://developer.chrome.com/extensions/sessions

Cache templates / clean index.html

Find a way to load templates dynamically at the best time available (idle). Plus cache them using $templateCache

See http://stackoverflow.com/questions/12346690/is-there-a-way-to-make-angularjs-load-partials-in-the-beginning-and-not-at-when

Ok Google ?

Implement voice search.
Depends on the complexity

Onboarding Screen

Nice onboarding/welcome screen for new users

Reorder cards (drag & drop)

Most requested feature

System card shows "Nan undefined" storage volumes

Some machines have weird storage volumes.
Proposed solution: hide storage that have no defined name.

Chrome notification when download ends

Load city header from external source

Remove the city header images from the extension to drastically reduce the footprint.
Instead make them available through an url (github, imgur, whatever) that will be fetched when the user select the given background.

Google Calendar integration

Add support for a Calendar card with Google Calendar integration. Hopefully there's some sort of calendar API.

Tab indicator has incorrect width at init

At init:

After click on tab or viewport resize:

Integrate Analytics

More content in a card ?

For example for the bookmark card, it could be a show more button to display more bookmarks.
Same for downloads, top sites...

[App Card] Arrange app icons by frequency

Behaviour was present in v0.2.4

New system for selecting cards, displaying a new detailed screen

Let me explain:
Currently the is the only important element the interface has.
The goal would be to keep cards for small interactions, quick glances at recent data.
Leaving a more complete detailed view behind a click.

Let's take the bookmarks as an exemple:

Currently the card has 2 tabs: one that shows 5 most recent bookmarks, and one that shows a dead simple browser to navigated through the bookmarks folders.
But I foresee people (myself included) wanting more out of this card. Features like search or simply more screen estate to browse hundreds of bookmarked links and folders.
However stuffing so much data in a grid of cards interface is not ideal and can feel cluttered.
The solutions would be to use a common behaviour in real web apps, which is the use of a detailed view.

I can imagine something that would allow the user to click on the bookmark card. Then the user would be directed to an entire new view that would allow him to do more complex operations on bookmarks. (like search, delete, move)

This can implemented in house in a all in one manner (every view is packaged into cardboard) OR
This can be de-bundled in several add-ons that would override the default bookmarks page of chrome.
(see https://developer.chrome.com/extensions/override)

Anyway add a nice touch of animations and design and you can have a killer chrome extension.

Google I/O 15 Website

MD5 checker ?

CardBoard could check if the download match the MD5 found on the page and automatically authenticate it.
Maybe not possible because of limited permissions. Considering splitting the feature into another extension

Display trends based on location

The extension would display the trends based on the user location (country wide).
http://hawttrends.appspot.com/api/terms/ returns a JSON object which contains an arrays of trends.
Each array has a key (number) which can be associated with a country.
To see the list of country and their corresponding keys, head over http://www.google.com/trends/hottrends/visualize and look for the source code of the select button
which I'll copypasta here for convenience.

 <select id="region-select">
            <option value="0">All Regions</option>
            <option class="sort" value="30">Argentina</option>
            <option class="sort" value="8">Australia</option>
            <option class="sort" value="44">Austria</option>
            <option class="sort" value="41">Belgium</option>
            <option class="sort" value="18">Brazil</option>
            <option class="sort" value="13">Canada</option>
            <option class="sort" value="38">Chile</option>
            <option class="sort" value="32">Colombia</option>
            <option class="sort" value="43">Czech Republic</option>
            <option class="sort" value="49">Denmark</option>
            <option class="sort" value="29">Egypt</option>
            <option class="sort" value="50">Finland</option>
            <option class="sort" value="16">France</option>
            <option class="sort" value="15">Germany</option>
            <option class="sort" value="48">Greece</option>
            <option class="sort" value="10">Hong Kong</option>
            <option class="sort" value="45">Hungary</option>
            <option class="sort" value="3">India</option>
            <option class="sort" value="19">Indonesia</option>
            <option class="sort" value="6">Israel</option>
            <option class="sort" value="27">Italy</option>
            <option class="sort" value="4">Japan</option>
            <option class="sort" value="37">Kenya</option>
            <option class="sort" value="34">Malaysia</option>
            <option class="sort" value="21">Mexico</option>
            <option class="sort" value="17">Netherlands</option>
            <option class="sort" value="52">Nigeria</option>
            <option class="sort" value="51">Norway</option>
            <option class="sort" value="25">Philippines</option>
            <option class="sort" value="31">Poland</option>
            <option class="sort" value="47">Portugal</option>
            <option class="sort" value="39">Romania</option>
            <option class="sort" value="14">Russia</option>
            <option class="sort" value="36">Saudi Arabia</option>
            <option class="sort" value="5">Singapore</option>
            <option class="sort" value="40">South Africa</option>
            <option class="sort" value="23">South Korea</option>
            <option class="sort" value="26">Spain</option>
            <option class="sort" value="42">Sweden</option>
            <option class="sort" value="46">Switzerland</option>
            <option class="sort" value="12">Taiwan</option>
            <option class="sort" value="33">Thailand</option>
            <option class="sort" value="24">Turkey</option>
            <option class="sort" value="35">Ukraine</option>
            <option class="sort" value="9">United Kingdom</option>
            <option class="sort" value="1">United States</option>
            <option class="sort" value="28">Vietnam</option>
        </select>

[Windows] Visible scrollbar on cards messup the layout

The app card layout has been designed to be a grid of 3 column. However due to the large scrollbars on windows, the layout fallback to a 2 column layout.
Proposed solution: hide scrollbar

Reload packery layout when removing a card

If you remove a card, others will not take its place while they should.