κρμγ 8 years ago
parent
commit
a892d2a840
10 changed files with 317 additions and 0 deletions
  1. 5 0
      .gitignore
  2. 30 0
      bower.json
  3. 30 0
      components/app.js
  4. 36 0
      components/nav/nav.html
  5. 25 0
      components/nav/nav.js
  6. 20 0
      components/route.js
  7. 90 0
      components/wizard/wizard-controller.js
  8. 46 0
      components/wizard/wizard.html
  9. BIN
      favicon.ico
  10. 35 0
      index.html

+ 5 - 0
.gitignore

@@ -35,3 +35,8 @@ jspm_packages
 
 # Optional REPL history
 .node_repl_history
+/*.iml
+/*.ipr
+/*.iws
+/nginx
+/bower_components

+ 30 - 0
bower.json

@@ -0,0 +1,30 @@
+{
+  "name": "solv",
+  "authors": [
+    "κρμγ <petryxa.clever@gmail.com>"
+  ],
+  "description": "",
+  "main": "components/app.js",
+  "license": "WTFPL",
+  "homepage": "",
+  "private": true,
+  "ignore": [
+    "**/.*",
+    "node_modules",
+    "bower_components",
+    "test",
+    "tests"
+  ],
+  "dependencies": {
+    "angular": "1.5.8",
+    "angular-ui-router": "0.3.1",
+    "angular-material": "^1.1.1",
+    "angular-material-icons": "^0.7.1",
+    "angular-messages": "^1.5.8",
+    "material-design-icons": "^3.0.1",
+    "underscore": "^1.8.3",
+    "roboto-fontface": "^0.6.0",
+    "d3-cloud-ng": "^0.9.6",
+    "angular-sanitize": "^1.5.8"
+  }
+}

+ 30 - 0
components/app.js

@@ -0,0 +1,30 @@
+/**
+ * Created by pk on 07.11.2016.
+ */
+angular.module('SolvIn', ['ui.router', 'ngMaterial', 'ngMdIcons', 'ngMessages', 'd3.cloud', 'ngSanitize'])
+    .config(function ($mdIconProvider) {
+        $mdIconProvider.iconSet('action', 'bower_components/material-design-icons/sprites/svg-sprite/svg-sprite-action.svg');
+        $mdIconProvider.iconSet('alert', 'bower_components/material-design-icons/sprites/svg-sprite/svg-sprite-alert.svg');
+        $mdIconProvider.iconSet('av', 'bower_components/material-design-icons/sprites/svg-sprite/svg-sprite-av.svg');
+        $mdIconProvider.iconSet('communication', 'bower_components/material-design-icons/sprites/svg-sprite/svg-sprite-communication.svg');
+        $mdIconProvider.iconSet('content', 'bower_components/material-design-icons/sprites/svg-sprite/svg-sprite-content.svg');
+        $mdIconProvider.iconSet('device', 'bower_components/material-design-icons/sprites/svg-sprite/svg-sprite-device.svg');
+        $mdIconProvider.iconSet('editor', 'bower_components/material-design-icons/sprites/svg-sprite/svg-sprite-editor.svg');
+        $mdIconProvider.iconSet('file', 'bower_components/material-design-icons/sprites/svg-sprite/svg-sprite-file.svg');
+        $mdIconProvider.iconSet('hardware', 'bower_components/material-design-icons/sprites/svg-sprite/svg-sprite-hardware.svg');
+        $mdIconProvider.iconSet('image', 'bower_components/material-design-icons/sprites/svg-sprite/svg-sprite-image.svg');
+        $mdIconProvider.iconSet('maps', 'bower_components/material-design-icons/sprites/svg-sprite/svg-sprite-maps.svg');
+        $mdIconProvider.iconSet('navigation', 'bower_components/material-design-icons/sprites/svg-sprite/svg-sprite-navigation.svg');
+        $mdIconProvider.iconSet('notification', 'bower_components/material-design-icons/sprites/svg-sprite/svg-sprite-notification.svg');
+        $mdIconProvider.iconSet('places', 'bower_components/material-design-icons/sprites/svg-sprite/svg-sprite-places.svg');
+        $mdIconProvider.iconSet('social', 'bower_components/material-design-icons/sprites/svg-sprite/svg-sprite-social.svg');
+        $mdIconProvider.iconSet('toggle', 'bower_components/material-design-icons/sprites/svg-sprite/svg-sprite-toggle.svg');
+    })
+    .config(function ($mdThemingProvider) {
+            $mdThemingProvider
+                .theme('default')
+                .primaryPalette('blue')
+                .accentPalette('teal')
+                .warnPalette('red')
+                .backgroundPalette('grey');
+    });

+ 36 - 0
components/nav/nav.html

@@ -0,0 +1,36 @@
+<md-toolbar layout="row" layout-align="start center">
+    <md-button class="md-icon-button" aria-label="navi" ng-click="toggleNav('left-nav')">
+        <md-icon md-svg-icon="action:ic_fingerprint_24px"></md-icon>
+    </md-button>
+    <div><h3>НАУКА ЛОГИКИ В КАРТИНКАХ</h3></div>
+    <span flex></span>
+    <md-button aria-label="Back" ng-click="showPrevStep()" ng-if="hasPrevStep()">
+        <span ng-if="!hasNextStep()">НАЗАД</span>
+        <md-icon md-svg-icon="navigation:ic_arrow_back_24px"></md-icon>
+    </md-button>
+    <md-button aria-label="Fwd" ng-click="showNextStep()" ng-if="hasNextStep()">
+        ДАЛЬШЕ
+        <md-icon md-svg-icon="navigation:ic_arrow_forward_24px"></md-icon>
+    </md-button>
+</md-toolbar>
+<div layout="row" layout-align="end center">
+    <md-subheader><em>{{phrase()}}</em></md-subheader>
+</div>
+<md-sidenav class="md-sidenav-left" md-component-id="left-nav">
+    <md-toolbar layout="row" layout-align="start center">
+        <md-button class="md-icon-button" aria-label="navi" ng-click="toggleNav('left-nav')">
+            <md-icon md-svg-icon="hardware:ic_keyboard_arrow_left_24px"></md-icon>
+        </md-button>
+        <div><h3>КАТЕГОРИИ</h3></div>
+    </md-toolbar>
+    <md-content>
+        <md-list>
+            <md-list-item ng-repeat="(i, step) in steps" ng-click="showStep(i) + toggleNav('left-nav')">
+                <div layout="row" class="md-list-item-text">
+                    <md-icon md-svg-icon="action:ic_timeline_24px" style="padding-right: 0.3em"></md-icon>
+                    <p>{{step.name}}</p>
+                </div>
+            </md-list-item>
+        </md-list>
+    </md-content>
+</md-sidenav>

+ 25 - 0
components/nav/nav.js

@@ -0,0 +1,25 @@
+/**
+ * Created by pk on 08.11.2016.
+ */
+angular.module('SolvIn')
+    .directive('navbar', function () {
+        return {
+            restrict: 'E',
+            templateUrl: 'components/nav/nav.html',
+            controller: function ($scope, $mdSidenav) {
+                $scope._=_; //усатый-полосатый
+
+                $scope.todayPhrase = null;
+
+                $scope.phrase = function () {
+                    var phrases = [`Метод есть осознание формы внутреннего самодвижения содержания изучаемого предмета.`,
+                    `Свобода — это господство над обстоятельствами со знанием дела.`, `Всё является примером диалектики.`];
+                    return _.isNull($scope.todayPhrase) ? ($scope.todayPhrase = phrases[Math.min(Math.round(Math.random()*phrases.length), phrases.length - 1)]) : $scope.todayPhrase;
+                };
+
+                $scope.toggleNav = function (id) {
+                    $mdSidenav(id).toggle();
+                }
+            }
+        }
+    });

+ 20 - 0
components/route.js

@@ -0,0 +1,20 @@
+/**
+ * Created by pk on 08.11.2016.
+ */
+angular.module('SolvIn')
+    .config(function ($stateProvider) {
+        $stateProvider
+            .state({
+                name: 'wizard',
+                url: '/wizard?id',
+                controller: 'WizardController',
+                templateUrl: 'components/wizard/wizard.html'
+            })
+            .state({
+                name: 'otherwise',
+                url: '*path',
+                controller: function ($state) {
+                    $state.go('wizard');
+                }
+            });
+    });

+ 90 - 0
components/wizard/wizard-controller.js

@@ -0,0 +1,90 @@
+angular.module('SolvIn')
+    .value('PureBeing', {
+        name: 'Чистое бытие',
+        words: ['есть', 'чистое', 'бытие'],
+        facts: [{
+            title: 'Есть', description: `Про всё можно сказать, что оно есть, хотя бы в виде слова.`
+        }, {
+            title: 'Бытие', description: `Всё, что есть - есть бытие.`
+        }, {
+            title: 'Чистое бытие', description: `Самое простое бытие, то есть бытие без всякой дальнейшей определённости, абстракция.`
+        }, {
+            title: 'Оно есть', description: `Кроме того, что <em>чистое&nbsp;бытие</em> есть, <em>ничего</em> о
+нём сказать нельзя.`
+        }, {
+            title: `Слово о ничто`, description: `Если о чистом бытии более нельзя сказать ничего, то как это <em>ничего</em> назвать?`,
+            actions: [{name: 'Ничто', value: `PureNothing`}]
+        }]
+    })
+    .value('PureNothing', {
+        name: 'Чистое ничто',
+        words: ['чистое', 'ничто'],
+        facts: [{title: 'Чистое ничто', description: 'Ничто чистого бытия, абстракции, есть абстрактное, <em>чистое&nbsp;ничто</em>.'},
+            {title: 'Переход', description: `Обсуждая понятие <em>чистое&nbsp;бытие</em> диалектически перешли к понятию <em>чистое&nbsp;ничто</em>.`},
+            {title: 'Чистое бытие переходит в чистое ничто.'}
+        ]
+    })
+    .controller('WizardController', function ($scope, $state, $stateParams, $mdToast, PureBeing, PureNothing) {
+        $scope.steps = [];
+        $scope.stepsMap = {};
+
+        function pushStep(id, step) {
+            $scope.steps.push(step);
+            $scope.stepsMap[id] = $scope.steps.length -1;
+        }
+        pushStep('PureBeing', PureBeing);
+        pushStep('PureNothing', PureNothing);
+
+        $scope.rotate = function (w) {
+            return [0, 90, -90][Math.round(2 * Math.random())];
+        };
+
+        $scope.events = {
+           click: function (tag) {
+                $mdToast.showSimple('КЛИК')
+           }
+        };
+
+        let update = $scope.update = function () {
+            $scope.words = [];
+            const maxWords = 300;
+            let step = $scope.step = $scope.steps[$scope.stepIdx];
+
+            for(var i = 0; i<maxWords; i++){
+                $scope.words.push({
+                    name: step.words[Math.round((step.words.length -1) * Math.random())],
+                    score: i < (2 * maxWords / 3) ? Math.random() / 2 : Math.random(),
+                    index: i
+                })
+            }
+        };
+
+        $scope.showStep = function (idx){
+           if(_.isNumber(idx)) {
+               $scope.stepIdx = idx;
+           } else {
+               $scope.stepIdx = $scope.stepsMap[idx];
+           }
+
+            $state.go('wizard', {id: _.invert($scope.stepsMap)[$scope.stepIdx]});
+        };
+
+        $scope.showNextStep = function () {
+            $scope.showStep($scope.stepIdx + 1);
+        };
+
+        $scope.showPrevStep = function () {
+            $scope.showStep($scope.stepIdx - 1);
+        };
+
+        $scope.hasNextStep = function () {
+            return ($scope.stepIdx + 1) < $scope.steps.length;
+        };
+
+        $scope.hasPrevStep = function () {
+            return ($scope.stepIdx - 1) >= 0;
+        };
+
+        $scope.showStep(_.isUndefined($stateParams.id) ? 'PureBeing' : $scope.stepsMap[$stateParams.id]);
+        update();
+    });

+ 46 - 0
components/wizard/wizard.html

@@ -0,0 +1,46 @@
+<style>
+    .d3-pane {
+        min-width: 600px;
+        width: 600px;
+        max-width: 600px;
+    }
+    .left-side {
+        padding-left: 1em;
+    }
+    .left-side-card-text{
+        text-align: left;
+    }
+    .right-side-card-text{
+        text-align: right;
+    }
+    .left-side-card{
+        padding-right: 2em;
+    }
+    .right-side-card{
+        padding-left: 2em;
+    }
+</style>
+<div layout="column">
+    <navbar></navbar>
+    <md-content layout="row" layout-align="space-around start">
+        <div flex="30" layout="column" class="left-side">
+            <div ng-class="$odd ? 'right-side-card' : 'left-side-card'" ng-repeat="fact in step.facts">
+                <md-card>
+                    <md-card-header>
+                        <md-card-header-text ng-class="$odd ? 'right-side-card-text' : 'left-side-card-text'">
+                            <span class="md-headline">{{fact.title}}</span>
+                            <span class="md-subhead" ng-bind-html="fact.description"></span>
+                        </md-card-header-text>
+                    </md-card-header>
+                    <md-card-actions layout="row" layout-align="end center" ng-if="!_.isEmpty(fact.actions)">
+                        <md-button ng-repeat="action in fact.actions" ng-click="showStep(action.value)">{{action.name}}</md-button>
+                    </md-card-actions>
+                </md-card>
+            </div>
+        </div>
+        <div class="d3-pane" flex="50">
+            <d3-cloud words="words" padding="1" slope-factor="40" slope-base="1" rotate="rotate(word)" events="events"></d3-cloud>
+        </div>
+        <div flex="20"></div>
+    </md-content>
+</div>

BIN
favicon.ico


+ 35 - 0
index.html

@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html lang="en" ng-app="SolvIn">
+    <head>
+        <meta charset="UTF-8">
+        <title>solv</title>
+        <link rel="icon" href="favicon.ico"/>
+        <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
+        <link rel="stylesheet" href="bower_components/angular/angular-csp.css"/>
+        <link rel="stylesheet" href="bower_components/angular-material/angular-material.css"/>
+        <link rel="stylesheet" href="bower_components/angular-material-icons/angular-material-icons.css"/>
+        <link rel="stylesheet" href="bower_components/roboto-fontface/css/roboto/roboto-fontface.css"/>
+        <link rel="stylesheet" href="bower_components/d3-cloud-ng/dist/d3-cloud-ng.css">
+    </head>
+    <body ui-view>
+        <script src="bower_components/angular/angular.js"></script>
+        <script src="bower_components/angular-ui-router/release/angular-ui-router.js"></script>
+
+        <script src="bower_components/angular-aria/angular-aria.js"></script>
+        <script src="bower_components/angular-animate/angular-animate.js"></script>
+        <script src="bower_components/angular-material/angular-material.js"></script>
+        <script src="bower_components/angular-messages/angular-messages.js"></script>
+        <script src="bower_components/angular-sanitize/angular-sanitize.js"></script>
+
+        <script src="bower_components/angular-material-icons/angular-material-icons.js"></script>
+        <script src="bower_components/underscore/underscore.js"></script>
+        <script src='bower_components/d3/d3.js'></script>
+        <script src='bower_components/d3-cloud/build/d3.layout.cloud.js'></script>
+        <script src='bower_components/d3-cloud-ng/dist/d3-cloud-ng.js'></script>
+
+        <script src="components/app.js"></script>
+        <script src="components/nav/nav.js"></script>
+        <script src="components/wizard/wizard-controller.js"></script>
+        <script src="components/route.js"></script>
+    </body>
+</html>