@mjhls/mjh-framework 1.0.249 → 1.0.251

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (42) hide show
  1. package/README.md +171 -171
  2. package/dist/cjs/{AdSlot-a79ba074.js → AdSlot-9f3af35d.js} +30 -21
  3. package/dist/cjs/DeckContent.js +10 -10
  4. package/dist/cjs/DeckQueue.js +1 -1
  5. package/dist/cjs/{GridContent-e6c8fb75.js → GridContent-007573a0.js} +3 -3
  6. package/dist/cjs/GridContent.js +3 -3
  7. package/dist/cjs/IssueContentDeck.js +1 -1
  8. package/dist/cjs/IssueDeck.js +1 -1
  9. package/dist/cjs/MasterDeck.js +9 -9
  10. package/dist/cjs/{Normal-2ee1925d.js → Normal-503df349.js} +30 -30
  11. package/dist/cjs/PublicationDeck.js +1 -1
  12. package/dist/cjs/QueueDeckExpanded.js +1 -1
  13. package/dist/cjs/{TaxonomyCard-b5074d6e.js → TaxonomyCard-e3566492.js} +1 -1
  14. package/dist/cjs/TaxonomyCard.js +2 -2
  15. package/dist/cjs/TemplateNormal.js +2 -2
  16. package/dist/cjs/ThumbnailCard.js +1 -1
  17. package/dist/cjs/VideoSeriesListing.js +1 -1
  18. package/dist/cjs/{YoutubeGroup-fd44f8a0.js → YoutubeGroup-5f480446.js} +4 -4
  19. package/dist/cjs/YoutubeGroup.js +1 -1
  20. package/dist/cjs/{index-39beccb3.js → index-be0c82be.js} +1 -2
  21. package/dist/cjs/index.js +787 -613
  22. package/dist/esm/{AdSlot-fb853576.js → AdSlot-0f82b407.js} +30 -21
  23. package/dist/esm/DeckContent.js +10 -10
  24. package/dist/esm/DeckQueue.js +1 -1
  25. package/dist/esm/{GridContent-3711b837.js → GridContent-9e96754b.js} +2 -2
  26. package/dist/esm/GridContent.js +3 -3
  27. package/dist/esm/IssueContentDeck.js +1 -1
  28. package/dist/esm/IssueDeck.js +1 -1
  29. package/dist/esm/MasterDeck.js +9 -9
  30. package/dist/esm/{Normal-b0b212a3.js → Normal-dfda02dc.js} +30 -30
  31. package/dist/esm/PublicationDeck.js +1 -1
  32. package/dist/esm/QueueDeckExpanded.js +1 -1
  33. package/dist/esm/{TaxonomyCard-ee1a22ae.js → TaxonomyCard-2d0ab635.js} +1 -1
  34. package/dist/esm/TaxonomyCard.js +2 -2
  35. package/dist/esm/TemplateNormal.js +2 -2
  36. package/dist/esm/ThumbnailCard.js +1 -1
  37. package/dist/esm/VideoSeriesListing.js +1 -1
  38. package/dist/esm/{YoutubeGroup-1b3eca73.js → YoutubeGroup-78d93d44.js} +4 -4
  39. package/dist/esm/YoutubeGroup.js +1 -1
  40. package/dist/esm/{index-3849e3fe.js → index-73819142.js} +1 -2
  41. package/dist/esm/index.js +789 -618
  42. package/package.json +102 -102
package/README.md CHANGED
@@ -1,171 +1,171 @@
1
-
2
- # mjh-framework v. 1.0.249
3
-
4
- > Foundation Framework
5
-
6
- [![NPM](https://img.shields.io/npm/v/mjh-framework.svg)](https://www.npmjs.com/package/mjh-framework) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)
7
-
8
- ## Install
9
-
10
- ```bash
11
- npm install --save @mjhls/mjh-framework
12
- ```
13
-
14
- ## Usage
15
-
16
- ```jsx
17
- import React, { Component } from 'react'
18
-
19
- import { NavMagazine, DeckQueue } from 'mjh-framework'
20
-
21
- export default class App extends Component {
22
- render() {
23
- return (
24
- <div>
25
- <NavMagazine />
26
- <DeckQueue />
27
- </div>
28
- )
29
- }
30
- }
31
- ```
32
-
33
- ## Publish new updates to the npm registry
34
-
35
- ```bash
36
- npm publish
37
- ```
38
-
39
- ## For getting updates in the template without publishing each time a change is made in the framework
40
-
41
- Link react and react-dom of the template repo, so that it can be used by the framework.
42
- This is to avoid the error arising due to multiple instances of React.
43
-
44
- ```bash
45
- cd ../mjh-template/node_modules/react
46
-
47
- yarn link
48
-
49
- cd ../react-dom
50
-
51
- yarn link
52
-
53
- cd ../../../mjh-framework
54
-
55
- yarn link react && yarn link react-dom
56
- ```
57
-
58
- Link the framework repo so that it can be used in the template
59
-
60
- ```bash
61
- npm link
62
-
63
- cd ../mjh-template
64
-
65
- npm link @mjhls/mjh-framework
66
- ```
67
-
68
- ## Components and "props"
69
-
70
- ### Deck Components
71
-
72
- - #### DeckContent
73
-
74
- ##### Props
75
-
76
- - mapping
77
- - dataRecord
78
- - query
79
- - params
80
- - pointer
81
- - pointerArray
82
- - defaultImage
83
-
84
- - #### DeckQueue
85
- ##### Props
86
- - page
87
- - dataRecord
88
- - query
89
- - params
90
- - pointer
91
- - pointerArray
92
-
93
- ### Layout Components
94
-
95
- - #### Column1
96
- - #### Column2
97
- ##### Props
98
- - rightItems
99
- - #### Column3
100
- ##### Props
101
- - leftItems
102
- - rightItems
103
- ##### Common Props (Column1, Column2, Column3)
104
- - title
105
- - children
106
- - #### Header
107
- ##### Props
108
- - title
109
- - keyword
110
- - description
111
- - #### LeftNav
112
- ##### Props
113
- - leftItems
114
- - #### AccordionPanel
115
- ##### Props
116
- - accordionClassName
117
- - data
118
-
119
- ### Navigation Components
120
-
121
- - #### NavMagazine
122
- ##### Props
123
- - logo
124
- - dataObject
125
- - #### NavNative
126
- ##### Props
127
- - logo
128
- - dataObject
129
- - #### NavNormal
130
- ##### Props
131
- - logo
132
- - dataObject
133
- - variant
134
- - #### NavDvm
135
- ##### Props
136
- - logo
137
- - dataObject
138
- - subNavHeads
139
-
140
- ### Template Components
141
-
142
- - #### TemplateNormal
143
- ##### Props
144
- - config
145
- - title
146
- - keywords
147
- - description
148
- - website
149
-
150
- ### Ad Components
151
-
152
- - #### AD300x250
153
- - #### AD300x250x600
154
- - #### AD728x90
155
- ##### Common Props
156
- - networkID
157
- - adUnit
158
-
159
- ### Serializers
160
-
161
- - #### getSerializers (function)
162
- ##### arguments
163
- - client
164
- ##### types
165
- - youtube
166
- - figure
167
- - slideshow
168
-
169
- ## License
170
-
171
- MIT © [mjh-framework](https://github.com/mjh-framework)
1
+
2
+ # mjh-framework v. 1.0.251
3
+
4
+ > Foundation Framework
5
+
6
+ [![NPM](https://img.shields.io/npm/v/mjh-framework.svg)](https://www.npmjs.com/package/mjh-framework) [![JavaScript Style Guide](https://img.shields.io/badge/code_style-standard-brightgreen.svg)](https://standardjs.com)
7
+
8
+ ## Install
9
+
10
+ ```bash
11
+ npm install --save @mjhls/mjh-framework
12
+ ```
13
+
14
+ ## Usage
15
+
16
+ ```jsx
17
+ import React, { Component } from 'react'
18
+
19
+ import { NavMagazine, DeckQueue } from 'mjh-framework'
20
+
21
+ export default class App extends Component {
22
+ render() {
23
+ return (
24
+ <div>
25
+ <NavMagazine />
26
+ <DeckQueue />
27
+ </div>
28
+ )
29
+ }
30
+ }
31
+ ```
32
+
33
+ ## Publish new updates to the npm registry
34
+
35
+ ```bash
36
+ npm publish
37
+ ```
38
+
39
+ ## For getting updates in the template without publishing each time a change is made in the framework
40
+
41
+ Link react and react-dom of the template repo, so that it can be used by the framework.
42
+ This is to avoid the error arising due to multiple instances of React.
43
+
44
+ ```bash
45
+ cd ../mjh-template/node_modules/react
46
+
47
+ yarn link
48
+
49
+ cd ../react-dom
50
+
51
+ yarn link
52
+
53
+ cd ../../../mjh-framework
54
+
55
+ yarn link react && yarn link react-dom
56
+ ```
57
+
58
+ Link the framework repo so that it can be used in the template
59
+
60
+ ```bash
61
+ npm link
62
+
63
+ cd ../mjh-template
64
+
65
+ npm link @mjhls/mjh-framework
66
+ ```
67
+
68
+ ## Components and "props"
69
+
70
+ ### Deck Components
71
+
72
+ - #### DeckContent
73
+
74
+ ##### Props
75
+
76
+ - mapping
77
+ - dataRecord
78
+ - query
79
+ - params
80
+ - pointer
81
+ - pointerArray
82
+ - defaultImage
83
+
84
+ - #### DeckQueue
85
+ ##### Props
86
+ - page
87
+ - dataRecord
88
+ - query
89
+ - params
90
+ - pointer
91
+ - pointerArray
92
+
93
+ ### Layout Components
94
+
95
+ - #### Column1
96
+ - #### Column2
97
+ ##### Props
98
+ - rightItems
99
+ - #### Column3
100
+ ##### Props
101
+ - leftItems
102
+ - rightItems
103
+ ##### Common Props (Column1, Column2, Column3)
104
+ - title
105
+ - children
106
+ - #### Header
107
+ ##### Props
108
+ - title
109
+ - keyword
110
+ - description
111
+ - #### LeftNav
112
+ ##### Props
113
+ - leftItems
114
+ - #### AccordionPanel
115
+ ##### Props
116
+ - accordionClassName
117
+ - data
118
+
119
+ ### Navigation Components
120
+
121
+ - #### NavMagazine
122
+ ##### Props
123
+ - logo
124
+ - dataObject
125
+ - #### NavNative
126
+ ##### Props
127
+ - logo
128
+ - dataObject
129
+ - #### NavNormal
130
+ ##### Props
131
+ - logo
132
+ - dataObject
133
+ - variant
134
+ - #### NavDvm
135
+ ##### Props
136
+ - logo
137
+ - dataObject
138
+ - subNavHeads
139
+
140
+ ### Template Components
141
+
142
+ - #### TemplateNormal
143
+ ##### Props
144
+ - config
145
+ - title
146
+ - keywords
147
+ - description
148
+ - website
149
+
150
+ ### Ad Components
151
+
152
+ - #### AD300x250
153
+ - #### AD300x250x600
154
+ - #### AD728x90
155
+ ##### Common Props
156
+ - networkID
157
+ - adUnit
158
+
159
+ ### Serializers
160
+
161
+ - #### getSerializers (function)
162
+ ##### arguments
163
+ - client
164
+ ##### types
165
+ - youtube
166
+ - figure
167
+ - slideshow
168
+
169
+ ## License
170
+
171
+ MIT © [mjh-framework](https://github.com/mjh-framework)
@@ -924,7 +924,11 @@ var Beam = {
924
924
  switch (_context.prev = _context.next) {
925
925
  case 0:
926
926
  beam = _this.get_beam(deviceType);
927
- _context.next = 3;
927
+
928
+
929
+ console.log('Call Beam', action, beam);
930
+
931
+ _context.next = 4;
928
932
  return fetch(beam_domain + '/api/beam/event', {
929
933
  headers: {
930
934
  'Content-Type': 'application/json',
@@ -939,19 +943,19 @@ var Beam = {
939
943
  })
940
944
  });
941
945
 
942
- case 3:
946
+ case 4:
943
947
  response = _context.sent;
944
- _context.next = 6;
948
+ _context.next = 7;
945
949
  return response.json();
946
950
 
947
- case 6:
951
+ case 7:
948
952
  res = _context.sent;
949
953
 
950
954
  if (res.error) {
951
955
  console.error('Beam reporting error:', res.error);
952
956
  }
953
957
 
954
- case 8:
958
+ case 9:
955
959
  case 'end':
956
960
  return _context.stop();
957
961
  }
@@ -977,7 +981,9 @@ var Beam = {
977
981
  data.size = adSize;
978
982
  data.slotId = slotId;
979
983
 
980
- _context2.next = 9;
984
+ console.log('Call DFP', action, data);
985
+
986
+ _context2.next = 10;
981
987
  return fetch(beam_domain + '/api/beam/ad', {
982
988
  headers: {
983
989
  'Content-Type': 'application/json',
@@ -993,19 +999,19 @@ var Beam = {
993
999
  })
994
1000
  });
995
1001
 
996
- case 9:
1002
+ case 10:
997
1003
  response = _context2.sent;
998
- _context2.next = 12;
1004
+ _context2.next = 13;
999
1005
  return response.json();
1000
1006
 
1001
- case 12:
1007
+ case 13:
1002
1008
  res = _context2.sent;
1003
1009
 
1004
1010
  if (res.error) {
1005
- console.error('Beam AD reporting error:', res.error);
1011
+ console.error('DFP reporting error:', res.error);
1006
1012
  }
1007
1013
 
1008
- case 14:
1014
+ case 15:
1009
1015
  case 'end':
1010
1016
  return _context2.stop();
1011
1017
  }
@@ -1030,7 +1036,9 @@ var Beam = {
1030
1036
  data.segment = segment;
1031
1037
  data.current = current;
1032
1038
 
1033
- _context3.next = 8;
1039
+ console.log('Call YouTube', action, data);
1040
+
1041
+ _context3.next = 9;
1034
1042
  return fetch(beam_domain + '/api/beam/video', {
1035
1043
  headers: {
1036
1044
  'Content-Type': 'application/json',
@@ -1039,26 +1047,26 @@ var Beam = {
1039
1047
  method: 'post',
1040
1048
  credentials: "include",
1041
1049
  body: _JSON$stringify({
1042
- event: 'DFP',
1050
+ event: 'Video',
1043
1051
  action: action,
1044
1052
  beam: _JSON$stringify(beam),
1045
1053
  data: _JSON$stringify(data)
1046
1054
  })
1047
1055
  });
1048
1056
 
1049
- case 8:
1057
+ case 9:
1050
1058
  response = _context3.sent;
1051
- _context3.next = 11;
1059
+ _context3.next = 12;
1052
1060
  return response.json();
1053
1061
 
1054
- case 11:
1062
+ case 12:
1055
1063
  res = _context3.sent;
1056
1064
 
1057
1065
  if (res.error) {
1058
- console.error('Beam AD reporting error:', res.error);
1066
+ console.error('Video reporting error:', res.error);
1059
1067
  }
1060
1068
 
1061
- case 13:
1069
+ case 14:
1062
1070
  case 'end':
1063
1071
  return _context3.stop();
1064
1072
  }
@@ -1075,7 +1083,9 @@ var DFPAdSlot = function DFPAdSlot(_ref) {
1075
1083
  slotId = _ref.slotId,
1076
1084
  sizes = _ref.sizes,
1077
1085
  _ref$targeting = _ref.targeting,
1078
- targeting = _ref$targeting === undefined ? {} : _ref$targeting;
1086
+ targeting = _ref$targeting === undefined ? {} : _ref$targeting,
1087
+ _ref$refreshFlag = _ref.refreshFlag,
1088
+ refreshFlag = _ref$refreshFlag === undefined ? true : _ref$refreshFlag;
1079
1089
 
1080
1090
  var _useState = React.useState(false),
1081
1091
  _useState2 = slicedToArray._slicedToArray(_useState, 2),
@@ -1144,7 +1154,6 @@ var DFPAdSlot = function DFPAdSlot(_ref) {
1144
1154
 
1145
1155
  var hasFocus = slot_div.getAttribute('hasFocus');
1146
1156
  if (hasFocus == 'yes' && document.hidden) {
1147
- console.log('AD Clicked:', eventData.slotId);
1148
1157
  slot_div.setAttribute('hasFocus', 'no');
1149
1158
  Beam.report_beam_ad('Click', main.main_16, cID, lID, campID, adSize, slotId);
1150
1159
  }
@@ -1156,7 +1165,7 @@ var DFPAdSlot = function DFPAdSlot(_ref) {
1156
1165
  },
1157
1166
  onSlotVisibilityChanged: handleVisibilityChange,
1158
1167
  shouldRefresh: function shouldRefresh() {
1159
- if (adRendered && adRefreshable) return true;else return false;
1168
+ if (adRendered && adRefreshable && refreshFlag) return true;else return false;
1160
1169
  }
1161
1170
  })
1162
1171
  );
@@ -24,11 +24,11 @@ require('next/link');
24
24
  var Router = require('next/router');
25
25
  var Router__default = _interopDefault(Router);
26
26
  require('react-dom');
27
- var index$1 = require('./index-39beccb3.js');
27
+ var index$1 = require('./index-be0c82be.js');
28
28
  var index$2 = require('./index-fa0fb52c.js');
29
29
  var entities = require('./entities-310b46ee.js');
30
30
  require('./slicedToArray-e38fb29d.js');
31
- var AdSlot = require('./AdSlot-a79ba074.js');
31
+ var AdSlot = require('./AdSlot-9f3af35d.js');
32
32
  require('./promise-b96c61f8.js');
33
33
 
34
34
  var DeckContent = function (_React$Component) {
@@ -170,14 +170,14 @@ var DeckContent = function (_React$Component) {
170
170
  var newPath = pageNumber === 1 ? '' + path : path + '?page=' + pageNumber;
171
171
 
172
172
  // please leave this for later debug purpose : Yong Jun.
173
- /* console.log('page change reported', {
174
- currentPage: currentPage,
175
- pageNumber: pageNumber,
176
- pathname: pathname,
177
- path: path,
178
- newPath: newPath,
179
- firstPage: pageNumber === 1,
180
- queryString: queryString
173
+ /* console.log('page change reported', {
174
+ currentPage: currentPage,
175
+ pageNumber: pageNumber,
176
+ pathname: pathname,
177
+ path: path,
178
+ newPath: newPath,
179
+ firstPage: pageNumber === 1,
180
+ queryString: queryString
181
181
  }) */
182
182
 
183
183
  if (pageview) {
@@ -24,7 +24,7 @@ require('next/link');
24
24
  var Router = require('next/router');
25
25
  var Router__default = _interopDefault(Router);
26
26
  require('react-dom');
27
- var index$1 = require('./index-39beccb3.js');
27
+ var index$1 = require('./index-be0c82be.js');
28
28
  var index$2 = require('./index-fa0fb52c.js');
29
29
  var entities = require('./entities-310b46ee.js');
30
30
  var get$1 = require('./get-1f91592f.js');
@@ -18,14 +18,14 @@ var visibilitySensor = require('./visibility-sensor-b72d9527.js');
18
18
  require('next/link');
19
19
  var Router = require('next/router');
20
20
  var Router__default = _interopDefault(Router);
21
- var index$1 = require('./index-39beccb3.js');
21
+ var index$1 = require('./index-be0c82be.js');
22
22
  var index$2 = require('./index-fa0fb52c.js');
23
23
  var entities = require('./entities-310b46ee.js');
24
- var AdSlot = require('./AdSlot-a79ba074.js');
24
+ var AdSlot = require('./AdSlot-9f3af35d.js');
25
25
  var get$1 = require('./get-1f91592f.js');
26
26
 
27
27
  var Dfp = React__default.lazy(function () {
28
- return new Promise(function (resolve) { resolve(require('./Dfp-7a5533f9.js')); });
28
+ return Promise.resolve().then(function () { return require('./Dfp-7a5533f9.js'); });
29
29
  });
30
30
 
31
31
  var AD = function AD(props) {
@@ -20,14 +20,14 @@ require('./visibility-sensor-b72d9527.js');
20
20
  require('next/link');
21
21
  require('next/router');
22
22
  require('react-dom');
23
- require('./index-39beccb3.js');
23
+ require('./index-be0c82be.js');
24
24
  require('./index-fa0fb52c.js');
25
25
  require('./entities-310b46ee.js');
26
26
  require('./slicedToArray-e38fb29d.js');
27
- require('./AdSlot-a79ba074.js');
27
+ require('./AdSlot-9f3af35d.js');
28
28
  require('./promise-b96c61f8.js');
29
29
  require('./get-1f91592f.js');
30
- var GridContent = require('./GridContent-e6c8fb75.js');
30
+ var GridContent = require('./GridContent-007573a0.js');
31
31
 
32
32
 
33
33
 
@@ -11,7 +11,7 @@ var Col = _interopDefault(require('react-bootstrap/Col'));
11
11
  var Card = _interopDefault(require('react-bootstrap/Card'));
12
12
  require('next/link');
13
13
  require('react-dom');
14
- var index$1 = require('./index-39beccb3.js');
14
+ var index$1 = require('./index-be0c82be.js');
15
15
  var index$2 = require('./index-fa0fb52c.js');
16
16
  var Badge = _interopDefault(require('react-bootstrap/Badge'));
17
17
 
@@ -11,7 +11,7 @@ var Col = _interopDefault(require('react-bootstrap/Col'));
11
11
  var Card = _interopDefault(require('react-bootstrap/Card'));
12
12
  require('next/link');
13
13
  require('react-dom');
14
- var index$1 = require('./index-39beccb3.js');
14
+ var index$1 = require('./index-be0c82be.js');
15
15
  var index$2 = require('./index-fa0fb52c.js');
16
16
  var Button = _interopDefault(require('react-bootstrap/Button'));
17
17
 
@@ -24,7 +24,7 @@ require('next/link');
24
24
  var Router = require('next/router');
25
25
  var Router__default = _interopDefault(Router);
26
26
  require('react-dom');
27
- require('./index-39beccb3.js');
27
+ require('./index-be0c82be.js');
28
28
  var promise = require('./promise-b96c61f8.js');
29
29
 
30
30
  var MasterDeck = function (_React$Component) {
@@ -170,14 +170,14 @@ var MasterDeck = function (_React$Component) {
170
170
  var newPath = pageNumber === 1 ? '' + path : path + '?page=' + pageNumber;
171
171
 
172
172
  // please leave this for later debug purpose : Yong Jun.
173
- /* console.log('page change reported', {
174
- currentPage: currentPage,
175
- pageNumber: pageNumber,
176
- pathname: pathname,
177
- path: path,
178
- newPath: newPath,
179
- firstPage: pageNumber === 1,
180
- queryString: queryString
173
+ /* console.log('page change reported', {
174
+ currentPage: currentPage,
175
+ pageNumber: pageNumber,
176
+ pathname: pathname,
177
+ path: path,
178
+ newPath: newPath,
179
+ firstPage: pageNumber === 1,
180
+ queryString: queryString
181
181
  }) */
182
182
 
183
183
  if (pageview) {