add icons for Character groups

www/analytics/plugins/DevicesDetection/templates/detection.twig

@@ -0,0 +1,97 @@
+{% extends 'admin.twig' %}
+
+{% block content %}
+
+    <script type="text/javascript">
+
+        function showList(type) {
+            var ajaxHandler = new ajaxHelper();
+            ajaxHandler.addParams({
+                module: 'DevicesDetection',
+                action: 'showList',
+                type: type
+            }, 'GET');
+            ajaxHandler.setFormat('html');
+            ajaxHandler.setCallback(function(response){
+                $('.itemList').html(response).dialog({
+                    modal: true,
+                    width: '50%',
+                    maxHeight: 400
+                });
+            });
+            ajaxHandler.send(true);
+        }
+
+    </script>
+
+    <style type="text/css">
+
+        textarea {
+            width: 700px;
+            display: block;
+        }
+
+        .detection td {
+            width: 50%;
+        }
+
+    </style>
+    <h1>{{ 'DevicesDetection_DeviceDetection'|translate }}</h1>
+
+    <h2>{{ 'DevicesDetection_UserAgent'|translate }}</h2>
+    <form action="{{ linkTo({}) }}" method="POST">
+        <textarea name="ua">{{ userAgent }}</textarea>
+        <input type="submit" value="{{ 'General_Refresh'|translate }}" />
+    </form>
+
+    <h2>{{ 'UserSettings_ColumnOperatingSystem'|translate }}</h2>
+    <table class="dataTable detection">
+        <tr>
+            <td>{{ 'General_Name'|translate }} <small>(<a href="javascript:showList('os');">{{ 'Mobile_ShowAll'|translate }}</a>)</small></td>
+            <td><img src="{{ os_logo }}" />{{ os_name }}</td>
+        </tr>
+        <tr>
+            <td>{{ 'CorePluginsAdmin_Version'|translate }}</td>
+            <td>{{ os_version }}</td>
+        </tr>
+        <tr>
+            <td>{{ 'UserSettings_OperatingSystemFamily'|translate }}  <small>(<a href="javascript:showList('osfamilies');">{{ 'Mobile_ShowAll'|translate }}</a>)</small></td>
+            <td><img src="{{ os_family_logo }}" />{{ os_family }}</td>
+        </tr>
+    </table>
+
+    <h2>{{ 'UserSettings_ColumnBrowser'|translate }}</h2>
+    <table class="dataTable detection">
+        <tr>
+            <td>{{ 'General_Name'|translate }} <small>(<a href="javascript:showList('browsers');">{{ 'Mobile_ShowAll'|translate }}</a>)</small></td>
+            <td><img src="{{ browser_logo }}" />{{ browser_name }}</td>
+        </tr>
+        <tr>
+            <td>{{ 'CorePluginsAdmin_Version'|translate }}</td>
+            <td>{{ browser_version }}</td>
+        </tr>
+        <tr>
+            <td>{{ 'UserSettings_ColumnBrowserFamily'|translate }} <small>(<a href="javascript:showList('browserfamilies');">{{ 'Mobile_ShowAll'|translate }}</a>)</small></td>
+            <td><img src="{{ browser_family_logo }}" />{{ browser_family }}</td>
+        </tr>
+    </table>
+
+    <h2>{{ 'DevicesDetection_Device'|translate }}</h2>
+    <table class="dataTable detection">
+        <tr>
+            <td>{{ 'DevicesDetection_dataTableLabelTypes'|translate }} <small>(<a href="javascript:showList('devicetypes');">{{ 'Mobile_ShowAll'|translate }}</a>)</small></td>
+            <td><img src="{{ device_type_logo }}" />{{ device_type }}</td>
+        </tr>
+        <tr>
+            <td>{{ 'DevicesDetection_dataTableLabelBrands'|translate }} <small>(<a href="javascript:showList('brands');">{{ 'Mobile_ShowAll'|translate }}</a>)</small></td>
+            <td><img src="{{ device_brand_logo }}" />{{ device_brand }}</td>
+        </tr>
+        <tr>
+            <td>{{ 'DevicesDetection_dataTableLabelModels'|translate }}</td>
+            <td>{{ device_model }}</td>
+        </tr>
+    </table>
+
+    <div style="display: none;" class="itemList"></div>
+
+{% endblock %}

www/analytics/plugins/DevicesDetection/templates/index.twig

@@ -0,0 +1,15 @@
+<div id='leftcolumn'>
+    <h2 piwik-enriched-headline>{{ "DevicesDetection_DeviceType"|translate }}</h2>
+    {{ deviceTypes  | raw}}
+    <h2 piwik-enriched-headline>{{ "DevicesDetection_DeviceBrand"|translate }}</h2>
+    {{ deviceBrands | raw }}
+    <h2 piwik-enriched-headline>{{ "DevicesDetection_DeviceModel"|translate }}</h2>
+    {{ deviceModels | raw }}
+</div>
+
+<div id='rightcolumn'>
+    <h2 piwik-enriched-headline>{{ "DevicesDetection_OperatingSystemFamilies"|translate }}</h2>
+    {{ osReport  | raw}}
+    <h2 piwik-enriched-headline>{{ "UserSettings_BrowserFamilies"|translate }}</h2>
+    {{ browserReport | raw }}
+</div>

www/analytics/plugins/DevicesDetection/templates/list.twig

@@ -0,0 +1,7 @@
+<table class="dataTable">
+    {% for name,image in itemList %}
+        <tr>
+            <td><img src="{{ image }}" /> {{ name }}</td>
+        </tr>
+    {% endfor %}
+</table>