Prefer ng-if to ng-show where applicable

html/index.html

@@ -29,7 +29,7 @@
     </div>
   </header>
   <main class="container">
-    <div ng-show="showSplash">
+    <div ng-if="showSplash">
       <!-- This content is handled separately from the main view for the benefit of bots and initial page load -->
       <section class="page-header">
         <h1>MELPA <small>(Milkypostman’s Emacs Lisp Package Archive)</small></h1>

html/js/melpa.js

@@ -154,7 +154,7 @@
   app.directive("viewOrError", function($rootScope) {
     return {
       template: '<div>' +
-        '<div class="alert alert-danger" ng-show="routeError"><strong>Error: </strong>{{routeError}}</div>' +
+        '<div class="alert alert-danger" ng-if="routeError"><strong>Error: </strong>{{routeError}}</div>' +
         '<div ng-if="!routeError" ng-view><ng-transclude></ng-transclude></div>'+'</div>',
       transclude: true,
       link: function(scope) {

html/partials/list.html

@@ -25,8 +25,8 @@
         <td class="version"><a href="{{package.packageURL}}">{{package.version}} <span class="glyphicon glyphicon-download"></span></a></td>
         <td class="recipe"><a href="{{package.recipeURL}}"><span class="glyphicon glyphicon-cutlery"></span></a></td>
         <td class="source">
-          <a ng-show="package.sourceURL" href="{{package.sourceURL}}">{{package.source}}</a>
+          <a ng-if="package.sourceURL" href="{{package.sourceURL}}">{{package.source}}</a>
-          <span ng-show="!package.sourceURL">{{package.source}}</span>
+          <span ng-if="!package.sourceURL">{{package.source}}</span>
         </td>
         <td>{{package.downloads}}</td>
       </tr>

html/partials/package.html

@@ -6,7 +6,7 @@
 <p>
   <a href="{{pkg.recipeURL}}" class="btn btn-default"><span class="glyphicon glyphicon-cutlery"> Recipe</a>
   <a href="{{pkg.packageURL}}" class="btn btn-default"><span class="glyphicon glyphicon-download"> Download</a>
-  <a ng-show="pkg.sourceURL" href="{{pkg.sourceURL}}" class="btn btn-default"><span class="glyphicon glyphicon-home"> Homepage</a>
+  <a ng-if="pkg.sourceURL" href="{{pkg.sourceURL}}" class="btn btn-default"><span class="glyphicon glyphicon-home"> Homepage</a>
 </p>
 <section>
   <div class="well">
@@ -15,21 +15,21 @@
       <dd>{{pkg.downloads}} <span class="muted">(all versions)</span></dd>
       <dt>Source</dt>
       <dd>
-        <a ng-show="pkg.sourceURL" href="{{pkg.sourceURL}}">{{pkg.source}}</a>
+        <a ng-if="pkg.sourceURL" href="{{pkg.sourceURL}}">{{pkg.source}}</a>
-        <span ng-show="!pkg.sourceURL">{{pkg.source}}</span>
+        <span ng-if="!pkg.sourceURL">{{pkg.source}}</span>
       </dd>
       <dt>Dependencies</dt>
-      <dd><span ng-show="pkg.dependencies.length > 0" ng-repeat="dep in pkg.dependencies">
+      <dd><span ng-if="pkg.dependencies.length" ng-repeat="dep in pkg.dependencies">
           <a ng-if="havePackage(dep.name)" href="#/{{dep.name}}">{{dep.name}} {{dep.version}}</a>
           <span ng-if="!havePackage(dep.name)">{{dep.name}} {{dep.version}}</span>
           &nbsp;</span>
-        <span class="muted" ng-show="pkg.dependencies.length == 0">-</span>
+        <span class="muted" ng-if="!pkg.dependencies.length">-</span>
       </dd>
       <dt>Needed by</dt>
-      <dd><span ng-show="reverseDependencies.length > 0" ng-repeat="dep in reverseDependencies | orderBy:'name'">
+      <dd><span ng-if="reverseDependencies.length" ng-repeat="dep in reverseDependencies | orderBy:'name'">
           <a href="#/{{dep.name}}">{{dep.name}}</a>
         &nbsp;</span>
-        <span class="muted" ng-show="reverseDependencies.length == 0">-</span>
+        <span class="muted" ng-if="reverseDependencies.length == 0">-</span>
       </dd>
     </dl>
   </div>