You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@cordova.apache.org by db...@apache.org on 2015/08/22 00:55:18 UTC

[1/3] docs commit: Applying Richard's changes.

Repository: cordova-docs
Updated Branches:
  refs/heads/cordova-website 2c078dcff -> 786c1ab71


Applying Richard's changes.


Project: http://git-wip-us.apache.org/repos/asf/cordova-docs/repo
Commit: http://git-wip-us.apache.org/repos/asf/cordova-docs/commit/89d07741
Tree: http://git-wip-us.apache.org/repos/asf/cordova-docs/tree/89d07741
Diff: http://git-wip-us.apache.org/repos/asf/cordova-docs/diff/89d07741

Branch: refs/heads/cordova-website
Commit: 89d077412fa1f1e10c668c384ec090c1f946c531
Parents: 2b08a73
Author: Dmitry Blotsky <dm...@gmail.com>
Authored: Fri Aug 21 14:50:04 2015 -0700
Committer: Dmitry Blotsky <dm...@gmail.com>
Committed: Fri Aug 21 14:51:41 2015 -0700

----------------------------------------------------------------------
 www/static/css-src/_plugins.scss            |  13 +-
 www/static/plugins/app.js                   | 222 ++++++++++++++++++-----
 www/static/plugins/blacklisted-plugins.json |   2 +-
 www/static/plugins/official-plugins.json    |   2 +-
 www/static/plugins/platformbutton.jsx       |  32 +++-
 www/static/plugins/plugin.jsx               |  73 +++++---
 www/static/plugins/pluginlist.jsx           |  16 +-
 www/static/plugins/searchbar.jsx            |  15 +-
 www/static/plugins/sortbutton.jsx           |  15 ++
 www/static/plugins/sortdropdown.jsx         |  22 +++
 www/static/plugins/supportedplatforms.jsx   |  24 ++-
 11 files changed, 332 insertions(+), 104 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/89d07741/www/static/css-src/_plugins.scss
----------------------------------------------------------------------
diff --git a/www/static/css-src/_plugins.scss b/www/static/css-src/_plugins.scss
index afeb4e6..06a8d29 100644
--- a/www/static/css-src/_plugins.scss
+++ b/www/static/css-src/_plugins.scss
@@ -10,9 +10,9 @@ button.btn {
 
 	img {
 		float:left;
-		    padding-right: 20px;
+			padding-right: 20px;
 			padding-bottom: 20px;
-		    width: 84px;
+			width: 84px;
 	}
 }
 .plugins_links {
@@ -69,8 +69,8 @@ button.btn {
 }
 
 /***
-****	Plugins Results	
-****	
+****	Plugins Results
+****
 */
 
 .plugins-results-container {
@@ -81,6 +81,11 @@ button.btn {
 	margin-bottom:20px;
 	background-color:$gray-5;
 	position: relative;
+	.plugin-npm-command {
+		width:0px;
+		height:0px;
+		overflow:hidden;
+	}
 }
 .version_and_author {
 	display: inline-block;

http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/89d07741/www/static/plugins/app.js
----------------------------------------------------------------------
diff --git a/www/static/plugins/app.js b/www/static/plugins/app.js
old mode 100644
new mode 100755
index 3264567..5948833
--- a/www/static/plugins/app.js
+++ b/www/static/plugins/app.js
@@ -1,7 +1,9 @@
 var React           = window.React = require('react'), // assign it to window for react chrome extension
     SearchBar       = require('./searchbar.jsx'),
     PluginList      = require('./pluginlist.jsx'),
-    App             = {};
+    PlatformButton  = require('./platformbutton.jsx')
+    App             = {},
+    SortDropdown = require('./sortdropdown.jsx');
 
 var timer = null;
 var Constants = {
@@ -18,49 +20,72 @@ window.addEventListener('popstate', function(e) {
 
 var App = React.createClass({
     getInitialState: function() {
+        var staticFilters = [];
+        staticFilters['platforms'] = [];
+        staticFilters['authors'] = [];
+        staticFilters['licenses'] = [];
+        var platforms = App.getURLParameter('platforms');
+        if(platforms) {
+            staticFilters['platforms'] = staticFilters['platforms'].concat(platforms.split(','));
+        }
         var q = App.getURLParameter('q');
         if (q) {
             return {
                 plugins: [],
                 filterText: q,
                 placeHolderText: 'Loading...',
-                searchResults: []
-            }
+                searchResults: [],
+                staticFilters: staticFilters
+            };
         } else {
             return {
                 plugins: [],
                 filterText: '',
                 placeHolderText: 'Loading...',
-                searchResults: []
+                searchResults: [],
+                staticFilters: staticFilters
             };
         }
     },
     handleUserInput: function(filterText) {
         /* Routing logic */
-        var filterTextLowerCase = filterText.toLowerCase();
+        var platformFilters = this.state.staticFilters["platforms"];
         delay(function(){
-            window.history.pushState({"filterText":filterTextLowerCase}, "", "?q=" + filterTextLowerCase);
-            ga('send', 'pageview', '/index.html?q=' + filterTextLowerCase);
+            App.updateURL(filterText, platformFilters);
         }, 2000 );
 
         this.setState({
             filterText: filterText,
-            searchResults: App.filterPlugins(this.state.plugins, filterText)
+            searchResults: App.filterPlugins(this.state.plugins, filterText, this.state.staticFilters)
         });
     },
-    addCondition: function(condition) {
+    toggleCondition: function(keyword, condition) {
         this.setState(function(previousState, currentProps) {
-            if(previousState.filterText.indexOf(condition) > -1) {
-                return {
-                    filterText: previousState.filterText,
-                    plugins: previousState.plugins
-                };
+            var conditionIndex = previousState.staticFilters[keyword].indexOf(condition);
+            if(conditionIndex > -1) {
+                previousState.staticFilters[keyword].splice(conditionIndex, 1);
             }
             else {
-                return {
-                    filterText: previousState.filterText.trim() + ' ' + condition + ' ',
-                    plugins: previousState.plugins
-                };
+                previousState.staticFilters[keyword].push(condition);
+            }
+
+            delay(function(){
+                App.updateURL(previousState.filterText, previousState.staticFilters['platforms']);
+            }, 2000 );
+
+            return {
+                staticFilters: previousState.staticFilters,
+                plugins: previousState.plugins,
+                searchResults: App.filterPlugins(previousState.plugins, this.state.filterText, this.state.staticFilters)
+            };
+        });
+    },
+    setSort: function(sort) {
+        this.setState(function(previousState, currentProps) {
+            App.sortPlugins(previousState.plugins, sort)
+            return {
+                plugins: previousState.plugins,
+                searchResults: App.filterPlugins(previousState.plugins, this.state.filterText, this.state.staticFilters)
             }
         });
     },
@@ -89,7 +114,7 @@ var App = React.createClass({
         tagOfficialPlugins: function() {
 
         },
-        filterPlugins: function(plugins, filter) {
+        filterPlugins: function(plugins, filter, staticFilters) {
             var contains = function(values, pluginInfo) {
                 var allValuesPresent = true;
                 if(values.length == 0) {
@@ -151,18 +176,96 @@ var App = React.createClass({
             }
             var results = [];
             var filters = populateFilters(filter);
+
+            var combine = function(filter1, filter2) {
+                var result = [].concat(filter1)
+                for(var i = 0; i < filter2.length; i++) {
+                    if(result.indexOf(filter2[i]) === -1) {
+                        result.push(filter2[i])
+                    }
+                }
+                return result;
+            }
+
             for (var i = 0; i < plugins.length; i++) {
                 var plugin = plugins[i];
                 var fullPluginText = plugin.name.concat(plugin.author, plugin.keywords, plugin.license, plugin.description);
-                if(contains(filters['platforms'], plugin.keywords)
-                    && contains(filters['authors'], plugin.author)
-                    && contains(filters['licenses'], plugin.license)
+
+                if(contains(combine(filters['platforms'], staticFilters['platforms']), plugin.keywords)
+                    && contains(combine(filters['authors'], staticFilters['authors']), plugin.author)
+                    && contains(combine(filters['licenses'], staticFilters['licenses']), plugin.license)
                     && contains(filters['searchWords'], fullPluginText)) {
                         results.push(plugin);
                 }
             };
             return results;
-        }
+        },
+        sortPlugins: function(plugins, criteria) {
+            // Search results should be deterministic, so we need a secondary
+            // sort function for cases where the plugins are equal
+            var compareName = function(p1, p2) {
+                if(p1.name === p2.name) {
+                    return 0;
+                } else if(p1.name > p2.name) {
+                    return 1;
+                } else {
+                    return -1;
+                }
+            }
+            switch(criteria) {
+                case 'Downloads':
+                    plugins.sort(function(p1, p2) {
+                        if(p2.downloadCount === p1.downloadCount) {
+                            return compareName(p1, p2);
+                        };
+                        return p2.downloadCount - p1.downloadCount;
+                    });
+                    break;
+                case 'Recently Updated':
+                    plugins.sort(function(p1, p2) {
+                        if(p2.modified === p1.modified) {
+                            return compareName(p1, p2);
+                        };
+                        return p1.modified - p2.modified;
+                    });
+                    break;
+                case 'Quality':
+                default:
+                    plugins.sort(function(p1, p2) {
+                        if(p2.rating === p1.rating) {
+                            return compareName(p1, p2);
+                        };
+                        return p2.rating - p1.rating;
+                    });
+                    break;
+            }
+            return plugins;
+        },
+        updateURL: function(filterText, platformFilters) {
+            var query = "";
+            var stateObj = {};
+            if(filterText) {
+                var filterTextLowerCase = filterText;
+                query = "?q=" + filterTextLowerCase;
+                stateObj.filterText = filterTextLowerCase;
+            }
+
+            if(platformFilters.length > 0) {
+                if(!query) {
+                    query = "?platforms=";
+                } else {
+                    query = query + "&platforms=";
+                }
+                platformFilters.forEach(function(platform) {
+                    query = query + platform + ",";
+                });
+                query = query.slice(0, query.length - 1);
+                stateObj.platforms = platformFilters;
+            }
+
+            window.history.pushState(stateObj, "", query);
+            ga('send', 'pageview', '/index.html' + query);
+        },
     },
     componentDidMount: function() {
         var plugins = [],
@@ -171,17 +274,17 @@ var App = React.createClass({
             pluginCount = 0,
             self = this,
             queryHost = "http://npmsearch.com/query",
-            queryFields = "fields=name,keywords,license,description,author,modified,homepage,version",
+            queryFields = "fields=name,keywords,license,description,author,modified,homepage,version,rating",
             queryKeywords = "q=keywords:%22ecosystem:cordova%22",
             queryInitialSize = Constants.NpmSearchInitialSize;
 
-        xhrRequest(queryHost + "?" + queryFields + "&" + queryKeywords + "&size=" + queryInitialSize + "&start=0&sort=rating:desc", function(xhrResult) {
+        xhrRequest(queryHost + "?" + queryFields + "&" + queryKeywords + "&size=" + queryInitialSize + "&start=0", function(xhrResult) {
             plugins = xhrResult.results;
             pluginCount = xhrResult.total;
             if (pluginCount <= queryInitialSize) {
                 processPlugins.bind(self, officialPlugins, plugins)();
             } else {
-                xhrRequest(queryHost + "?" + queryFields + "&" + queryKeywords + "&size=" + (pluginCount - queryInitialSize) + "&start=" + queryInitialSize + "&sort=rating:desc", function(xhrResult) {
+                xhrRequest(queryHost + "?" + queryFields + "&" + queryKeywords + "&size=" + (pluginCount - queryInitialSize) + "&start=" + queryInitialSize, function(xhrResult) {
                         plugins = [].concat(plugins, xhrResult.results);
                         processPlugins.bind(self, officialPlugins, plugins)();
                 }, function() { console.log('xhr err'); });
@@ -201,17 +304,9 @@ var App = React.createClass({
                             }
                         }
 
-                        // If we were unable to do server side sorting because
-                        // we requested in multiple batches, do it in the client
-                        if(plugins.length > Constants.NpmSearchInitialSize) {
-                            plugins.sort(function(p1, p2) {
-                                return p2.downloadCount - p1.downloadCount;
-                            });
-                        }
-
                         that.setState({
                             plugins: plugins,
-                            searchResults: App.filterPlugins(plugins, this.state.filterText)
+                            searchResults: App.filterPlugins(plugins, this.state.filterText, this.state.staticFilters)
                         });
                     }.bind(self), function() { console.log('xhr err'); });
                     packageNames = "";
@@ -251,6 +346,9 @@ var App = React.createClass({
                 plugins[i].modified = Math.ceil((dateNow - new Date(plugins[i].modified)) / oneDay);
             };
 
+            // Initial sort is always on quality
+            plugins = App.sortPlugins(plugins, 'Quality');
+
             if (this.isMounted()) {
                 var q = App.getURLParameter('q');
                 if(q) {
@@ -258,14 +356,14 @@ var App = React.createClass({
                         plugins: plugins,
                         filterText: q,
                         placeHolderText: 'Search ' + pluginCount + ' plugins...',
-                        searchResults: App.filterPlugins(plugins, q)
+                        searchResults: App.filterPlugins(plugins, q, this.state.staticFilters)
                     });
                 }
                 else {
                     this.setState({
                         plugins: plugins,
                         placeHolderText: 'Search ' + pluginCount + ' plugins...',
-                        searchResults: plugins
+                        searchResults: App.filterPlugins(plugins, '', this.state.staticFilters)
                     });
                 }
                 getDownloadCount(plugins,this);
@@ -273,18 +371,50 @@ var App = React.createClass({
         }
     },
     render: function() {
+        var createPlatformButton = function(platform, keyword, state) {
+            var active = state.staticFilters["platforms"].indexOf(keyword) > -1;
+            return (
+                <PlatformButton platform={platform} keyword={keyword} initiallyActive={active}/>
+            );
+        }
         return (
             <div>
-                <div id="headblock">
-                    <div id="topcontent">
-                        <div id="pluggy"></div>
-                        <div id="discovermessage"><h1>Search Cordova Plugins</h1></div>
+                <div className="container">
+                    <div className="row">
+                        <div className="col-sm-12 text-center">
+                            <h1>Cordova Plugins</h1>
+                        </div>
+                    </div>
+                    <div className="row">
+                        <div className="col-sm-12">
+                        <SearchBar
+                            initialValue={this.state.filterText}
+                            placeHolderText={this.state.placeHolderText}
+                            onUserInput={this.handleUserInput}
+                        />
+                            <div className="plugins_links">
+                                    <ul className="nav nav-justified">
+                                    <li><a href="#"><span className="glyphicon glyphicon-plus"></span><i>&nbsp;</i>Contribute Plugins</a></li>
+                                    <li><a href="#"><span className="glyphicon glyphicon-question-sign"></span><i>&nbsp;</i>Plugin Help</a></li>
+                                    <li><a href="#"><span className="glyphicon glyphicon-alert"></span><i>&nbsp;</i>Plugin Issue Tracker</a></li>
+                                    </ul>
+                            </div>
+                        </div>
+                    </div>
+                    <div className="row filter-by-platforms">
+                        <div className="filter-by-platform-label"><span>Platform:</span></div>
+                        <ul className="nav nav-pills filter-by-platform-filters">
+                            {createPlatformButton("Android", "cordova-android", this.state)}
+                            {createPlatformButton("iOS", "cordova-ios", this.state)}
+                            {createPlatformButton("Windows 10", "cordova-windows", this.state)}
+                            {createPlatformButton("Blackberry", "cordova-blackberry10", this.state)}
+                            {createPlatformButton("Ubuntu", "cordova-ubuntu", this.state)}
+                            {createPlatformButton("Firefox OS", "cordova-firefoxos", this.state)}
+                            {createPlatformButton("WebOS", "cordova-webos", this.state)}
+                            {createPlatformButton("Fire OS", "cordova-amazon-fireos", this.state)}
+                            {createPlatformButton("Browser", "cordova-browser", this.state)}
+                        </ul>
                     </div>
-                    <SearchBar
-                        initialValue={this.state.filterText}
-                        placeHolderText={this.state.placeHolderText}
-                        onUserInput={this.handleUserInput}
-                    />
                 </div>
                 <PluginList plugins={this.state.searchResults} />
             </div>

http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/89d07741/www/static/plugins/blacklisted-plugins.json
----------------------------------------------------------------------
diff --git a/www/static/plugins/blacklisted-plugins.json b/www/static/plugins/blacklisted-plugins.json
old mode 100644
new mode 100755
index 946e82e..4836042
--- a/www/static/plugins/blacklisted-plugins.json
+++ b/www/static/plugins/blacklisted-plugins.json
@@ -5,4 +5,4 @@
         "cordova-app-hello-world",
         "delete-this"
     ]
-}
\ No newline at end of file
+}

http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/89d07741/www/static/plugins/official-plugins.json
----------------------------------------------------------------------
diff --git a/www/static/plugins/official-plugins.json b/www/static/plugins/official-plugins.json
old mode 100644
new mode 100755
index d220cfb..567ef1a
--- a/www/static/plugins/official-plugins.json
+++ b/www/static/plugins/official-plugins.json
@@ -23,4 +23,4 @@
         "cordova-plugin-vibration",
         "cordova-plugin-whitelist"
     ]
-}
\ No newline at end of file
+}

http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/89d07741/www/static/plugins/platformbutton.jsx
----------------------------------------------------------------------
diff --git a/www/static/plugins/platformbutton.jsx b/www/static/plugins/platformbutton.jsx
old mode 100644
new mode 100755
index 66b007b..0002284
--- a/www/static/plugins/platformbutton.jsx
+++ b/www/static/plugins/platformbutton.jsx
@@ -1,14 +1,38 @@
 var React = require('react');
 
 var PlatformButton = React.createClass({
+    getInitialState: function() {
+        return {
+            isActive: this.props.initiallyActive
+        };
+    },
     onClick: function() {
         var appInstance = React.render(<App />, document.getElementById('container'));
-        appInstance.addCondition("platform:" + this.props.platform);
+        appInstance.toggleCondition('platforms', this.props.keyword);
+        this.setState(function(prevState, currentProps) {
+            return {
+                isActive: !prevState.isActive
+            };
+        });
     },
     render: function() {
-        return (
-            <li className = "clickable" onClick={this.onClick}> {this.props.platform} </li>
-        );
+        if(this.state.isActive) {
+            return (
+                <li role="presentation" className="active" onClick={this.onClick}>
+                    <a href="#">
+                        <span className="glyphicon glyphicon-ok"></span><i>&nbsp;</i>{this.props.platform}
+                    </a>
+                </li>
+            );
+        } else {
+            return (
+                <li role="presentation" onClick={this.onClick}>
+                    <a href="#">
+                        {this.props.platform}
+                    </a>
+                </li>
+            );
+        }
     }
 });
 

http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/89d07741/www/static/plugins/plugin.jsx
----------------------------------------------------------------------
diff --git a/www/static/plugins/plugin.jsx b/www/static/plugins/plugin.jsx
old mode 100644
new mode 100755
index 0c5cb2f..7f7ae4b
--- a/www/static/plugins/plugin.jsx
+++ b/www/static/plugins/plugin.jsx
@@ -6,18 +6,38 @@ var Plugin = React.createClass({
     shouldComponentUpdate: function(nextProps, nextState) {
         return this.props.plugin !== nextProps.plugin;
     },
+    copyText: function() {
+        var range = document.createRange();
+        range.selectNode(document.getElementById("command-" + this.props.plugin.name));
+
+        var select = window.getSelection();
+        select.addRange(range);
+        try {
+            document.execCommand("copy");
+        } catch(error) {
+
+        }
+        select.removeAllRanges();
+    },
     render: function() {
         if(!this.props.plugin) {
             // Empty card with loading wheel
             return (
-                <li>
-                    <div className="pluginCard">
-                        <div style={{ textAlign: 'center', height: 10 + "rem"}}>
-                            <span style={{ display: 'inline-block', height: 100 + "%", verticalAlign: 'middle'}} />
-                            <img style={{verticalAlign: 'middle'}} src="img/loading.gif" />
+                // <li>
+                //     <div className="pluginCard">
+                //         <div style={{ textAlign: 'center', height: 10 + "rem"}}>
+                //             <span style={{ display: 'inline-block', height: 100 + "%", verticalAlign: 'middle'}} />
+                //             <img style={{verticalAlign: 'middle'}} src="img/loading.gif" />
+                //         </div>
+                //     </div>
+                // </li>
+                <div className="container plugin-results-result">
+                    <div className="row">
+                        <div className="col-sm-9">
+                            <h2>Loading...</h2>
                         </div>
                     </div>
-                </li>
+                </div>
             )
         }
 
@@ -26,6 +46,7 @@ var Plugin = React.createClass({
             license = license[0];
         }
         var downloadField;
+        var copyIcon;
         var npmLink = 'https://www.npmjs.com/package/' + this.props.plugin.name;
 
         var classes = classNames({
@@ -38,28 +59,32 @@ var Plugin = React.createClass({
             downloadField = <p><small> {downloadCount} downloads last month</small></p>;
         }
 
+        if(document.queryCommandSupported("copy")) {
+            copyIcon = (<img src="/static/img/copy-clipboard-icon.svg" className="plugins-copy-to-clipboard" onClick={this.copyText}/>)
+        }
+
         return (
-            <li>
-                <div className={classes}>
-                    <div className="primaryContent">
-                        <div className="header">
-                            <h3><a href={npmLink} onClick={trackOutboundLink.bind(this, npmLink)} target="_blank">{this.props.plugin.name}</a></h3>
-                            <small className="pluginVersion">v{this.props.plugin.version}</small>
-                            <small> by </small>
-                            <small className="pluginAuthor">{this.props.plugin.author}</small>
-                        </div>
-                        <div className="pluginDesc">{this.props.plugin.description}</div>
+            <div className="container plugin-results-result">
+                {copyIcon}
+                <div className="row">
+                    <div className="col-sm-9">
+                        <h2><a href={npmLink} onClick={trackOutboundLink.bind(this, npmLink)} target="_blank">{this.props.plugin.name}</a></h2>
+                        <p className="version_and_author">v{this.props.plugin.version} by <strong>{this.props.plugin.author}</strong></p>
                     </div>
-                    <div className="secondaryContent">
-                        <SupportedPlatforms keywords={this.props.plugin.keywords}/>
-                        <div className="extraInfo">
-                            <p><small><strong>License:</strong> {license}</small></p>
-                            {downloadField}
-                            <p><small><em>Last updated {this.props.plugin.modified} days ago</em></small></p>
-                        </div>
+                </div>
+                <div className="row">
+                    <div className="col-sm-8">
+                        <p>{this.props.plugin.description}</p>
+                    </div>
+                    <div className="col-sm-3 col-sm-offset-1">
+                        <hr className="visible-xs results-divider-line"/>
+                        <p className="license">{license}</p>
+                        <p className="downloads"><strong>{downloadCount}</strong> downloads last month</p>
+                        <p className="last-updated">Last updated <strong>{this.props.plugin.modified} days ago</strong></p>
                     </div>
+                    <div className="plugin-npm-command" id={"command-" + this.props.plugin.name}>{"npm install " + this.props.plugin.name}</div>
                 </div>
-            </li>
+            </div>
         )
     }
 });

http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/89d07741/www/static/plugins/pluginlist.jsx
----------------------------------------------------------------------
diff --git a/www/static/plugins/pluginlist.jsx b/www/static/plugins/pluginlist.jsx
old mode 100644
new mode 100755
index 0868979..4d83a09
--- a/www/static/plugins/pluginlist.jsx
+++ b/www/static/plugins/pluginlist.jsx
@@ -30,10 +30,8 @@ var PluginList = React.createClass({
             };
 
             return (
-                <div className="contentwrap">
-                    <ul className="pluginList">
-                        {emptyPluginList}
-                    </ul>
+                <div className="container plugins-results-container">
+                    {emptyPluginList}
                 </div>
             )
         } else {
@@ -52,10 +50,8 @@ var PluginList = React.createClass({
 
             if (plugins.length === 0) {
                 return (
-                    <div className="contentwrap">
-                        <div className="pluginEmptyMessage">
+                    <div className="container plugins-results-container">
                             No plugins found. Learn how to <a href="http://cordova.apache.org/docs/en/edge/guide_hybrid_plugins_index.md.html#Plugin%20Development%20Guide">create one</a>
-                        </div>
                     </div>
                 );
             } else {
@@ -67,10 +63,8 @@ var PluginList = React.createClass({
                     }
                 };
                 return (
-                    <div className="contentwrap">
-                        <ul className="pluginList">
-                            {visiblePlugins}
-                        </ul>
+                    <div className="container plugins-results-container">
+                        {visiblePlugins}
                         {showMore}
                     </div>
                 );

http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/89d07741/www/static/plugins/searchbar.jsx
----------------------------------------------------------------------
diff --git a/www/static/plugins/searchbar.jsx b/www/static/plugins/searchbar.jsx
old mode 100644
new mode 100755
index 75a4569..16e33ad
--- a/www/static/plugins/searchbar.jsx
+++ b/www/static/plugins/searchbar.jsx
@@ -39,17 +39,20 @@ var SearchBar = React.createClass({
 
     render: function() {
         return (
-                <div className="contentwrap">
-                    <div id="search">
+                <div className="plugins_search_container">
+                    <div className="input-group">
                         <input
-                            className="searchBox"
-                            type="search"
+                            className="form-control"
+                            type="text"
                             autoComplete="off"
-                            placeholder={this.props.placeHolderText}
+                            placeholder="Find a Plugin..."
                             value={this.state.textValue}
                             onChange={this.handleChange}
                             ref="filterTextInput"
-                        />
+                            />
+                        <span className="input-group-btn">
+                            <button className="btn btn-default" type="button"><span className="glyphicon glyphicon-search"></span></button>
+                        </span>
                     </div>
                 </div>
         );

http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/89d07741/www/static/plugins/sortbutton.jsx
----------------------------------------------------------------------
diff --git a/www/static/plugins/sortbutton.jsx b/www/static/plugins/sortbutton.jsx
new file mode 100755
index 0000000..e9d321d
--- /dev/null
+++ b/www/static/plugins/sortbutton.jsx
@@ -0,0 +1,15 @@
+var React = require('react');
+
+var SortButton = React.createClass({
+    onClick: function() {
+        var appInstance = React.render(<App />, document.getElementById('container'));
+        appInstance.setSort(this.props.criteria);
+    },
+    render: function() {
+        return (
+            <li className="clickable" onClick={this.onClick}><a>{this.props.criteria}</a></li>
+        );
+    }
+});
+
+module.exports = SortButton;

http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/89d07741/www/static/plugins/sortdropdown.jsx
----------------------------------------------------------------------
diff --git a/www/static/plugins/sortdropdown.jsx b/www/static/plugins/sortdropdown.jsx
new file mode 100755
index 0000000..511c657
--- /dev/null
+++ b/www/static/plugins/sortdropdown.jsx
@@ -0,0 +1,22 @@
+var React = require('react');
+var SortButton = require('./sortbutton.jsx');
+
+var SortDropdown = React.createClass({
+    render: function() {
+        return (
+            <div className="dropdown">
+                <button className="btn btn-default dropdown-toggle" type="button" id="sortdropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+                    Sort
+                    <span className="caret"></span>
+                </button>
+                <ul className="dropdown-menu" aria-labelledby="sortdropdown">
+                    <SortButton criteria="Quality"/>
+                    <SortButton criteria="Recently Updated"/>
+                    <SortButton criteria="Downloads"/>
+                </ul>
+            </div>
+        );
+    }
+});
+
+module.exports = SortDropdown;

http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/89d07741/www/static/plugins/supportedplatforms.jsx
----------------------------------------------------------------------
diff --git a/www/static/plugins/supportedplatforms.jsx b/www/static/plugins/supportedplatforms.jsx
old mode 100644
new mode 100755
index f6de778..83df2b9
--- a/www/static/plugins/supportedplatforms.jsx
+++ b/www/static/plugins/supportedplatforms.jsx
@@ -12,9 +12,19 @@ var SupportedPlatforms = React.createClass({
             moreClicked: true
         });
     },
+    componentWillReceiveProps: function(nextProps) {
+        this.setState({
+            moreClicked: false
+        });
+    },
     render: function() {
         var keywords = this.props.keywords;
-        var sortedMajorPlatforms = [{present:false, text: "Android"}, {present:false, text: "iOS"}, {present:false, text: "Windows"}, {present:false, text: "Blackberry10"}];
+        var sortedMajorPlatforms = [
+            {present:false, text: "Android", keyword:"cordova-android"},
+            {present:false, text: "iOS", keyword:"cordova-ios"},
+            {present:false, text: "Windows", keyword:"cordova-windows"},
+            {present:false, text: "Blackberry10", keyword:"cordova-blackberry10"}
+        ];
         var majorPlatformsSupported = [];
         var otherPlatformsSupported = [];
         // remove windows8 & windows dupe
@@ -24,16 +34,16 @@ var SupportedPlatforms = React.createClass({
         keywords.forEach(function(keyword) {
             switch (keyword) {
                 case 'cordova-firefoxos':
-                    otherPlatformsSupported.push(<PlatformButton platform="FirefoxOS" />);
+                    otherPlatformsSupported.push(<PlatformButton platform="FirefoxOS" keyword={keyword} />);
                     break;
                 case 'cordova-android':
                     sortedMajorPlatforms[0].present = true;
                     break;
                 case 'cordova-amazon-fireos':
-                    otherPlatformsSupported.push(<PlatformButton platform="FireOS" />);
+                    otherPlatformsSupported.push(<PlatformButton platform="FireOS" keyword={keyword} />);
                     break;
                 case 'cordova-ubuntu':
-                    otherPlatformsSupported.push(<PlatformButton platform="Ubuntu" />);
+                    otherPlatformsSupported.push(<PlatformButton platform="Ubuntu" keyword={keyword} />);
                     break;
                 case 'cordova-ios':
                     sortedMajorPlatforms[1].present = true;
@@ -42,21 +52,21 @@ var SupportedPlatforms = React.createClass({
                     sortedMajorPlatforms[3].present = true;
                     break;
                 case 'cordova-wp8':
-                    otherPlatformsSupported.push(<PlatformButton platform="Windows Phone 8" />);
+                    otherPlatformsSupported.push(<PlatformButton platform="Windows Phone 8" keyword={keyword} />);
                     break;
                 case 'cordova-windows8':
                 case 'cordova-windows':
                     sortedMajorPlatforms[2].present = true;
                     break;
                 case 'cordova-browser':
-                    otherPlatformsSupported.push(<PlatformButton platform="Browser" />);
+                    otherPlatformsSupported.push(<PlatformButton platform="Browser" keyword={keyword} />);
                     break;
             }
         });
 
         sortedMajorPlatforms.forEach(function(platform) {
             if(platform.present) {
-                majorPlatformsSupported.push(<PlatformButton platform={platform.text} />)
+                majorPlatformsSupported.push(<PlatformButton platform={platform.text} keyword={platform.keyword}/>)
             }
         });
         while(majorPlatformsSupported.length < 4 && otherPlatformsSupported.length > 0) {


---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@cordova.apache.org
For additional commands, e-mail: commits-help@cordova.apache.org


[2/3] docs commit: Fixing history.

Posted by db...@apache.org.
Fixing history.


Project: http://git-wip-us.apache.org/repos/asf/cordova-docs/repo
Commit: http://git-wip-us.apache.org/repos/asf/cordova-docs/commit/2b08a738
Tree: http://git-wip-us.apache.org/repos/asf/cordova-docs/tree/2b08a738
Diff: http://git-wip-us.apache.org/repos/asf/cordova-docs/diff/2b08a738

Branch: refs/heads/cordova-website
Commit: 2b08a73838ffdc500e9bcbf723e2c62fdf14677b
Parents: 2c078dc
Author: Dmitry Blotsky <dm...@gmail.com>
Authored: Fri Aug 21 14:43:57 2015 -0700
Committer: Dmitry Blotsky <dm...@gmail.com>
Committed: Fri Aug 21 14:51:41 2015 -0700

----------------------------------------------------------------------
 www/_includes/footer.html              |   2 +-
 www/index.html                         |  34 +++++-
 www/plugins/index.html                 | 177 +++++++++++-----------------
 www/plugins/plugins_initial.html       | 146 +++++++++++++++++++++++
 www/static/css-src/_contribute.scss    |   2 +-
 www/static/css-src/_home.scss          |  37 +++++-
 www/static/css-src/_plugins.scss       |  52 ++++++++
 www/static/css-src/main.scss           |  20 +++-
 www/static/img/copy-clipboard-icon.svg |  15 +++
 www/static/js/main.js                  |  22 ++--
 10 files changed, 379 insertions(+), 128 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/2b08a738/www/_includes/footer.html
----------------------------------------------------------------------
diff --git a/www/_includes/footer.html b/www/_includes/footer.html
index 5a41245..c694c41 100644
--- a/www/_includes/footer.html
+++ b/www/_includes/footer.html
@@ -48,7 +48,7 @@
             </div>
             <div class="col-sm-3">
                 <h1>Contribute</h1>
-                <p><strong>Help Cordova move forward!</strong></p>
+                <p style="padding-top:20px"><strong>Help Cordova move forward!</strong></p>
                 <p>Report bugs, improve the docs, or contribute to the code.</p>
                 <a href="{{ site.baseurl }}/contribute" class="btn btn-lg btn-primary">
                     Learn More

http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/2b08a738/www/index.html
----------------------------------------------------------------------
diff --git a/www/index.html b/www/index.html
index f8c68eb..acdcf50 100644
--- a/www/index.html
+++ b/www/index.html
@@ -39,20 +39,20 @@ permalink: /
             <div class="row">
                 <div class="col-xs-4">
                     <div class="row">
-                        <div class="col-sm-3"><div class="sprite_img" id="sprite_shared_code"></div></div>
-                        <div class="col-sm-9"><div class="value_prop"><p>100% shared code across platforms</p></div></div>
+                        <div class="col-sm-4 col-md-3"><div class="sprite_img" id="sprite_shared_code"></div></div>
+                        <div class="col-sm-8 col-md-9"><div class="value_prop"><p>100% shared code across platforms</p></div></div>
                     </div>
                 </div>
                 <div class="col-xs-4">
                     <div class="row">
-                        <div class="col-sm-3"><div class="sprite_img" id="sprite_offline"></div></div>
-                        <div class="col-sm-9"><div class="value_prop">Support for offline scenarios</div></div>
+                        <div class="col-sm-4 col-md-3"><div class="sprite_img" id="sprite_offline"></div></div>
+                        <div class="col-sm-8 col-md-9"><div class="value_prop"><p>Support for offline scenarios</p></div></div>
                     </div>
                 </div>
                 <div class="col-xs-4">
                     <div class="row">
-                        <div class="col-sm-3"><div class="sprite_img" id="sprite_apis"></div></div>
-                        <div class="col-sm-9"><div class="value_prop">Access native Device APIs</div></div>
+                        <div class="col-sm-4 col-md-3"><div class="sprite_img" id="sprite_apis"></div></div>
+                        <div class="col-sm-8 col-md-9"><div class="value_prop"><p>Access native Device APIs</p></div></div>
                     </div>
                 </div>
             </div>
@@ -209,3 +209,25 @@ permalink: /
 <script src="../../dist/js/bootstrap.min.js"></script>
 <!-- IE10 viewport hack for Surface/desktop Windows 8 bug -->
 <script src="../../assets/js/ie10-viewport-bug-workaround.js"></script>
+<script>
+        //Smooth scroll to anchor links
+    	$("#navbar ul li a[href^='/#']").on('click', function(e) { 
+		// prevent default anchor click behavior
+		console.log('Scrolled to where you asked');
+		e.preventDefault();
+
+		// store hash
+		var hash = this.hash;
+		
+		// animate
+		$('html, body').animate({
+			scrollTop: $(hash).offset().top
+			}, 300, function(){
+		
+			// when done, add hash to url
+			// (default click behaviour)
+			window.location.hash = hash;
+			});
+		
+	});
+</script>
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/2b08a738/www/plugins/index.html
----------------------------------------------------------------------
diff --git a/www/plugins/index.html b/www/plugins/index.html
index a46deb5..d135328 100644
--- a/www/plugins/index.html
+++ b/www/plugins/index.html
@@ -23,124 +23,91 @@ plugins_tab: true
                         <button class="btn btn-default" type="button"><span class="glyphicon glyphicon-search"></span></button>
                     </span>
                 </div>
-                <div class="whatisplugin_box">
-                    <img src="{{ site.baseurl }}/static/img/pluggy.png"/>
-                    <h2>What is a Cordova plugin?</h2>
-                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc nec ante placerat, gravida ligula in, interdum mauris. Sed quis est vel erat vestibulum volutpat in vitae.  <a href="#">Learn more...</a></p>
-                </div>
-                <div class="clearfix"></div>
-
             </div>
             <div class="plugins_links">
                     <ul class="nav nav-justified">
                     <li><a href="#"><span class="glyphicon glyphicon-plus"></span><i>&nbsp;</i>Contribute Plugins</a></li>
                     <li><a href="#"><span class="glyphicon glyphicon-question-sign"></span><i>&nbsp;</i>Plugin Help</a></li>
-                    <li><a href="#"><span class="glyphicon glyphicon-alert"></span><i>&nbsp;</i>Plugin Issue Trakcer</a></li>
+                    <li><a href="#"><span class="glyphicon glyphicon-alert"></span><i>&nbsp;</i>Plugin Issue Tracker</a></li>
                     </ul>
             </div>
             <!-- /input-group -->
         </div>
     </div>
-
-    <div class="row">
-        <div class="col-sm-6">
-            <div class="well featured-list">
-                <h2>Most Downloaded</h2>
-                <ul>
-                    <li>
-                        <div class="progress">
-                            <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"
-                            style="width: 40%">
-                                <span class="sr-only">40% Complete (success)</span>
-                            </div>
-                        </div>
-                        <span class="plugin">Cordova Device</span>
-                        <span class="plugin-stats">2,339,658</span>
-                    </li>
-                    <li>
-                        <div class="progress">
-                            <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"
-                            style="width: 40%">
-                                <span class="sr-only">40% Complete (success)</span>
-                            </div>
-                        </div>
-                        <span class="plugin">Cordova Device</span>
-                        <span class="plugin-stats">2,339,658</span>
-                    </li>
-                    <li>
-                        <div class="progress">
-                            <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"
-                            style="width: 40%">
-                                <span class="sr-only">40% Complete (success)</span>
-                            </div>
-                        </div>
-                        <span class="plugin">Cordova Device</span>
-                        <span class="plugin-stats">2,339,658</span>
-                    </li>
-                    <li>
-                        <div class="progress">
-                            <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"
-                            style="width: 40%">
-                                <span class="sr-only">40% Complete (success)</span>
-                            </div>
-                        </div>
-                        <span class="plugin">Cordova Device</span>
-                        <span class="plugin-stats">2,339,658</span>
-                    </li>
-                    <li>
-                        <div class="progress">
-                            <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"
-                            style="width: 40%">
-                                <span class="sr-only">40% Complete (success)</span>
-                            </div>
-                        </div>
-                        <span class="plugin">Cordova Device</span>
-                        <span class="plugin-stats">2,339,658</span>
-                    </li>
-                    <li>
-                        <div class="progress">
-                            <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"
-                            style="width: 40%">
-                                <span class="sr-only">40% Complete (success)</span>
-                            </div>
-                        </div>
-                        <span class="plugin">Cordova Device</span>
-                        <span class="plugin-stats">2,339,658</span>
-                    </li>
-                    <li>
-                        <div class="progress">
-                            <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"
-                            style="width: 40%">
-                                <span class="sr-only">40% Complete (success)</span>
-                            </div>
-                        </div>
-                        <span class="plugin">Cordova Device</span>
-                        <span class="plugin-stats">2,339,658</span>
-                    </li>
-                </ul>
-
-            </div>
+    <div class="row filter-by-platforms">
+        <div class="filter-by-platform-label"><span>Platform:</span></div>
+        <ul class="nav nav-pills filter-by-platform-filters">
+            <li role="presentation" class="active"><a href="#"><span class="glyphicon glyphicon-ok"></span><i>&nbsp;</i>Android</a></li>
+            <li role="presentation" class="active"><a href="#"><span class="glyphicon glyphicon-ok"></span><i>&nbsp;</i>iOS</a></li>
+            <li role="presentation" class="active"><a href="#"><span class="glyphicon glyphicon-ok"></span><i>&nbsp;</i>Windows 10</a></li>
+            <li role="presentation"><a href="#">Blackberry</a></li>
+            <li role="presentation"><a href="#">Ubuntu</a></li>
+            <li role="presentation"><a href="#">Firefox OS</a></li>
+            <li role="presentation"><a href="#">WebOS</a></li>
+            <li role="presentation"><a href="#">Fire OS</a></li>
+        </ul>
+    </div>
+</div>
+<div class="container plugins-results-container">
+    <div class="container plugin-results-result">
+        <img src="{{ site.baseurl }}/static/img/copy-clipboard-icon.svg" class="plugins-copy-to-clipboard"/>
+        <div class="row">
+            <div class="col-sm-9">
+                <h2><a href="">cordova-plugin-android-idfa</a></h2>
+                <p class="version_and_author">v1.04 by <strong>praves</strong></p>
+            </div>       
         </div>
-        <div class="col-sm-6">
-            <div class="well">
-                <h2 class="featured-list-header text-center">Most Downloaded</h2>
-                <ul class="featured-list">
-                    <li>
-                        <div class="progress">
-                            <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"
-                            style="width: 40%">
-                                <span class="sr-only">40% Complete (success)</span>
-                            </div>
-                        </div>
-                        <span class="plugin">Cordova Device</span>
-                        <span class="plugin-stats">2,339,658</span>
-                    </li>
-                </ul>
-
+        <div class="row">
+            <div class="col-sm-8">
+                <p>Cordova Advertising ID (IDFA) Plugin for Android using Google Play Services API Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p>
+            </div>
+            <div class="col-sm-3 col-sm-offset-1">
+                <hr class="visible-xs results-divider-line">
+                <p class="license">License</p>
+                <p class="downloads"><strong>114</strong> downloads last month</p>
+                <p class="last-updated">Last updated <strong>21 days ago</strong></p>
             </div>
         </div>
     </div>
-
-
+    <div class="container plugin-results-result">
+        <img src="{{ site.baseurl }}/static/img/copy-clipboard-icon.svg" class="plugins-copy-to-clipboard"/>
+        <div class="row">
+            <div class="col-sm-9">
+                <h2><a href="">cordova-plugin-android-idfa</a></h2>
+                <p class="version_and_author">v1.04 by <strong>praves</strong></p>
+            </div>       
+        </div>
+        <div class="row">
+            <div class="col-sm-8">
+                <p>Cordova Advertising ID (IDFA) Plugin for Android using Google Play Services API Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p>
+            </div>
+            <div class="col-sm-3 col-sm-offset-1">
+                <hr class="visible-xs results-divider-line">
+                <p class="license">License</p>
+                <p class="downloads"><strong>114</strong> downloads last month</p>
+                <p class="last-updated">Last updated <strong>21 days ago</strong></p>
+            </div>
+        </div>
+    </div> 
+    <div class="container plugin-results-result">
+        <img src="{{ site.baseurl }}/static/img/copy-clipboard-icon.svg" class="plugins-copy-to-clipboard"/>
+        <div class="row">
+            <div class="col-sm-9">
+                <h2><a href="">cordova-plugin-android-idfa</a></h2>
+                <p class="version_and_author">v1.04 by <strong>praves</strong></p>
+            </div>       
+        </div>
+        <div class="row">
+            <div class="col-sm-8">
+                <p>Cordova Advertising ID (IDFA) Plugin for Android using Google Play Services API Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p>
+            </div>
+            <div class="col-sm-3 col-sm-offset-1">
+                <hr class="visible-xs results-divider-line">
+                <p class="license">License</p>
+                <p class="downloads"><strong>114</strong> downloads last month</p>
+                <p class="last-updated">Last updated <strong>21 days ago</strong></p>
+            </div>
+        </div>
+    </div>     
 </div>
 <!-- /container -->

http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/2b08a738/www/plugins/plugins_initial.html
----------------------------------------------------------------------
diff --git a/www/plugins/plugins_initial.html b/www/plugins/plugins_initial.html
new file mode 100644
index 0000000..8db714a
--- /dev/null
+++ b/www/plugins/plugins_initial.html
@@ -0,0 +1,146 @@
+---
+layout: cordova
+title: Apache Cordova Plugins
+plugins_tab: true
+---
+
+<!-- REMOVE THIS LINK BEFORE PUBLISHING.  This is just for IntelliSense while coding -->
+<!-- <link rel="stylesheet" type="text/css" href="static/css/lib/bootstrap.css"/> -->
+
+<!-- Main jumbotron for a primary marketing message or call to action -->
+<div class="container">
+    <div class="row">
+        <div class="col-sm-12 text-center">
+            <h1>Cordova Plugins</h1>
+        </div>
+    </div>
+    <div class="row">
+        <div class="col-sm-12">
+            <div class="plugins_search_container">
+                <div class="input-group">
+                    <input type="text" class="form-control" placeholder="Find a Plugin...">
+                    <span class="input-group-btn">
+                        <button class="btn btn-default" type="button"><span class="glyphicon glyphicon-search"></span></button>
+                    </span>
+                </div>
+                <div class="whatisplugin_box">
+                    <img src="{{ site.baseurl }}/static/img/pluggy.png"/>
+                    <h2>What is a Cordova plugin?</h2>
+                    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc nec ante placerat, gravida ligula in, interdum mauris. Sed quis est vel erat vestibulum volutpat in vitae.  <a href="#">Learn more...</a></p>
+                </div>
+                <div class="clearfix"></div>
+
+            </div>
+            <div class="plugins_links">
+                    <ul class="nav nav-justified">
+                    <li><a href="#"><span class="glyphicon glyphicon-plus"></span><i>&nbsp;</i>Contribute Plugins</a></li>
+                    <li><a href="#"><span class="glyphicon glyphicon-question-sign"></span><i>&nbsp;</i>Plugin Help</a></li>
+                    <li><a href="#"><span class="glyphicon glyphicon-alert"></span><i>&nbsp;</i>Plugin Issue Tracker</a></li>
+                    </ul>
+            </div>
+            <!-- /input-group -->
+        </div>
+    </div>
+
+    <div class="row">
+        <div class="col-sm-6">
+            <div class="well featured-list">
+                <h2>Most Downloaded</h2>
+                <ul>
+                    <li>
+                        <div class="progress">
+                            <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"
+                            style="width: 40%">
+                                <span class="sr-only">40% Complete (success)</span>
+                            </div>
+                        </div>
+                        <span class="plugin">Cordova Device</span>
+                        <span class="plugin-stats">2,339,658</span>
+                    </li>
+                    <li>
+                        <div class="progress">
+                            <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"
+                            style="width: 40%">
+                                <span class="sr-only">40% Complete (success)</span>
+                            </div>
+                        </div>
+                        <span class="plugin">Cordova Device</span>
+                        <span class="plugin-stats">2,339,658</span>
+                    </li>
+                    <li>
+                        <div class="progress">
+                            <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"
+                            style="width: 40%">
+                                <span class="sr-only">40% Complete (success)</span>
+                            </div>
+                        </div>
+                        <span class="plugin">Cordova Device</span>
+                        <span class="plugin-stats">2,339,658</span>
+                    </li>
+                    <li>
+                        <div class="progress">
+                            <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"
+                            style="width: 40%">
+                                <span class="sr-only">40% Complete (success)</span>
+                            </div>
+                        </div>
+                        <span class="plugin">Cordova Device</span>
+                        <span class="plugin-stats">2,339,658</span>
+                    </li>
+                    <li>
+                        <div class="progress">
+                            <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"
+                            style="width: 40%">
+                                <span class="sr-only">40% Complete (success)</span>
+                            </div>
+                        </div>
+                        <span class="plugin">Cordova Device</span>
+                        <span class="plugin-stats">2,339,658</span>
+                    </li>
+                    <li>
+                        <div class="progress">
+                            <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"
+                            style="width: 40%">
+                                <span class="sr-only">40% Complete (success)</span>
+                            </div>
+                        </div>
+                        <span class="plugin">Cordova Device</span>
+                        <span class="plugin-stats">2,339,658</span>
+                    </li>
+                    <li>
+                        <div class="progress">
+                            <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"
+                            style="width: 40%">
+                                <span class="sr-only">40% Complete (success)</span>
+                            </div>
+                        </div>
+                        <span class="plugin">Cordova Device</span>
+                        <span class="plugin-stats">2,339,658</span>
+                    </li>
+                </ul>
+
+            </div>
+        </div>
+        <div class="col-sm-6">
+            <div class="well">
+                <h2 class="featured-list-header text-center">Most Downloaded</h2>
+                <ul class="featured-list">
+                    <li>
+                        <div class="progress">
+                            <div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="40" aria-valuemin="0" aria-valuemax="100"
+                            style="width: 40%">
+                                <span class="sr-only">40% Complete (success)</span>
+                            </div>
+                        </div>
+                        <span class="plugin">Cordova Device</span>
+                        <span class="plugin-stats">2,339,658</span>
+                    </li>
+                </ul>
+
+            </div>
+        </div>
+    </div>
+
+
+</div>
+<!-- /container -->

http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/2b08a738/www/static/css-src/_contribute.scss
----------------------------------------------------------------------
diff --git a/www/static/css-src/_contribute.scss b/www/static/css-src/_contribute.scss
index a24c73d..ecf9c03 100644
--- a/www/static/css-src/_contribute.scss
+++ b/www/static/css-src/_contribute.scss
@@ -56,7 +56,7 @@ a:hover .report-bug-icon {
     width: 108px;
 }
 .platforms-list li.first a.link-apache {
-    width: 144px;
+    width: 129px;
     right: 111px;
 }
 .contribute-get-started-steps {

http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/2b08a738/www/static/css-src/_home.scss
----------------------------------------------------------------------
diff --git a/www/static/css-src/_home.scss b/www/static/css-src/_home.scss
index 67cbb15..9c5ffd1 100644
--- a/www/static/css-src/_home.scss
+++ b/www/static/css-src/_home.scss
@@ -43,9 +43,6 @@ body {
 		padding-bottom:20px;
 	}
 }
-@media (max-width: 767px) {
-	#hero #hero_section #hero_section_right { width:100%; }
-}
 
 #hero_bottom_strip {
     position: absolute;
@@ -71,11 +68,32 @@ body {
 		width: 85px;
    		height: 85px;
 		background-repeat: no-repeat;
-    	background-size: cover;
+    	background-size: 255px 85px;
 	}
 }
 .value_prop {
 	max-width: 146px;
+	height: 4em;
+	div, p {
+		top:50%;
+		position: relative;
+		transform: translateY(-50%);
+	}
+}
+
+@media (max-width: 767px) {
+	#hero #hero_section #hero_section_right { width:100%; }
+	#hero_bottom_strip {
+		min-height: initial;
+		.container {
+			padding-top: 10px;
+			padding-bottom: 20px;
+			font-size: 1em;
+			text-align: center;
+		}
+	}
+	.sprite_img { display:inline-block }
+	.value_prop { max-width:initial }
 }
 
 @mixin sprite-img($a, $b) {
@@ -83,8 +101,8 @@ body {
 }
 
 #sprite_shared_code { @include sprite-img(0px, 0) }
-#sprite_offline { @include sprite-img(-84px, 0) }
-#sprite_apis { @include sprite-img(-84px*2, 0) }
+#sprite_offline { @include sprite-img(50%, 0) }
+#sprite_apis { @include sprite-img(100%, 0) }
 
 .navbar-brand {
 	padding:0;
@@ -166,9 +184,16 @@ img#logo_top {
 /*
 ********* Showcase Section ***********
 */
+
 .dark {
 	background-color: $gray-90;
 }
+.dark, .dark .container-fluid { /* Fixes an overflow problem in the showcase sections */
+	margin-left:0;
+	margin-right:0;
+	padding-left:0;
+	padding-right:0;
+}
 .showcase_section_intro {
     margin: auto;
 	float:none;

http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/2b08a738/www/static/css-src/_plugins.scss
----------------------------------------------------------------------
diff --git a/www/static/css-src/_plugins.scss b/www/static/css-src/_plugins.scss
index 6814431..afeb4e6 100644
--- a/www/static/css-src/_plugins.scss
+++ b/www/static/css-src/_plugins.scss
@@ -53,3 +53,55 @@ button.btn {
 	right:0;
 	width:100px;
 }
+.filter-by-platforms {
+	margin-top:40px;
+	margin-bottom:10px;
+}
+
+.filter-by-platform-label {
+	line-height:40px;
+	display: inline-block;
+	vertical-align: top;
+}
+
+.filter-by-platform-filters {
+	display: inline-block;
+}
+
+/***
+****	Plugins Results	
+****	
+*/
+
+.plugins-results-container {
+	margin-bottom:40px;
+	padding:0;
+}
+.plugin-results-result {
+	margin-bottom:20px;
+	background-color:$gray-5;
+	position: relative;
+}
+.version_and_author {
+	display: inline-block;
+}
+
+.plugins-copy-to-clipboard {
+	width:15px;
+	position:absolute;
+	right:0;
+	top:20px;
+	margin-right:10px;
+}
+
+@media (min-width: 767px) {
+	.version_and_author {
+	float:right;
+	margin-top:20px;
+	}
+	h2 { display: inline-block }
+}
+.license { font-weight: bold }
+hr.results-divider-line {
+	border-color:$gray-20;
+}

http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/2b08a738/www/static/css-src/main.scss
----------------------------------------------------------------------
diff --git a/www/static/css-src/main.scss b/www/static/css-src/main.scss
index 5bd3ee9..1f01116 100644
--- a/www/static/css-src/main.scss
+++ b/www/static/css-src/main.scss
@@ -31,6 +31,7 @@ $gray-50: lighten($gray-base, 50%);
 $gray-40: lighten($gray-base, 60%);
 $gray-20: lighten($gray-base, 80%);
 $gray-10: lighten($gray-base, 90%);
+$gray-5: lighten($gray-base, 95%);
 $brand-primary: #4CC2E4;
 
 /* Grid size (mirrors Bootstraps) */
@@ -166,11 +167,26 @@ $scree-md-max: $screen-lg - 1;
 
 /* footer */
 footer {
-    background-color: white;
+    background-color: $gray-5;
     position: relative;
+	strong { color:inherit; }
+	h1 {
+		font-size:2.5em;
+		color:$brand-primary-darker;
+	}
+  	h2 {
+    text-transform: uppercase;
+    color:$gray-50;
+    font-size: 1em;
+    font-weight: bold;
+    }
 }
 footer ul.nav li > a {
-    padding-left: 0px;
+	font-size:1em;
+	margin-left: -15px;
+}
+footer ul.nav li > a:hover {
+	background-color: $gray-20;
 }
 footer .copyright_text {
     margin-top: 25px;

http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/2b08a738/www/static/img/copy-clipboard-icon.svg
----------------------------------------------------------------------
diff --git a/www/static/img/copy-clipboard-icon.svg b/www/static/img/copy-clipboard-icon.svg
new file mode 100644
index 0000000..dce4a0d
--- /dev/null
+++ b/www/static/img/copy-clipboard-icon.svg
@@ -0,0 +1,15 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 17 19" style="enable-background:new 0 0 17 19;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#3993AC;}
+</style>
+<g>
+	<path class="st0" d="M13,4V0H0v15h4v4h13V4H13z M1,14V1h11v3h-2V3H3v1h1v2H3v1h1v2H3v1h1v2H3v1h1v1H1z M16,18H5V5h11V18z"/>
+	<rect x="7" y="7" class="st0" width="7" height="1"/>
+	<rect x="7" y="10" class="st0" width="7" height="1"/>
+	<rect x="7" y="13" class="st0" width="7" height="1"/>
+	<rect x="7" y="16" class="st0" width="7" height="1"/>
+</g>
+</svg>

http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/2b08a738/www/static/js/main.js
----------------------------------------------------------------------
diff --git a/www/static/js/main.js b/www/static/js/main.js
index 2473c56..dd06684 100644
--- a/www/static/js/main.js
+++ b/www/static/js/main.js
@@ -1,9 +1,17 @@
-$(function(){ // resize the hero to the innerWidth of the window
-	var window_height = window.innerHeight;
-	var navbar_spacer = $('#_fixed_navbar_spacer').height();
-	var adjusted_window_height = window_height - navbar_spacer;
-	if (adjusted_window_height > 800) { // do not resize on small devices
-		$('#hero').height(adjusted_window_height);
-		console.log('new height ' + adjusted_window_height)
+$(function(){
+	
+	function setHeroHeight() {
+		console.log('IT works!');
+		// resize the hero to the innerWidth of the window
+		var window_height = window.innerHeight;
+		var navbar_spacer = $('#_fixed_navbar_spacer').height();
+		var adjusted_window_height = window_height - navbar_spacer;
+		if (adjusted_window_height > 549) { // do not resize on small devices
+			$('#hero').height(adjusted_window_height);
+			console.log('new height ' + adjusted_window_height)
+		}
 	}
+	setHeroHeight();
+	$(window).resize(function() { setHeroHeight() });
+	
  });


---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@cordova.apache.org
For additional commands, e-mail: commits-help@cordova.apache.org


[3/3] docs commit: Finishing porting Richard's changes. Fixing UI on plugin page a bit.

Posted by db...@apache.org.
Finishing porting Richard's changes. Fixing UI on plugin page a bit.


Project: http://git-wip-us.apache.org/repos/asf/cordova-docs/repo
Commit: http://git-wip-us.apache.org/repos/asf/cordova-docs/commit/786c1ab7
Tree: http://git-wip-us.apache.org/repos/asf/cordova-docs/tree/786c1ab7
Diff: http://git-wip-us.apache.org/repos/asf/cordova-docs/diff/786c1ab7

Branch: refs/heads/cordova-website
Commit: 786c1ab71df91023476b1d7fd1ae4ff576bc3e68
Parents: 89d0774
Author: Dmitry Blotsky <dm...@gmail.com>
Authored: Fri Aug 21 15:54:35 2015 -0700
Committer: Dmitry Blotsky <dm...@gmail.com>
Committed: Fri Aug 21 15:54:35 2015 -0700

----------------------------------------------------------------------
 www/plugins/index.html                | 103 +----------------------------
 www/static/css-src/_plugins.scss      |  23 +++++--
 www/static/plugins/app.js             |  10 +--
 www/static/plugins/platformbutton.jsx |   8 +--
 4 files changed, 31 insertions(+), 113 deletions(-)
----------------------------------------------------------------------


http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/786c1ab7/www/plugins/index.html
----------------------------------------------------------------------
diff --git a/www/plugins/index.html b/www/plugins/index.html
index d135328..8d8c8ea 100644
--- a/www/plugins/index.html
+++ b/www/plugins/index.html
@@ -9,105 +9,8 @@ plugins_tab: true
 
 <!-- Main jumbotron for a primary marketing message or call to action -->
 <div class="container">
-    <div class="row">
-        <div class="col-sm-12 text-center">
-            <h1>Cordova Plugins</h1>
-        </div>
-    </div>
-    <div class="row">
-        <div class="col-sm-12">
-            <div class="plugins_search_container">
-                <div class="input-group">
-                    <input type="text" class="form-control" placeholder="Find a Plugin...">
-                    <span class="input-group-btn">
-                        <button class="btn btn-default" type="button"><span class="glyphicon glyphicon-search"></span></button>
-                    </span>
-                </div>
-            </div>
-            <div class="plugins_links">
-                    <ul class="nav nav-justified">
-                    <li><a href="#"><span class="glyphicon glyphicon-plus"></span><i>&nbsp;</i>Contribute Plugins</a></li>
-                    <li><a href="#"><span class="glyphicon glyphicon-question-sign"></span><i>&nbsp;</i>Plugin Help</a></li>
-                    <li><a href="#"><span class="glyphicon glyphicon-alert"></span><i>&nbsp;</i>Plugin Issue Tracker</a></li>
-                    </ul>
-            </div>
-            <!-- /input-group -->
-        </div>
-    </div>
-    <div class="row filter-by-platforms">
-        <div class="filter-by-platform-label"><span>Platform:</span></div>
-        <ul class="nav nav-pills filter-by-platform-filters">
-            <li role="presentation" class="active"><a href="#"><span class="glyphicon glyphicon-ok"></span><i>&nbsp;</i>Android</a></li>
-            <li role="presentation" class="active"><a href="#"><span class="glyphicon glyphicon-ok"></span><i>&nbsp;</i>iOS</a></li>
-            <li role="presentation" class="active"><a href="#"><span class="glyphicon glyphicon-ok"></span><i>&nbsp;</i>Windows 10</a></li>
-            <li role="presentation"><a href="#">Blackberry</a></li>
-            <li role="presentation"><a href="#">Ubuntu</a></li>
-            <li role="presentation"><a href="#">Firefox OS</a></li>
-            <li role="presentation"><a href="#">WebOS</a></li>
-            <li role="presentation"><a href="#">Fire OS</a></li>
-        </ul>
-    </div>
-</div>
-<div class="container plugins-results-container">
-    <div class="container plugin-results-result">
-        <img src="{{ site.baseurl }}/static/img/copy-clipboard-icon.svg" class="plugins-copy-to-clipboard"/>
-        <div class="row">
-            <div class="col-sm-9">
-                <h2><a href="">cordova-plugin-android-idfa</a></h2>
-                <p class="version_and_author">v1.04 by <strong>praves</strong></p>
-            </div>       
-        </div>
-        <div class="row">
-            <div class="col-sm-8">
-                <p>Cordova Advertising ID (IDFA) Plugin for Android using Google Play Services API Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p>
-            </div>
-            <div class="col-sm-3 col-sm-offset-1">
-                <hr class="visible-xs results-divider-line">
-                <p class="license">License</p>
-                <p class="downloads"><strong>114</strong> downloads last month</p>
-                <p class="last-updated">Last updated <strong>21 days ago</strong></p>
-            </div>
-        </div>
-    </div>
-    <div class="container plugin-results-result">
-        <img src="{{ site.baseurl }}/static/img/copy-clipboard-icon.svg" class="plugins-copy-to-clipboard"/>
-        <div class="row">
-            <div class="col-sm-9">
-                <h2><a href="">cordova-plugin-android-idfa</a></h2>
-                <p class="version_and_author">v1.04 by <strong>praves</strong></p>
-            </div>       
-        </div>
-        <div class="row">
-            <div class="col-sm-8">
-                <p>Cordova Advertising ID (IDFA) Plugin for Android using Google Play Services API Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p>
-            </div>
-            <div class="col-sm-3 col-sm-offset-1">
-                <hr class="visible-xs results-divider-line">
-                <p class="license">License</p>
-                <p class="downloads"><strong>114</strong> downloads last month</p>
-                <p class="last-updated">Last updated <strong>21 days ago</strong></p>
-            </div>
-        </div>
-    </div> 
-    <div class="container plugin-results-result">
-        <img src="{{ site.baseurl }}/static/img/copy-clipboard-icon.svg" class="plugins-copy-to-clipboard"/>
-        <div class="row">
-            <div class="col-sm-9">
-                <h2><a href="">cordova-plugin-android-idfa</a></h2>
-                <p class="version_and_author">v1.04 by <strong>praves</strong></p>
-            </div>       
-        </div>
-        <div class="row">
-            <div class="col-sm-8">
-                <p>Cordova Advertising ID (IDFA) Plugin for Android using Google Play Services API Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. </p>
-            </div>
-            <div class="col-sm-3 col-sm-offset-1">
-                <hr class="visible-xs results-divider-line">
-                <p class="license">License</p>
-                <p class="downloads"><strong>114</strong> downloads last month</p>
-                <p class="last-updated">Last updated <strong>21 days ago</strong></p>
-            </div>
-        </div>
-    </div>     
+    <div id="container"></div>
+    <script src="/static/js/plugins.js"></script>
+    <script>App.start();</script>
 </div>
 <!-- /container -->

http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/786c1ab7/www/static/css-src/_plugins.scss
----------------------------------------------------------------------
diff --git a/www/static/css-src/_plugins.scss b/www/static/css-src/_plugins.scss
index 06a8d29..54879a0 100644
--- a/www/static/css-src/_plugins.scss
+++ b/www/static/css-src/_plugins.scss
@@ -2,12 +2,11 @@
 	max-width:405px;
 	margin:auto;
 
-}
-button.btn {
-	color:white;
+	button.btn {
+		color:white;
+	}
 }
 .whatisplugin_box {
-
 	img {
 		float:left;
 			padding-right: 20px;
@@ -59,13 +58,27 @@ button.btn {
 }
 
 .filter-by-platform-label {
-	line-height:40px;
 	display: inline-block;
 	vertical-align: top;
+	line-height:40px;
+	margin-right: 1em;
 }
 
 .filter-by-platform-filters {
+	line-height:40px;
 	display: inline-block;
+	button.btn {
+		&.btn-primary {
+			background-color:$brand-primary;
+		}
+		&.btn-default {
+			background-color:$gray-10;
+			&:hover {
+				background-color: $brand-primary;
+				color: white;
+			}
+		}
+	}
 }
 
 /***

http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/786c1ab7/www/static/plugins/app.js
----------------------------------------------------------------------
diff --git a/www/static/plugins/app.js b/www/static/plugins/app.js
index 5948833..7ed6dee 100755
--- a/www/static/plugins/app.js
+++ b/www/static/plugins/app.js
@@ -5,6 +5,8 @@ var React           = window.React = require('react'), // assign it to window fo
     App             = {},
     SortDropdown = require('./sortdropdown.jsx');
 
+var INPUT_DELAY = 500; // in milliseconds
+
 var timer = null;
 var Constants = {
     DownloadCountBatch: 100,
@@ -71,7 +73,7 @@ var App = React.createClass({
 
             delay(function(){
                 App.updateURL(previousState.filterText, previousState.staticFilters['platforms']);
-            }, 2000 );
+            }, INPUT_DELAY);
 
             return {
                 staticFilters: previousState.staticFilters,
@@ -242,7 +244,7 @@ var App = React.createClass({
             return plugins;
         },
         updateURL: function(filterText, platformFilters) {
-            var query = "";
+            var query = "?";
             var stateObj = {};
             if(filterText) {
                 var filterTextLowerCase = filterText;
@@ -251,7 +253,7 @@ var App = React.createClass({
             }
 
             if(platformFilters.length > 0) {
-                if(!query) {
+                if(query === "?") {
                     query = "?platforms=";
                 } else {
                     query = query + "&platforms=";
@@ -263,7 +265,7 @@ var App = React.createClass({
                 stateObj.platforms = platformFilters;
             }
 
-            window.history.pushState(stateObj, "", query);
+            window.history.replaceState(stateObj, "", query);
             ga('send', 'pageview', '/index.html' + query);
         },
     },

http://git-wip-us.apache.org/repos/asf/cordova-docs/blob/786c1ab7/www/static/plugins/platformbutton.jsx
----------------------------------------------------------------------
diff --git a/www/static/plugins/platformbutton.jsx b/www/static/plugins/platformbutton.jsx
index 0002284..0bcd42f 100755
--- a/www/static/plugins/platformbutton.jsx
+++ b/www/static/plugins/platformbutton.jsx
@@ -19,17 +19,17 @@ var PlatformButton = React.createClass({
         if(this.state.isActive) {
             return (
                 <li role="presentation" className="active" onClick={this.onClick}>
-                    <a href="#">
+                    <button className="btn btn-primary">
                         <span className="glyphicon glyphicon-ok"></span><i>&nbsp;</i>{this.props.platform}
-                    </a>
+                    </button>
                 </li>
             );
         } else {
             return (
                 <li role="presentation" onClick={this.onClick}>
-                    <a href="#">
+                    <button className="btn btn-default">
                         {this.props.platform}
-                    </a>
+                    </button>
                 </li>
             );
         }


---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@cordova.apache.org
For additional commands, e-mail: commits-help@cordova.apache.org