-
Notifications
You must be signed in to change notification settings - Fork 8
/
options.html
103 lines (98 loc) · 5.76 KB
/
options.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
<!DOCTYPE html>
<html x-ng-app="awsConsoleModApp">
<head>
<meta charset="utf-8">
<title>Customize AWS Console Header Setting</title>
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/colorpicker.min.css">
<link rel="stylesheet" href="css/extension.css">
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery-ui.min.js"></script>
<script type="text/javascript" src="js/angular.min.js"></script>
<script type="text/javascript" src="js/sortable.min.js"></script>
<script type="text/javascript" src="js/ui-bootstrap-tpls-2.1.3.min.js"></script>
<script type="text/javascript" src="js/bootstrap-colorpicker-module.min.js"></script>
<script type="text/javascript" src="js/common.js"></script>
<script type="text/javascript" src="js/options.js"></script>
</head>
<body class="extension" x-ng-controller="appCtrl" ng-init="loadSetting()">
<div id="prev-navbar" ng-style="{ 'background-color': previewRule.color }" class="previewHeader" style="height: 32px; font-size: 20px;">
<div id="previewLabel" _ng-show="previewRule.showLabel && previewRule.label != null && previewRule.label.length">{{ previewRule.label }}</div>
<div id="nav-logo" style="display:inline-block"></div>
<svg style="display:inline-block" width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<rect width="4" height="4" rx="1" fill="currentColor"></rect>
<rect y="6" width="4" height="4" rx="1" fill="currentColor"></rect>
<rect y="12" width="4" height="4" rx="1" fill="currentColor"></rect>
<rect x="6" width="4" height="4" rx="1" fill="currentColor"></rect>
<rect x="6" y="6" width="4" height="4" rx="1" fill="currentColor"></rect>
<rect x="6" y="12" width="4" height="4" rx="1" fill="currentColor"></rect>
<rect x="12" width="4" height="4" rx="1" fill="currentColor"></rect>
<rect x="12" y="6" width="4" height="4" rx="1" fill="currentColor"></rect>
<rect x="12" y="12" width="4" height="4" rx="1" fill="currentColor"></rect>
</svg>
Customize AWS Console Header Setting
</div>
<div style="height: 40px; padding: .5em;">
<div class="pull-right">
<button class="btn btn-xs btn-info" ng-click="addRule()"><i class="glyphicon glyphicon-plus-sign"></i> {{ "AddRule" | translate }}</button>
<button class="btn btn-xs btn-primary" ng-click="apply()"><i class="glyphicon glyphicon-save"></i> {{ "Apply" | translate }}</button>
<button class="btn btn-xs btn-success" ng-click="exportRule()" ng-disabled="ruleList.length > 999"><i class="glyphicon glyphicon-export"></i> {{ "Export" | translate }}</button>
<div style="display: inline-block;">
<input type="file" id="importFile" file-model="importFile" style="display:none;" accept="application/json"/>
<button class="btn btn-xs btn-warning" ng-click="importRule()"><i class="glyphicon glyphicon-import"></i> {{ "Import" | translate }}</button>
</div>
</div>
</div>
<div style="height:calc(100vh - 72px); overflow-y: auto; padding: 0 0.5em 0.5em 0.5em">
<table class="table table-bordered table-condensed" style="_padding-bottom: 0em; _border-collapse:unset">
<thead>
<tr class="bg-info">
<th class=" text-center" style="_width:1.5em;">
<i class="glyphicon glyphicon-sort"></i>
</th>
<th class="col-md-2">{{ "Label" | translate }}</th>
<th class="col-md-2">{{ "AccountName" | translate }}</th>
<th class="col-md-3">{{ "Region" | translate }}</th>
<th class="col-md-2">{{ "HeaderColor" | translate }}</th>
<th class="">{{ "Operations" | translate }}</th>
</tr>
</thead>
<tbody ui-sortable="sortableOptions" ng-model="ruleList">
<tr ng-repeat="rule in ruleList track by $index"
ng-class="{ disable_rule: !rule.enableRule }"
ng-mouseover="preview($index)"
ng-mouseleave="preview(-1)">
<td class="row-drag-cursor text-center" style="vertical-align: middle;" data-js="drag_handle">
<div style="vertical-align: middle;">
<i class="glyphicon glyphicon-menu-hamburger"></i>
</div>
</td>
<td><input type="text" class="form-control input-sm" ng-model="rule.label" placeholder="label"/></td>
<td><input type="text" class="form-control input-sm" ng-model="rule.user" placeholder="*" title="{{ 'TOOLTIP_AccountName' | translate }}"/></td>
<td>
<select ng-options="region.value as region.label for region in regions" class="form-control input-sm" ng-model="rule.region"></select>
</td>
<td>
<input colorpicker="hex" type="text" ng-model="rule.color" class="form-control input-sm color_picker" ng-style="{background:rule.color}" />
</td>
<td>
<button class="btn btn-sm" title="show label" ng-class="{ 'btn-success' : rule.showLabel }" ng-click="rule.showLabel = !rule.showLabel">
<i class="glyphicon glyphicon-tag"></i>
</button>
<button class="btn btn-sm" title="disable rule" ng-class="{ 'btn-warning' : !rule.enableRule }" ng-click="rule.enableRule = !rule.enableRule">
<i class="glyphicon glyphicon-pause"></i>
</button>
<button class="btn btn-sm btn-info" ng-click="copyRule($index)" title="copy rule">
<i class="glyphicon glyphicon-duplicate"></i>
</button>
<button class="btn btn-sm btn-danger" ng-click="removeRule($index);" title="remove rule">
<i class="glyphicon glyphicon-trash"></i>
</button>
</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>