Skip to content

Commit

Permalink
refs #5192 use menudropdown widget for language selector as well to s…
Browse files Browse the repository at this point in the history
…implify code and have same look&feel
  • Loading branch information
tsteur committed May 20, 2014
1 parent 056e8ef commit 51f5b43
Show file tree
Hide file tree
Showing 12 changed files with 88 additions and 159 deletions.
2 changes: 1 addition & 1 deletion plugins/CoreHome/angularjs/menudropdown/menudropdown.less
Expand Up @@ -43,6 +43,7 @@
color: @theme-color-text !important;
text-decoration: none !important;
padding: 6px 25px 6px 6px !important;
font-size: 11px;

&:hover {
background: @color-silver-l80;
Expand All @@ -54,7 +55,6 @@
}

&.category {
font-size: 11px;
color: @theme-color-text-light !important
}

Expand Down
4 changes: 4 additions & 0 deletions plugins/CoreHome/angularjs/piwikAppConfig.js
@@ -1,6 +1,10 @@
angular.module('piwikApp.config', []);

(function () {
if ('undefined' === (typeof piwik) || !piwik) {
return;
}

var piwikAppConfig = angular.module('piwikApp.config');
// we probably want this later as a separate config file, till then it serves as a "bridge"
for (var index in piwik.config) {
Expand Down
1 change: 0 additions & 1 deletion plugins/CoreHome/stylesheets/coreHome.less
Expand Up @@ -218,7 +218,6 @@ a.Piwik_Popover_Error_Back {
}

#userMenu .items {
margin-left: -105px;
width: 150px;
}

Expand Down
19 changes: 17 additions & 2 deletions plugins/CoreUpdater/templates/layout.twig
@@ -1,5 +1,8 @@
<!DOCTYPE html>
<html>
<!--[if lt IE 9 ]>
<html class="old-ie" id="ng-app" ng-app="piwikApp"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!-->
<html id="ng-app" ng-app="piwikApp"><!--<![endif]-->
<head>
<meta charset="utf-8">
<title>Piwik &rsaquo; {{ 'CoreUpdater_UpdateTitle'|translate }}</title>
Expand All @@ -16,14 +19,26 @@
<script type="text/javascript" src="libs/jquery/jquery-ui.js"></script>
<script type="text/javascript" src="plugins/CoreHome/javascripts/donate.js"></script>
<script type="text/javascript" src="plugins/CoreUpdater/javascripts/updateLayout.js"></script>

<script type="text/javascript" src="libs/angularjs/angular.min.js"></script>
<script type="text/javascript" src="libs/angularjs/angular-sanitize.min.js"></script>
<script type="text/javascript" src="libs/angularjs/angular-animate.min.js"></script>
<script type="text/javascript" src="libs/angularjs/angular-cookies.min.js"></script>
<script type="text/javascript" src="plugins/CoreHome/angularjs/common/services/service.js"></script>
<script type="text/javascript" src="plugins/CoreHome/angularjs/common/filters/filter.js"></script>
<script type="text/javascript" src="plugins/CoreHome/angularjs/common/directives/directive.js"></script>
<script type="text/javascript" src="plugins/CoreHome/angularjs/piwikAppConfig.js"></script>
<script type="text/javascript" src="plugins/CoreHome/angularjs/piwikApp.js"></script>
<script type="text/javascript" src="plugins/Installation/javascripts/installation.js"></script>

<script type="text/javascript">{{ getJavascriptTranslations()|raw }}</script>
{% if 'General_LayoutDirection'|translate =='rtl' %}
<link rel="stylesheet" type="text/css" href="plugins/Zeitgeist/stylesheets/rtl.css"/>
{% endif %}

{% include "@CoreHome/_favicon.twig" %}
</head>
<body id="simple">
<body id="simple" ng-app="app">
<div id="contentsimple">
<div id="title">
<img title='Piwik' alt="Piwik" src="plugins/Morpheus/images/logo-header.png" style="margin-left:10px;"/>
Expand Down
16 changes: 14 additions & 2 deletions plugins/Installation/templates/layout.twig
@@ -1,5 +1,8 @@
<!DOCTYPE html>
<html>
<!--[if lt IE 9 ]>
<html class="old-ie" id="ng-app" ng-app="piwikApp"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!-->
<html id="ng-app" ng-app="piwikApp"><!--<![endif]-->
<head>
<meta charset="utf-8">
<title>Piwik &rsaquo; {{ 'Installation_Installation'|translate }}</title>
Expand All @@ -8,14 +11,23 @@
<link rel="shortcut icon" href="plugins/CoreHome/images/favicon.ico"/>
<script type="text/javascript" src="libs/jquery/jquery.js"></script>
<script type="text/javascript" src="libs/jquery/jquery-ui.js"></script>
<script type="text/javascript" src="libs/angularjs/angular.min.js"></script>
<script type="text/javascript" src="libs/angularjs/angular-sanitize.min.js"></script>
<script type="text/javascript" src="libs/angularjs/angular-animate.min.js"></script>
<script type="text/javascript" src="libs/angularjs/angular-cookies.min.js"></script>
<script type="text/javascript" src="plugins/CoreHome/angularjs/common/services/service.js"></script>
<script type="text/javascript" src="plugins/CoreHome/angularjs/common/filters/filter.js"></script>
<script type="text/javascript" src="plugins/CoreHome/angularjs/common/directives/directive.js"></script>
<script type="text/javascript" src="plugins/CoreHome/angularjs/piwikAppConfig.js"></script>
<script type="text/javascript" src="plugins/CoreHome/angularjs/piwikApp.js"></script>
<script type="text/javascript" src="plugins/Installation/javascripts/installation.js"></script>

<link rel="stylesheet" type="text/css" href="plugins/Installation/stylesheets/installation.css"/>
{% if 'General_LayoutDirection'|translate =='rtl' %}
<link rel="stylesheet" type="text/css" href="plugins/Zeitgeist/stylesheets/rtl.css"/>
{% endif %}
</head>
<body>
<body ng-app="app">
<div id="installationPage">
<div id="content">
<div id="logo">
Expand Down
6 changes: 4 additions & 2 deletions plugins/LanguagesManager/LanguagesManager.php
Expand Up @@ -46,7 +46,7 @@ public function getStylesheetFiles(&$stylesheets)

public function getJsFiles(&$jsFiles)
{
$jsFiles[] = "plugins/LanguagesManager/javascripts/languageSelector.js";
$jsFiles[] = "plugins/LanguagesManager/angularjs/languageselector/languageselector-directive.js";
}

/**
Expand All @@ -58,7 +58,8 @@ public function addLanguagesManagerToOtherTopBar(&$str)
{
// piwik object & scripts aren't loaded in 'other' topbars
$str .= "<script type='text/javascript'>if (!window.piwik) window.piwik={};</script>";
$str .= "<script type='text/javascript' src='plugins/LanguagesManager/javascripts/languageSelector.js'></script>";
$str .= "<script type='text/javascript' src='plugins/CoreHome/angularjs/menudropdown/menudropdown-directive.js'></script>";
$str .= "<script type='text/javascript' src='plugins/LanguagesManager/angularjs/languageselector/languageselector-directive.js'></script>";
$str .= $this->getLanguagesSelector();
}

Expand All @@ -83,6 +84,7 @@ public function getLanguagesSelector()
$view = new View("@LanguagesManager/getLanguagesSelector");
$view->languages = API::getInstance()->getAvailableLanguageNames();
$view->currentLanguageCode = self::getLanguageCodeForCurrentUser();
$view->currentLanguageName = self::getLanguageNameForCurrentUser();
return $view->render();
}

Expand Down
@@ -0,0 +1,32 @@
/*!
* Piwik - Web Analytics
*
* @link http://piwik.org
* @license http://www.gnu.org/licenses/gpl-3.0.html GPL v3 or later
*/

/**
* Usage:
* <div class="languageSelection">
* </div>
*/
angular.module('piwikApp').directive('languageSelection', function() {

return {
restrict: 'C',
link: function(scope, element, attr, ctrl) {

function postLanguageChange () {
var value = $(this).attr('value');
if (value) {
element.find('#language').val(value).parents('form').submit();
}
}

element.on('click', 'a[value]', postLanguageChange);
scope.$on('$destroy', function() {
element.off('click', 'a[value]', postLanguageChange);
});
}
};
});
72 changes: 0 additions & 72 deletions plugins/LanguagesManager/javascripts/languageSelector.js

This file was deleted.

26 changes: 14 additions & 12 deletions plugins/LanguagesManager/templates/getLanguagesSelector.twig
@@ -1,17 +1,19 @@
<span class="topBarElem">
<span id="languageSelection">
<form action="index.php?module=LanguagesManager&amp;action=saveLanguage" method="post">
<select name="language" id="language">
<option title="" value=""
href="?module=Proxy&amp;action=redirect&amp;url=http://piwik.org/translations/">{{ 'LanguagesManager_AboutPiwikTranslations'|translate }}</option>
{% for language in languages %}
<option value="{{ language.code }}" {% if language.code == currentLanguageCode %}selected="selected"{% endif %}
title="{{ language.name }} ({{ language.english_name }})">{{ language.name }}</option>
{% endfor %}
</select>
<div class="languageSelection"
menu-title="{{ currentLanguageName|e('html_attr') }}"
piwik-menudropdown>
<a class="item"
href="?module=Proxy&amp;action=redirect&amp;url=http://piwik.org/translations/">{{ 'LanguagesManager_AboutPiwikTranslations'|translate }}</a>
{% for language in languages %}
<a class="item {% if language.code == currentLanguageCode %}active{% endif %}"
value="{{ language.code }}"
title="{{ language.name }} ({{ language.english_name }})">{{ language.name }}</a>
{% endfor %}

<form action="index.php?module=LanguagesManager&amp;action=saveLanguage" method="post">
<input type="hidden" name="language" id="language">
{# During installation token_auth is not set #}
{% if token_auth is defined %}<input type="hidden" name="token_auth" value="{{ token_auth }}"/>{% endif %}
<input type="submit" value="go"/>
</form>
</span>
</div>
</span>
26 changes: 0 additions & 26 deletions plugins/Morpheus/stylesheets/theme.less
Expand Up @@ -38,32 +38,6 @@ body {
width: 50%;
}

#languageSelection .ui-autocomplete-input {
position: relative;
&:after {
content: '';
position: absolute;
top: 5px;
right: -13px;
border-left: 4px solid transparent;
border-right: 4px solid transparent;
border-top: 5px solid @theme-color-link;
}
}

#languageSelect {
border: 1px solid @color-silver-l80 !important;
li {
a {
color: @theme-color-text !important;
&:hover {
background: @color-silver-l80 !important;
color: @theme-color-text !important;
}
}
}
}

.entityTable {
.border-radius(0px)!important;
border:1px solid @color-silver-l80!important;
Expand Down
1 change: 1 addition & 0 deletions plugins/Zeitgeist/stylesheets/base.less
Expand Up @@ -22,6 +22,7 @@
@import "ui/_headerMessage.less";

@import "../../CoreHome/angularjs/siteselector/siteselector.less";
@import "../../CoreHome/angularjs/menudropdown/menudropdown.less";

@import "ui/_periodSelect.less";

Expand Down
42 changes: 1 addition & 41 deletions plugins/Zeitgeist/stylesheets/ui/_languageSelect.less
@@ -1,43 +1,3 @@
#languageSelect {
max-height: 400px;
overflow-y: auto;
overflow-x: hidden;
padding: 0 !important;
background:#FFF;
border: 1px solid #1F447F!important;
}

#languageSelection {
.languageSelection {
padding-right: 11px;
}

#languageSelection > form {
display: inline-block;
}

#languageSelection input, #languageSelection select {
display: none;
}

#languageSelection .ui-autocomplete-input:after {
display: inline;
content: " \25BC";
font-size: 0.9em;
}
#languageSelection .ui-autocomplete-input {
text-decoration: underline;
}

#languageSelect .ui-autocomplete-input:hover {
text-decoration: underline;
}

#languageSelect a {
text-decoration:none!important;
padding: 1px 25px 1px 3px!important;
}

#languageSelect a:hover {
background:#176999!important;
color:#FFF!important;
}

0 comments on commit 51f5b43

Please sign in to comment.