From 7d5bc0f0786f29477a516e8f5c7e22abf1331bf5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Lorenz=20H=C3=BCbschle-Schneider?= Date: Sat, 5 Jul 2014 14:37:43 +0100 Subject: [PATCH] Accordion without jQuery / bootstrap js it's not quite 100% as nice though --- css/glowingbear.css | 14 ++++++++++++++ index.html | 32 ++++++++++++++++---------------- js/glowingbear.js | 17 +++++++++++++++++ 3 files changed, 47 insertions(+), 16 deletions(-) diff --git a/css/glowingbear.css b/css/glowingbear.css index 70bf245..11cd3eb 100644 --- a/css/glowingbear.css +++ b/css/glowingbear.css @@ -423,6 +423,20 @@ h2 span, h2 small { display: block; } +.panel[data-state=active] .panel-collapse { + transition: max-height 0.5s; + max-height: 35em; + height: auto; + display: block; +} +.panel[data-state=collapsed] .panel-collapse { + transition: max-height 0.5s; + max-height: 0; +} +.panel[data-state=collapsed] { + border: 0px solid transparent; +} + /* */ /* Mobile layout */ /* */ diff --git a/index.html b/index.html index b86b220..577f233 100644 --- a/index.html +++ b/index.html @@ -47,18 +47,18 @@
Secure connection error Unable to connect to unencrypted relay when your are connecting to Glowing Bear over HTTPS. Please use an encrypted relay or load the page without using HTTPS.
-
-
+
+

- + Connection settings

-
-
+

- + Usage instructions

-
+

Configuring the relay

To start using glowing bear, please enable the relay plugin in your WeeChat client: @@ -125,15 +125,15 @@
-
+

- + Encryption instructions

-
+

If you check the encryption box, the communication between browser and WeeChat will be encrypted with SSL.

Note: If you are using a self-signed certificate, you have to visit https://{{ host || 'weechathost' }}:{{ port || 'relayport' }}/ in your browser first to add a security exception. You can close that tab once you confirmed the certificate, no content will appear. The necessity of this process is a bug in Firefox and other browsers.

@@ -151,15 +151,15 @@ $ openssl req -nodes -newkey rsa:4096 -keyout relay.pem -x509 -days 365 -out rel
-
+

- + Install app

-
+

You don't need to install anything to use this app, it should work with any modern browser. Start using it right now! However, there are a few ways to improve integration with your operating system.

Firefox

@@ -170,15 +170,15 @@ $ openssl req -nodes -newkey rsa:4096 -keyout relay.pem -x509 -days 365 -out rel
-
+

- + Get involved

-
+

Glowing bear is built by a small group of developers in their free time. As we're always trying to improve it, we would love getting your feedback and help. If that sounds like something you might enjoy, check out our project page on GitHub!

If you're interested in contributing or simply want to say hello, head over to #glowing-bear on freenode! We won't bite, promise (-ish).

diff --git a/js/glowingbear.js b/js/glowingbear.js index f32b816..e322d52 100644 --- a/js/glowingbear.js +++ b/js/glowingbear.js @@ -1090,6 +1090,23 @@ weechat.controller('WeechatCtrl', ['$rootScope', '$scope', '$store', '$timeout', event.stopPropagation(); }; + $scope.toggleAccordion = function(event) { + event.stopPropagation(); + event.preventDefault(); + + var target = event.target.parentNode.parentNode.parentNode; + target.setAttribute('data-state', target.getAttribute('data-state') === 'active' ? 'collapsed' : 'active'); + + // Hide all other siblings + var siblings = target.parentNode.children; + for (var childId in siblings) { + var child = siblings[childId]; + if (child.nodeType === 1 && child !== target) { + child.setAttribute('data-state', 'collapsed'); + } + } + }; + /* Function gets called from bufferLineAdded code if user should be notified */ $rootScope.createHighlight = function(buffer, message) { var title = '';