178 |
179 | If you run this, you will get a cloned version of this repo to start working on in a private git repo,
180 | along with a CI service (in Jenkins) hosted that will run unit and end to end tests in both Firefox and Chrome.
181 |
182 |
183 | ## Contact
184 |
185 | For more information on AngularJS please check out http://angularjs.org/
186 |
187 | [git]: http://git-scm.com/
188 | [bower]: http://bower.io
189 | [npm]: https://www.npmjs.org/
190 | [node]: http://nodejs.org
191 | [protractor]: https://github.com/angular/protractor
192 | [jasmine]: http://jasmine.github.io
193 | [karma]: http://karma-runner.github.io
194 | [travis]: https://travis-ci.org/
195 | [http-server]: https://github.com/nodeapps/http-server
196 |
--------------------------------------------------------------------------------
/app/app.css:
--------------------------------------------------------------------------------
1 | /* app css stylesheet */
2 | body {
3 | height: none;
4 | background-color: #E7E7E7;
5 | }
6 |
7 | .box {
8 | width: 200px;
9 | height: 200px;
10 | background-color: yellow;
11 |
12 | }
13 |
14 | .fix-top {
15 | position: fixed;
16 | top:0;
17 | }
18 |
19 | .nornal-btn {
20 | width: 56px;
21 | height: 56px;
22 | }
23 |
24 | .nornal-round-btn {
25 | width: 56px;
26 | height: 56px;
27 | border-radius: 50%;
28 | }
29 |
30 | .float-btn {
31 | height:56px;
32 | width: 56px;
33 | position: fixed;
34 | bottom: 55px;
35 | right: 55px;
36 | }
37 |
38 | md-whiteframe {
39 | background: #fff;
40 | margin: 20px;
41 | padding: 20px;
42 | }
43 |
44 | .check {
45 | background-color: #E8EAF6;
46 | }
47 | .left-box {
48 | width:56px; height: 56px; padding:0; background-color: gray; border-radius: 50%;
49 | }
50 | .active-checkbox {
51 | background-color: transparent !important;
52 | }
53 |
54 | core-tooltip.fancy::shadow .core-tooltip {
55 | opacity: 0;
56 | -webkit-transition: all 300ms cubic-bezier(0,1.92,.99,1.07);
57 | transition: all 300ms cubic-bezier(0,1.92,.99,1.07);
58 | -webkit-transform: translate3d(0, -10px, 0);
59 | transform: translate3d(0, -10px, 0);
60 | }
61 |
62 | core-tooltip.fancy:hover::shadow .core-tooltip,
63 | core-tooltip.fancy:focus::shadow .core-tooltip {
64 | opacity: 1;
65 | -webkit-transform: translate3d(0, 0, 0);
66 | transform: translate3d(0, 0, 0);
67 | }
68 |
69 | .sample-show-hide {
70 |
71 | }
72 |
73 | .sample-show-hide {
74 | -webkit-transition:all linear 0.5s;
75 | transition:all linear 0.5s;
76 | }
77 |
78 | .sample-show-hide.ng-hide {
79 | opacity:0;
80 | }
81 |
82 |
83 | .md-subheader {
84 | background-color: #dcedc8;
85 |
86 | }
87 | h2.md-subheader {
88 | margin: 0px;
89 | margin-left: -24px;
90 | margin-right: -24px;
91 | margin-top: -24px; }
92 | h2.md-subheader.md-sticky-clone {
93 | margin-right: 0px;
94 | margin-top: 0px;
95 | box-shadow: 0px 2px 4px 0 rgba(0, 0, 0, 0.16); }
96 | h2 .md-subheader-content {
97 | padding-left: 10px; }
98 |
99 |
100 |
101 | md-backdrop {
102 | position: fixed !important;
103 | }
104 |
105 | md-toast {
106 | position: fixed !important;
107 |
108 | }
109 |
110 | md-sidenav {
111 | position: fixed !important;
112 | }
113 |
114 | md-tooltip {
115 | position: fixed !important;
116 | }
117 |
118 | .menu-item {
119 | background: none;
120 | border-width: 0;
121 | cursor: pointer;
122 | display: block;
123 | color: #333;
124 | font-size: inherit;
125 | line-height: 40px;
126 | max-height: 40px;
127 | opacity: 1;
128 | margin: 0;
129 | outline: none;
130 | padding: 0px 28px;
131 | position: relative;
132 | text-align: left;
133 | text-decoration: none;
134 | width: 100%;
135 | z-index: 1;
136 | -webkit-transition: 0.45s cubic-bezier(0.35, 0, 0.25, 1);
137 | -webkit-transition-property: max-height, background-color, opacity;
138 | -moz-transition: 0.45s cubic-bezier(0.35, 0, 0.25, 1);
139 | -moz-transition-property: max-height, background-color, opacity;
140 | transition: 0.45s cubic-bezier(0.35, 0, 0.25, 1);
141 | transition-property: max-height, background-color, opacity;
142 | }
143 | .menu-item.ng-hide {
144 | max-height: 0;
145 | opacity: 0;
146 | }
147 | .menu-item:hover {
148 | color: #999;
149 | }
150 | .menu-item:focus {
151 | font-weight: bold;
152 | }
153 | .menu-item.menu-title {
154 | color: #888;
155 | font-size: 14px;
156 | padding-left: 16px;
157 | text-align: left;
158 | text-transform: uppercase;
159 | transition: color 0.35s cubic-bezier(0.35, 0, 0.25, 1);
160 | }
161 | .menu-item.menu-title:hover,
162 | .menu-item.menu-title.active {
163 | color: #1976d2;
164 | }
165 |
166 | .menu-icon {
167 | background: none;
168 | border: none;
169 | }
170 |
171 | .menu-separator-icon {
172 | margin: 0;
173 | }
174 | .menu-module-name {
175 | opacity: 0.6;
176 | font-size: 18px;
177 | }
178 |
179 | .list-cont {
180 | background-color: #E7E7E7 !important;
181 | max-width: 800px;
182 | margin: 0 auto;
183 | height: 100%;
184 | overflow: hidden;
185 | }
186 |
187 | .list-cb {
188 | margin: 0;
189 | position: relative;
190 | top: 15px;
191 | left: 19px;
192 | }
193 |
194 | .list-check-area {
195 | width:56px;
196 | height: 56px;
197 | padding:0;
198 | margin-right: 10px;
199 | }
--------------------------------------------------------------------------------
/app/app.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | // Declare app level module which depends on views, and components
4 | angular.module('myApp', [
5 | 'ngRoute',
6 | 'myApp.view1',
7 | 'myApp.home',
8 | 'myApp.version',
9 | 'ngMaterial'
10 | ]).
11 | config(['$routeProvider', function($routeProvider) {
12 | $routeProvider.otherwise({redirectTo: '/home'});
13 | }])
14 |
15 | .controller('MainCtrl', function($scope, $timeout, $mdSidenav) {
16 | $scope.toggleRight = function() {
17 | $mdSidenav('left').toggle();
18 | };
19 |
20 | $scope.menu = {};
21 | $scope.menu.pages = [
22 | {"url": "/home", "discription":"Главная"},
23 | {"url": "/view1", "discription":"Список дел"}
24 |
25 | ];
26 |
27 | $scope.menu.isPageSelected = function(page) {
28 | return ($scope.menu.currentPage === page);
29 | };
30 |
31 | $scope.menu.toggleSelectPage = function(page) {
32 | $scope.menu.currentPage = page;
33 | };
34 | })
35 |
36 | .controller('LeftCtrl', function($scope, $timeout, $mdSidenav) {
37 | $scope.close = function() {
38 | $mdSidenav('left').close();
39 | };
40 | });
--------------------------------------------------------------------------------
/app/components/version/interpolate-filter.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | angular.module('myApp.version.interpolate-filter', [])
4 |
5 | .filter('interpolate', ['version', function(version) {
6 | return function(text) {
7 | return String(text).replace(/\%VERSION\%/mg, version);
8 | };
9 | }]);
10 |
--------------------------------------------------------------------------------
/app/components/version/interpolate-filter_test.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | describe('myApp.version module', function() {
4 | beforeEach(module('myApp.version'));
5 |
6 | describe('interpolate filter', function() {
7 | beforeEach(module(function($provide) {
8 | $provide.value('version', 'TEST_VER');
9 | }));
10 |
11 | it('should replace VERSION', inject(function(interpolateFilter) {
12 | expect(interpolateFilter('before %VERSION% after')).toEqual('before TEST_VER after');
13 | }));
14 | });
15 | });
16 |
--------------------------------------------------------------------------------
/app/components/version/version-directive.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | angular.module('myApp.version.version-directive', [])
4 |
5 | .directive('appVersion', ['version', function(version) {
6 | return function(scope, elm, attrs) {
7 | elm.text(version);
8 | };
9 | }]);
10 |
--------------------------------------------------------------------------------
/app/components/version/version-directive_test.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | describe('myApp.version module', function() {
4 | beforeEach(module('myApp.version'));
5 |
6 | describe('app-version directive', function() {
7 | it('should print current version', function() {
8 | module(function($provide) {
9 | $provide.value('version', 'TEST_VER');
10 | });
11 | inject(function($compile, $rootScope) {
12 | var element = $compile('')($rootScope);
13 | expect(element.text()).toEqual('TEST_VER');
14 | });
15 | });
16 | });
17 | });
18 |
--------------------------------------------------------------------------------
/app/components/version/version.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | angular.module('myApp.version', [
4 | 'myApp.version.interpolate-filter',
5 | 'myApp.version.version-directive'
6 | ])
7 |
8 | .value('version', '0.1');
9 |
--------------------------------------------------------------------------------
/app/components/version/version_test.js:
--------------------------------------------------------------------------------
1 | 'use strict';
2 |
3 | describe('myApp.version module', function() {
4 | beforeEach(module('myApp.version'));
5 |
6 | describe('version service', function() {
7 | it('should return current version', inject(function(version) {
8 | expect(version).toEqual('0.1');
9 | }));
10 | });
11 | });
12 |
--------------------------------------------------------------------------------
/app/dialog.tmpl.html:
--------------------------------------------------------------------------------
1 | Это простая демонстрация разработки Angular приложения в стиле Material Design с библиотеки Material Angular
4 |Внимание!: В данном приложении не содержится никакой серверной части, поэтому все изменения не будут сохраняться.
5 |Приложение служит только для демонстрации
6 |Переходите в 'Список дел', там Вы можете добавлять, удалять задачи, можете выбирать несколько задач сразу
7 |45 | {{item.notes}} 46 |
47 |Это простая демонстрация разработки Angular приложения в стиле Material Design с библиотеки Material Angular
4 |Внимание!: В данном приложении не содержится никакой серверной части, поэтому все изменения не будут сохраняться.
5 |Приложение служит только для демонстрации
6 |Переходите в 'Список дел', там Вы можете добавлять, удалять задачи, можете выбирать несколько задач сразу
7 |45 | {{item.notes}} 46 |
47 |Toast can be dismissed with a swipe, a timer, or a button.
3 |