Ufuk Kayserilioglu
aea00e4941
We want the default theme to be Aubergine since that is the default that comes with Slack. However, we were actually relying on the first theme in alphabetical sorted order as the default theme, which ended up changing the default as themes got added. This patch always makes it the first entry in the themes.yml file
72 lines
2.2 KiB
ERB
72 lines
2.2 KiB
ERB
//= require_tree .
|
|
|
|
var app = angular.module('theme', ['ui.router']);
|
|
|
|
app.config(['$stateProvider', '$urlRouterProvider',
|
|
function($stateProvider, $urlRouterProvider) {
|
|
$stateProvider
|
|
.state('theme', {
|
|
url: "/:slug",
|
|
controller: 'ThemeController',
|
|
params: {
|
|
slug: { value: '<%= default_theme.slug %>' }
|
|
}
|
|
});
|
|
$urlRouterProvider.otherwise('/<%= default_theme.slug %>');
|
|
}]);
|
|
|
|
app.controller('ThemeController', ['$scope', '$stateParams', '$state', '$location',
|
|
function($scope, $stateParams, $state, $location) {
|
|
var themes = {
|
|
<%= themes.map do |theme|
|
|
"'#{theme.slug}': '#{theme.colors}'"
|
|
end.join ",\n" %>
|
|
};
|
|
|
|
$scope.$on('$stateChangeSuccess', function() {
|
|
$scope.slug = $stateParams.slug;
|
|
});
|
|
|
|
$scope.$watch('slug', function(slug) {
|
|
if (!slug) {
|
|
return;
|
|
}
|
|
if (slug === 'custom') {
|
|
$scope.colors = $location.hash().split(',').map(function(part) {
|
|
return '#' + part;
|
|
}).join(',');
|
|
|
|
return;
|
|
}
|
|
$scope.colors = themes[$scope.slug];
|
|
$state.go('theme', { slug: slug });
|
|
});
|
|
|
|
$scope.$watch('colors', function(colors) {
|
|
if (!colors) {
|
|
return;
|
|
}
|
|
var parts = colors.split(',');
|
|
$scope.column_bg = parts[0];
|
|
$scope.menu_bg = parts[1];
|
|
$scope.active_item = parts[2];
|
|
$scope.active_item_text = parts[3];
|
|
$scope.hover_item = parts[4];
|
|
$scope.text_color = parts[5];
|
|
$scope.active_presence = parts[6];
|
|
$scope.mention_badge = parts[7];
|
|
|
|
function updateHash() {
|
|
$location.hash(parts.map(function(part) {
|
|
return part.replace('#', '');
|
|
}));
|
|
}
|
|
|
|
if ($scope.slug === 'custom') {
|
|
updateHash();
|
|
} else if (colors !== themes[$scope.slug]) {
|
|
$state.go('theme', { slug: 'custom' }).then(updateHash);
|
|
}
|
|
});
|
|
}]);
|