Rich Manalang avatar Rich Manalang committed 6ece7d9

initial

Comments (0)

Files changed (60)

+.env
+.heroku
+local_env

helloworldpage-app-plugin/.gitignore

+*.iml
+*.ipr
+*.iws
+.idea
+target

helloworldpage-app-plugin/README.txt

+Standalone "universal binary" Atlassian Remote App plugin
+
+This is a "unversal binary" remote app that demonstrates a single artifact that can be deployed
+standalone outside an Atlassian application on a hosting service such as Heroku, or for behind-the-firewall
+instances, install as a plugin.
+
+To get started, build the app:
+  mvn package
+  
+To install the app, upload the plugin to a target instance such as https://remoteapps.jira.com
+
+Instructions on running standalone to come...

helloworldpage-app-plugin/pom.xml

+<?xml version="1.0" encoding="UTF-8"?>
+
+<project xmlns="http://maven.apache.org/POM/4.0.0"
+         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
+         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">
+
+    <modelVersion>4.0.0</modelVersion>
+    <groupId>com.atlassian.labs</groupId>
+    <artifactId>helloworldpage-app-plugin</artifactId>
+    <version>1.0-SNAPSHOT</version>
+    <name>Hello World Page App Plugin</name>
+    <packaging>atlassian-plugin</packaging>
+    <description>
+        A sample remote app plugin (universal binary) that shows a hello world general page.
+    </description>
+
+    <dependencies>
+        <dependency>
+            <groupId>com.atlassian.labs</groupId>
+            <artifactId>remoteapps-servlet-kit</artifactId>
+            <version>0.4.99-SNAPSHOT</version>
+        </dependency>
+
+        <dependency>
+            <groupId>com.samskivert</groupId>
+            <artifactId>jmustache</artifactId>
+            <version>1.3</version>
+        </dependency>
+        <dependency>
+            <groupId>org.springframework</groupId>
+            <artifactId>org.springframework.context</artifactId>
+            <version>2.5.6</version>
+            <scope>provided</scope>
+        </dependency>
+        <dependency>
+            <groupId>javax.servlet</groupId>
+            <artifactId>servlet-api</artifactId>
+            <version>2.5</version>
+            <scope>provided</scope>
+        </dependency>
+
+        <dependency>
+            <groupId>junit</groupId>
+            <artifactId>junit</artifactId>
+            <version>4.6</version>
+            <scope>provided</scope>
+        </dependency>
+    </dependencies>
+
+    <build>
+        <plugins>
+            <plugin>
+                <artifactId>maven-compiler-plugin</artifactId>
+                <configuration>
+                    <source>1.5</source>
+                    <target>1.5</target>
+                </configuration>
+            </plugin>
+            <plugin>
+                <groupId>com.atlassian.maven.plugins</groupId>
+                <artifactId>maven-amps-plugin</artifactId>
+                <version>3.9</version>
+                <extensions>true</extensions>
+                <configuration>
+                    <productVersion>2.15.0</productVersion>
+                    <extractDependencies>true</extractDependencies>
+                    <pluginArtifacts>
+                        <pluginArtifact>
+                            <groupId>com.atlassian.labs</groupId>
+                            <artifactId>remoteapps-plugin</artifactId>
+                            <version>0.4.99-SNAPSHOT</version>
+                        </pluginArtifact>
+                    </pluginArtifacts>
+                </configuration>
+            </plugin>
+        </plugins>
+    </build>
+
+</project>

helloworldpage-app-plugin/src/main/java/services/Renderer.java

+package services;
+
+import com.samskivert.mustache.Mustache;
+import org.springframework.stereotype.Component;
+
+import javax.servlet.http.HttpServletResponse;
+import java.io.IOException;
+import java.io.InputStream;
+import java.io.InputStreamReader;
+import java.io.StringWriter;
+import java.nio.charset.Charset;
+import java.util.Map;
+
+/**
+ *
+ */
+@Component
+public class Renderer
+{
+    public void renderHtml(HttpServletResponse resp, String template, Map<String, Object> context) throws IOException
+    {
+        resp.setContentType("text/html");
+        byte[] bytes = render(template, context).getBytes(Charset.forName("UTF-8"));
+        resp.setContentLength(bytes.length);
+        resp.getOutputStream().write(bytes);
+        resp.getOutputStream().close();
+    }
+
+    public static String render(String template, Map<String,Object> context)
+    {
+        StringWriter writer = new StringWriter();
+        InputStream resourceAsStream = null;
+        try
+        {
+            resourceAsStream = Renderer.class.getClassLoader().getResourceAsStream("templates/" + template);
+            Mustache.compiler().compile(
+                new InputStreamReader(resourceAsStream)).execute(context,
+                writer);
+        }
+        finally
+        {
+            try
+            {
+                resourceAsStream.close();
+            }
+            catch (IOException e)
+            {
+                throw new RuntimeException(e);
+            }
+        }
+        return writer.toString();
+    }
+}

helloworldpage-app-plugin/src/main/java/servlets/HelloWorldServlet.java

+package servlets;
+
+import org.springframework.beans.factory.annotation.Autowired;
+import org.springframework.stereotype.Component;
+import services.Renderer;
+
+import javax.servlet.ServletException;
+import javax.servlet.http.HttpServlet;
+import javax.servlet.http.HttpServletRequest;
+import javax.servlet.http.HttpServletResponse;
+import java.io.IOException;
+import java.util.Collections;
+import java.util.Date;
+
+/**
+ *
+ */
+@Component
+public class HelloWorldServlet extends HttpServlet
+{
+    private final Renderer renderer;
+
+    @Autowired
+    public HelloWorldServlet(Renderer renderer)
+    {
+        this.renderer = renderer;
+    }
+
+    @Override
+    protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException
+    {
+        renderer.renderHtml(resp, "hello-world.html.mu",
+                Collections.<String, Object>singletonMap("date", new Date().toString()));
+
+    }
+}

helloworldpage-app-plugin/src/main/resources/atlassian-plugin.xml

+<atlassian-plugin key="helloworldpage-app-plugin" name="${project.name}" plugins-version="2">
+    <plugin-info>
+        <version>${project.version}</version>
+    </plugin-info>
+</atlassian-plugin>

helloworldpage-app-plugin/src/main/resources/atlassian-remote-app.xml

+<remote-app key="helloworldpage-app-plugin" name="Hello World Page App Plugin" version="1" icon-url="https://atlassian.com/favicon.ico"
+            display-url="-- to be replaced --">
+    <vendor name="Atlassian" url="http://atlassian.com" />
+    <description>
+        Demonstrates a "universal binary" app plugin
+    </description>
+
+    <general-page key="helloWorld" name="Hello World" url="/helloWorld"/>
+</remote-app>

helloworldpage-app-plugin/src/main/resources/templates/hello-world.html.mu

+<html>
+    <head>
+        <script src="https://remoteapps.jira.com/remoteapps/all.js" type="text/javascript"></script>
+    </head>
+    <body>
+        <h2>Hello World at {{date}}</h2>
+        <script type="text/javascript">
+            RA.init();
+        </script>
+    </body>
+</html>

hipchat-demo/Gemfile

+source :rubygems
+gem 'sinatra'
+gem 'multi_json'

hipchat-demo/Gemfile.lock

+GEM
+  remote: http://rubygems.org/
+  specs:
+    multi_json (1.1.0)
+    rack (1.4.1)
+    rack-protection (1.2.0)
+      rack
+    sinatra (1.3.2)
+      rack (~> 1.3, >= 1.3.6)
+      rack-protection (~> 1.2)
+      tilt (~> 1.3, >= 1.3.3)
+    tilt (1.3.3)
+
+PLATFORMS
+  ruby
+
+DEPENDENCIES
+  multi_json
+  sinatra

hipchat-demo/README.md

+# HipChat notifier Remote App
+
+This is a simple Atlassian Remote App that shows how to use webhooks
+to notify HipChat when a new blog post in Confluence is posted. This app is written
+in Ruby using the [Sinatra](http://sinatrarb.com) web framework. 
+
+In order for this app to work, you'll need to [get a notification token](https://hipchat.com/admin/api)
+from your HipChat admin then define a HIPCHAT_TOKEN env variable. You'll
+also need to figure out which room you'll want to notify and then define a 
+HIPCHAT_ROOM env variable. To start it up, do the following:
+
+    > bundle install
+    > rackup
+
+Once the app is running, go to your Remote Apps container (or use <https://remoteapps.jira.com>), then
+[install](https://remoteapps.jira.com/wiki/plugins/servlet/speakeasy/user) your remote app by
+using the following url:
+
+    http://localhost:9292/register
+
+Your app should now be running. Any time a blog post is created in Confluence, 
+the HipChat room specified in HIPCHAT_ROOM will be notified.
+
+## Disclaimer
+
+This is not for production use. It simply illustrates the power of
+webhooks in Remote Apps.

hipchat-demo/app.rb

+require 'sinatra'
+require 'multi_json'
+require 'net/http'
+require 'uri'
+
+# Handler for inbound webhook
+post '/blog_created', :agent => /^Atlassian-RemoteApps(.)*/ do
+  blog = MultiJson.decode(request.body.read)['blog']
+  msg = "<b><a href=\"#{blog['self']}\">#{blog['title']}</a></b>" +
+    "- a new blog post by #{blog['creatorName']}"
+  uri = URI.parse("https://api.hipchat.com/v1/rooms/message?auth_token=#{ENV['HIPCHAT_TOKEN']}")
+  http = Net::HTTP.new(uri.host, uri.port)
+  http.set_debug_output($stderr)
+  http.use_ssl = true
+  http.verify_mode = OpenSSL::SSL::VERIFY_NONE
+  req = Net::HTTP::Post.new(uri.request_uri)
+  req.set_form_data({
+    "room_id" => ENV['HIPCHAT_ROOM'],
+    "message" => msg,
+    "notify" => "1",
+    "from" => "Confluence"
+  })
+  http.request(req)
+end

hipchat-demo/config.ru

+require "rubygems"
+require "bundler/setup"
+Bundler.require(:default)
+
+require 'net/http'
+require 'uri'
+
+require './app'
+run Sinatra::Application

hipchat-demo/public/register.xml

+<?xml version="1.0" encoding="UTF-8"?>
+<remote-app key="hipchat-demo" name="HipChat Demo" version="1" icon-url="http://www.atlassian.com/favicon.ico" 
+  display-url="http://localhost:4567" access-level="user">
+  <vendor name="Atlassian" url="http://atlassian.com" />
+  <description>
+    A simple webhook example that sends a HipChat notification when a blog post or 
+    issue is created.
+  </description>
+  <web-hook event="blog_created" url="/blog_created"/>
+</remote-app>

hipchat-demo/public/register.xml.html

+<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
+<html>
+<head>
+<meta http-equiv="content-type" content="text/html; charset=UTF-8">
+<title>~/dev/atlassian/atlascamp-eu-2012/hipchat-demo/public/register.xml.html</title>
+<meta name="Generator" content="Vim/7.3">
+<meta name="plugin-version" content="vim7.3_v10">
+<meta name="syntax" content="xml">
+<meta name="settings" content="number_lines,use_css,expand_tabs">
+<style type="text/css">
+<!--
+pre { font-family: menlo, monospace;font-size:16px; color: #f6f3e8; background-color: #000000; }
+body { font-family: monospace; color: #f6f3e8; background-color: #000000; }
+.lnr { color: #3d3d3d; background-color: #000000; }
+.Identifier { color: #c6c5fe; }
+.Conditional { color: #6699cc; }
+.Keyword { color: #96cbfe; }
+.String { color: #a8ff60; }
+.Type { color: #ffffb6; }
+.Comment { color: #7c7c7c; }
+-->
+</style>
+</head>
+<body>
+<pre>
+<span class="lnr"> 1 </span><span class="Comment">&lt;?</span><span class="Type">xml</span><span class="Type"> </span><span class="Type">version</span>=<span class="String">&quot;1.0&quot;</span><span class="Type"> </span><span class="Type">encoding</span>=<span class="String">&quot;UTF-8&quot;</span><span class="Comment">?&gt;</span>
+<span class="lnr"> 2 </span><span class="Keyword">&lt;</span><span class="Conditional">remote-app</span><span class="Keyword"> </span><span class="Type">key</span>=<span class="String">&quot;hipchat-demo&quot;</span><span class="Keyword"> </span><span class="Type">name</span>=<span class="String">&quot;HipChat Demo&quot;</span><span class="Keyword"> </span><span class="Type">version</span>=<span class="String">&quot;1&quot;</span><span class="Keyword"> </span><span class="Type">icon-url</span>=<span class="String">&quot;<a href="http://www.atlassian.com/favicon.ico">http://www.atlassian.com/favicon.ico</a>&quot;</span><span class="Keyword"> </span>
+<span class="lnr"> 3 </span><span class="Keyword">  </span><span class="Type">display-url</span>=<span class="String">&quot;<a href="http://localhost:4567">http://localhost:4567</a>&quot;</span><span class="Keyword"> </span><span class="Type">access-level</span>=<span class="String">&quot;user&quot;</span><span class="Keyword">&gt;</span>
+<span class="lnr"> 4 </span>  <span class="Keyword">&lt;</span><span class="Conditional">vendor</span><span class="Keyword"> </span><span class="Type">name</span>=<span class="String">&quot;Atlassian&quot;</span><span class="Keyword"> </span><span class="Type">url</span>=<span class="String">&quot;<a href="http://atlassian.com">http://atlassian.com</a>&quot;</span><span class="Keyword"> /&gt;</span>
+<span class="lnr"> 5 </span>  <span class="Keyword">&lt;</span><span class="Conditional">description</span><span class="Keyword">&gt;</span>
+<span class="lnr"> 6 </span>    A simple webhook example that sends a HipChat notification when a blog post or
+<span class="lnr"> 7 </span>    issue is created.
+<span class="lnr"> 8 </span>  <span class="Identifier">&lt;/description&gt;</span>
+<span class="lnr"> 9 </span>  <span class="Keyword">&lt;</span><span class="Conditional">web-hook</span><span class="Keyword"> </span><span class="Type">event</span>=<span class="String">&quot;blog_created&quot;</span><span class="Keyword"> </span><span class="Type">url</span>=<span class="String">&quot;/blog_created&quot;</span><span class="Keyword">/&gt;</span>
+<span class="lnr">10 </span><span class="Identifier">&lt;/remote-app&gt;</span>
+</pre>
+</body>
+</html>

hipchat-notifier/Gemfile

+source :rubygems
+gem 'sinatra'
+gem 'multi_json'
+gem 'oauth'
+gem 'bson', '>=1.6.1'
+gem 'bson_ext', '>=1.6.1'
+gem 'mongo_mapper'
+gem 'rack-flash', :git => 'git://github.com/ChrisCauser/rack-flash.git'

hipchat-notifier/Gemfile.lock

+GIT
+  remote: git://github.com/ChrisCauser/rack-flash.git
+  revision: d8fd1d2c0b176d04bcb904a22cd84debe85f2061
+  specs:
+    rack-flash (0.1.2)
+      rack
+
+GEM
+  remote: http://rubygems.org/
+  specs:
+    activemodel (3.2.2)
+      activesupport (= 3.2.2)
+      builder (~> 3.0.0)
+    activesupport (3.2.2)
+      i18n (~> 0.6)
+      multi_json (~> 1.0)
+    bson (1.6.1)
+    bson_ext (1.6.1)
+      bson (~> 1.6.1)
+    builder (3.0.0)
+    i18n (0.6.0)
+    mongo (1.6.1)
+      bson (~> 1.6.1)
+    mongo_mapper (0.11.0)
+      activemodel (~> 3.0)
+      activesupport (~> 3.0)
+      plucky (~> 0.4.0)
+    multi_json (1.1.0)
+    oauth (0.4.5)
+    plucky (0.4.4)
+      mongo (~> 1.5)
+    rack (1.4.1)
+    rack-protection (1.2.0)
+      rack
+    sinatra (1.3.2)
+      rack (~> 1.3, >= 1.3.6)
+      rack-protection (~> 1.2)
+      tilt (~> 1.3, >= 1.3.3)
+    tilt (1.3.3)
+
+PLATFORMS
+  ruby
+
+DEPENDENCIES
+  bson (>= 1.6.1)
+  bson_ext (>= 1.6.1)
+  mongo_mapper
+  multi_json
+  oauth
+  rack-flash!
+  sinatra

hipchat-notifier/README.md

+# HipChat notifier Remote App
+
+This is a simple Atlassian Remote App that shows how to use webhooks
+to notify HipChat when a new blog post in Confluence is posted. This app is written
+in Ruby using the [Sinatra](http://sinatrarb.com) web framework. 
+
+In order for this app to work, you'll need to [get a notification token](https://hipchat.com/admin/api)
+from your HipChat admin then define a HIPCHAT_TOKEN env variable. You'll
+also need to figure out which room you'll want to notify and then define a 
+HIPCHAT_ROOM env variable. To start it up, do the following:
+
+    > bundle install
+    > rackup
+
+Once the app is running, go to your Remote Apps container (or use <https://remoteapps.jira.com>), then
+[install](https://remoteapps.jira.com/wiki/plugins/servlet/speakeasy/user) your remote app by
+using the following url:
+
+    http://localhost:9292/register
+
+Your app should now be running. Any time a blog post is created in Confluence, 
+the HipChat room specified in HIPCHAT_ROOM will be notified.
+
+## Disclaimer
+
+This is not for production use. It simply illustrates the power of
+webhooks in Remote Apps.

hipchat-notifier/app.rb

+# Uses Mongo DB for persisting OAuth keys and host registration
+MongoMapper.connection = Mongo::Connection.new(ENV['MONGO_HOST'],ENV['MONGO_PORT'])
+MongoMapper.database = ENV['MONGO_DB']
+MongoMapper.database.authenticate(ENV['MONGO_USER'],ENV['MONGO_PWD'])
+
+# Host registration Mongo document model
+class Registration
+  include MongoMapper::Document
+  key :client_key, String
+  key :host_public_key, String
+  key :base_url, String
+  key :description, String
+  key :hipchat_auth_token, String
+
+  timestamps!
+  attr_accessible :client_key, :base_url, :description
+end
+
+enable :sessions
+set :protection, :except => :frame_options
+use Rack::Flash
+
+# Used to register the remote app into a Confluence instance
+get '/register' do
+  @uri = ENV['APP_URI']
+  if params["key"]
+    @registration = Registration.find_or_initialize_by_client_key(params["key"])
+    @registration.attributes = {
+      host_public_key: to_pub_key_pem(params["publicKey"]),
+      base_url: params["baseUrl"],
+      description: params["description"] 
+    }
+    @registration.save
+  end
+  content_type :xml
+  erb :register
+end
+
+# Check requests that go to /protected/* and make sure they have valid OAuth tokens
+before "/protected/*" do
+  response.header["X-Frame-Options"] = "GOFORIT"
+  if session[:client_key].nil?
+    session[:client_key] = params["oauth_consumer_key"] || 
+      hashify_oauth_headers(request.env['HTTP_AUTHORIZATION'])[:oauth_consumer_key]
+    @client_key = session[:client_key]
+    @registration = Registration.find_by_client_key(@client_key)
+    halt(400, "Bad Request") unless has_oauth_params(params)
+    # TODO add nonce/timestamp check http://tools.ietf.org/html/rfc5849#section-3.3
+    valid = OAuth::Signature.verify(request, {:consumer_secret =>  
+      @registration.host_public_key})
+    halt(401, "Not authorized") unless valid
+  else
+    @client_key = session[:client_key]
+    @registration = Registration.find_by_client_key(@client_key)
+  end
+end
+
+# Checks to see if HipChat Auth Token has been configured
+before "/protected/notify/*" do
+  halt "HipChat auth token not configured" if @registration.hipchat_auth_token.blank?
+end
+
+# Renders HipChat Configuration page
+get '/protected/config' do
+  erb :config
+end
+
+# Handles HipChat Configuration update
+post '/protected/config' do
+  @registration.hipchat_auth_token = params['hipChatAuthToken']
+  @registration.save
+  flash[:notice] = "Configuration saved."
+  redirect "/protected/config?oauth_consumer_key=#{@client_key}"
+end
+
+# Handles webhook from Confluence
+post '/protected/notify/blog_created' do
+  blog = MultiJson.decode(request.body.read)['blog']
+  user = MultiJson.decode(
+    signed_http_client.post(
+      "#{@registration.base_url}/rpc/json-rpc/confluenceservice-v2/getUser?user_id=admin",
+        MultiJson.encode(["#{blog['creatorName']}"]), {"Content-Type" => "application/json"} ).body
+    )
+  send_message <<-HTML
+    <b>
+      <a href='#{blog['self']}'>#{blog['title']}</a>
+    </b> - a new blog post by 
+    <a href="#{user['url']}">#{user['fullname']}</a>
+  HTML
+end
+
+helpers do
+  def send_message(msg)
+    uri = URI.parse("https://api.hipchat.com/v1/rooms/message?auth_token=#{@registration.hipchat_auth_token}")
+    http = Net::HTTP.new(uri.host, uri.port)
+    http.set_debug_output($stderr)
+    http.use_ssl = true
+    http.verify_mode = OpenSSL::SSL::VERIFY_NONE
+
+    req = Net::HTTP::Post.new(uri.request_uri)
+    req.set_form_data({
+      "room_id" => ENV['HIPCHAT_ROOM'],
+      "message" => msg,
+      "notify" => "1",
+      "from" => "Confluence"
+    })
+    http.request(req)
+  end
+
+  def has_oauth_params(params)
+    params["oauth_version"] == "1.0" && 
+    params["oauth_signature_method"] == "RSA-SHA1" && 
+    params["oauth_signature"] && 
+    params["oauth_consumer_key"] &&
+    params["oauth_timestamp"] && 
+    params["oauth_nonce"] &&
+    params["user_id"]
+  end
+
+  # Self-signing HTTP client for use when making a call back into
+  # Confluence
+  def signed_http_client
+    @consumer = OAuth::Consumer.new(
+      "hipchat-demo",
+      OpenSSL::PKey::RSA.new(ENV["LOCAL_PRIVATE_KEY"]),
+      :site => @registration.base_url,
+      :signature_method => 'RSA-SHA1',
+      :request_token_path => "",
+      :authorize_path => "",
+      :access_token_path => ""
+    )
+    @consumer.http.set_debug_output($stderr)
+    OAuth::AccessToken.new(@consumer)
+  end
+
+  # added this to convert the pubKey I get back from
+  # the registration process to a valid PEM that Ruby's 
+  # OpenSSL lib can understand... lame!
+  def to_pub_key_pem(str)
+    str = CGI.unescape(str).gsub(" ","+")
+    len = str.length
+    start = 0
+    arry = []
+    while len > 0 do
+      arry.push(str.slice(start,64))
+      start += 64
+      len = len - 64
+    end
+    arry.unshift("-----BEGIN PUBLIC KEY-----")
+    arry.push("-----END PUBLIC KEY-----")
+    arry.join("\n")
+  end
+
+  # A helper to convert the HTTP_AUTHORIZATION header to hash for easy access.
+  # Only used in webhooks where the OAuth sig are delivered in a header.
+  def hashify_oauth_headers(str)
+    return if str == nil
+    Hash[str.split(",").map{|i|
+      j = i.split("=")
+      [ j[0].strip.gsub(/OAuth\ /,'').to_sym, CGI.unescape(j[1].gsub(/\"/,'')) ]
+      }
+    ]
+  end
+end

hipchat-notifier/config.ru

+require "rubygems"
+require "bundler/setup"
+Bundler.require(:default)
+
+require 'net/http'
+require 'uri'
+require 'oauth/request_proxy/rack_request'
+require 'rack-flash'
+require 'cgi'
+
+require './app'
+run Sinatra::Application

hipchat-notifier/public/css/aui-ie.css

+/**
+* The structure of this file pre-supposes two conditions:
+* - That the file is served via a conditional comment of [if lte IE 8] or [if lt IE 9]
+* - That de-bugging starts with IE8 and moves down through IE7 to IE6
+**/
+
+/** * Fixes for IE8, IE7 and IE6 * - each property should be written
+without CSS hacks * eg: 
+.dashboard {
+    margin: 0 0 2px 1px;
+}
+* **/
+.aui-blanket {
+    background: transparent url(images/bg-000-trans50.png) repeat;
+    position: fixed;
+}
+.aui-blanket-shim {
+    filter: alpha(opacity = 0);
+    left: 0;
+    position: absolute;
+    top: 0;
+    width: 100%;
+    z-index: 2499;
+}
+
+.aui-dialog .dialog-blanket {
+    background: transparent url(images/bg-000-trans20.png) repeat;
+}
+/** * Fixes for IE7 and IE6 * - each property *must* be prefixed with
+an asterisk (*) * eg: 
+.dashboard {
+    *margin: 0 0 4px 2px;
+}
+* **/ 
+.aui-blanket {
+    *height: 100px;
+    *position: absolute;
+}
+
+/** * Fixes for IE6 only * - each property *must* be prefixed with an
+underscore (_) * eg: 
+.dashboard {
+    _margin: 0 0 0 1px;
+    _padding: 0 0
+    -3px 0;
+}
+* **/
+/**
+* The structure of this file pre-supposes two conditions:
+* - That the file is served via a conditional comment of [if lte IE 8] or [if lt IE 9]
+* - That de-bugging starts with IE8 and moves down through IE7 to IE6
+**/
+
+/**
+* Fixes for IE8, IE7 and IE6
+* - each property should be written without CSS hacks
+* eg: 
+.dashboard {
+    margin: 0 0 2px 1px;
+}
+*
+**/
+
+/* dropdown-shim */
+.dropdown-shim {
+    border: none;
+    display: none;
+    position: absolute;
+    z-index: 2000;
+}
+
+/**
+* Fixes for IE7 and IE6
+* - each property *must* be prefixed with an asterisk (*)
+* eg: 
+.dashboard {
+    *margin: 0 0 4px 2px;
+}
+*
+**/
+
+.aui-dd-parent .aui-dropdown {
+    *margin: 0;
+}
+
+/**
+* Fixes for IE6 only
+* - each property *must* be prefixed with an underscore (_)
+* eg: 
+.dashboard {
+    _margin: 0 0 0 1px;
+    _padding: 0 0 -3px 0;
+}
+*
+**/
+/* IE6 spits out screwy heights on the LIs without the zoom for hasLayout - which then blows out the width unless constrained on the parent - and then the hover effects look lame. This remedies all that - somewhat */
+.aui-dd-parent .aui-dropdown {
+    _width: 1%;
+}
+.aui-dd-parent .aui-dropdown li.dropdown-item a.item-link {
+    _zoom: 1;
+}
+.aui-dd-parent .aui-dropdown li.dropdown-item a.item-link:hover,
+.aui-dd-parent .aui-dropdown li.dropdown-item a.item-link:active,
+.aui-dd-parent .aui-dropdown li.dropdown-item a.item-link focus {
+    _background: #fff;
+    _text-decoration: none;
+}
+/**
+* The structure of this file pre-supposes two conditions:
+* - That the file is served via a conditional comment of [if lte IE 8] or [if lt IE 9]
+* - That de-bugging starts with IE8 and moves down through IE7 to IE6
+**/
+
+/**
+* Fixes for IE8, IE7 and IE6
+* - each property should be written without CSS hacks
+* eg: 
+.dashboard {
+    margin: 0 0 2px 1px;
+}
+*
+**/
+
+form.aui div.radio input.radio,
+form.aui div.checkbox input.checkbox {
+    margin-top: 0;
+}
+
+/**
+* Fixes for IE7 and IE6
+* - each property *must* be prefixed with an asterisk (*)
+* eg: 
+.dashboard {
+    *margin: 0 0 4px 2px;
+}
+*
+**/
+form.aui {
+    *min-height: 0; /* min-height prevents a crash bug in IE7. srsly. */
+}
+
+form.aui div.radio input.radio,
+form.aui div.checkbox input.checkbox {
+    *margin-top: -2px;
+}
+
+form.aui.top-label .group legend span,
+form.aui.top-label .date-select legend span {
+    *left: -9px; 
+    *top: -3px;
+}
+form.aui .group .field-value {
+    *padding-top: 3px; 
+    *line-height: 1;
+}
+
+form.aui .field-group label {
+    *line-height: 1.2; /* keeps IE7 from trimming decenders */
+}
+
+
+/**
+* Fixes for IE6 only
+* - each property *must* be prefixed with an underscore (_)
+* eg: 
+.dashboard {
+    _margin: 0 0 0 1px;
+    _padding: 0 0 -3px 0;
+}
+*
+**/
+form.aui .field-group {
+    _height: 1.6em;
+}
+form.aui .group .field-value {
+    _width: 2em;
+}
+form.aui .group label,
+form.aui div.radio label,
+form.aui div.checkbox label {
+    _margin-top: 1px;
+    _position: static;
+}
+form.aui div.radio .error,
+form.aui div.checkbox .error {
+    _margin-left: 20px;
+}
+form.aui div.radio .description,
+form.aui div.checkbox .description {
+    _margin-left: 24px;
+}
+form.aui pre.aui-form {
+    _width: 95%;
+}
+
+/**
+* The structure of this file pre-supposes two conditions:
+* - That the file is served via a conditional comment of [if lte IE 8] or [if lt IE 9]
+* - That de-bugging starts with IE8 and moves down through IE7 to IE6
+**/
+
+/** * Fixes for IE8, IE7 and IE6 * - each property should be written
+without CSS hacks * eg:
+.dashboard {
+    margin: 0 0 2px 1px;
+}
+* **/
+
+
+/** * Fixes for IE7 and IE6 * - each property *must* be prefixed with
+an asterisk (*) * eg:
+.dashboard {
+    *margin: 0 0 4px 2px;
+}
+* **/
+
+span.svg-icon div {
+    *display: inline !important;
+}
+
+
+/** * Fixes for IE6 only * - each property *must* be prefixed with an
+underscore (_) * eg:
+.dashboard {
+    _margin: 0 0 0 1px;
+    _padding: 0 0
+    -3px 0;
+}
+* **/
+/* This file is served to all versions of IE up to IE9, no hacks as all versions need the one thing it contains :) */
+.inline-dialog-shim {
+    border: none;
+    display: block;
+    height: 0;
+    left: 0;
+    position: absolute;
+    top: 0;
+    width: 0;
+    z-index: -2;
+}
+/* AJS-563 Fix IE7 displaying I-beam cursor on hovering tab */
+*+html
+.aui-tabs ul.tabs-menu li.menu-item strong {
+    cursor: pointer;
+}
+.aui-toolbar .toolbar-dropdown .icon-dropdown,
+.aui-toolbar .toolbar-splitbutton .icon-dropdown {
+    *float: none;
+    *height: 10px; /* we do it this way so all icon spacing is attached to the icon */
+}
+
+.aui-toolbar .toolbar-dropdown .icon-dropdown {
+    background-position: -20px 10px;
+}
+
+.aui-toolbar .toolbar-trigger .icon-dropdown {
+    float: left;
+    margin: 0;
+    height: 24px
+}
+
+.toolbar-splitbutton .icon-dropdown {
+    *background-position: -58px -10px;
+    *border: 0;
+}
+.aui-toolbar .toolbar-group .first .toolbar-trigger {
+    border-left: 1px solid #ddd;
+}
+.aui-toolbar .toolbar-group .first .toolbar-trigger:hover {
+    border-left: 1px solid #999;
+}
+
+.aui-toolbar .toolbar-group .toolbar-item-link {
+    border-left: none;
+}
+
+.aui-toolbar .toolbar-group {
+    *padding-bottom: 10px;
+}
+
+.aui-toolbar .toolbar-item,
+.aui-toolbar .toolbar-trigger,
+.aui-toolbar .toolbar-trigger span {
+    *white-space: nowrap !important; 
+}
+
+.aui-toolbar .toolbar-group button.toolbar-trigger,
+.aui-toolbar .toolbar-group input.toolbar-trigger {
+    *width: 1%; /* prevent buttons collapsing in ie7 */
+}
+
+.aui-toolbar .toolbar-group button.toolbar-trigger,
+.aui-toolbar .toolbar-group input.toolbar-trigger {
+    *width: 1%; /* prevent buttons collapsing in ie7 */
+}
+
+/* START IE7 border shenanigins
+   - remove the mysteriously-added black border on buttons
+   - put the border on the item instead
+   - has-buttons added to .toolbar-group containing buttons
+   - multi class selectors purely for human readability, IE7 only reads the last class
+*/
+.aui-toolbar button {
+    *border: 0 !important;
+    *margin: 0;
+    *padding: 0;
+}
+.aui-toolbar .toolbar-item.contains-button {
+    *border: 1px solid #ddd !important;
+    *height: 24px;
+    *padding: 0;
+}
+.aui-toolbar .toolbar-item.toolbar-item-link {
+    *border: 0 !important;
+}
+/* END IE7 border shenanigins */
+
+/* Added by forceRightSplitToRow(), removing float from left split pushes the right split to its own row */
+.toolbar-split-left.force-split {
+    float: none;
+}
+
+/* disabled triggers - IE8 screws up without this */
+.aui-toolbar .disabled .toolbar-trigger,
+.aui-toolbar .toolbar-trigger.disabled {
+    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; /*IE8*/
+    filter: alpha(opacity=50); /* IE6-7 */
+}
+
+.aui-toolbar .disabled .first .toolbar-trigger,
+.aui-toolbar .disabled .toolbar-item.first .toolbar-trigger,
+.aui-toolbar .toolbar-group .disabled.first .toolbar-trigger,
+.aui-toolbar .toolbar-group .first .disabled.toolbar-trigger {
+    border-left: 1px solid #ddd;
+}
+

hipchat-notifier/public/css/aui-ie9.css

+/* dropdown-shim */
+.dropdown-shim {
+    border: none;
+    display: none;
+    position: absolute;
+    z-index: 2000;
+}

hipchat-notifier/public/css/aui.css

+/* Solution from https://github.com/necolas/normalize.css/blob/master/normalize.css */
+/* Corrects block display not defined in IE6/7/8/9 & FF3 */
+article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {
+    display: block;
+}
+
+/* Corrects inline-block display not defined in IE6/7/8/9 & FF3 */
+audio, canvas, video {
+    display: inline-block;
+    *display: inline;
+    *zoom: 1;
+}
+/**
+ * RESET
+ */
+html, body, p, div, h1, h2, h3, h4, h5, h6, img, pre, form, fieldset {
+    margin: 0;
+    padding: 0;
+}
+ul, ol, dl {
+    margin: 0;
+}
+
+/**
+ * PAGE LAYOUT
+ */
+.aui-layout #header {
+    clear: both;
+    float: left;
+    width: 100%;
+}
+
+.aui-layout #header ul {
+    list-style: none;
+    margin: 0;
+}
+
+.aui-layout #header .global,
+.aui-layout #header .global .primary,
+.aui-layout #header .global .primary > ul,
+.aui-layout #header .global .primary > ul > li,
+.aui-layout #header .local,
+.aui-layout #header .local .primary,
+.aui-layout #header .local .primary > ul,
+.aui-layout #header .local .primary > ul > li {
+    float: left;
+}
+
+.aui-layout #header .global .secondary,
+.aui-layout #header .global .secondary > ul,
+.aui-layout #header .global .secondary > ul > li,
+.aui-layout #header .local .secondary,
+.aui-layout #header .local .secondary > ul,
+.aui-layout #header .local .secondary > ul > li {
+    float: right;
+}
+
+.aui-layout #logo {
+    margin: 0;
+    padding: 0;
+}
+
+.aui-layout #header .local,
+.aui-layout #header .global {
+    width: 100%;
+}
+
+.aui-layout #content {
+    -moz-box-sizing: border-box;
+    -ms-box-sizing: border-box;
+    -o-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    clear: both;
+    position: relative;
+} 
+
+.aui-layout #footer {
+    clear: both;
+    float: left;
+    margin: 0;
+    padding: 0 0 16px 0;
+    width: 100%;
+} 
+
+.aui-layout #footer .footer-body a {
+    color: #505050;
+}
+
+.aui-layout #footer .footer-body > ul,
+.aui-layout #footer .footer-body > p {
+    margin: 8px 0 0 0;
+}
+
+.aui-layout #footer .footer-body > ul:first-child,
+.aui-layout #footer .footer-body > p:first-child {
+    margin: 0;
+}
+
+.aui-layout #footer .footer-body > ul {
+    display: block;
+    list-style: none;
+    padding: 0;
+}
+
+.aui-layout #footer .footer-body > ul > li {
+    display: inline-block;
+    padding: 0;
+}
+
+.aui-layout #footer .footer-body > ul > li + li {
+    margin-left: 8px;
+}
+
+.aui-layout #footer .footer-body > ul > li + li:before {
+    content: "|";
+    display: inline-block;
+    margin-right: 8px;
+}
+
+
+/**
+ * GROUP/ITEM
+ */
+
+.aui-group {
+    display: table;
+    -moz-box-sizing: border-box;
+    -ms-box-sizing: border-box;
+    -o-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    border-spacing: 0;
+    table-layout: fixed;
+    width: 100%;
+}
+
+.aui-group > .aui-item {
+    -moz-box-sizing: border-box;
+    -ms-box-sizing: border-box;
+    -o-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    display: table-cell;
+    margin: 0;
+    vertical-align: top;
+}
+
+.aui-group > .aui-item + .aui-item {
+    padding-left: 16px;
+}
+
+/* defensive header allowance */
+.aui-layout .aui-group > header {
+    display: table-caption;
+}
+
+/* .aui-group-split: two items; alignment is left, then right (splits the layout). */
+.aui-group.aui-group-split > .aui-item {
+	text-align: right;
+}
+.aui-group.aui-group-split > .aui-item:first-child {
+	text-align: left;
+}
+
+/* .aui-group-trio: three items; alignment is left, center, right */
+.aui-group.aui-group-trio > .aui-item {
+	text-align: left;
+}
+.aui-group.aui-group-trio > .aui-item + .aui-item {
+	text-align: center;
+}
+.aui-group.aui-group-trio > .aui-item + .aui-item + .aui-item {
+	text-align: right;
+}
+
+/**
+ * DEFAULT THEME SPACING
+ */
+.aui-theme-default #content {
+    margin: 0;
+	padding: 16px;    
+}
+
+/**
+ * PAGE DESIGN
+ */
+.aui-theme-default {
+    background: #F0F0F0;
+    color: #000;
+}
+
+.aui-theme-default a {
+    color: #326ca6;
+    text-decoration: none;
+}
+.aui-theme-default a:focus,
+.aui-theme-default a:hover,
+.aui-theme-default a:active {
+    text-decoration: underline;
+}
+
+.aui-theme-default h1,
+.aui-theme-default h2,
+.aui-theme-default h3,
+.aui-theme-default h4,
+.aui-theme-default h5,
+.aui-theme-default h6 {
+    color: #000;
+}
+
+.aui-theme-default #header .global {
+    background: #036;
+    color: #fff;
+}
+
+.aui-theme-default #header a {
+    color: #fff;
+}
+
+.aui-theme-default #header .local .primary > ul,
+.aui-theme-default #header .global .primary > ul {
+    padding: 0 0 0 8px;
+}
+
+.aui-theme-default #header .local .primary > ul > li,
+.aui-theme-default #header .global .primary > ul > li {
+    margin: 0 8px 0 0;
+}
+
+.aui-theme-default #header .local .primary > ul > li > a,
+.aui-theme-default #header .global .primary > ul > li > a {
+    display: block;
+    padding: 4px;
+    white-space: nowrap;
+}
+
+.aui-theme-default #header .local .secondary > ul,
+.aui-theme-default #header .global .secondary > ul {
+    padding: 0 8px 0 0;
+}
+
+.aui-theme-default #header .local .secondary > ul > li,
+.aui-theme-default #header .global .secondary > ul > li {
+    margin: 0 0 0 8px;
+}
+
+.aui-theme-default #header .local .secondary > ul > li > a,
+.aui-theme-default #header .global .secondary > ul > li > a {
+    display: block;
+    padding: 4px;
+    white-space: nowrap;
+}
+
+.aui-theme-default #header .local {
+    background: #326ca6;
+    border-top: 1px solid #036;
+    color: #fff;
+}
+
+.aui-theme-default #header .local .primary > ul > li > a:hover {
+    background: #fff;
+    color: #333;
+}
+
+.aui-theme-default #header .local .primary > ul > li.selected,
+.aui-theme-default #header .local .primary > ul > li.selected a {
+    background: #f0f0f0;
+    color: #333;
+}
+
+.aui-theme-default #footer .footer-body {
+    background: transparent;
+    color: #505050;
+    font-size: 11px;
+    line-height: 1.364;
+    margin: 0;
+    padding: 0 16px;
+} 
+
+.aui-theme-default #footer .footer-body {
+    text-align: center;    
+}
+
+/**
+ * CONTENT PANEL
+ */
+.aui-theme-default .aui-panel {
+    background: #fff;
+    border: 1px solid #bbb;
+    -webkit-border-radius: 5px;
+    -moz-border-radius: 5px;
+    border-radius: 5px;
+    padding: 16px;
+}
+
+/**
+ * TABS AS FIRST CHILD IN CONTENT
+ * Explicitly sets bg to white, changes horizontal hovers to work on grey.
+ * Remember these extend the standard component styles.
+ */
+.aui-theme-default #content > .aui-tabs > .tabs-pane {
+    background: #fff;
+    -webkit-border-radius: 5px;
+    -moz-border-radius: 5px;
+    border-radius: 5px;
+}
+
+.aui-theme-default #content > .aui-tabs.horizontal-tabs > .tabs-menu > li.menu-item a {
+    background: #f0f0f0;
+    border-color: #f0f0f0;
+}
+
+.aui-theme-default #content > .aui-tabs.horizontal-tabs > .tabs-menu > li.menu-item a:focus,
+.aui-theme-default #content > .aui-tabs.horizontal-tabs > .tabs-menu > li.menu-item a:hover {
+    background: #fff;
+    border-color: #bbb;
+    border-bottom-color: #fff;
+}
+
+.aui-theme-default #content > .aui-tabs.horizontal-tabs > .tabs-pane {
+    border: 1px solid #bbb;
+    margin: 0;
+    padding: 16px;
+}
+/**
+ * TYPOGRAPHY
+ */
+body {
+    font-family: Arial, FreeSans, Helvetica, sans-serif;
+    font-size: 13px;
+    line-height: 1.3077;    
+}
+
+p, ul, ol, dl,
+h1, h2, h3, h4, h5, h6,
+form.aui,
+table.aui,
+.aui-tabs,
+.aui-panel,
+.aui-group {
+    margin: 16px 0 0 0;
+}
+
+p:first-child,
+ul:first-child,
+ol:first-child,
+dl:first-child,
+h1:first-child,
+h2:first-child,
+h3:first-child,
+h4:first-child,
+h5:first-child,
+h6:first-child,
+form.aui:first-child,
+table.aui:first-child,
+.aui-tabs:first-child,
+.aui-panel:first-child,
+.aui-group:first-child {
+    margin-top: 0;
+}
+
+h1 { font-size: 25px; line-height: 1.16; } /* 29px equiv line-height */
+h2 { font-size: 23px; line-height: 1.174; } /* 27px equiv line-height */
+h3 { font-size: 19px; line-height: 1.2106; } /* 23px equiv line-height */
+h4 { font-size: 17px; line-height: 1.2353; } /* 21px equiv line-height */
+h5 { font-size: 15px; line-height: 1.2667; } /* 19px equiv line-height */
+h6 { font-size: 13px; line-height: 1.3077; } /* 17px equiv line-height */
+/**
+ * AUI Module and Header
+ */
+
+.aui-module,
+.aui-header {
+    margin-top: 16px;
+}
+
+.aui-module:first-child,
+.aui-header:first-child {
+    margin-top: 0;
+}
+
+/* do NOT set aui-header to table-layout: fixed */
+.aui-header,
+.aui-module-header,
+.aui-module-footer {
+    -moz-box-sizing: border-box;
+    -ms-box-sizing: border-box;
+    -o-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    border-spacing: 0;
+    width: 100%;
+}
+
+/* do NOT set aui-header to display: table. */
+.aui-module-header,
+.aui-module-footer {
+    display:table;
+}
+
+.aui-header .aui-header-main,
+.aui-header .aui-header-image,
+.aui-module-header .aui-header-main {
+    -moz-box-sizing: border-box;
+    -ms-box-sizing: border-box;
+    -o-box-sizing: border-box;
+    -webkit-box-sizing: border-box;
+    box-sizing: border-box;
+    display: table-cell;
+    margin: 0;
+    vertical-align: top;
+    text-align: left;
+}
+
+.aui-header .aui-header-image {
+    white-space: nowrap;
+}
+.aui-header .aui-header-image img {
+    margin: 0 8px 0 0;
+}
+.aui-header .aui-header-main {
+    /* this does actually work becase we don't set display:table on the parent. */
+    width: 100%;
+}
+
+.aui-header .aui-header-image + .aui-header-main {
+    margin: 0;
+    padding: 0;
+}
+
+.aui-header .aui-header-main .aui-breadcrumbs + h1,
+.aui-header .aui-header-main .aui-breadcrumbs + h2,
+.aui-header .aui-header-main .aui-breadcrumbs + h3,
+.aui-header .aui-header-main .aui-breadcrumbs + h4,
+.aui-header .aui-header-main .aui-breadcrumbs + h5,
+.aui-header .aui-header-main .aui-breadcrumbs + h6 {
+    margin-top: 0;
+}
+
+.aui-header ul.aui-header-actions,
+.aui-module ul.aui-header-actions {
+    display: table-cell;
+    list-style-type: none;
+    text-align: right;
+    vertical-align: top;
+    white-space: nowrap;
+    margin: 0;
+    padding: 0 0 0 8px;
+}
+.aui-header ul.aui-header-actions li,
+.aui-module ul.aui-header-actions li {
+    display: inline;
+}
+
+.aui-module-header > .aui-header-main,
+.aui-module-footer > .aui-header-main,
+.aui-module-header > .aui-header-actions,
+.aui-module-footer > .aui-header-actions {
+    margin: 0;
+}
+
+/**
+ * AUI Breadcrumbs prototype pattern
+ */
+
+.aui-breadcrumbs,
+.aui-breadcrumbs li {
+    margin: 0;
+    padding: 0;
+}
+.aui-breadcrumbs li {
+    display: inline-block;
+}
+.aui-breadcrumbs li:before {
+    content: ">";
+    padding-right: 4px;
+}
+.aui-breadcrumbs li:first-child:before {
+    content: "";
+    padding-right: 0;
+}
+.clear {
+    clear: both;
+}
+.hidden,
+form.aui .hidden,
+form.aui .field-group.hidden,
+form.aui fieldset.hidden {
+    display: none;
+}
+
+.assistive,
+legend.assistive span {
+    border: 0;
+    clip: rect(0 0 0 0);
+    height: 1px;
+    margin: -1px;
+    overflow: hidden;
+    padding: 0;
+    position: absolute;
+    width: 1px;
+}
+
+.aui-box-shadow {
+    box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.4);
+    -ms-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.4);
+    -moz-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.4);
+    -webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.4);
+}
+.aui-blanket {
+    background: #000;
+    height: 100%;
+    left: 0px;
+    opacity: 0.5;
+    position: fixed;
+    top: 0;
+    width: 100%;
+    z-index: 2500;
+}
+.aui-dialog-shadow-parent {
+    position: fixed;
+    overflow: hidden;
+    left:50%;
+    top:50%;
+}
+.aui-popup {
+    left: 50%;
+    position: fixed;
+    top: 50%;
+    z-index: 3000;
+}
+.aui-dialog {
+    border: 1px solid #666;
+    font-size: 14px;
+    overflow: hidden;
+}
+.aui-dialog h2.dialog-title {
+    background: #f0f0f0;
+    color: #666;
+    font-size: 1.5em;
+    height: 43px;
+    line-height: 43px;
+    margin: 0;
+    overflow: hidden;
+    padding: 0 1em;
+    position: relative;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+.aui-dialog .dialog-page-menu {
+    background: #fff;
+    border-right: 1px solid #f0f0f0;
+    float: left;
+    height: 100%;
+    list-style: none;
+    margin: 0 1.17em 0 0;
+    padding: 10px 0 0 0;
+    width: 25%;
+}
+.aui-dialog .dialog-page-menu li.page-menu-item {
+    margin: 0;
+    padding: 0;
+}
+.aui-dialog .dialog-page-menu li.page-menu-item.selected {
+    background: #69c;
+    color: #fff;
+}
+.aui-dialog .dialog-page-menu li.page-menu-item.selected button.item-button {
+    color: #fff;
+    font-weight: 800;
+}
+.aui-dialog .dialog-page-menu li.page-menu-item button.item-button {
+    background: none;
+    border: none;
+    color: #666;
+    font-family: "segoe ui", helvetica, arial, sans-serif;
+    font-size: 1em;
+    padding: .4em 1.2em;
+    text-align: left;
+    width: 100%;
+}
+.aui-dialog .dialog-panel-body {
+    overflow: auto;
+    padding: 10px;
+}
+
+.aui-dialog .dialog-button-panel {
+    background: #fff;
+    border-top: 1px solid #f0f0f0;
+    clear: both;
+    height: 23px;
+    overflow: hidden;
+    padding: 10px 0 10px 0;
+    text-align: right;
+    width: 100%;
+}
+.aui-dialog .dialog-button-panel button.button-panel-button {
+    font-size: 1em;
+    margin-right: 1.65em;
+    margin-top: 2px;
+}
+.aui-dialog .dialog-button-panel button.button-panel-button.left {
+    float: left;
+    margin: 0 0 0 0.5em;
+}
+
+.aui-dialog .dialog-button-panel a.button-panel-link {
+    font-size: 1em;
+    margin-right: 1.65em;
+    margin-top: 2px;
+}
+
+.aui-dialog .dialog-blanket {
+    position: absolute;
+    top: 0;
+    left: 0;
+    opacity: 0.2;
+    background: #000;
+}
+/* Styles for AJS.dropDown */
+.aui-dd-parent {
+    position: relative;
+}
+
+
+/*Default Styled Trigger*/
+.aui-dd-parent span a.aui-dd-trigger,
+.aui-dd-parent a.aui-dd-trigger {
+    background: transparent url(images/icons/aui-icon-tools.gif) no-repeat -13px 0;
+    border: none;
+    color: #000;
+    display: block;
+    height: 13px;
+    padding: 0;
+    text-indent: -9999px;
+    width: 13px;
+}
+.aui-dd-parent a.aui-dd-trigger:link,
+.aui-dd-parent a.aui-dd-trigger:visited {}
+.aui-dd-parent a.aui-dd-trigger.active,
+.aui-dd-parent a.aui-dd-trigger:hover,
+.aui-dd-parent a.aui-dd-trigger:active,
+.aui-dd-parent a.aui-dd-trigger:focus {
+    background: transparent url(images/icons/aui-icon-tools.gif) no-repeat -26px 0;
+    border: none;
+    color: #000;
+}
+
+
+.aui-dd-parent span a.aui-dd-trigger {
+    position: absolute;
+    right: 5px;
+    top: 8px;
+}
+
+/*UNSTYLED TRIGGER*/
+.aui-dd-parent span a.aui-dd-trigger.unstyled,
+.aui-dd-parent a.aui-dd-trigger.unstyled {
+    background: none;
+    border: none;
+    color: auto;
+    display: block;
+    height: auto;
+    padding: auto;
+    text-indent: 0;
+    width: auto;
+
+}
+.aui-dd-parent a.aui-dd-trigger-unstyled:link,
+.aui-dd-parent a.aui-dd-trigger-unstyled:visited {}
+.aui-dd-parent a.aui-dd-trigger-unstyled.active,
+.aui-dd-parent a.aui-dd-trigger-unstyled:hover,
+.aui-dd-parent a.aui-dd-trigger-unstyled:active,
+.aui-dd-parent a.aui-dd-trigger-unstyled:focus {
+    background: none;
+    border: none;
+    color: auto;
+}
+
+.aui-dd-parent span a.aui-dd-trigger-unstyled {
+    position: absolute;
+    right: auto;
+    top: auto;
+}
+
+.aui-dropdown {list-style-type:none;}
+
+.aui-dd-parent .aui-dropdown,
+.aui-dropdown,
+.aui-dd-parent .aui-shadow-parent {
+    background: #fff;
+    border: 1px solid #6A8EB3;
+    color: #000;
+    padding: 4px 0 4px 0;
+    position: absolute;
+    z-index: 2003;  
+    margin-top: -1px;
+}
+
+.aui-dd-parent  .aui-dropdown-left{
+    left:0px;
+}
+
+.aui-dd-parent .aui-dropdown-right{
+    right:0px;
+}
+
+.aui-dd-parent .aui-shadow {
+    right: 5px;
+}
+.aui-dd-parent .aui-dropdown li.dropdown-item,
+.aui-dropdown li.dropdown-item  {
+    background: #fff;
+    color: #000;
+    display: block;
+    float: none;
+    margin: 0;
+    position: static;
+}
+
+.aui-dd-parent .aui-dropdown a.item-link,
+.aui-dropdown a.item-link {
+    background: #fff;
+    color: #036;
+    display: inline-block;
+    float: none;
+    height: auto;
+    position: static;
+    text-indent: 0;
+    white-space: nowrap;
+    width: auto;
+}
+.aui-dd-parent .aui-dropdown a.item-link:link,
+.aui-dd-parent .aui-dropdown a.item-link:visited,
+.aui-dropdown a.item-link:link,
+.aui-dropdown a.item-link:visited {
+    background: #fff;
+    color: #036;
+    padding: 0.3em 0.5em;
+}
+.aui-dd-parent .aui-dropdown li.dropdown-item.active a.item-link,
+.aui-dd-parent .aui-dropdown a.item-link:hover,
+.aui-dd-parent .aui-dropdown a.item-link:active,
+.aui-dd-parent .aui-dropdown a.item-link:focus,
+.aui-dropdown a.item-link:hover,
+.aui-dropdown a.item-link:active,
+.aui-dropdown a.item-link:focus  {
+    background: #f2f2f2;
+    color: #036;
+    padding: 0.3em 0.5em;
+}
+
+.aui-dd-parent .aui-dropdown li.dropdown-item a.item-link span.icon {
+    display: inline-block;
+}
+
+div.shim {
+    position: absolute;
+}/* CSS Document for form styling - REQUIRES class of 'aui' to form */
+
+form.aui {
+    color: #333;
+    font-family: arial,tahoma,verdana,sans-serif;
+    font-size: 13px;
+    line-height: 1.4;
+    margin: 0 0 1em 0;
+    position: relative;
+}
+form.aui textarea,form.aui select,form.aui optgroup,form.aui option,form.aui input.text {
+    color: #000;
+    font-family: arial,tahoma,verdana,sans-serif;
+    font-size: 13px;
+}
+form.aui pre.aui-form {
+    background-color: #f8f8f8;
+    border: 1px solid #ddd;
+    font-family: monospace;
+    font-size: 13px;
+    overflow-x: auto;
+    overflow-y: visible;
+    padding: 15px;
+}
+form.aui img.aui-form,form.aui a img.aui-form,form.aui fieldset {
+    border: none;
+}
+form.aui span.aui-form {
+    margin-right: 0.25em;
+}
+form.aui p {
+    margin-bottom: 5px;
+    padding: 5px 0 5px 0;
+}
+form.aui fieldset {
+    border: 0;
+    display: block;
+    margin-bottom: 5px;
+    padding-bottom: 5px;
+    position: relative;
+}
+form.aui input,
+form.aui select {
+    margin-right: 5px;
+    padding: 2px;
+}
+form.aui select {
+    padding: 1px;
+}
+form.aui option {
+    padding: 0 1em;
+}
+form.aui textarea {
+    overflow: auto;
+    padding: 1px 2px;
+}
+form.aui input.button,
+form.aui button {
+    line-height: 1.2;
+    margin: 10px 10px 0 0;
+    padding: 0 0.5em;
+}
+form.aui .buttons a.cancel {
+    line-height: 1.2;
+    margin: 10px 10px 0 0;
+}
+@media screen and (-webkit-min-device-pixel-ratio:0) {
+    /* Safari 3.0 and Chrome hacks here */
+    form.aui button {
+        padding: 0.1em 0.5em 0.5em;
+    }
+
+}
+form.aui div.error {
+    color: #c00;
+    font-weight: bold;
+}
+form.aui div.description {
+    font-size: 11px;
+}
+form.aui .field-value {
+    color: #000;
+    display: inline-block;
+    font-weight: bold;
+    line-height: 1;
+    padding-top: 4px;
+}
+
+/* headings */
+form.aui h2,
+form.aui h3 {
+    border-bottom: 1px solid #ddd;
+    clear: both;
+    color: #222;
+    font-size: 16px;
+    margin: 10px 0;
+}
+form.aui h3 {
+    font-size: 14px;
+}
+
+form.aui.unsectioned h2,
+form.aui.unsectioned h3 {
+    border: none;
+}
+
+
+/* legend,labels left hand width related items */
+form.aui legend {
+    display: none;
+}
+form.aui legend span {
+    color: #333;
+    display: block;
+    left: 0;
+    line-height: 1;
+    position: absolute;
+    top: 3px;
+    white-space: normal;
+    width: 130px;
+    text-align: right;
+}
+form.aui .field-group {
+    clear: both;
+    display: block;
+    margin-bottom: 5px;
+    min-height: 1.6em;
+    padding: 0 0 5px 140px;
+}
+form.aui .field-group:last-child,
+form.aui fieldset fieldset:last-child {
+    margin-bottom: 0;
+    padding-bottom: 0;
+}
+form.aui .field-group label {
+    float: left;
+    display: block;
+    left: -140px;
+    line-height: 1;
+    margin-right: -130px;
+    padding-top: 4px;
+    position: relative;
+    width: 130px;
+    text-align: right;
+}
+form.aui div.matrix {
+    padding-top: 0;
+    width: 780px;
+}
+form.aui div.matrix div.checkbox,
+form.aui div.matrix div.radio {
+    clear: none;
+    float: left;
+    width: 250px;
+}
+
+/* input default and fixed widths */
+form.aui .text,
+form.aui .textarea,
+form.aui .select {
+    width: 250px;
+}
+form.aui .short-field {
+    width: 75px;
+}
+form.aui .medium-field {
+    width: 165px;
+}
+form.aui .long-field {
+    width: 500px;
+}
+/* select */
+form.aui .multi-select {
+    min-width: 250px;
+}
+form.aui .multi-select optgroup {
+    background-color: #f8f8f8;
+    color: #999;
+    font-style: normal;
+    font-weight: normal;
+}
+form.aui .multi-select optgroup option {
+    background-color: #fff;
+    color: #000;
+}
+/* date selects */
+form.aui .date-select legend {
+    display: block;
+}
+form.aui .date-select legend span {
+    left: 0;
+}
+form.aui .date-select .field-group label {
+    display: none;
+}
+/* submit div - outside the fieldsets */
+form.aui .buttons-container {
+    border-top: 1px solid #ddd;
+    clear: both;
+    margin-bottom: 5px;
+    min-height: 2.7em;
+    overflow: auto;
+}
+form.aui.unsectioned .buttons-container {
+    border: none;
+}
+form.aui .buttons {
+    padding: 0 0 5px 140px;
+}
+form.aui .buttons-container.right .buttons {
+    clear: both;
+    float: right;
+    padding: 0 5px 5px 0;
+    width: auto;
+}
+form.aui .buttons-container.left .buttons {
+    padding: 0 5px 5px 0;
+}
+
+/* radios and checkboxes */
+form.aui div.radio input.radio,
+form.aui div.checkbox input.checkbox {
+    border: none;
+    float: left;
+    margin-top: 2px;
+    width: 15px;
+} /* IE */
+
+/* groups */
+form.aui .group {
+    position: relative;
+    clear: both;
+    display: block;
+    margin-bottom: 5px;
+    min-height: 1.6em;
+    padding: 0 0 5px 0;
+}
+form.aui .group .field-value {
+    float: left;
+    margin-right: .25em;
+    min-width: 2.5em;
+    padding-top: 0;
+    line-height: inherit;
+}
+form.aui .group .field-value.checked {
+    color: #693;
+}
+form.aui .group legend {
+    display: block;
+}
+form.aui div.checkbox,
+form.aui div.radio {
+    padding: 0 0 5px 140px;
+} /* IE */
+form.aui .group label,
+form.aui div.radio label,
+form.aui div.checkbox label {
+    float: none;
+    display: inline;
+    left: 0;
+    margin: 0;
+    width: auto;
+}
+form.aui div.radio .error,
+form.aui div.checkbox .error {
+    margin-left: 19px;
+}
+form.aui div.radio .description,
+form.aui div.checkbox .description {
+    clear: both;
+    margin-left: 19px;
+}
+
+
+/* long labels - add long-label class to form "aui long-label" */
+form.aui.long-label .field-group,
+form.aui.long-label .group,
+form.aui.long-label .buttons {
+    padding-left: 250px;
+}
+form.aui.long-label .group label,
+form.aui.long-label .group .field-group,
+form.aui.long-label div.checkbox,
+form.aui.long-label div.radio {
+    padding: 0 0 5px 0;
+}
+
+form.aui.long-label .group label,
+form.aui.long-label .field-group label {
+    left:-200px;
+    margin-right:-190px;
+    width:190px;
+}
+
+
+form.aui.long-label legend span {
+    left: 110px;
+}
+