Minimise usage of ng-show/hide to reduce number of useless DOM elements
Progress in the direction of #87, especially on mobile.
This commit is contained in:
parent
3ad76d2ff3
commit
b4e1a5aaad
14
index.html
14
index.html
|
@ -33,7 +33,7 @@
|
||||||
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
|
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body ng-controller="WeechatCtrl" ng-keydown="handleKeyPress($event)">
|
<body ng-controller="WeechatCtrl" ng-keydown="handleKeyPress($event)">
|
||||||
<div ng-hide="connected" class="container">
|
<div ng-if="!connected" class="container">
|
||||||
<h2>
|
<h2>
|
||||||
<img alt="logo" src="assets/img/glowing-bear.svg">
|
<img alt="logo" src="assets/img/glowing-bear.svg">
|
||||||
<span>glowing bear</span>
|
<span>glowing bear</span>
|
||||||
|
@ -189,7 +189,7 @@ $ openssl req -nodes -newkey rsa:4096 -keyout relay.pem -x509 -days 365 -out rel
|
||||||
<a href="#" ng-click="swipeSidebar()">
|
<a href="#" ng-click="swipeSidebar()">
|
||||||
<img alt="brand" src="assets/img/favicon.png" title="Connected to {{ host }}:{{ port}}">
|
<img alt="brand" src="assets/img/favicon.png" title="Connected to {{ host }}:{{ port}}">
|
||||||
</a>
|
</a>
|
||||||
<button ng-show="debugMode" ng-click="countWatchers()">Count<br />Watchers</button>
|
<button ng-if="debugMode" ng-click="countWatchers()">Count<br />Watchers</button>
|
||||||
</div>
|
</div>
|
||||||
<div class="title" ng-bind-html="activeBuffer().title | irclinky:'_blank'"></div>
|
<div class="title" ng-bind-html="activeBuffer().title | irclinky:'_blank'"></div>
|
||||||
<div class="actions pull-right vertical-line-left">
|
<div class="actions pull-right vertical-line-left">
|
||||||
|
@ -203,7 +203,7 @@ $ openssl req -nodes -newkey rsa:4096 -keyout relay.pem -x509 -days 365 -out rel
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div bindonce id="sidebar" ng-show="showSidebar" ng-swipe-left="swipeSidebar()" class="vertical-line">
|
<div bindonce id="sidebar" ng-if="showSidebar" ng-swipe-left="swipeSidebar()" class="vertical-line">
|
||||||
<ul class="nav nav-pills nav-stacked" ng-class="{'indented': (predicate === 'serverSortKey')}">
|
<ul class="nav nav-pills nav-stacked" ng-class="{'indented': (predicate === 'serverSortKey')}">
|
||||||
<li class="bufferfilter">
|
<li class="bufferfilter">
|
||||||
<form role="form">
|
<form role="form">
|
||||||
|
@ -212,15 +212,15 @@ $ openssl req -nodes -newkey rsa:4096 -keyout relay.pem -x509 -days 365 -out rel
|
||||||
</li>
|
</li>
|
||||||
<li class="buffer" ng-class="{'active': buffer.active, 'indent': buffer.indent }" ng-repeat="(key, buffer) in (filteredBuffers = (buffers | toArray | filter:{fullName:search} | filter:hasUnread | orderBy:predicate))">
|
<li class="buffer" ng-class="{'active': buffer.active, 'indent': buffer.indent }" ng-repeat="(key, buffer) in (filteredBuffers = (buffers | toArray | filter:{fullName:search} | filter:hasUnread | orderBy:predicate))">
|
||||||
<a href="#" ng-click="setActiveBuffer(buffer.id)" title="{{ buffer.fullName }}">
|
<a href="#" ng-click="setActiveBuffer(buffer.id)" title="{{ buffer.fullName }}">
|
||||||
<span class="badge pull-right" ng-hide="buffer.notification" ng-if="buffer.unread" ng-bind="buffer.unread"></span>
|
<span class="badge pull-right" ng-if="buffer.unread && !buffer.notification" ng-bind="buffer.unread"></span>
|
||||||
<span class="badge pull-right danger" ng-show="buffer.notification" ng-bind="buffer.notification"></span>
|
<span class="badge pull-right danger" ng-if="buffer.notification" ng-bind="buffer.notification"></span>
|
||||||
<span class="buffername">{{ buffer.shortName }}</span><span ng-hide="buffer.shortName">{{ buffer.fullName }}</span>
|
<span class="buffername">{{ buffer.shortName }}</span><span ng-if="!buffer.shortName">{{ buffer.fullName }}</span>
|
||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div bindonce id="bufferlines" class="monospace" ng-swipe-right="swipeSidebar()" ng-swipe-left="openNick()" ng-class="{'withnicklist': showNicklist, 'withsidebar': showSidebar}">
|
<div bindonce id="bufferlines" class="monospace" ng-swipe-right="swipeSidebar()" ng-swipe-left="openNick()" ng-class="{'withnicklist': showNicklist, 'withsidebar': showSidebar}">
|
||||||
<div id="nicklist" ng-show="showNicklist" ng-swipe-right="closeNick()" class="vertical-line-left">
|
<div id="nicklist" ng-if="showNicklist" ng-swipe-right="closeNick()" class="vertical-line-left">
|
||||||
<ul class="nicklistgroup list-unstyled" ng-repeat="group in nicklist">
|
<ul class="nicklistgroup list-unstyled" ng-repeat="group in nicklist">
|
||||||
<li ng-repeat="nick in group.nicks|orderBy:'name'" ng-click="openBuffer(nick.name)">
|
<li ng-repeat="nick in group.nicks|orderBy:'name'" ng-click="openBuffer(nick.name)">
|
||||||
<a ng-click="nickAction(nick)"><span bo-class="nick.prefixClasses" bo-text="nick.prefix"></span><span bo-class="nick.nameClasses" bo-text="nick.name"></span></a>
|
<a ng-click="nickAction(nick)"><span bo-class="nick.prefixClasses" bo-text="nick.prefix"></span><span bo-class="nick.nameClasses" bo-text="nick.name"></span></a>
|
||||||
|
|
Loading…
Reference in New Issue