Shenlin / publisher

Go to a project
Toggle navigation Toggle navigation pinning
lintry
45fa4fb0 1 parent f2b4078e

增加CSSgram的样式效果

Inline Side-by-side
Showing 10 changed files with 101 additions and 134 deletions
1 +{
2 + "key": "0102030405060708",
3 + "iv": "0000000000000000"
4 +}
...\ No newline at end of file ...\ No newline at end of file
...@@ -20,6 +20,7 @@ ...@@ -20,6 +20,7 @@
20 "express": "^4.14.0", 20 "express": "^4.14.0",
21 "formidable": "^1.0.17", 21 "formidable": "^1.0.17",
22 "gm": "^1.23.0", 22 "gm": "^1.23.0",
23 + "kml-express-stage": "git+ssh://git@gitlab.kmlab.com:comm/express-stage.git",
23 "lodash": "^4.16.5", 24 "lodash": "^4.16.5",
24 "log4js": "^0.6.38", 25 "log4js": "^0.6.38",
25 "lrz": "^4.9.40", 26 "lrz": "^4.9.40",
......
1 -/**
2 - * Created by lintry on 16/7/18.
3 - */
4 -"use strict";
5 -
6 -function CryptoJSON(sKey, sIv) {
7 - const path = require('path'),
8 - util = require('util'),
9 - crypto_utils = require('./crypto-utils');
10 -
11 - if (!(this instanceof CryptoJSON)) {
12 - return new CryptoJSON(sKey, sIv);
13 - }
14 -
15 -
16 - function convert(source, type, key, iv) {
17 - key = key || sKey;
18 - iv = iv || sIv;
19 - var method = crypto_utils[!!type ? 'AESEncode': 'AESDecode'];
20 - if (source) {
21 - if (util.isString(source)) {
22 - return method(source, key, iv);
23 - }
24 - var target = util.isArray(source)? [] : {};
25 - for (let k in source) {
26 - var v = source[k];
27 - if (!v) {
28 - target[k] = v;
29 - }
30 - else if (typeof v === 'object') {
31 - target[k] = convert(v, type, key, iv);
32 - } else {
33 - target[k] = method(v, key, iv);
34 - }
35 - }
36 - return target;
37 - } else {
38 - return null;
39 - }
40 - }
41 -
42 - /**
43 - * 加密对象
44 - * @param obj
45 - * @param key
46 - * @param iv
47 - * @returns {*}
48 - */
49 - this.encode = function (obj, key, iv) {
50 - return convert(obj, 1, key, iv);
51 - };
52 -
53 - /**
54 - * 解密对象
55 - * @param crypto_obj
56 - * @param key
57 - * @param iv
58 - * @returns {*}
59 - */
60 - this.decode = function (crypto_obj, key, iv) {
61 - return convert(crypto_obj, 0, key, iv);
62 - };
63 -}
64 -
65 -module.exports = CryptoJSON;
...\ No newline at end of file ...\ No newline at end of file
1 -/**
2 - * Created by lintry on 16/4/19.
3 - *
4 - * 加密解密算法工具
5 - */
6 -"use strict";
7 -
8 -module.exports = function () {
9 - const CryptoJS = require("crypto-js"),
10 - uuid = require('node-uuid');
11 -
12 - const DEFAULT_KEY = '0102030405060708',
13 - DEFAULT_IV = '0000000000000000',
14 - PADDING_CHAR = 'ABCDEFGHIJKLMNOP',
15 - PADDING_LENGTH = 16;
16 - var cj = {};
17 -
18 - function padding(text) {
19 - text = text || '';
20 - return text + PADDING_CHAR.substr(0, PADDING_LENGTH - ((text.length % PADDING_LENGTH)||PADDING_LENGTH));
21 - }
22 -
23 - cj.AESEncode = function (word, sKey, sIv) {
24 - var key = CryptoJS.enc.Utf8.parse(padding(sKey || DEFAULT_KEY));
25 - var iv = CryptoJS.enc.Utf8.parse(padding(sIv || DEFAULT_IV));
26 - var srcs = CryptoJS.enc.Utf8.parse(word);
27 - var encrypted = CryptoJS.AES.encrypt(srcs, key, {iv: iv, mode: CryptoJS.mode.CBC});
28 - return encrypted.toString();
29 - };
30 -
31 - cj.AESDecode = function (word, sKey, sIv) {
32 - var key = CryptoJS.enc.Utf8.parse(padding(sKey || DEFAULT_KEY));
33 - var iv = CryptoJS.enc.Utf8.parse(padding(sIv || DEFAULT_IV));
34 - var decrypted = CryptoJS.AES.decrypt(word, key, {iv: iv, mode: CryptoJS.mode.CBC});
35 - return CryptoJS.enc.Utf8.stringify(decrypted).toString();
36 - };
37 -
38 - cj.Base64Encode = function (text) {
39 - var words = CryptoJS.enc.Utf8.parse(text);
40 - return CryptoJS.enc.Base64.stringify(words);
41 - };
42 -
43 - cj.Base64Decode = function (text) {
44 - return CryptoJS.enc.Base64.parse(text).toString(CryptoJS.enc.Utf8);
45 - };
46 -
47 - cj.MD5 = function (text) {
48 - return CryptoJS.MD5(text).toString();
49 - };
50 -
51 - cj.SHA1 = function (text) {
52 - return CryptoJS.SHA1(text).toString();
53 - };
54 -
55 - cj.UUID = function() {
56 - return uuid.v4().replace(/[-]/g,'');
57 - };
58 -
59 - return cj;
60 -}();
...\ No newline at end of file ...\ No newline at end of file
...@@ -18,8 +18,8 @@ module.exports = function Uploader(routerPath, db) { ...@@ -18,8 +18,8 @@ module.exports = function Uploader(routerPath, db) {
18 UPLOAD_OPTION = global.config.upload, 18 UPLOAD_OPTION = global.config.upload,
19 ENTITIES_PATH = config_path.ENTITIES_PATH, 19 ENTITIES_PATH = config_path.ENTITIES_PATH,
20 logger = global.loggers.upload, 20 logger = global.loggers.upload,
21 - crypto_utils = require('./crypto-utils'), 21 + crypto_utils = require('kml-crypto-utils'),
22 - Result = require('./result'); 22 + Result = require('kml-express-stage/lib/result');
23 23
24 const 24 const
25 DEST_DIR = path.resolve(UPLOAD_OPTION.root, routerPath), 25 DEST_DIR = path.resolve(UPLOAD_OPTION.root, routerPath),
......
...@@ -4,7 +4,7 @@ const express = require('express'), ...@@ -4,7 +4,7 @@ const express = require('express'),
4 app = express(), 4 app = express(),
5 router = express.Router(), 5 router = express.Router(),
6 Uploader = require('./lib/uploader'), 6 Uploader = require('./lib/uploader'),
7 - Result = require('./lib/result'); 7 + Result = require('kml-express-stage/lib/result');
8 8
9 // 定义参数 9 // 定义参数
10 const config = require('./init/config'), 10 const config = require('./init/config'),
......
...@@ -6,7 +6,11 @@ ...@@ -6,7 +6,11 @@
6 <title>lrz4 demo&test</title> 6 <title>lrz4 demo&test</title>
7 7
8 <link rel="stylesheet" href="../lib/bootstrap/3.3.5/css/bootstrap.min.css"/> 8 <link rel="stylesheet" href="../lib/bootstrap/3.3.5/css/bootstrap.min.css"/>
9 + <link rel="stylesheet" href="https://cssgram-cssgram.netdna-ssl.com/cssgram.min.css">
9 <style> 10 <style>
11 + .css-gram{
12 + width: 100%;
13 + }
10 img { 14 img {
11 width: 100%; 15 width: 100%;
12 max-width: 320px; 16 max-width: 320px;
...@@ -48,7 +52,32 @@ ...@@ -48,7 +52,32 @@
48 <div id="upload-container" class="col-xs-12 text-center"> 52 <div id="upload-container" class="col-xs-12 text-center">
49 <input accept="image/*" type="file"/> 53 <input accept="image/*" type="file"/>
50 </div> 54 </div>
51 - 55 + <div class="col-xs-12 text-center">
56 + <h3>图片样式</h3>
57 + <small class="text-muted">选择一个预设的CSSgram的样式</small>
58 + <div>
59 + <select id="filter">
60 + <option>aden</option>
61 + <option>reyes</option>
62 + <option>perpetua</option>
63 + <option>inkwell</option>
64 + <option>toaster</option>
65 + <option>walden</option>
66 + <option>hudson</option>
67 + <option>gingham</option>
68 + <option>mayfair</option>
69 + <option>lofi</option>
70 + <option>xpro2</option>
71 + <option>_1977</option>
72 + <option>brooklyn</option>
73 + <option>nashville</option>
74 + <option>lark</option>
75 + <option>moon</option>
76 + <option>clarendon</option>
77 + <option>willow</option>
78 + </select>
79 + </div>
80 + </div>
52 <div class="col-xs-12 text-center"> 81 <div class="col-xs-12 text-center">
53 <hr/> 82 <hr/>
54 <h3>旋转方向测试</h3> 83 <h3>旋转方向测试</h3>
...@@ -92,6 +121,6 @@ ...@@ -92,6 +121,6 @@
92 121
93 122
94 <script src="../lib/lrz/lrz.bundle.js"></script> 123 <script src="../lib/lrz/lrz.bundle.js"></script>
95 -<script src="./index.js?v=27ce5f7"></script> 124 +<script src="./index.js"></script>
96 </body> 125 </body>
97 </html> 126 </html>
......
...@@ -37,10 +37,11 @@ document.querySelector('input').addEventListener('change', function () { ...@@ -37,10 +37,11 @@ document.querySelector('input').addEventListener('change', function () {
37 var that = this; 37 var that = this;
38 38
39 lrz(that.files[0], { 39 lrz(that.files[0], {
40 - width: 800 40 + width: 1024
41 }) 41 })
42 .then(function (rst) { 42 .then(function (rst) {
43 var img = new Image(), 43 var img = new Image(),
44 + figure = document.createElement('figure'),
44 div = document.createElement('div'), 45 div = document.createElement('div'),
45 p = document.createElement('p'), 46 p = document.createElement('p'),
46 sourceSize = toFixed2(that.files[0].size / 1024), 47 sourceSize = toFixed2(that.files[0].size / 1024),
...@@ -56,7 +57,9 @@ document.querySelector('input').addEventListener('change', function () { ...@@ -56,7 +57,9 @@ document.querySelector('input').addEventListener('change', function () {
56 '</span> '; 57 '</span> ';
57 58
58 div.className = 'col-sm-6'; 59 div.className = 'col-sm-6';
59 - div.appendChild(img); 60 + figure.className = 'css-gram ' + document.querySelector('#filter').value;
61 + figure.appendChild(img);
62 + div.appendChild(figure);
60 div.appendChild(p); 63 div.appendChild(p);
61 64
62 img.onload = function () { 65 img.onload = function () {
...@@ -101,6 +104,17 @@ document.querySelector('input').addEventListener('change', function () { ...@@ -101,6 +104,17 @@ document.querySelector('input').addEventListener('change', function () {
101 document.querySelector('#version').innerHTML = lrz.version; 104 document.querySelector('#version').innerHTML = lrz.version;
102 document.querySelector('.UA').innerHTML = 'UA: ' + navigator.userAgent; 105 document.querySelector('.UA').innerHTML = 'UA: ' + navigator.userAgent;
103 106
107 +document.querySelector('#filter').addEventListener('change', function (e) {
108 + var filter = e.target.value;
109 + if (filter) {
110 + [].forEach.call(document.querySelectorAll('.css-gram'), function (el) {
111 + (function (el) {
112 + el.className = 'css-gram ' + filter;
113 + })(el);
114 + });
115 + }
116 +});
117 +
104 function toFixed2 (num) { 118 function toFixed2 (num) {
105 return parseFloat(+num.toFixed(2)); 119 return parseFloat(+num.toFixed(2));
106 } 120 }
......
...@@ -6,7 +6,11 @@ ...@@ -6,7 +6,11 @@
6 <title>lrz4 demo&test</title> 6 <title>lrz4 demo&test</title>
7 7
8 <link rel="stylesheet" href="../lib/bootstrap/3.3.5/css/bootstrap.min.css"/> 8 <link rel="stylesheet" href="../lib/bootstrap/3.3.5/css/bootstrap.min.css"/>
9 + <link rel="stylesheet" href="https://cssgram-cssgram.netdna-ssl.com/cssgram.min.css">
9 <style> 10 <style>
11 + .css-gram{
12 + width: 100%;
13 + }
10 img { 14 img {
11 width: 100%; 15 width: 100%;
12 max-width: 320px; 16 max-width: 320px;
...@@ -54,6 +58,32 @@ ...@@ -54,6 +58,32 @@
54 </div> 58 </div>
55 59
56 <div class="col-xs-12 text-center"> 60 <div class="col-xs-12 text-center">
61 + <h3>图片样式</h3>
62 + <small class="text-muted">选择一个预设的CSSgram的样式</small>
63 + <div>
64 + <select id="filter">
65 + <option>aden</option>
66 + <option>reyes</option>
67 + <option>perpetua</option>
68 + <option>inkwell</option>
69 + <option>toaster</option>
70 + <option>walden</option>
71 + <option>hudson</option>
72 + <option>gingham</option>
73 + <option>mayfair</option>
74 + <option>lofi</option>
75 + <option>xpro2</option>
76 + <option>_1977</option>
77 + <option>brooklyn</option>
78 + <option>nashville</option>
79 + <option>lark</option>
80 + <option>moon</option>
81 + <option>clarendon</option>
82 + <option>willow</option>
83 + </select>
84 + </div>
85 + </div>
86 + <div class="col-xs-12 text-center">
57 <hr/> 87 <hr/>
58 <h3>旋转方向测试</h3> 88 <h3>旋转方向测试</h3>
59 <small class="text-muted">看到的图像应该全是一个方向的，没见到图片是出问题了</small> 89 <small class="text-muted">看到的图像应该全是一个方向的，没见到图片是出问题了</small>
...@@ -96,6 +126,6 @@ ...@@ -96,6 +126,6 @@
96 126
97 127
98 <script src="../lib/lrz/lrz.bundle.js"></script> 128 <script src="../lib/lrz/lrz.bundle.js"></script>
99 -<script src="./server.js?v=c8aaa97"></script> 129 +<script src="./server.js"></script>
100 </body> 130 </body>
101 </html> 131 </html>
......
...@@ -42,6 +42,7 @@ document.querySelector('input').addEventListener('change', function () { ...@@ -42,6 +42,7 @@ document.querySelector('input').addEventListener('change', function () {
42 }) 42 })
43 .then(function (rst) { 43 .then(function (rst) {
44 var img = new Image(), 44 var img = new Image(),
45 + figure = document.createElement('figure'),
45 div = document.createElement('div'), 46 div = document.createElement('div'),
46 p = document.createElement('p'), 47 p = document.createElement('p'),
47 sourceSize = toFixed2(that.files[0].size / 1024), 48 sourceSize = toFixed2(that.files[0].size / 1024),
...@@ -56,7 +57,9 @@ document.querySelector('input').addEventListener('change', function () { ...@@ -56,7 +57,9 @@ document.querySelector('input').addEventListener('change', function () {
56 }); 57 });
57 58
58 div.className = 'col-sm-6'; 59 div.className = 'col-sm-6';
59 - div.appendChild(img); 60 + figure.className = 'css-gram ' + document.querySelector('#filter').value;
61 + figure.appendChild(img);
62 + div.appendChild(figure);
60 div.appendChild(p); 63 div.appendChild(p);
61 64
62 img.onload = function () { 65 img.onload = function () {
...@@ -122,6 +125,17 @@ document.querySelector('input').addEventListener('change', function () { ...@@ -122,6 +125,17 @@ document.querySelector('input').addEventListener('change', function () {
122 document.querySelector('#version').innerHTML = lrz.version; 125 document.querySelector('#version').innerHTML = lrz.version;
123 document.querySelector('.UA').innerHTML = 'UA: ' + navigator.userAgent; 126 document.querySelector('.UA').innerHTML = 'UA: ' + navigator.userAgent;
124 127
128 +document.querySelector('#filter').addEventListener('change', function (e) {
129 + var filter = e.target.value;
130 + if (filter) {
131 + [].forEach.call(document.querySelectorAll('.css-gram'), function (el) {
132 + (function (el) {
133 + el.className = 'css-gram ' + filter;
134 + })(el);
135 + });
136 + }
137 +});
138 +
125 function toFixed2 (num) { 139 function toFixed2 (num) {
126 return parseFloat(+num.toFixed(2)); 140 return parseFloat(+num.toFixed(2));
127 } 141 }
......