HUGE REFACTOR introducing conditioner.js and dynamic chunk imports to our blocks. #580.
This commit is contained in:
mateuswetah
parent
9e99eed3c7
commit
43d0d51795
|
|
@ -2889,6 +2889,11 @@
|
||||||
"typedarray": "^0.0.6"
|
"typedarray": "^0.0.6"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
"conditioner-core": {
|
||||||
|
"version": "2.3.3",
|
||||||
|
"resolved": "https://registry.npmjs.org/conditioner-core/-/conditioner-core-2.3.3.tgz",
|
||||||
|
"integrity": "sha512-IiXkkTceFuvuU05vvSUo+SfERaHce5p5pbXvJvov3+pmHOMtKR7YD+70F+vbRtkCsLX83dR626znGqwGc/OFEg=="
|
||||||
|
},
|
||||||
"connect-history-api-fallback": {
|
"connect-history-api-fallback": {
|
||||||
"version": "1.6.0",
|
"version": "1.6.0",
|
||||||
"resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-1.6.0.tgz",
|
"resolved": "https://registry.npmjs.org/connect-history-api-fallback/-/connect-history-api-fallback-1.6.0.tgz",
|
||||||
|
|
@ -7570,6 +7575,13 @@
|
||||||
"resolved": "https://registry.npmjs.org/photoswipe/-/photoswipe-4.1.3.tgz",
|
"resolved": "https://registry.npmjs.org/photoswipe/-/photoswipe-4.1.3.tgz",
|
||||||
"integrity": "sha512-89Z43IRUyw7ycTolo+AaiDn3W1EEIfox54hERmm9bI12IB9cvRfHSHez3XhAyU8XW2EAFrC+2sKMhh7SJwn0bA=="
|
"integrity": "sha512-89Z43IRUyw7ycTolo+AaiDn3W1EEIfox54hERmm9bI12IB9cvRfHSHez3XhAyU8XW2EAFrC+2sKMhh7SJwn0bA=="
|
||||||
},
|
},
|
||||||
|
"picomatch": {
|
||||||
|
"version": "2.3.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.0.tgz",
|
||||||
|
"integrity": "sha512-lY1Q/PiJGC2zOv/z391WOTD+Z02bCgsFfvxoXXf6h7kv9o+WmsmzYqrAwY63sNgOxE4xEdq0WyUnXfKeBrSvYw==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
"pify": {
|
"pify": {
|
||||||
"version": "2.3.0",
|
"version": "2.3.0",
|
||||||
"resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
|
"resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
|
||||||
|
|
@ -7671,9 +7683,9 @@
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"postcss": {
|
"postcss": {
|
||||||
"version": "7.0.30",
|
"version": "7.0.36",
|
||||||
"resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.30.tgz",
|
"resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
|
||||||
"integrity": "sha512-nu/0m+NtIzoubO+xdAlwZl/u5S5vi/y6BCsoL8D+8IxsD3XvBS8X4YEADNIVXKVuQvduiucnRv+vPIqj56EGMQ==",
|
"integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"chalk": "^2.4.2",
|
"chalk": "^2.4.2",
|
||||||
|
|
@ -7773,14 +7785,25 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"chalk": {
|
"chalk": {
|
||||||
"version": "2.4.1",
|
"version": "2.4.2",
|
||||||
"resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.1.tgz",
|
"resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
|
||||||
"integrity": "sha512-ObN6h1v2fTJSmUXoS3nMQ92LbDK9be4TV+6G+omQlGJFdcUX5heKi1LZ1YnRMIgwTLEj3E24bT6tYni50rlCfQ==",
|
"integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"ansi-styles": "^3.2.1",
|
"ansi-styles": "^3.2.1",
|
||||||
"escape-string-regexp": "^1.0.5",
|
"escape-string-regexp": "^1.0.5",
|
||||||
"supports-color": "^5.3.0"
|
"supports-color": "^5.3.0"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"supports-color": {
|
||||||
|
"version": "5.5.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
|
||||||
|
"integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
|
||||||
|
"dev": true,
|
||||||
|
"requires": {
|
||||||
|
"has-flag": "^3.0.0"
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"fast-deep-equal": {
|
"fast-deep-equal": {
|
||||||
|
|
@ -7796,14 +7819,14 @@
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"postcss": {
|
"postcss": {
|
||||||
"version": "7.0.2",
|
"version": "7.0.36",
|
||||||
"resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.2.tgz",
|
"resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.36.tgz",
|
||||||
"integrity": "sha512-fmaUY5370keLUTx+CnwRxtGiuFTcNBLQBqr1oE3WZ/euIYmGAo0OAgOhVJ3ByDnVmOR3PK+0V9VebzfjRIUcqw==",
|
"integrity": "sha512-BebJSIUMwJHRH0HAQoxN4u1CN86glsrwsW0q7T+/m44eXOUAxSNdHRkNZPYz5vVUbg17hFgOQDE7fZk7li3pZw==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"chalk": "^2.4.1",
|
"chalk": "^2.4.2",
|
||||||
"source-map": "^0.6.1",
|
"source-map": "^0.6.1",
|
||||||
"supports-color": "^5.4.0"
|
"supports-color": "^6.1.0"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"punycode": {
|
"punycode": {
|
||||||
|
|
@ -7830,9 +7853,9 @@
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"supports-color": {
|
"supports-color": {
|
||||||
"version": "5.4.0",
|
"version": "6.1.0",
|
||||||
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.4.0.tgz",
|
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-6.1.0.tgz",
|
||||||
"integrity": "sha512-zjaXglF5nnWpsq470jSv6P9DwPvgLkuapYmfDm3JWOm0vkNTVF2tI4UrN2r6jH1qM/uc/WtxYY1hYoA2dOKj5w==",
|
"integrity": "sha512-qe1jfm1Mg7Nq/NSh6XE24gPXROEVsWHxC1LIx//XNlD9iw7YZQGjZNjYN7xGaEG6iKdA8EtNFW6R0gjnVXp+wQ==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"has-flag": "^3.0.0"
|
"has-flag": "^3.0.0"
|
||||||
|
|
@ -10943,14 +10966,136 @@
|
||||||
"integrity": "sha512-ajtqwEW/QhnrBZQsZxCLHThZZaa+Db45c92Asf46ZDXu6uHXgbfVuBaJ4gzD2r4UX0oMJHstFwd2r2HM4l8umg=="
|
"integrity": "sha512-ajtqwEW/QhnrBZQsZxCLHThZZaa+Db45c92Asf46ZDXu6uHXgbfVuBaJ4gzD2r4UX0oMJHstFwd2r2HM4l8umg=="
|
||||||
},
|
},
|
||||||
"watchpack": {
|
"watchpack": {
|
||||||
"version": "1.6.1",
|
"version": "1.7.5",
|
||||||
"resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.6.1.tgz",
|
"resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.7.5.tgz",
|
||||||
"integrity": "sha512-+IF9hfUFOrYOOaKyfaI7h7dquUIOgyEMoQMLA7OP5FxegKA2+XdXThAZ9TU2kucfhDH7rfMHs1oPYziVGWRnZA==",
|
"integrity": "sha512-9P3MWk6SrKjHsGkLT2KHXdQ/9SNkyoJbabxnKOoJepsvJjJG8uYTR3yTPxPQvNDI3w4Nz1xnE0TLHK4RIVe/MQ==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"chokidar": "^2.1.8",
|
"chokidar": "^3.4.1",
|
||||||
"graceful-fs": "^4.1.2",
|
"graceful-fs": "^4.1.2",
|
||||||
"neo-async": "^2.5.0"
|
"neo-async": "^2.5.0",
|
||||||
|
"watchpack-chokidar2": "^2.0.1"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"anymatch": {
|
||||||
|
"version": "3.1.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.2.tgz",
|
||||||
|
"integrity": "sha512-P43ePfOAIupkguHUycrc4qJ9kz8ZiuOUijaETwX7THt0Y/GNK7v0aa8rY816xWjZ7rJdA5XdMcpVFTKMq+RvWg==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
|
"requires": {
|
||||||
|
"normalize-path": "^3.0.0",
|
||||||
|
"picomatch": "^2.0.4"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"binary-extensions": {
|
||||||
|
"version": "2.2.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.2.0.tgz",
|
||||||
|
"integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"braces": {
|
||||||
|
"version": "3.0.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz",
|
||||||
|
"integrity": "sha512-b8um+L1RzM3WDSzvhm6gIz1yfTbBt6YTlcEKAvsmqCZZFw46z626lVj9j1yEPW33H5H+lBQpZMP1k8l+78Ha0A==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
|
"requires": {
|
||||||
|
"fill-range": "^7.0.1"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"chokidar": {
|
||||||
|
"version": "3.5.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.2.tgz",
|
||||||
|
"integrity": "sha512-ekGhOnNVPgT77r4K/U3GDhu+FQ2S8TnK/s2KbIGXi0SZWuwkZ2QNyfWdZW+TVfn84DpEP7rLeCt2UI6bJ8GwbQ==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
|
"requires": {
|
||||||
|
"anymatch": "~3.1.2",
|
||||||
|
"braces": "~3.0.2",
|
||||||
|
"fsevents": "~2.3.2",
|
||||||
|
"glob-parent": "~5.1.2",
|
||||||
|
"is-binary-path": "~2.1.0",
|
||||||
|
"is-glob": "~4.0.1",
|
||||||
|
"normalize-path": "~3.0.0",
|
||||||
|
"readdirp": "~3.6.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"fill-range": {
|
||||||
|
"version": "7.0.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.0.1.tgz",
|
||||||
|
"integrity": "sha512-qOo9F+dMUmC2Lcb4BbVvnKJxTPjCm+RRpe4gDuGrzkL7mEVl/djYSu2OdQ2Pa302N4oqkSg9ir6jaLWJ2USVpQ==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
|
"requires": {
|
||||||
|
"to-regex-range": "^5.0.1"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"fsevents": {
|
||||||
|
"version": "2.3.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz",
|
||||||
|
"integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"glob-parent": {
|
||||||
|
"version": "5.1.2",
|
||||||
|
"resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
|
||||||
|
"integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
|
"requires": {
|
||||||
|
"is-glob": "^4.0.1"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"is-binary-path": {
|
||||||
|
"version": "2.1.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
|
||||||
|
"integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
|
"requires": {
|
||||||
|
"binary-extensions": "^2.0.0"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"is-number": {
|
||||||
|
"version": "7.0.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
|
||||||
|
"integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true
|
||||||
|
},
|
||||||
|
"readdirp": {
|
||||||
|
"version": "3.6.0",
|
||||||
|
"resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
|
||||||
|
"integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
|
"requires": {
|
||||||
|
"picomatch": "^2.2.1"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"to-regex-range": {
|
||||||
|
"version": "5.0.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
|
||||||
|
"integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
|
"requires": {
|
||||||
|
"is-number": "^7.0.0"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
"watchpack-chokidar2": {
|
||||||
|
"version": "2.0.1",
|
||||||
|
"resolved": "https://registry.npmjs.org/watchpack-chokidar2/-/watchpack-chokidar2-2.0.1.tgz",
|
||||||
|
"integrity": "sha512-nCFfBIPKr5Sh61s4LPpy1Wtfi0HE8isJ3d2Yb5/Ppw2P2B/3eVSEBjKfN0fmHJSK14+31KwMKmcrzs2GM4P0Ww==",
|
||||||
|
"dev": true,
|
||||||
|
"optional": true,
|
||||||
|
"requires": {
|
||||||
|
"chokidar": "^2.1.8"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"wbuf": {
|
"wbuf": {
|
||||||
|
|
|
||||||
|
|
@ -9,11 +9,12 @@
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"apexcharts": "^3.26.3",
|
"apexcharts": "^3.26.3",
|
||||||
"countup.js": "^2.0.7",
|
|
||||||
"axios": "^0.21.1",
|
"axios": "^0.21.1",
|
||||||
"blurhash": "^1.1.3",
|
"blurhash": "^1.1.3",
|
||||||
"buefy": "^0.9.7",
|
"buefy": "^0.9.7",
|
||||||
"bulma": "^0.9.2",
|
"bulma": "^0.9.2",
|
||||||
|
"conditioner-core": "^2.3.3",
|
||||||
|
"countup.js": "^2.0.7",
|
||||||
"css-vars-ponyfill": "^2.3.1",
|
"css-vars-ponyfill": "^2.3.1",
|
||||||
"mdi": "^2.2.43",
|
"mdi": "^2.2.43",
|
||||||
"moment": "^2.25.3",
|
"moment": "^2.25.3",
|
||||||
|
|
|
||||||
|
|
@ -170,6 +170,7 @@
|
||||||
top: calc(50% - 42px);
|
top: calc(50% - 42px);
|
||||||
bottom: initial;
|
bottom: initial;
|
||||||
background: none;
|
background: none;
|
||||||
|
background-color: transparent !important;
|
||||||
border: none;
|
border: none;
|
||||||
width: 42px;
|
width: 42px;
|
||||||
height: 42px;
|
height: 42px;
|
||||||
|
|
|
||||||
File diff suppressed because one or more lines are too long
|
|
@ -150,6 +150,7 @@
|
||||||
top: calc(50% - 42px);
|
top: calc(50% - 42px);
|
||||||
bottom: initial;
|
bottom: initial;
|
||||||
background: none;
|
background: none;
|
||||||
|
background-color: transparent !important;
|
||||||
border: none;
|
border: none;
|
||||||
width: 42px;
|
width: 42px;
|
||||||
height: 42px;
|
height: 42px;
|
||||||
|
|
|
||||||
File diff suppressed because one or more lines are too long
|
|
@ -170,6 +170,7 @@
|
||||||
top: calc(50% - 42px);
|
top: calc(50% - 42px);
|
||||||
bottom: initial;
|
bottom: initial;
|
||||||
background: none;
|
background: none;
|
||||||
|
background-color: transparent !important;
|
||||||
border: none;
|
border: none;
|
||||||
width: 42px;
|
width: 42px;
|
||||||
height: 42px;
|
height: 42px;
|
||||||
|
|
|
||||||
File diff suppressed because one or more lines are too long
|
|
@ -324,6 +324,7 @@
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
min-width: 100%;
|
||||||
flex-basis: 100%;
|
flex-basis: 100%;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center; }
|
align-items: center; }
|
||||||
|
|
|
||||||
File diff suppressed because one or more lines are too long
|
|
@ -311,8 +311,10 @@
|
||||||
.wp-block-tainacan-facets-list ul.facets-list-edit.facets-layout-grid li.facet-list-item {
|
.wp-block-tainacan-facets-list ul.facets-list-edit.facets-layout-grid li.facet-list-item {
|
||||||
position: relative;
|
position: relative;
|
||||||
display: block;
|
display: block;
|
||||||
width: 100%;
|
min-width: 100%;
|
||||||
flex-basis: 220px; }
|
flex-basis: 220px;
|
||||||
|
min-width: 100%;
|
||||||
|
max-width: 220px; }
|
||||||
.wp-block-tainacan-facets-list ul.facets-list.facets-layout-grid li.facet-list-item a,
|
.wp-block-tainacan-facets-list ul.facets-list.facets-layout-grid li.facet-list-item a,
|
||||||
.wp-block-tainacan-facets-list ul.facets-list-edit.facets-layout-grid li.facet-list-item a {
|
.wp-block-tainacan-facets-list ul.facets-list-edit.facets-layout-grid li.facet-list-item a {
|
||||||
color: var(--tainacan-block-gray5, #454647);
|
color: var(--tainacan-block-gray5, #454647);
|
||||||
|
|
|
||||||
File diff suppressed because one or more lines are too long
|
|
@ -275,7 +275,7 @@ class REST_Items_Controller extends REST_Controller {
|
||||||
}
|
}
|
||||||
|
|
||||||
if ( $request['context'] === 'edit' ) {
|
if ( $request['context'] === 'edit' ) {
|
||||||
add_filter( 'taiancan_add_related_item', function( $related_item ) {
|
add_filter( 'tainacan_add_related_item', function( $related_item ) {
|
||||||
return array_merge($related_item, $this->get_context_edit($related_item['id']));
|
return array_merge($related_item, $this->get_context_edit($related_item['id']));
|
||||||
}, 10, 2 );
|
}, 10, 2 );
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -594,7 +594,7 @@ class Items extends Repository {
|
||||||
$item_related = new \Tainacan\Entities\Item($items->post);
|
$item_related = new \Tainacan\Entities\Item($items->post);
|
||||||
$item_arr = $item_related->_toArray();
|
$item_arr = $item_related->_toArray();
|
||||||
$item_arr['thumbnail'] = $item_related->get_thumbnail();
|
$item_arr['thumbnail'] = $item_related->get_thumbnail();
|
||||||
array_push($prepared_items, apply_filters( 'taiancan_add_related_item', $item_arr ) );
|
array_push($prepared_items, apply_filters( 'tainacan_add_related_item', $item_arr ) );
|
||||||
}
|
}
|
||||||
wp_reset_postdata();
|
wp_reset_postdata();
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -35,8 +35,6 @@ class Theme_Helper {
|
||||||
// Redirect to post type archive if no cover page is set
|
// Redirect to post type archive if no cover page is set
|
||||||
add_action('wp', array($this, 'collection_single_redirect'));
|
add_action('wp', array($this, 'collection_single_redirect'));
|
||||||
|
|
||||||
add_action('wp_print_scripts', array($this, 'enqueue_scripts'), 90);
|
|
||||||
|
|
||||||
// make archive for terms work with items
|
// make archive for terms work with items
|
||||||
add_action('pre_get_posts', array($this, 'tax_archive_pre_get_posts'));
|
add_action('pre_get_posts', array($this, 'tax_archive_pre_get_posts'));
|
||||||
|
|
||||||
|
|
@ -117,45 +115,6 @@ class Theme_Helper {
|
||||||
]);
|
]);
|
||||||
}
|
}
|
||||||
|
|
||||||
public function enqueue_scripts($force = false) {
|
|
||||||
global $TAINACAN_BASE_URL;
|
|
||||||
if ( $force || is_post_type_archive( \Tainacan\Repositories\Repository::get_collections_db_identifiers() ) || tainacan_get_term() || get_query_var('tainacan_repository_archive') == 1 ) {
|
|
||||||
wp_register_script('tainacan-search', $TAINACAN_BASE_URL . '/assets/js/theme_search.js' , ['underscore'] , TAINACAN_VERSION);
|
|
||||||
wp_localize_script('tainacan-search', 'tainacan_plugin', \Tainacan\Admin::get_instance()->get_admin_js_localization_params());
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
public function enqueue_items_carousel_scripts() {
|
|
||||||
global $post;
|
|
||||||
global $TAINACAN_BASE_URL;
|
|
||||||
global $TAINACAN_VERSION;
|
|
||||||
global $wp_version;
|
|
||||||
|
|
||||||
$settings = [
|
|
||||||
'wp_version' => $wp_version,
|
|
||||||
'root' => esc_url_raw( rest_url() ) . 'tainacan/v2',
|
|
||||||
'nonce' => is_user_logged_in() ? wp_create_nonce( 'wp_rest' ) : false,
|
|
||||||
'base_url' => $TAINACAN_BASE_URL,
|
|
||||||
'admin_url' => admin_url(),
|
|
||||||
'site_url' => site_url(),
|
|
||||||
'theme_items_list_url' => esc_url_raw( get_site_url() ) . '/' . \Tainacan\Theme_Helper::get_instance()->get_items_list_slug()
|
|
||||||
];
|
|
||||||
|
|
||||||
wp_enqueue_script(
|
|
||||||
'carousel-items-list-theme',
|
|
||||||
$TAINACAN_BASE_URL . '/assets/js/block_carousel_items_list_theme.js',
|
|
||||||
array('wp-components')
|
|
||||||
);
|
|
||||||
wp_enqueue_style(
|
|
||||||
'carousel-items-list',
|
|
||||||
$TAINACAN_BASE_URL . '/assets/css/tainacan-gutenberg-block-' . 'carousel-items-list' . '.css',
|
|
||||||
array('tainacan-blocks-common-styles'),
|
|
||||||
$TAINACAN_VERSION
|
|
||||||
);
|
|
||||||
wp_set_script_translations('carousel-items-list-theme', 'tainacan');
|
|
||||||
wp_localize_script('carousel-items-list-theme', 'tainacan_blocks', $settings);
|
|
||||||
}
|
|
||||||
|
|
||||||
public function enqueue_related_items_carousel_scripts() {
|
public function enqueue_related_items_carousel_scripts() {
|
||||||
global $TAINACAN_BASE_URL;
|
global $TAINACAN_BASE_URL;
|
||||||
global $TAINACAN_VERSION;
|
global $TAINACAN_VERSION;
|
||||||
|
|
@ -428,11 +387,8 @@ class Theme_Helper {
|
||||||
}
|
}
|
||||||
|
|
||||||
wp_enqueue_media();
|
wp_enqueue_media();
|
||||||
wp_enqueue_script('jcrop');
|
|
||||||
wp_enqueue_script('tainacan-item-submission', $TAINACAN_BASE_URL . '/assets/js/item_submission.js' , ['underscore', 'jcrop', 'media-editor', 'media-views', 'customize-controls'] , TAINACAN_VERSION);
|
|
||||||
wp_localize_script('tainacan-item-submission', 'tainacan_plugin', \Tainacan\Admin::get_instance()->get_admin_js_localization_params());
|
|
||||||
|
|
||||||
return "<div id='tainacan-item-submission-form' $props ></div>";
|
return "<div data-module='item-submission-form' id='tainacan-item-submission-form' $props ></div>";
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
@ -522,9 +478,7 @@ class Theme_Helper {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
$this->enqueue_scripts($force_enqueue);
|
return "<div data-module='faceted-search' id='tainacan-items-page' $props ></div>";
|
||||||
|
|
||||||
return "<div id='tainacan-items-page' $props ></div>";
|
|
||||||
}
|
}
|
||||||
|
|
||||||
function get_items_list_slug() {
|
function get_items_list_slug() {
|
||||||
|
|
@ -937,9 +891,7 @@ class Theme_Helper {
|
||||||
$props .= (str_replace('_', '-', $key) . "='" . $value . "' ");
|
$props .= (str_replace('_', '-', $key) . "='" . $value . "' ");
|
||||||
}
|
}
|
||||||
|
|
||||||
$this->enqueue_items_carousel_scripts();
|
return "<div data-module='carousel-items-list' id='tainacan-items-carousel-shortcode' $props ></div>";
|
||||||
|
|
||||||
return "<div id='tainacan-items-carousel-shortcode' $props ></div>";
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
|
||||||
|
|
@ -33,6 +33,7 @@
|
||||||
min-width: 6em;
|
min-width: 6em;
|
||||||
border: none;
|
border: none;
|
||||||
z-index: 999991;
|
z-index: 999991;
|
||||||
|
background-color: var(--tainacan-input-background-color);
|
||||||
|
|
||||||
.dropdown-content {
|
.dropdown-content {
|
||||||
padding: 0px 0px 1px 0px;
|
padding: 0px 0px 1px 0px;
|
||||||
|
|
|
||||||
|
|
@ -112,7 +112,6 @@ class Admin {
|
||||||
function add_theme_files() {
|
function add_theme_files() {
|
||||||
global $TAINACAN_BASE_URL;
|
global $TAINACAN_BASE_URL;
|
||||||
|
|
||||||
// wp_enqueue_style( 'style', $TAINACAN_BASE_URL . '/assets/css/materialdesignicons.css' );
|
|
||||||
wp_enqueue_style( 'tainacan-fonts', $TAINACAN_BASE_URL . '/assets/css/tainacanicons.css', [], TAINACAN_VERSION );
|
wp_enqueue_style( 'tainacan-fonts', $TAINACAN_BASE_URL . '/assets/css/tainacanicons.css', [], TAINACAN_VERSION );
|
||||||
wp_enqueue_style( 'roboto-fonts', 'https://fonts.googleapis.com/css?family=Roboto:400,400i,500,500i,700,700i', [], TAINACAN_VERSION );
|
wp_enqueue_style( 'roboto-fonts', 'https://fonts.googleapis.com/css?family=Roboto:400,400i,500,500i,700,700i', [], TAINACAN_VERSION );
|
||||||
wp_enqueue_script('underscore');
|
wp_enqueue_script('underscore');
|
||||||
|
|
|
||||||
|
|
@ -6,12 +6,12 @@ include_once( ABSPATH . 'wp-admin/includes/plugin.php' );
|
||||||
const TAINACAN_BLOCKS = [
|
const TAINACAN_BLOCKS = [
|
||||||
'items-list' => [],
|
'items-list' => [],
|
||||||
'collections-list' => [],
|
'collections-list' => [],
|
||||||
'search-bar' => [ 'has_theme_script' => true ],
|
'search-bar' => [],
|
||||||
'facets-list' => [ 'has_theme_script' => true ],
|
'facets-list' => [],
|
||||||
'dynamic-items-list' => [ 'has_theme_script' => true ],
|
'dynamic-items-list' => [],
|
||||||
'carousel-items-list' => [ 'has_theme_script' => true ],
|
'carousel-items-list' => [],
|
||||||
'carousel-terms-list' => [ 'has_theme_script' => true ],
|
'carousel-terms-list' => [],
|
||||||
'carousel-collections-list' => [ 'has_theme_script' => true ],
|
'carousel-collections-list' => [],
|
||||||
'carousel-related-items' => [],
|
'carousel-related-items' => [],
|
||||||
'terms-list' => [ 'extra_editor_script_deps' => array('undescore') ],
|
'terms-list' => [ 'extra_editor_script_deps' => array('undescore') ],
|
||||||
];
|
];
|
||||||
|
|
@ -35,7 +35,6 @@ function tainacan_blocks_initialize() {
|
||||||
add_action('init', 'tainacan_blocks_add_plugin_admin_settings', 90);
|
add_action('init', 'tainacan_blocks_add_plugin_admin_settings', 90);
|
||||||
add_action('init', 'register_tainacan_blocks_add_gutenberg_blocks');
|
add_action('init', 'register_tainacan_blocks_add_gutenberg_blocks');
|
||||||
add_action('wp_enqueue_scripts', 'unregister_tainacan_blocks');
|
add_action('wp_enqueue_scripts', 'unregister_tainacan_blocks');
|
||||||
add_action('admin_enqueue_scripts', 'unregister_tainacan_blocks');
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -44,7 +43,7 @@ function tainacan_blocks_initialize() {
|
||||||
* both 'generic' and 'special' blocks
|
* both 'generic' and 'special' blocks
|
||||||
*/
|
*/
|
||||||
function register_tainacan_blocks_add_gutenberg_blocks() {
|
function register_tainacan_blocks_add_gutenberg_blocks() {
|
||||||
tainacan_blocks_get_common_styles();
|
tainacan_blocks_get_common_assets();
|
||||||
tainacan_blocks_register_category_icon();
|
tainacan_blocks_register_category_icon();
|
||||||
|
|
||||||
foreach(TAINACAN_BLOCKS as $block_slug => $block_options) {
|
foreach(TAINACAN_BLOCKS as $block_slug => $block_options) {
|
||||||
|
|
@ -60,7 +59,7 @@ function register_tainacan_blocks_add_gutenberg_blocks() {
|
||||||
function unregister_tainacan_blocks() {
|
function unregister_tainacan_blocks() {
|
||||||
global $post;
|
global $post;
|
||||||
|
|
||||||
// If we are outside the block editor, there are assets not necessary, so lets deregister them!
|
// If we are outside the block editor, there are editor-related assets not necessary, so lets deregister them!
|
||||||
if ( !is_admin() ) {
|
if ( !is_admin() ) {
|
||||||
|
|
||||||
// First, handle the generic blocks
|
// First, handle the generic blocks
|
||||||
|
|
@ -84,7 +83,6 @@ function unregister_tainacan_blocks() {
|
||||||
// If there is no faceted search block, no need for its styles and theme side scripts
|
// If there is no faceted search block, no need for its styles and theme side scripts
|
||||||
if ( !has_block('tainacan/faceted-search') || !is_singular() ) {
|
if ( !has_block('tainacan/faceted-search') || !is_singular() ) {
|
||||||
wp_deregister_style('faceted-search');
|
wp_deregister_style('faceted-search');
|
||||||
wp_deregister_script('tainacan-search');
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// If there is no item submission block, no need for its styles and theme side scripts
|
// If there is no item submission block, no need for its styles and theme side scripts
|
||||||
|
|
@ -97,20 +95,6 @@ function unregister_tainacan_blocks() {
|
||||||
// No need for category assets outside the block editor
|
// No need for category assets outside the block editor
|
||||||
wp_deregister_script('tainacan-blocks-register-category-icon');
|
wp_deregister_script('tainacan-blocks-register-category-icon');
|
||||||
wp_deregister_style('tainacan-blocks-register-category-icon');
|
wp_deregister_style('tainacan-blocks-register-category-icon');
|
||||||
|
|
||||||
// If, however we are in the editor side, then no need to load theme side scripts!
|
|
||||||
} else {
|
|
||||||
|
|
||||||
// First, handle the generic blocks
|
|
||||||
foreach(TAINACAN_BLOCKS as $block_slug => $block_options) {
|
|
||||||
if ( isset($block_options['has_theme_script']) && $block_options['has_theme_script'] )
|
|
||||||
wp_deregister_script($block_slug . '-theme');
|
|
||||||
}
|
|
||||||
|
|
||||||
// Then the special ones
|
|
||||||
wp_deregister_script('tainacan-search');
|
|
||||||
wp_deregister_script('tainacan-item-submission');
|
|
||||||
wp_deregister_script('tainacan-google-recaptcha-script');
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Now, lets check if the blocks had been removed by the filter */
|
/* Now, lets check if the blocks had been removed by the filter */
|
||||||
|
|
@ -132,7 +116,6 @@ function unregister_tainacan_blocks() {
|
||||||
}
|
}
|
||||||
|
|
||||||
wp_deregister_script('faceted-search');
|
wp_deregister_script('faceted-search');
|
||||||
wp_deregister_script('tainacan-search');
|
|
||||||
wp_deregister_script('item-submission-form');
|
wp_deregister_script('item-submission-form');
|
||||||
wp_deregister_script('tainacan-google-recaptcha-script');
|
wp_deregister_script('tainacan-google-recaptcha-script');
|
||||||
wp_deregister_script('tainacan-blocks-register-category-icon');
|
wp_deregister_script('tainacan-blocks-register-category-icon');
|
||||||
|
|
@ -150,7 +133,7 @@ function unregister_tainacan_blocks() {
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Registers the Taiancan category on the blocks inserter
|
* Registers the Tainacan category on the blocks inserter
|
||||||
* In case we are in WP > 5.8, we if we are in a post edition page first,
|
* In case we are in WP > 5.8, we if we are in a post edition page first,
|
||||||
* as we don't want our blocks inside the Widgets area so far.
|
* as we don't want our blocks inside the Widgets area so far.
|
||||||
*/
|
*/
|
||||||
|
|
@ -190,7 +173,12 @@ function tainacan_blocks_register_block($block_slug, $options = []) {
|
||||||
$register_params = [];
|
$register_params = [];
|
||||||
|
|
||||||
// Defines dependencies for editor script
|
// Defines dependencies for editor script
|
||||||
$editor_script_deps = array('wp-blocks', 'wp-i18n', 'wp-element', 'wp-components', 'wp-editor');
|
$editor_script_deps = array('wp-blocks', 'wp-i18n', 'wp-element', 'wp-components');
|
||||||
|
if ( version_compare( $wp_version, '5.2', '<') )
|
||||||
|
$editor_script_deps[] = 'wp-editor';
|
||||||
|
else
|
||||||
|
$editor_script_deps[] = 'wp-block-editor';
|
||||||
|
|
||||||
if ( isset($options['extra_editor_script_deps']) )
|
if ( isset($options['extra_editor_script_deps']) )
|
||||||
array_merge($editor_script_deps, $options['extra_editor_script_deps']);
|
array_merge($editor_script_deps, $options['extra_editor_script_deps']);
|
||||||
|
|
||||||
|
|
@ -242,19 +230,17 @@ function tainacan_blocks_register_tainacan_faceted_search() {
|
||||||
global $TAINACAN_VERSION;
|
global $TAINACAN_VERSION;
|
||||||
global $wp_version;
|
global $wp_version;
|
||||||
|
|
||||||
// Theme side script
|
|
||||||
wp_register_script(
|
|
||||||
'tainacan-search',
|
|
||||||
$TAINACAN_BASE_URL . '/assets/js/theme_search.js',
|
|
||||||
['underscore'],
|
|
||||||
$TAINACAN_VERSION
|
|
||||||
);
|
|
||||||
|
|
||||||
// Editor side script
|
// Editor side script
|
||||||
|
$editor_script_deps = array('wp-blocks', 'wp-i18n', 'wp-element', 'wp-components');
|
||||||
|
if ( version_compare( $wp_version, '5.2', '<') )
|
||||||
|
$editor_script_deps[] = 'wp-editor';
|
||||||
|
else
|
||||||
|
$editor_script_deps[] = 'wp-block-editor';
|
||||||
|
|
||||||
wp_register_script(
|
wp_register_script(
|
||||||
'faceted-search',
|
'faceted-search',
|
||||||
$TAINACAN_BASE_URL . '/assets/js/block_faceted_search.js',
|
$TAINACAN_BASE_URL . '/assets/js/block_faceted_search.js',
|
||||||
array('wp-blocks', 'wp-i18n', 'wp-element', 'wp-components', 'wp-editor'),
|
$editor_script_deps,
|
||||||
$TAINACAN_VERSION
|
$TAINACAN_VERSION
|
||||||
);
|
);
|
||||||
wp_set_script_translations('faceted-search', 'tainacan');
|
wp_set_script_translations('faceted-search', 'tainacan');
|
||||||
|
|
@ -275,8 +261,7 @@ function tainacan_blocks_register_tainacan_faceted_search() {
|
||||||
else
|
else
|
||||||
register_block_type( 'tainacan/faceted-search', array(
|
register_block_type( 'tainacan/faceted-search', array(
|
||||||
'editor_script' => 'faceted-search',
|
'editor_script' => 'faceted-search',
|
||||||
'style' => 'faceted-search',
|
'style' => 'faceted-search'
|
||||||
'script' => 'tainacan-search'
|
|
||||||
) );
|
) );
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -289,19 +274,17 @@ function tainacan_blocks_register_tainacan_item_submission_form() {
|
||||||
global $TAINACAN_VERSION;
|
global $TAINACAN_VERSION;
|
||||||
global $wp_version;
|
global $wp_version;
|
||||||
|
|
||||||
// Theme side script
|
|
||||||
wp_register_script(
|
|
||||||
'tainacan-item-submission',
|
|
||||||
$TAINACAN_BASE_URL . '/assets/js/item_submission.js',
|
|
||||||
['underscore'],
|
|
||||||
$TAINACAN_VERSION
|
|
||||||
);
|
|
||||||
|
|
||||||
// Editor side script
|
// Editor side script
|
||||||
|
$editor_script_deps = array('wp-blocks', 'wp-element', 'wp-components');
|
||||||
|
if ( version_compare( $wp_version, '5.2', '<') )
|
||||||
|
$editor_script_deps[] = 'wp-editor';
|
||||||
|
else
|
||||||
|
$editor_script_deps[] = 'wp-block-editor';
|
||||||
|
|
||||||
wp_register_script(
|
wp_register_script(
|
||||||
'item-submission-form',
|
'item-submission-form',
|
||||||
$TAINACAN_BASE_URL . '/assets/js/block_item_submission_form.js',
|
$TAINACAN_BASE_URL . '/assets/js/block_item_submission_form.js',
|
||||||
array('wp-blocks', 'wp-element', 'wp-components', 'wp-editor'),
|
$editor_script_deps,
|
||||||
$TAINACAN_VERSION
|
$TAINACAN_VERSION
|
||||||
);
|
);
|
||||||
|
|
||||||
|
|
@ -334,8 +317,8 @@ function tainacan_blocks_register_tainacan_item_submission_form() {
|
||||||
else
|
else
|
||||||
register_block_type( 'tainacan/item-submission-form', array(
|
register_block_type( 'tainacan/item-submission-form', array(
|
||||||
'editor_script' => 'item-submission-form',
|
'editor_script' => 'item-submission-form',
|
||||||
'style' => 'item-submission-form',
|
'style' => 'item-submission-form'//,
|
||||||
'script' => 'tainacan-item-submission'
|
//'script' => 'tainacan-item-submission'
|
||||||
) );
|
) );
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -377,25 +360,29 @@ function tainacan_blocks_add_plugin_settings() {
|
||||||
|
|
||||||
// The faceded search block also uses this settings for checking gutenberg version
|
// The faceded search block also uses this settings for checking gutenberg version
|
||||||
wp_localize_script( 'faceted-search', 'tainacan_blocks', $settings );
|
wp_localize_script( 'faceted-search', 'tainacan_blocks', $settings );
|
||||||
|
|
||||||
|
wp_localize_script( 'tainacan-blocks-common-theme-scripts', 'tainacan_blocks', $settings);
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Makes the global 'tainacan_plugin' available to some spacial blocks that need it
|
* Makes the global 'tainacan_plugin' available to some spacial blocks that need it
|
||||||
*/
|
*/
|
||||||
function tainacan_blocks_add_plugin_admin_settings() {
|
function tainacan_blocks_add_plugin_admin_settings() {
|
||||||
|
$settings = \Tainacan\Admin::get_instance()->get_admin_js_localization_params();
|
||||||
|
|
||||||
// The faceded search block uses a different settings object, the same used on the theme items list
|
// The faceded search block uses a different settings object, the same used on the theme items list
|
||||||
wp_localize_script( 'tainacan-search', 'tainacan_plugin', \Tainacan\Admin::get_instance()->get_admin_js_localization_params() );
|
wp_localize_script( 'faceted-search', 'tainacan_plugin', $settings );
|
||||||
wp_localize_script( 'faceted-search', 'tainacan_plugin', \Tainacan\Admin::get_instance()->get_admin_js_localization_params() );
|
|
||||||
|
|
||||||
// The item submission search block uses a different settings object, the same used on the item submission component
|
// The item submission search block uses a different settings object, the same used on the item submission component
|
||||||
wp_localize_script( 'tainacan-item-submission', 'tainacan_plugin', \Tainacan\Admin::get_instance()->get_admin_js_localization_params() );
|
wp_localize_script( 'tainacan-item-submission', 'tainacan_plugin', $settings );
|
||||||
|
|
||||||
|
wp_localize_script( 'tainacan-blocks-common-theme-scripts', 'tainacan_plugin', $settings);
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Enqueues the global styles necessary for the majority of the blocks
|
* Enqueues the global styles necessary for the majority of the blocks
|
||||||
*/
|
*/
|
||||||
function tainacan_blocks_get_common_styles() {
|
function tainacan_blocks_get_common_assets() {
|
||||||
global $TAINACAN_BASE_URL;
|
global $TAINACAN_BASE_URL;
|
||||||
global $TAINACAN_VERSION;
|
global $TAINACAN_VERSION;
|
||||||
|
|
||||||
|
|
@ -405,6 +392,12 @@ function tainacan_blocks_get_common_styles() {
|
||||||
array('wp-edit-blocks'),
|
array('wp-edit-blocks'),
|
||||||
$TAINACAN_VERSION
|
$TAINACAN_VERSION
|
||||||
);
|
);
|
||||||
|
wp_enqueue_script(
|
||||||
|
'tainacan-blocks-common-theme-scripts',
|
||||||
|
$TAINACAN_BASE_URL . '/assets/js/tainacan_blocks_common_theme_scripts.js',
|
||||||
|
array('wp-i18n'),
|
||||||
|
$TAINACAN_VERSION
|
||||||
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|
|
||||||
|
|
@ -1,4 +0,0 @@
|
||||||
import Swiper from 'swiper';
|
|
||||||
import 'swiper/css/swiper.min.css';
|
|
||||||
|
|
||||||
export default Swiper;
|
|
||||||
|
|
@ -102,7 +102,5 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"editorScript": "carousel-collections-list",
|
"editorScript": "carousel-collections-list",
|
||||||
"script": "carousel-collections-list-theme",
|
"editorStyle": "carousel-collections-list"
|
||||||
"editorStyle": "carousel-collections-list",
|
|
||||||
"style": "carousel-collections-list"
|
|
||||||
}
|
}
|
||||||
|
|
@ -1,88 +0,0 @@
|
||||||
import Vue from 'vue';
|
|
||||||
import CarouselCollectionsListTheme from './carousel-collections-list-theme.vue';
|
|
||||||
import { ThumbnailHelperPlugin } from '../../../admin/js/utilities.js';
|
|
||||||
import VueBlurHash from 'vue-blurhash';
|
|
||||||
|
|
||||||
// Vue Dev Tools!
|
|
||||||
Vue.config.devtools = process && process.env && process.env.NODE_ENV === 'development';
|
|
||||||
|
|
||||||
// This is rendered on the theme side.
|
|
||||||
document.addEventListener("DOMContentLoaded", () => {
|
|
||||||
|
|
||||||
// Gets all divs with content created by our block;
|
|
||||||
let blocks = document.getElementsByClassName('wp-block-tainacan-carousel-collections-list');
|
|
||||||
|
|
||||||
if (blocks) {
|
|
||||||
let blockIds = Object.values(blocks).map((block) => block.id);
|
|
||||||
|
|
||||||
// Creates a new Vue Instance to manage each block isolatelly
|
|
||||||
for (let blockId of blockIds) {
|
|
||||||
|
|
||||||
// Configure Vue logic before passing it to constructor:
|
|
||||||
let vueOptions = {
|
|
||||||
data: {
|
|
||||||
selectedItem: [],
|
|
||||||
maxItemsNumber: 12,
|
|
||||||
arrowsPosition: 'around',
|
|
||||||
autoPlay: false,
|
|
||||||
autoPlaySpeed: 3,
|
|
||||||
largeArrows: false,
|
|
||||||
maxCollectionsPerScreen: 6,
|
|
||||||
cropImagesToSquare: true,
|
|
||||||
loopSlides: false,
|
|
||||||
hideName: true,
|
|
||||||
showCollectionThumbnail: false,
|
|
||||||
tainacanApiRoot: '',
|
|
||||||
tainacanBaseUrl: '',
|
|
||||||
className: ''
|
|
||||||
},
|
|
||||||
render(h){
|
|
||||||
return h(CarouselCollectionsListTheme, {
|
|
||||||
props: {
|
|
||||||
blockId: blockId,
|
|
||||||
selectedCollections: this.selectedCollections,
|
|
||||||
maxItemsNumber: this.maxItemsNumber,
|
|
||||||
arrowsPosition: this.arrowsPosition,
|
|
||||||
autoPlay: this.autoPlay,
|
|
||||||
autoPlaySpeed: this.autoPlaySpeed,
|
|
||||||
loopSlides: this.loopSlides,
|
|
||||||
largeArrows: this.largeArrows,
|
|
||||||
cropImagesToSquare: this.cropImagesToSquare,
|
|
||||||
maxCollectionsPerScreen: this.maxCollectionsPerScreen,
|
|
||||||
hideName: this.hideName,
|
|
||||||
showCollectionThumbnail: this.showCollectionThumbnail,
|
|
||||||
tainacanApiRoot: this.tainacanApiRoot,
|
|
||||||
tainacanBaseUrl: this.tainacanBaseUrl,
|
|
||||||
className: this.className,
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
beforeMount () {
|
|
||||||
this.className = this.$el.attributes.class != undefined ? this.$el.attributes.class.value : undefined;
|
|
||||||
this.selectedCollections = this.$el.attributes['selected-collections'] != undefined ? JSON.parse(this.$el.attributes['selected-collections'].value) : undefined;
|
|
||||||
this.maxItemsNumber = this.$el.attributes['max-collections-number'] != undefined ? this.$el.attributes['max-collections-number'].value : undefined;
|
|
||||||
this.maxCollectionsPerScreen = this.$el.attributes['max-collections-per-screen'] != undefined ? this.$el.attributes['max-collections-per-screen'].value : 6;
|
|
||||||
this.arrowsPosition = this.$el.attributes['arrows-position'] != undefined ? this.$el.attributes['arrows-position'].value : undefined;
|
|
||||||
this.autoPlay = this.$el.attributes['auto-play'] != undefined ? this.$el.attributes['auto-play'].value == 'true' : false;
|
|
||||||
this.largeArrows = this.$el.attributes['large-arrows'] != undefined ? this.$el.attributes['large-arrows'].value == 'true' : false;
|
|
||||||
this.autoPlaySpeed = this.$el.attributes['auto-play-speed'] != undefined ? this.$el.attributes['auto-play-speed'].value : 3;
|
|
||||||
this.loopSlides = this.$el.attributes['loop-slides'] != undefined ? this.$el.attributes['loop-slides'].value == 'true' : false;
|
|
||||||
this.cropImagesToSquare = this.$el.attributes['crop-images-to-square'] != undefined ? this.$el.attributes['crop-images-to-square'].value == 'true' : false;
|
|
||||||
this.hideName = this.$el.attributes['hide-name'] != undefined ? this.$el.attributes['hide-name'].value == 'true' : false;
|
|
||||||
this.showCollectionThumbnail = this.$el.attributes['show-collection-thumbnail'] != undefined ? this.$el.attributes['show-collection-thumbnail'].value == 'true' : false;
|
|
||||||
this.tainacanApiRoot = this.$el.attributes['tainacan-api-root'] != undefined ? this.$el.attributes['tainacan-api-root'].value : undefined;
|
|
||||||
this.tainacanBaseUrl = this.$el.attributes['tainacan-base-url'] != undefined ? this.$el.attributes['tainacan-base-url'].value : undefined;
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
__(text, domain) {
|
|
||||||
return wp.i18n.__(text, domain);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
Vue.use(VueBlurHash);
|
|
||||||
Vue.use(ThumbnailHelperPlugin);
|
|
||||||
new Vue( Object.assign({ el: '#' + blockId }, vueOptions) );
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
@ -15,6 +15,7 @@ export default function ({ attributes, className }) {
|
||||||
showCollectionThumbnail
|
showCollectionThumbnail
|
||||||
} = attributes;
|
} = attributes;
|
||||||
return <div
|
return <div
|
||||||
|
data-module="carousel-collections-list"
|
||||||
className={ className }
|
className={ className }
|
||||||
selected-collections={ JSON.stringify(selectedCollections.map((collection) => { return collection.id })) }
|
selected-collections={ JSON.stringify(selectedCollections.map((collection) => { return collection.id })) }
|
||||||
arrows-position={ arrowsPosition }
|
arrows-position={ arrowsPosition }
|
||||||
|
|
|
||||||
|
|
@ -201,6 +201,7 @@
|
||||||
top: calc(50% - 42px);
|
top: calc(50% - 42px);
|
||||||
bottom: initial;
|
bottom: initial;
|
||||||
background: none;
|
background: none;
|
||||||
|
background-color: transparent !important;
|
||||||
border: none;
|
border: none;
|
||||||
width: 42px;
|
width: 42px;
|
||||||
height: 42px;
|
height: 42px;
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,102 @@
|
||||||
|
import Vue from 'vue';
|
||||||
|
import CarouselCollectionsListTheme from './theme.vue';
|
||||||
|
import { ThumbnailHelperPlugin } from '../../../admin/js/utilities.js';
|
||||||
|
import VueBlurHash from 'vue-blurhash';
|
||||||
|
|
||||||
|
export default (element) => {
|
||||||
|
|
||||||
|
// Vue Dev Tools!
|
||||||
|
Vue.config.devtools = process && process.env && process.env.NODE_ENV === 'development';
|
||||||
|
|
||||||
|
function renderTainacanCollectionsCarouselBlocks() {
|
||||||
|
|
||||||
|
// Gets all divs with content created by our block;
|
||||||
|
let blocksElements = element ? [ element ] : document.getElementsByClassName('wp-block-tainacan-carousel-collections-list');
|
||||||
|
|
||||||
|
if (blocksElements) {
|
||||||
|
let blocks = Object.values(blocksElements);
|
||||||
|
|
||||||
|
// Checks if this carousel isn't already mounted
|
||||||
|
blocks = blocks.filter((block) => block.classList && !block.classList.contains('has-mounted'));
|
||||||
|
const blockIds = Object.values(blocks).map((block) => block.id);
|
||||||
|
|
||||||
|
// Creates a new Vue Instance to manage each block isolatelly
|
||||||
|
for (let blockId of blockIds) {
|
||||||
|
|
||||||
|
// Configure Vue logic before passing it to constructor:
|
||||||
|
let vueOptions = {
|
||||||
|
data: {
|
||||||
|
selectedItem: [],
|
||||||
|
maxItemsNumber: 12,
|
||||||
|
arrowsPosition: 'around',
|
||||||
|
autoPlay: false,
|
||||||
|
autoPlaySpeed: 3,
|
||||||
|
largeArrows: false,
|
||||||
|
maxCollectionsPerScreen: 6,
|
||||||
|
cropImagesToSquare: true,
|
||||||
|
loopSlides: false,
|
||||||
|
hideName: true,
|
||||||
|
showCollectionThumbnail: false,
|
||||||
|
tainacanApiRoot: '',
|
||||||
|
tainacanBaseUrl: '',
|
||||||
|
className: ''
|
||||||
|
},
|
||||||
|
render(h){
|
||||||
|
return h(CarouselCollectionsListTheme, {
|
||||||
|
props: {
|
||||||
|
blockId: blockId,
|
||||||
|
selectedCollections: this.selectedCollections,
|
||||||
|
maxItemsNumber: this.maxItemsNumber,
|
||||||
|
arrowsPosition: this.arrowsPosition,
|
||||||
|
autoPlay: this.autoPlay,
|
||||||
|
autoPlaySpeed: this.autoPlaySpeed,
|
||||||
|
loopSlides: this.loopSlides,
|
||||||
|
largeArrows: this.largeArrows,
|
||||||
|
cropImagesToSquare: this.cropImagesToSquare,
|
||||||
|
maxCollectionsPerScreen: this.maxCollectionsPerScreen,
|
||||||
|
hideName: this.hideName,
|
||||||
|
showCollectionThumbnail: this.showCollectionThumbnail,
|
||||||
|
tainacanApiRoot: this.tainacanApiRoot,
|
||||||
|
tainacanBaseUrl: this.tainacanBaseUrl,
|
||||||
|
className: this.className,
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
beforeMount () {
|
||||||
|
this.className = this.$el.attributes.class != undefined ? this.$el.attributes.class.value : undefined;
|
||||||
|
this.selectedCollections = this.$el.attributes['selected-collections'] != undefined ? JSON.parse(this.$el.attributes['selected-collections'].value) : undefined;
|
||||||
|
this.maxItemsNumber = this.$el.attributes['max-collections-number'] != undefined ? this.$el.attributes['max-collections-number'].value : undefined;
|
||||||
|
this.maxCollectionsPerScreen = this.$el.attributes['max-collections-per-screen'] != undefined ? this.$el.attributes['max-collections-per-screen'].value : 6;
|
||||||
|
this.arrowsPosition = this.$el.attributes['arrows-position'] != undefined ? this.$el.attributes['arrows-position'].value : undefined;
|
||||||
|
this.autoPlay = this.$el.attributes['auto-play'] != undefined ? this.$el.attributes['auto-play'].value == 'true' : false;
|
||||||
|
this.largeArrows = this.$el.attributes['large-arrows'] != undefined ? this.$el.attributes['large-arrows'].value == 'true' : false;
|
||||||
|
this.autoPlaySpeed = this.$el.attributes['auto-play-speed'] != undefined ? this.$el.attributes['auto-play-speed'].value : 3;
|
||||||
|
this.loopSlides = this.$el.attributes['loop-slides'] != undefined ? this.$el.attributes['loop-slides'].value == 'true' : false;
|
||||||
|
this.cropImagesToSquare = this.$el.attributes['crop-images-to-square'] != undefined ? this.$el.attributes['crop-images-to-square'].value == 'true' : false;
|
||||||
|
this.hideName = this.$el.attributes['hide-name'] != undefined ? this.$el.attributes['hide-name'].value == 'true' : false;
|
||||||
|
this.showCollectionThumbnail = this.$el.attributes['show-collection-thumbnail'] != undefined ? this.$el.attributes['show-collection-thumbnail'].value == 'true' : false;
|
||||||
|
this.tainacanApiRoot = this.$el.attributes['tainacan-api-root'] != undefined ? this.$el.attributes['tainacan-api-root'].value : undefined;
|
||||||
|
this.tainacanBaseUrl = this.$el.attributes['tainacan-base-url'] != undefined ? this.$el.attributes['tainacan-base-url'].value : undefined;
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
__(text, domain) {
|
||||||
|
return wp.i18n.__(text, domain);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
Vue.use(VueBlurHash);
|
||||||
|
Vue.use(ThumbnailHelperPlugin);
|
||||||
|
new Vue( Object.assign({ el: '#' + blockId }, vueOptions) );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// This is rendered on the theme side.
|
||||||
|
renderTainacanCollectionsCarouselBlocks();
|
||||||
|
|
||||||
|
// Also if a theme or plugin requested a reset...
|
||||||
|
document.addEventListener("TainacanReloadCarouselCollectionsListBlock", () => {
|
||||||
|
renderTainacanCollectionsCarouselBlocks();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<div :class="className">
|
<div :class="className + ' has-mounted'">
|
||||||
<div v-if="!isLoading">
|
<div v-if="!isLoading">
|
||||||
<div
|
<div
|
||||||
:class="'tainacan-carousel ' + (arrowsPosition ? ' has-arrows-' + arrowsPosition : '') + (largeArrows ? ' has-large-arrows' : '') "
|
:class="'tainacan-carousel ' + (arrowsPosition ? ' has-arrows-' + arrowsPosition : '') + (largeArrows ? ' has-large-arrows' : '') "
|
||||||
|
|
@ -122,7 +122,5 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"editorScript": "carousel-items-list",
|
"editorScript": "carousel-items-list",
|
||||||
"script": "carousel-items-list-theme",
|
"editorStyle": "carousel-items-list"
|
||||||
"editorStyle": "carousel-items-list",
|
|
||||||
"style": "carousel-items-list"
|
|
||||||
}
|
}
|
||||||
|
|
@ -1,117 +0,0 @@
|
||||||
import Vue from 'vue';
|
|
||||||
import CarouselItemsListTheme from './carousel-items-list-theme.vue';
|
|
||||||
import { ThumbnailHelperPlugin } from '../../../admin/js/utilities.js';
|
|
||||||
import VueBlurHash from 'vue-blurhash';
|
|
||||||
|
|
||||||
// Vue Dev Tools!
|
|
||||||
Vue.config.devtools = process && process.env && process.env.NODE_ENV === 'development';
|
|
||||||
|
|
||||||
function renderTainacanItemCarouselBlocks() {
|
|
||||||
// Gets all divs with content created by our block;
|
|
||||||
let blocksElements = document.getElementsByClassName('wp-block-tainacan-carousel-items-list');
|
|
||||||
|
|
||||||
if (blocksElements) {
|
|
||||||
let blocks = Object.values(blocksElements);
|
|
||||||
|
|
||||||
// Checks if this carousel isn't already mounted
|
|
||||||
blocks = blocks.filter((block) => block.classList && !block.classList.contains('has-mounted'));
|
|
||||||
const blockIds = blocks.map((block) => block.id);
|
|
||||||
|
|
||||||
// Creates a new Vue Instance to manage each block isolatelly
|
|
||||||
for (let blockId of blockIds) {
|
|
||||||
// Configure Vue logic before passing it to constructor:
|
|
||||||
let vueOptions = {
|
|
||||||
data: {
|
|
||||||
collectionId: '',
|
|
||||||
searchURL: '',
|
|
||||||
selectedItems: [],
|
|
||||||
loadStrategy: 'search',
|
|
||||||
maxItemsNumber: 12,
|
|
||||||
maxItemsPerScreen: 7,
|
|
||||||
arrowsPosition: 'around',
|
|
||||||
largeArrows: false,
|
|
||||||
autoPlay: false,
|
|
||||||
autoPlaySpeed: 3,
|
|
||||||
loopSlides: false,
|
|
||||||
hideTitle: true,
|
|
||||||
cropImagesToSquare: true,
|
|
||||||
showCollectionHeader: false,
|
|
||||||
showCollectionLabel: false,
|
|
||||||
collectionBackgroundColor: '#454647',
|
|
||||||
collectionTextColor: '#ffffff',
|
|
||||||
tainacanApiRoot: '',
|
|
||||||
tainacanBaseUrl: '',
|
|
||||||
className: ''
|
|
||||||
},
|
|
||||||
render(h){
|
|
||||||
return h(CarouselItemsListTheme, {
|
|
||||||
props: {
|
|
||||||
blockId: blockId,
|
|
||||||
collectionId: this.collectionId,
|
|
||||||
searchURL: this.searchURL,
|
|
||||||
selectedItems: this.selectedItems,
|
|
||||||
loadStrategy: this.loadStrategy,
|
|
||||||
maxItemsNumber: this.maxItemsNumber,
|
|
||||||
maxItemsPerScreen: this.maxItemsPerScreen,
|
|
||||||
arrowsPosition: this.arrowsPosition,
|
|
||||||
largeArrows: this.largeArrows,
|
|
||||||
autoPlay: this.autoPlay,
|
|
||||||
autoPlaySpeed: this.autoPlaySpeed,
|
|
||||||
loopSlides: this.loopSlides,
|
|
||||||
hideTitle: this.hideTitle,
|
|
||||||
cropImagesToSquare: this.cropImagesToSquare,
|
|
||||||
showCollectionHeader: this.showCollectionHeader,
|
|
||||||
showCollectionLabel: this.showCollectionLabel,
|
|
||||||
collectionBackgroundColor: this.collectionBackgroundColor,
|
|
||||||
collectionTextColor: this.collectionTextColor,
|
|
||||||
tainacanApiRoot: this.tainacanApiRoot,
|
|
||||||
tainacanBaseUrl: this.tainacanBaseUrl,
|
|
||||||
className: this.className
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
beforeMount () {
|
|
||||||
this.className = this.$el.attributes.class != undefined ? this.$el.attributes.class.value : undefined;
|
|
||||||
this.searchURL = this.$el.attributes['search-url'] != undefined ? this.$el.attributes['search-url'].value : undefined;
|
|
||||||
this.selectedItems = this.$el.attributes['selected-items'] != undefined ? JSON.parse(this.$el.attributes['selected-items'].value) : undefined;
|
|
||||||
this.loadStrategy = this.$el.attributes['load-strategy'] != undefined ? this.$el.attributes['load-strategy'].value : undefined;
|
|
||||||
this.collectionId = this.$el.attributes['collection-id'] != undefined ? this.$el.attributes['collection-id'].value : undefined;
|
|
||||||
this.maxItemsNumber = this.$el.attributes['max-items-number'] != undefined ? this.$el.attributes['max-items-number'].value : undefined;
|
|
||||||
this.maxItemsPerScreen = this.$el.attributes['max-items-per-screen'] != undefined ? this.$el.attributes['max-items-per-screen'].value : 7;
|
|
||||||
this.arrowsPosition = this.$el.attributes['arrows-position'] != undefined ? this.$el.attributes['arrows-position'].value : undefined;
|
|
||||||
this.largeArrows = this.$el.attributes['large-arrows'] != undefined ? this.$el.attributes['large-arrows'].value == 'true' : false;
|
|
||||||
this.autoPlay = this.$el.attributes['auto-play'] != undefined ? this.$el.attributes['auto-play'].value == 'true' : false;
|
|
||||||
this.autoPlaySpeed = this.$el.attributes['auto-play-speed'] != undefined ? this.$el.attributes['auto-play-speed'].value : 3;
|
|
||||||
this.loopSlides = this.$el.attributes['loop-slides'] != undefined ? this.$el.attributes['loop-slides'].value == 'true' : false;
|
|
||||||
this.hideTitle = this.$el.attributes['hide-title'] != undefined ? this.$el.attributes['hide-title'].value == 'true' : false;
|
|
||||||
this.cropImagesToSquare = this.$el.attributes['crop-images-to-square'] != undefined ? this.$el.attributes['crop-images-to-square'].value == 'true' : true;
|
|
||||||
this.showCollectionHeader = this.$el.attributes['show-collection-header'] != undefined ? this.$el.attributes['show-collection-header'].value == 'true' : false;
|
|
||||||
this.showCollectionLabel = this.$el.attributes['show-collection-label'] != undefined ? this.$el.attributes['show-collection-label'].value == 'true' : false;
|
|
||||||
this.collectionBackgroundColor = this.$el.attributes['collection-background-color'] != undefined ? this.$el.attributes['collection-background-color'].value : undefined;
|
|
||||||
this.collectionTextColor = this.$el.attributes['collection-text-color'] != undefined ? this.$el.attributes['collection-text-color'].value : undefined;
|
|
||||||
this.tainacanApiRoot = this.$el.attributes['tainacan-api-root'] != undefined ? this.$el.attributes['tainacan-api-root'].value : undefined;
|
|
||||||
this.tainacanBaseUrl = this.$el.attributes['tainacan-base-url'] != undefined ? this.$el.attributes['tainacan-base-url'].value : undefined;
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
__(text, domain) {
|
|
||||||
return wp.i18n.__(text, domain);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
Vue.use(ThumbnailHelperPlugin);
|
|
||||||
Vue.use(VueBlurHash);
|
|
||||||
new Vue( Object.assign({ el: '#' + blockId }, vueOptions) );
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// This is rendered on the theme side.
|
|
||||||
document.addEventListener("DOMContentLoaded", () => {
|
|
||||||
renderTainacanItemCarouselBlocks();
|
|
||||||
});
|
|
||||||
|
|
||||||
// Also if a theme or plugin requested a reset...
|
|
||||||
document.addEventListener("TainacanReloadCarouselItemsListBlock", () => {
|
|
||||||
renderTainacanItemCarouselBlocks();
|
|
||||||
});
|
|
||||||
|
|
@ -22,6 +22,7 @@ export default function ({ attributes, className }) {
|
||||||
} = attributes;
|
} = attributes;
|
||||||
|
|
||||||
return <div
|
return <div
|
||||||
|
data-module="carousel-items-list"
|
||||||
className={ className }
|
className={ className }
|
||||||
search-url={ searchURL }
|
search-url={ searchURL }
|
||||||
selected-items={ JSON.stringify(selectedItems) }
|
selected-items={ JSON.stringify(selectedItems) }
|
||||||
|
|
|
||||||
|
|
@ -184,6 +184,7 @@
|
||||||
top: calc(50% - 42px);
|
top: calc(50% - 42px);
|
||||||
bottom: initial;
|
bottom: initial;
|
||||||
background: none;
|
background: none;
|
||||||
|
background-color: transparent !important;
|
||||||
border: none;
|
border: none;
|
||||||
width: 42px;
|
width: 42px;
|
||||||
height: 42px;
|
height: 42px;
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,120 @@
|
||||||
|
|
||||||
|
import Vue from 'vue';
|
||||||
|
import CarouselItemsListTheme from './theme.vue';
|
||||||
|
import { ThumbnailHelperPlugin } from '../../../admin/js/utilities.js';
|
||||||
|
import VueBlurHash from 'vue-blurhash';
|
||||||
|
|
||||||
|
export default (element) => {
|
||||||
|
|
||||||
|
// Vue Dev Tools!
|
||||||
|
Vue.config.devtools = process && process.env && process.env.NODE_ENV === 'development';
|
||||||
|
|
||||||
|
function renderTainacanItemCarouselBlocks() {
|
||||||
|
|
||||||
|
// Gets all divs with content created by our block;
|
||||||
|
let blocksElements = element ? [ element ] : document.getElementsByClassName('wp-block-tainacan-carousel-items-list');
|
||||||
|
|
||||||
|
if (blocksElements) {
|
||||||
|
let blocks = Object.values(blocksElements);
|
||||||
|
|
||||||
|
// Checks if this carousel isn't already mounted
|
||||||
|
blocks = blocks.filter((block) => block.classList && !block.classList.contains('has-mounted'));
|
||||||
|
const blockIds = blocks.map((block) => block.id);
|
||||||
|
|
||||||
|
// Creates a new Vue Instance to manage each block isolatelly
|
||||||
|
for (let blockId of blockIds) {
|
||||||
|
// Configure Vue logic before passing it to constructor:
|
||||||
|
let vueOptions = {
|
||||||
|
data: {
|
||||||
|
collectionId: '',
|
||||||
|
searchURL: '',
|
||||||
|
selectedItems: [],
|
||||||
|
loadStrategy: 'search',
|
||||||
|
maxItemsNumber: 12,
|
||||||
|
maxItemsPerScreen: 7,
|
||||||
|
arrowsPosition: 'around',
|
||||||
|
largeArrows: false,
|
||||||
|
autoPlay: false,
|
||||||
|
autoPlaySpeed: 3,
|
||||||
|
loopSlides: false,
|
||||||
|
hideTitle: true,
|
||||||
|
cropImagesToSquare: true,
|
||||||
|
showCollectionHeader: false,
|
||||||
|
showCollectionLabel: false,
|
||||||
|
collectionBackgroundColor: '#454647',
|
||||||
|
collectionTextColor: '#ffffff',
|
||||||
|
tainacanApiRoot: '',
|
||||||
|
tainacanBaseUrl: '',
|
||||||
|
className: ''
|
||||||
|
},
|
||||||
|
render(h){
|
||||||
|
return h(CarouselItemsListTheme, {
|
||||||
|
props: {
|
||||||
|
blockId: blockId,
|
||||||
|
collectionId: this.collectionId,
|
||||||
|
searchURL: this.searchURL,
|
||||||
|
selectedItems: this.selectedItems,
|
||||||
|
loadStrategy: this.loadStrategy,
|
||||||
|
maxItemsNumber: this.maxItemsNumber,
|
||||||
|
maxItemsPerScreen: this.maxItemsPerScreen,
|
||||||
|
arrowsPosition: this.arrowsPosition,
|
||||||
|
largeArrows: this.largeArrows,
|
||||||
|
autoPlay: this.autoPlay,
|
||||||
|
autoPlaySpeed: this.autoPlaySpeed,
|
||||||
|
loopSlides: this.loopSlides,
|
||||||
|
hideTitle: this.hideTitle,
|
||||||
|
cropImagesToSquare: this.cropImagesToSquare,
|
||||||
|
showCollectionHeader: this.showCollectionHeader,
|
||||||
|
showCollectionLabel: this.showCollectionLabel,
|
||||||
|
collectionBackgroundColor: this.collectionBackgroundColor,
|
||||||
|
collectionTextColor: this.collectionTextColor,
|
||||||
|
tainacanApiRoot: this.tainacanApiRoot,
|
||||||
|
tainacanBaseUrl: this.tainacanBaseUrl,
|
||||||
|
className: this.className
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
beforeMount () {
|
||||||
|
this.className = this.$el.attributes.class != undefined ? this.$el.attributes.class.value : undefined;
|
||||||
|
this.searchURL = this.$el.attributes['search-url'] != undefined ? this.$el.attributes['search-url'].value : undefined;
|
||||||
|
this.selectedItems = this.$el.attributes['selected-items'] != undefined ? JSON.parse(this.$el.attributes['selected-items'].value) : undefined;
|
||||||
|
this.loadStrategy = this.$el.attributes['load-strategy'] != undefined ? this.$el.attributes['load-strategy'].value : undefined;
|
||||||
|
this.collectionId = this.$el.attributes['collection-id'] != undefined ? this.$el.attributes['collection-id'].value : undefined;
|
||||||
|
this.maxItemsNumber = this.$el.attributes['max-items-number'] != undefined ? this.$el.attributes['max-items-number'].value : undefined;
|
||||||
|
this.maxItemsPerScreen = this.$el.attributes['max-items-per-screen'] != undefined ? this.$el.attributes['max-items-per-screen'].value : 7;
|
||||||
|
this.arrowsPosition = this.$el.attributes['arrows-position'] != undefined ? this.$el.attributes['arrows-position'].value : undefined;
|
||||||
|
this.largeArrows = this.$el.attributes['large-arrows'] != undefined ? this.$el.attributes['large-arrows'].value == 'true' : false;
|
||||||
|
this.autoPlay = this.$el.attributes['auto-play'] != undefined ? this.$el.attributes['auto-play'].value == 'true' : false;
|
||||||
|
this.autoPlaySpeed = this.$el.attributes['auto-play-speed'] != undefined ? this.$el.attributes['auto-play-speed'].value : 3;
|
||||||
|
this.loopSlides = this.$el.attributes['loop-slides'] != undefined ? this.$el.attributes['loop-slides'].value == 'true' : false;
|
||||||
|
this.hideTitle = this.$el.attributes['hide-title'] != undefined ? this.$el.attributes['hide-title'].value == 'true' : false;
|
||||||
|
this.cropImagesToSquare = this.$el.attributes['crop-images-to-square'] != undefined ? this.$el.attributes['crop-images-to-square'].value == 'true' : true;
|
||||||
|
this.showCollectionHeader = this.$el.attributes['show-collection-header'] != undefined ? this.$el.attributes['show-collection-header'].value == 'true' : false;
|
||||||
|
this.showCollectionLabel = this.$el.attributes['show-collection-label'] != undefined ? this.$el.attributes['show-collection-label'].value == 'true' : false;
|
||||||
|
this.collectionBackgroundColor = this.$el.attributes['collection-background-color'] != undefined ? this.$el.attributes['collection-background-color'].value : undefined;
|
||||||
|
this.collectionTextColor = this.$el.attributes['collection-text-color'] != undefined ? this.$el.attributes['collection-text-color'].value : undefined;
|
||||||
|
this.tainacanApiRoot = this.$el.attributes['tainacan-api-root'] != undefined ? this.$el.attributes['tainacan-api-root'].value : undefined;
|
||||||
|
this.tainacanBaseUrl = this.$el.attributes['tainacan-base-url'] != undefined ? this.$el.attributes['tainacan-base-url'].value : undefined;
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
__(text, domain) {
|
||||||
|
return wp.i18n.__(text, domain);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
Vue.use(ThumbnailHelperPlugin);
|
||||||
|
Vue.use(VueBlurHash);
|
||||||
|
new Vue( Object.assign({ el: '#' + blockId }, vueOptions) );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// This is rendered on the theme side.
|
||||||
|
renderTainacanItemCarouselBlocks();
|
||||||
|
|
||||||
|
// Also if a theme or plugin requested a reset...
|
||||||
|
document.addEventListener("TainacanReloadCarouselItemsListBlock", () => {
|
||||||
|
renderTainacanItemCarouselBlocks();
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
@ -106,7 +106,5 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"editorScript": "carousel-terms-list",
|
"editorScript": "carousel-terms-list",
|
||||||
"script": "carousel-terms-list-theme",
|
"editorStyle": "carousel-terms-list"
|
||||||
"editorStyle": "carousel-terms-list",
|
|
||||||
"style": "carousel-terms-list"
|
|
||||||
}
|
}
|
||||||
|
|
@ -1,88 +0,0 @@
|
||||||
import Vue from 'vue';
|
|
||||||
import CarouselTermsListTheme from './carousel-terms-list-theme.vue';
|
|
||||||
import { ThumbnailHelperPlugin } from '../../../admin/js/utilities.js';
|
|
||||||
import VueBlurHash from 'vue-blurhash';
|
|
||||||
|
|
||||||
// Vue Dev Tools!
|
|
||||||
Vue.config.devtools = process && process.env && process.env.NODE_ENV === 'development';
|
|
||||||
|
|
||||||
// This is rendered on the theme side.
|
|
||||||
document.addEventListener("DOMContentLoaded", () => {
|
|
||||||
|
|
||||||
// Gets all divs with content created by our block;
|
|
||||||
let blocks = document.getElementsByClassName('wp-block-tainacan-carousel-terms-list');
|
|
||||||
|
|
||||||
if (blocks) {
|
|
||||||
let blockIds = Object.values(blocks).map((block) => block.id);
|
|
||||||
|
|
||||||
// Creates a new Vue Instance to manage each block isolatelly
|
|
||||||
for (let blockId of blockIds) {
|
|
||||||
|
|
||||||
// Configure Vue logic before passing it to constructor:
|
|
||||||
let vueOptions = {
|
|
||||||
data: {
|
|
||||||
selectedItem: [],
|
|
||||||
maxItemsNumber: 12,
|
|
||||||
arrowsPosition: 'around',
|
|
||||||
autoPlay: false,
|
|
||||||
autoPlaySpeed: 3,
|
|
||||||
largeArrows: false,
|
|
||||||
maxTermsPerScreen: 6,
|
|
||||||
loopSlides: false,
|
|
||||||
hideName: true,
|
|
||||||
showTermThumbnail: false,
|
|
||||||
tainacanApiRoot: '',
|
|
||||||
tainacanBaseUrl: '',
|
|
||||||
className: '',
|
|
||||||
taxonomyId: ''
|
|
||||||
},
|
|
||||||
render(h){
|
|
||||||
return h(CarouselTermsListTheme, {
|
|
||||||
props: {
|
|
||||||
blockId: blockId,
|
|
||||||
selectedTerms: this.selectedTerms,
|
|
||||||
maxItemsNumber: this.maxItemsNumber,
|
|
||||||
arrowsPosition: this.arrowsPosition,
|
|
||||||
autoPlay: this.autoPlay,
|
|
||||||
autoPlaySpeed: this.autoPlaySpeed,
|
|
||||||
loopSlides: this.loopSlides,
|
|
||||||
largeArrows: this.largeArrows,
|
|
||||||
maxTermsPerScreen: this.maxTermsPerScreen,
|
|
||||||
hideName: this.hideName,
|
|
||||||
showTermThumbnail: this.showTermThumbnail,
|
|
||||||
tainacanApiRoot: this.tainacanApiRoot,
|
|
||||||
tainacanBaseUrl: this.tainacanBaseUrl,
|
|
||||||
className: this.className,
|
|
||||||
taxonomyId: this.taxonomyId
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
beforeMount () {
|
|
||||||
this.className = this.$el.attributes.class != undefined ? this.$el.attributes.class.value : undefined;
|
|
||||||
this.selectedTerms = this.$el.attributes['selected-terms'] != undefined ? JSON.parse(this.$el.attributes['selected-terms'].value) : undefined;
|
|
||||||
this.maxItemsNumber = this.$el.attributes['max-terms-number'] != undefined ? this.$el.attributes['max-terms-number'].value : undefined;
|
|
||||||
this.maxTermsPerScreen = this.$el.attributes['max-terms-per-screen'] != undefined ? this.$el.attributes['max-terms-per-screen'].value : undefined;
|
|
||||||
this.arrowsPosition = this.$el.attributes['arrows-position'] != undefined ? this.$el.attributes['arrows-position'].value : undefined;
|
|
||||||
this.autoPlay = this.$el.attributes['auto-play'] != undefined ? this.$el.attributes['auto-play'].value == 'true' : false;
|
|
||||||
this.autoPlaySpeed = this.$el.attributes['auto-play-speed'] != undefined ? this.$el.attributes['auto-play-speed'].value : 3;
|
|
||||||
this.largeArrows = this.$el.attributes['large-arrows'] != undefined ? this.$el.attributes['large-arrows'].value == 'true' : false;
|
|
||||||
this.loopSlides = this.$el.attributes['loop-slides'] != undefined ? this.$el.attributes['loop-slides'].value == 'true' : false;
|
|
||||||
this.hideName = this.$el.attributes['hide-name'] != undefined ? this.$el.attributes['hide-name'].value == 'true' : false;
|
|
||||||
this.taxonomyId = this.$el.attributes['taxonomy-id'] != undefined ? this.$el.attributes['taxonomy-id'].value : undefined;
|
|
||||||
this.showTermThumbnail = this.$el.attributes['show-term-thumbnail'] != undefined ? this.$el.attributes['show-term-thumbnail'].value == 'true' : false;
|
|
||||||
this.tainacanApiRoot = this.$el.attributes['tainacan-api-root'] != undefined ? this.$el.attributes['tainacan-api-root'].value : undefined;
|
|
||||||
this.tainacanBaseUrl = this.$el.attributes['tainacan-base-url'] != undefined ? this.$el.attributes['tainacan-base-url'].value : undefined;
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
__(text, domain) {
|
|
||||||
return wp.i18n.__(text, domain);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
Vue.use(VueBlurHash);
|
|
||||||
Vue.use(ThumbnailHelperPlugin);
|
|
||||||
new Vue( Object.assign({ el: '#' + blockId }, vueOptions) );
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
@ -15,6 +15,7 @@ export default function({ attributes, className }) {
|
||||||
taxonomyId
|
taxonomyId
|
||||||
} = attributes;
|
} = attributes;
|
||||||
return <div
|
return <div
|
||||||
|
data-module="carousel-terms-list"
|
||||||
className={ className }
|
className={ className }
|
||||||
selected-terms={ JSON.stringify(selectedTerms.map((term) => { return term.id; })) }
|
selected-terms={ JSON.stringify(selectedTerms.map((term) => { return term.id; })) }
|
||||||
arrows-position={ arrowsPosition }
|
arrows-position={ arrowsPosition }
|
||||||
|
|
|
||||||
|
|
@ -201,6 +201,7 @@
|
||||||
top: calc(50% - 42px);
|
top: calc(50% - 42px);
|
||||||
bottom: initial;
|
bottom: initial;
|
||||||
background: none;
|
background: none;
|
||||||
|
background-color: transparent !important;
|
||||||
border: none;
|
border: none;
|
||||||
width: 42px;
|
width: 42px;
|
||||||
height: 42px;
|
height: 42px;
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,102 @@
|
||||||
|
import Vue from 'vue';
|
||||||
|
import CarouselTermsListTheme from './theme.vue';
|
||||||
|
import { ThumbnailHelperPlugin } from '../../../admin/js/utilities.js';
|
||||||
|
import VueBlurHash from 'vue-blurhash';
|
||||||
|
|
||||||
|
export default (element) => {
|
||||||
|
|
||||||
|
// Vue Dev Tools!
|
||||||
|
Vue.config.devtools = process && process.env && process.env.NODE_ENV === 'development';
|
||||||
|
|
||||||
|
function renderTainacanTermsCarouselBlocks() {
|
||||||
|
|
||||||
|
// Gets all divs with content created by our block;
|
||||||
|
let blocksElements = element ? [ element ] : document.getElementsByClassName('wp-block-tainacan-carousel-terms-list');
|
||||||
|
|
||||||
|
if (blocksElements) {
|
||||||
|
let blocks = Object.values(blocksElements);
|
||||||
|
|
||||||
|
// Checks if this carousel isn't already mounted
|
||||||
|
blocks = blocks.filter((block) => block.classList && !block.classList.contains('has-mounted'));
|
||||||
|
const blockIds = Object.values(blocks).map((block) => block.id);
|
||||||
|
|
||||||
|
// Creates a new Vue Instance to manage each block isolatelly
|
||||||
|
for (let blockId of blockIds) {
|
||||||
|
|
||||||
|
// Configure Vue logic before passing it to constructor:
|
||||||
|
let vueOptions = {
|
||||||
|
data: {
|
||||||
|
selectedItem: [],
|
||||||
|
maxItemsNumber: 12,
|
||||||
|
arrowsPosition: 'around',
|
||||||
|
autoPlay: false,
|
||||||
|
autoPlaySpeed: 3,
|
||||||
|
largeArrows: false,
|
||||||
|
maxTermsPerScreen: 6,
|
||||||
|
loopSlides: false,
|
||||||
|
hideName: true,
|
||||||
|
showTermThumbnail: false,
|
||||||
|
tainacanApiRoot: '',
|
||||||
|
tainacanBaseUrl: '',
|
||||||
|
className: '',
|
||||||
|
taxonomyId: ''
|
||||||
|
},
|
||||||
|
render(h){
|
||||||
|
return h(CarouselTermsListTheme, {
|
||||||
|
props: {
|
||||||
|
blockId: blockId,
|
||||||
|
selectedTerms: this.selectedTerms,
|
||||||
|
maxItemsNumber: this.maxItemsNumber,
|
||||||
|
arrowsPosition: this.arrowsPosition,
|
||||||
|
autoPlay: this.autoPlay,
|
||||||
|
autoPlaySpeed: this.autoPlaySpeed,
|
||||||
|
loopSlides: this.loopSlides,
|
||||||
|
largeArrows: this.largeArrows,
|
||||||
|
maxTermsPerScreen: this.maxTermsPerScreen,
|
||||||
|
hideName: this.hideName,
|
||||||
|
showTermThumbnail: this.showTermThumbnail,
|
||||||
|
tainacanApiRoot: this.tainacanApiRoot,
|
||||||
|
tainacanBaseUrl: this.tainacanBaseUrl,
|
||||||
|
className: this.className,
|
||||||
|
taxonomyId: this.taxonomyId
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
beforeMount () {
|
||||||
|
this.className = this.$el.attributes.class != undefined ? this.$el.attributes.class.value : undefined;
|
||||||
|
this.selectedTerms = this.$el.attributes['selected-terms'] != undefined ? JSON.parse(this.$el.attributes['selected-terms'].value) : undefined;
|
||||||
|
this.maxItemsNumber = this.$el.attributes['max-terms-number'] != undefined ? this.$el.attributes['max-terms-number'].value : undefined;
|
||||||
|
this.maxTermsPerScreen = this.$el.attributes['max-terms-per-screen'] != undefined ? this.$el.attributes['max-terms-per-screen'].value : undefined;
|
||||||
|
this.arrowsPosition = this.$el.attributes['arrows-position'] != undefined ? this.$el.attributes['arrows-position'].value : undefined;
|
||||||
|
this.autoPlay = this.$el.attributes['auto-play'] != undefined ? this.$el.attributes['auto-play'].value == 'true' : false;
|
||||||
|
this.autoPlaySpeed = this.$el.attributes['auto-play-speed'] != undefined ? this.$el.attributes['auto-play-speed'].value : 3;
|
||||||
|
this.largeArrows = this.$el.attributes['large-arrows'] != undefined ? this.$el.attributes['large-arrows'].value == 'true' : false;
|
||||||
|
this.loopSlides = this.$el.attributes['loop-slides'] != undefined ? this.$el.attributes['loop-slides'].value == 'true' : false;
|
||||||
|
this.hideName = this.$el.attributes['hide-name'] != undefined ? this.$el.attributes['hide-name'].value == 'true' : false;
|
||||||
|
this.taxonomyId = this.$el.attributes['taxonomy-id'] != undefined ? this.$el.attributes['taxonomy-id'].value : undefined;
|
||||||
|
this.showTermThumbnail = this.$el.attributes['show-term-thumbnail'] != undefined ? this.$el.attributes['show-term-thumbnail'].value == 'true' : false;
|
||||||
|
this.tainacanApiRoot = this.$el.attributes['tainacan-api-root'] != undefined ? this.$el.attributes['tainacan-api-root'].value : undefined;
|
||||||
|
this.tainacanBaseUrl = this.$el.attributes['tainacan-base-url'] != undefined ? this.$el.attributes['tainacan-base-url'].value : undefined;
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
__(text, domain) {
|
||||||
|
return wp.i18n.__(text, domain);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
Vue.use(VueBlurHash);
|
||||||
|
Vue.use(ThumbnailHelperPlugin);
|
||||||
|
new Vue( Object.assign({ el: '#' + blockId }, vueOptions) );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// This is rendered on the theme side.
|
||||||
|
renderTainacanTermsCarouselBlocks();
|
||||||
|
|
||||||
|
// Also if a theme or plugin requested a reset...
|
||||||
|
document.addEventListener("TainacanReloadCarouselTermsListBlock", () => {
|
||||||
|
renderTainacanTermsCarouselBlocks();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<div :class="className">
|
<div :class="className + ' has-mounted'">
|
||||||
<div v-if="!isLoading">
|
<div v-if="!isLoading">
|
||||||
<div
|
<div
|
||||||
:class="'tainacan-carousel ' + (arrowsPosition ? ' has-arrows-' + arrowsPosition : '') + (largeArrows ? ' has-large-arrows' : '')"
|
:class="'tainacan-carousel ' + (arrowsPosition ? ' has-arrows-' + arrowsPosition : '') + (largeArrows ? ' has-large-arrows' : '')"
|
||||||
|
|
@ -89,6 +89,5 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"editorScript": "collections-list",
|
"editorScript": "collections-list",
|
||||||
"editorStyle": "collections-list",
|
"editorStyle": "collections-list"
|
||||||
"style": "collections-list"
|
|
||||||
}
|
}
|
||||||
|
|
@ -1,4 +1,4 @@
|
||||||
export default function({ attributes, className }) {
|
export default function({ attributes, className }) {
|
||||||
const { content } = attributes;
|
const { content } = attributes;
|
||||||
return <div className={ className }>{ content }</div>
|
return <div data-module="collections-list" className={ className }>{ content }</div>
|
||||||
};
|
};
|
||||||
|
|
@ -0,0 +1,3 @@
|
||||||
|
import './style.scss';
|
||||||
|
|
||||||
|
export default () => {}
|
||||||
|
|
@ -144,7 +144,5 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"editorScript": "dynamic-items-list",
|
"editorScript": "dynamic-items-list",
|
||||||
"script": "dynamic-items-list-theme",
|
"editorStyle": "dynamic-items-list"
|
||||||
"editorStyle": "dynamic-items-list",
|
|
||||||
"style": "dynamic-items-list"
|
|
||||||
}
|
}
|
||||||
|
|
@ -1,117 +0,0 @@
|
||||||
import Vue from 'vue';
|
|
||||||
import DynamicItemsListTheme from './dynamic-items-list-theme.vue';
|
|
||||||
import { ThumbnailHelperPlugin } from '../../../admin/js/utilities.js';
|
|
||||||
import VueBlurHash from 'vue-blurhash';
|
|
||||||
|
|
||||||
// Vue Dev Tools!
|
|
||||||
Vue.config.devtools = process && process.env && process.env.NODE_ENV === 'development';
|
|
||||||
|
|
||||||
// This is rendered on the theme side.
|
|
||||||
document.addEventListener("DOMContentLoaded", () => {
|
|
||||||
|
|
||||||
// Gets all divs with content created by our block;
|
|
||||||
let blocks = document.getElementsByClassName('wp-block-tainacan-dynamic-items-list');
|
|
||||||
|
|
||||||
if (blocks) {
|
|
||||||
let blockIds = Object.values(blocks).map((block) => block.id);
|
|
||||||
|
|
||||||
// Creates a new Vue Instance to manage each block isolatelly
|
|
||||||
for (let blockId of blockIds) {
|
|
||||||
|
|
||||||
// Configure Vue logic before passing it to constructor:
|
|
||||||
let vueOptions = {
|
|
||||||
data: {
|
|
||||||
collectionId: '',
|
|
||||||
showImage: true,
|
|
||||||
showName: true,
|
|
||||||
layout: 'grid',
|
|
||||||
gridMargin: 0,
|
|
||||||
searchURL: '',
|
|
||||||
maxItemsNumber: 12,
|
|
||||||
mosaicHeight: 40,
|
|
||||||
mosaicDensity: 5,
|
|
||||||
mosaicGridRows: 3,
|
|
||||||
mosaicGridColumns: 3,
|
|
||||||
mosaicItemFocalPointX : 0.5,
|
|
||||||
mosaicItemFocalPointY : 0.5,
|
|
||||||
maxColumnsCount: 4,
|
|
||||||
cropImagesToSquare: true,
|
|
||||||
order: 'asc',
|
|
||||||
showSearchBar: false,
|
|
||||||
showCollectionHeader: false,
|
|
||||||
showCollectionLabel: false,
|
|
||||||
collectionBackgroundColor: '#454647',
|
|
||||||
collectionTextColor: '#ffffff',
|
|
||||||
tainacanApiRoot: '',
|
|
||||||
tainacanBaseUrl: '',
|
|
||||||
className: ''
|
|
||||||
},
|
|
||||||
render(h){
|
|
||||||
return h(DynamicItemsListTheme, {
|
|
||||||
props: {
|
|
||||||
collectionId: this.collectionId,
|
|
||||||
showImage: this.showImage,
|
|
||||||
showName: this.showName,
|
|
||||||
layout: this.layout,
|
|
||||||
gridMargin: this.gridMargin,
|
|
||||||
mosaicDensity: this.mosaicDensity,
|
|
||||||
mosaicHeight: this.mosaicHeight,
|
|
||||||
mosaicGridRows: this.mosaicGridRows,
|
|
||||||
mosaicGridColumns: this.mosaicGridColumns,
|
|
||||||
mosaicItemFocalPointX: this.mosaicItemFocalPointX,
|
|
||||||
mosaicItemFocalPointY: this.mosaicItemFocalPointY,
|
|
||||||
maxColumnsCount: this.maxColumnsCount,
|
|
||||||
cropImagesToSquare: this.cropImagesToSquare,
|
|
||||||
searchURL: this.searchURL,
|
|
||||||
maxItemsNumber: this.maxItemsNumber,
|
|
||||||
order: this.order,
|
|
||||||
showSearchBar: this.showSearchBar,
|
|
||||||
showCollectionHeader: this.showCollectionHeader,
|
|
||||||
showCollectionLabel: this.showCollectionLabel,
|
|
||||||
collectionBackgroundColor: this.collectionBackgroundColor,
|
|
||||||
collectionTextColor: this.collectionTextColor,
|
|
||||||
tainacanApiRoot: this.tainacanApiRoot,
|
|
||||||
tainacanBaseUrl: this.tainacanBaseUrl,
|
|
||||||
className: this.className
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
beforeMount () {
|
|
||||||
this.className = this.$el.attributes.class != undefined ? this.$el.attributes.class.value : undefined;
|
|
||||||
this.searchURL = this.$el.attributes['search-url'] != undefined ? this.$el.attributes['search-url'].value : undefined;
|
|
||||||
this.collectionId = this.$el.attributes['collection-id'] != undefined ? this.$el.attributes['collection-id'].value : undefined;
|
|
||||||
this.showImage = this.$el.attributes['show-image'] != undefined ? this.$el.attributes['show-image'].value == 'true' : true;
|
|
||||||
this.showName = this.$el.attributes['show-name'] != undefined ? this.$el.attributes['show-name'].value == 'true' : true;
|
|
||||||
this.layout = this.$el.attributes['layout'] != undefined ? this.$el.attributes['layout'].value : undefined;
|
|
||||||
this.gridMargin = this.$el.attributes['grid-margin'] != undefined ? Number(this.$el.attributes['grid-margin'].value) : undefined;
|
|
||||||
this.mosaicDensity = this.$el.attributes['mosaic-density'] != undefined ? Number(this.$el.attributes['mosaic-density'].value) : undefined;
|
|
||||||
this.mosaicHeight = this.$el.attributes['mosaic-height'] != undefined ? Number(this.$el.attributes['mosaic-height'].value) : undefined;
|
|
||||||
this.mosaicGridRows = this.$el.attributes['mosaic-grid-rows'] != undefined ? Number(this.$el.attributes['mosaic-grid-rows'].value) : undefined;
|
|
||||||
this.mosaicGridColumns = this.$el.attributes['mosaic-grid-columns'] != undefined ? Number(this.$el.attributes['mosaic-grid-columns'].value) : undefined;
|
|
||||||
this.mosaicItemFocalPointX = this.$el.attributes['mosaic-item-focal-point-x'] != undefined ? Number(this.$el.attributes['mosaic-item-focal-point-x'].value) : undefined;
|
|
||||||
this.mosaicItemFocalPointY = this.$el.attributes['mosaic-item-focal-point-y'] != undefined ? Number(this.$el.attributes['mosaic-item-focal-point-y'].value) : undefined;
|
|
||||||
this.maxColumnsCount = this.$el.attributes['max-columns-count'] != undefined ? this.$el.attributes['max-columns-count'].value : 4;
|
|
||||||
this.cropImagesToSquare = this.$el.attributes['crop-images-to-square'] != undefined ? this.$el.attributes['crop-images-to-square'].value == 'true' : true;
|
|
||||||
this.maxItemsNumber = this.$el.attributes['max-items-number'] != undefined ? this.$el.attributes['max-items-number'].value : undefined;
|
|
||||||
this.order = this.$el.attributes['order'] != undefined ? this.$el.attributes['order'].value : undefined;
|
|
||||||
this.showSearchBar = this.$el.attributes['show-search-bar'] != undefined ? this.$el.attributes['show-search-bar'].value == 'true' : false;
|
|
||||||
this.showCollectionHeader = this.$el.attributes['show-collection-header'] != undefined ? this.$el.attributes['show-collection-header'].value == 'true' : false;
|
|
||||||
this.showCollectionLabel = this.$el.attributes['show-collection-label'] != undefined ? this.$el.attributes['show-collection-label'].value == 'true' : false;
|
|
||||||
this.collectionBackgroundColor = this.$el.attributes['collection-background-color'] != undefined ? this.$el.attributes['collection-background-color'].value : undefined;
|
|
||||||
this.collectionTextColor = this.$el.attributes['collection-text-color'] != undefined ? this.$el.attributes['collection-text-color'].value : undefined;
|
|
||||||
this.tainacanApiRoot = this.$el.attributes['tainacan-api-root'] != undefined ? this.$el.attributes['tainacan-api-root'].value : undefined;
|
|
||||||
this.tainacanBaseUrl = this.$el.attributes['tainacan-base-url'] != undefined ? this.$el.attributes['tainacan-base-url'].value : undefined;
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
__(text, domain) {
|
|
||||||
return wp.i18n.__(text, domain);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
Vue.use(ThumbnailHelperPlugin);
|
|
||||||
Vue.use(VueBlurHash);
|
|
||||||
new Vue( Object.assign({ el: '#' + blockId }, vueOptions) );
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
@ -25,6 +25,7 @@ export default function({ attributes, className }) {
|
||||||
} = attributes;
|
} = attributes;
|
||||||
|
|
||||||
return <div
|
return <div
|
||||||
|
data-module="dynamic-items-list"
|
||||||
search-url={ searchURL }
|
search-url={ searchURL }
|
||||||
className={ className }
|
className={ className }
|
||||||
collection-id={ collectionId }
|
collection-id={ collectionId }
|
||||||
|
|
|
||||||
|
|
@ -381,6 +381,7 @@
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-wrap: wrap;
|
flex-wrap: wrap;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
min-width: 100%;
|
||||||
flex-basis: 100%;
|
flex-basis: 100%;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,132 @@
|
||||||
|
import Vue from 'vue';
|
||||||
|
import DynamicItemsListTheme from './theme.vue';
|
||||||
|
import { ThumbnailHelperPlugin } from '../../../admin/js/utilities.js';
|
||||||
|
import VueBlurHash from 'vue-blurhash';
|
||||||
|
|
||||||
|
export default (element) => {
|
||||||
|
|
||||||
|
// Vue Dev Tools!
|
||||||
|
Vue.config.devtools = process && process.env && process.env.NODE_ENV === 'development';
|
||||||
|
|
||||||
|
function renderTainacanDynamicItemsBlocks() {
|
||||||
|
|
||||||
|
// Gets all divs with content created by our block;
|
||||||
|
let blocksElements = element ? [ element ] : document.getElementsByClassName('wp-block-tainacan-dynamic-items-list');
|
||||||
|
|
||||||
|
if (blocksElements) {
|
||||||
|
let blocks = Object.values(blocksElements);
|
||||||
|
|
||||||
|
// Checks if this carousel isn't already mounted
|
||||||
|
blocks = blocks.filter((block) => block.classList && !block.classList.contains('has-mounted'));
|
||||||
|
const blockIds = Object.values(blocks).map((block) => block.id);
|
||||||
|
|
||||||
|
// Creates a new Vue Instance to manage each block isolatelly
|
||||||
|
for (let blockId of blockIds) {
|
||||||
|
|
||||||
|
// Configure Vue logic before passing it to constructor:
|
||||||
|
let vueOptions = {
|
||||||
|
data: {
|
||||||
|
collectionId: '',
|
||||||
|
showImage: true,
|
||||||
|
showName: true,
|
||||||
|
layout: 'grid',
|
||||||
|
gridMargin: 0,
|
||||||
|
searchURL: '',
|
||||||
|
maxItemsNumber: 12,
|
||||||
|
mosaicHeight: 40,
|
||||||
|
mosaicDensity: 5,
|
||||||
|
mosaicGridRows: 3,
|
||||||
|
mosaicGridColumns: 3,
|
||||||
|
mosaicItemFocalPointX : 0.5,
|
||||||
|
mosaicItemFocalPointY : 0.5,
|
||||||
|
maxColumnsCount: 4,
|
||||||
|
cropImagesToSquare: true,
|
||||||
|
order: 'asc',
|
||||||
|
showSearchBar: false,
|
||||||
|
showCollectionHeader: false,
|
||||||
|
showCollectionLabel: false,
|
||||||
|
collectionBackgroundColor: '#454647',
|
||||||
|
collectionTextColor: '#ffffff',
|
||||||
|
tainacanApiRoot: '',
|
||||||
|
tainacanBaseUrl: '',
|
||||||
|
className: ''
|
||||||
|
},
|
||||||
|
render(h){
|
||||||
|
return h(DynamicItemsListTheme, {
|
||||||
|
props: {
|
||||||
|
collectionId: this.collectionId,
|
||||||
|
showImage: this.showImage,
|
||||||
|
showName: this.showName,
|
||||||
|
layout: this.layout,
|
||||||
|
gridMargin: this.gridMargin,
|
||||||
|
mosaicDensity: this.mosaicDensity,
|
||||||
|
mosaicHeight: this.mosaicHeight,
|
||||||
|
mosaicGridRows: this.mosaicGridRows,
|
||||||
|
mosaicGridColumns: this.mosaicGridColumns,
|
||||||
|
mosaicItemFocalPointX: this.mosaicItemFocalPointX,
|
||||||
|
mosaicItemFocalPointY: this.mosaicItemFocalPointY,
|
||||||
|
maxColumnsCount: this.maxColumnsCount,
|
||||||
|
cropImagesToSquare: this.cropImagesToSquare,
|
||||||
|
searchURL: this.searchURL,
|
||||||
|
maxItemsNumber: this.maxItemsNumber,
|
||||||
|
order: this.order,
|
||||||
|
showSearchBar: this.showSearchBar,
|
||||||
|
showCollectionHeader: this.showCollectionHeader,
|
||||||
|
showCollectionLabel: this.showCollectionLabel,
|
||||||
|
collectionBackgroundColor: this.collectionBackgroundColor,
|
||||||
|
collectionTextColor: this.collectionTextColor,
|
||||||
|
tainacanApiRoot: this.tainacanApiRoot,
|
||||||
|
tainacanBaseUrl: this.tainacanBaseUrl,
|
||||||
|
className: this.className
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
beforeMount () {
|
||||||
|
this.className = this.$el.attributes.class != undefined ? this.$el.attributes.class.value : undefined;
|
||||||
|
this.searchURL = this.$el.attributes['search-url'] != undefined ? this.$el.attributes['search-url'].value : undefined;
|
||||||
|
this.collectionId = this.$el.attributes['collection-id'] != undefined ? this.$el.attributes['collection-id'].value : undefined;
|
||||||
|
this.showImage = this.$el.attributes['show-image'] != undefined ? this.$el.attributes['show-image'].value == 'true' : true;
|
||||||
|
this.showName = this.$el.attributes['show-name'] != undefined ? this.$el.attributes['show-name'].value == 'true' : true;
|
||||||
|
this.layout = this.$el.attributes['layout'] != undefined ? this.$el.attributes['layout'].value : undefined;
|
||||||
|
this.gridMargin = this.$el.attributes['grid-margin'] != undefined ? Number(this.$el.attributes['grid-margin'].value) : undefined;
|
||||||
|
this.mosaicDensity = this.$el.attributes['mosaic-density'] != undefined ? Number(this.$el.attributes['mosaic-density'].value) : undefined;
|
||||||
|
this.mosaicHeight = this.$el.attributes['mosaic-height'] != undefined ? Number(this.$el.attributes['mosaic-height'].value) : undefined;
|
||||||
|
this.mosaicGridRows = this.$el.attributes['mosaic-grid-rows'] != undefined ? Number(this.$el.attributes['mosaic-grid-rows'].value) : undefined;
|
||||||
|
this.mosaicGridColumns = this.$el.attributes['mosaic-grid-columns'] != undefined ? Number(this.$el.attributes['mosaic-grid-columns'].value) : undefined;
|
||||||
|
this.mosaicItemFocalPointX = this.$el.attributes['mosaic-item-focal-point-x'] != undefined ? Number(this.$el.attributes['mosaic-item-focal-point-x'].value) : undefined;
|
||||||
|
this.mosaicItemFocalPointY = this.$el.attributes['mosaic-item-focal-point-y'] != undefined ? Number(this.$el.attributes['mosaic-item-focal-point-y'].value) : undefined;
|
||||||
|
this.maxColumnsCount = this.$el.attributes['max-columns-count'] != undefined ? this.$el.attributes['max-columns-count'].value : 4;
|
||||||
|
this.cropImagesToSquare = this.$el.attributes['crop-images-to-square'] != undefined ? this.$el.attributes['crop-images-to-square'].value == 'true' : true;
|
||||||
|
this.maxItemsNumber = this.$el.attributes['max-items-number'] != undefined ? this.$el.attributes['max-items-number'].value : undefined;
|
||||||
|
this.order = this.$el.attributes['order'] != undefined ? this.$el.attributes['order'].value : undefined;
|
||||||
|
this.showSearchBar = this.$el.attributes['show-search-bar'] != undefined ? this.$el.attributes['show-search-bar'].value == 'true' : false;
|
||||||
|
this.showCollectionHeader = this.$el.attributes['show-collection-header'] != undefined ? this.$el.attributes['show-collection-header'].value == 'true' : false;
|
||||||
|
this.showCollectionLabel = this.$el.attributes['show-collection-label'] != undefined ? this.$el.attributes['show-collection-label'].value == 'true' : false;
|
||||||
|
this.collectionBackgroundColor = this.$el.attributes['collection-background-color'] != undefined ? this.$el.attributes['collection-background-color'].value : undefined;
|
||||||
|
this.collectionTextColor = this.$el.attributes['collection-text-color'] != undefined ? this.$el.attributes['collection-text-color'].value : undefined;
|
||||||
|
this.tainacanApiRoot = this.$el.attributes['tainacan-api-root'] != undefined ? this.$el.attributes['tainacan-api-root'].value : undefined;
|
||||||
|
this.tainacanBaseUrl = this.$el.attributes['tainacan-base-url'] != undefined ? this.$el.attributes['tainacan-base-url'].value : undefined;
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
__(text, domain) {
|
||||||
|
return wp.i18n.__(text, domain);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
Vue.use(ThumbnailHelperPlugin);
|
||||||
|
Vue.use(VueBlurHash);
|
||||||
|
new Vue( Object.assign({ el: '#' + blockId }, vueOptions) );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// This is rendered on the theme side.
|
||||||
|
renderTainacanDynamicItemsBlocks()
|
||||||
|
|
||||||
|
// Also if a theme or plugin requested a reset...
|
||||||
|
document.addEventListener("TainacanReloadDynamicItemsBlock", () => {
|
||||||
|
renderTainacanDynamicItemsBlocks();
|
||||||
|
});
|
||||||
|
|
||||||
|
}
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<div :class="className">
|
<div :class="className + ' has-mounted'">
|
||||||
<div v-if="showCollectionHeader">
|
<div v-if="showCollectionHeader">
|
||||||
<div
|
<div
|
||||||
v-if="isLoadingCollection"
|
v-if="isLoadingCollection"
|
||||||
|
|
@ -190,7 +190,6 @@
|
||||||
"multiple": false
|
"multiple": false
|
||||||
},
|
},
|
||||||
"editorScript": "faceted-search",
|
"editorScript": "faceted-search",
|
||||||
"script": "tainacan-search",
|
|
||||||
"editorStyle": "faceted-search",
|
"editorStyle": "faceted-search",
|
||||||
"style": "faceted-search"
|
"style": "faceted-search"
|
||||||
}
|
}
|
||||||
|
|
@ -69,8 +69,10 @@ export default function({ attributes, className }) {
|
||||||
'--tainacan-primary': primaryColor,
|
'--tainacan-primary': primaryColor,
|
||||||
'--tainacan-secondary': secondaryColor
|
'--tainacan-secondary': secondaryColor
|
||||||
}}
|
}}
|
||||||
className={ className }>
|
className={ className }
|
||||||
|
data-module="faceted-search">
|
||||||
<main
|
<main
|
||||||
|
id="tainacan-items-page"
|
||||||
term-id={ updatedListType == 'term' ? termId : null }
|
term-id={ updatedListType == 'term' ? termId : null }
|
||||||
taxonomy={ updatedListType == 'term' ? 'tnc_tax_' + taxonomyId : null }
|
taxonomy={ updatedListType == 'term' ? 'tnc_tax_' + taxonomyId : null }
|
||||||
collection-id={ updatedListType == 'collection' ? collectionId : null }
|
collection-id={ updatedListType == 'collection' ? collectionId : null }
|
||||||
|
|
@ -95,8 +97,7 @@ export default function({ attributes, className }) {
|
||||||
start-with-filters-hidden = { startWithFiltersHidden.toString() }
|
start-with-filters-hidden = { startWithFiltersHidden.toString() }
|
||||||
filters-as-modal = { filtersAsModal.toString() }
|
filters-as-modal = { filtersAsModal.toString() }
|
||||||
show-inline-view-mode-options = { showInlineViewModeOptions.toString() }
|
show-inline-view-mode-options = { showInlineViewModeOptions.toString() }
|
||||||
show-fullscreen-with-view-modes = { showFullscreenWithViewModes.toString() }
|
show-fullscreen-with-view-modes = { showFullscreenWithViewModes.toString() } >
|
||||||
id="tainacan-items-page">
|
|
||||||
</main>
|
</main>
|
||||||
</div>
|
</div>
|
||||||
};
|
};
|
||||||
|
|
@ -0,0 +1,264 @@
|
||||||
|
// Main imports
|
||||||
|
import Vue from 'vue';
|
||||||
|
import Buefy from 'buefy';
|
||||||
|
import VTooltip from 'v-tooltip';
|
||||||
|
import VueMasonry from 'vue-masonry-css';
|
||||||
|
import cssVars from 'css-vars-ponyfill';
|
||||||
|
import qs from 'qs';
|
||||||
|
import VueBlurHash from 'vue-blurhash';
|
||||||
|
|
||||||
|
// Filters
|
||||||
|
import FilterNumeric from '../../../admin/components/filter-types/numeric/Numeric.vue';
|
||||||
|
import FilterDate from '../../../admin/components/filter-types/date/Date.vue';
|
||||||
|
import FilterSelectbox from '../../../admin/components/filter-types/selectbox/Selectbox.vue';
|
||||||
|
import FilterAutocomplete from '../../../admin/components/filter-types/autocomplete/Autocomplete.vue';
|
||||||
|
import FilterCheckbox from '../../../admin/components/filter-types/checkbox/Checkbox.vue';
|
||||||
|
import FilterTaginput from '../../../admin/components/filter-types/taginput/Taginput.vue';
|
||||||
|
import FilterTaxonomyCheckbox from '../../../admin/components/filter-types/taxonomy/Checkbox.vue';
|
||||||
|
import FilterTaxonomyTaginput from '../../../admin/components/filter-types/taxonomy/Taginput.vue';
|
||||||
|
import FilterDateInterval from '../../../admin/components/filter-types/date-interval/DateInterval.vue';
|
||||||
|
import FilterNumericInterval from '../../../admin/components/filter-types/numeric-interval/NumericInterval.vue';
|
||||||
|
import FilterNumericListInterval from '../../../admin/components/filter-types/numeric-list-interval/NumericListInterval.vue';
|
||||||
|
|
||||||
|
import TaincanFiltersList from '../../../admin/components/filter-types/tainacan-filter-item.vue';
|
||||||
|
import ThemeItemsPage from '../../../theme-search/pages/theme-items-page.vue';
|
||||||
|
import ThemeSearch from '../../../theme-search/theme-search.vue';
|
||||||
|
|
||||||
|
// View Modes
|
||||||
|
import ViewModeTable from '../../../theme-search/components/view-mode-table.vue';
|
||||||
|
import ViewModeCards from '../../../theme-search/components/view-mode-cards.vue';
|
||||||
|
import ViewModeRecords from '../../../theme-search/components/view-mode-records.vue';
|
||||||
|
import ViewModeMasonry from '../../../theme-search/components/view-mode-masonry.vue';
|
||||||
|
import ViewModeSlideshow from '../../../theme-search/components/view-mode-slideshow.vue';
|
||||||
|
import ViewModeList from '../../../theme-search/components/view-mode-list.vue';
|
||||||
|
|
||||||
|
// Remaining imports
|
||||||
|
import store from '../../../admin/js/store/store';
|
||||||
|
import routerTheme from '../../../theme-search/js/theme-router.js';
|
||||||
|
import eventBusSearch from '../../../admin/js/event-bus-search';
|
||||||
|
import {
|
||||||
|
I18NPlugin,
|
||||||
|
UserPrefsPlugin,
|
||||||
|
ConsolePlugin
|
||||||
|
} from '../../../admin/js/admin-utilities';
|
||||||
|
import {
|
||||||
|
ThumbnailHelperPlugin
|
||||||
|
} from '../../../admin/js/utilities';
|
||||||
|
|
||||||
|
export default (element) => {
|
||||||
|
|
||||||
|
// Vue Dev Tools!
|
||||||
|
Vue.config.devtools = process && process.env && process.env.NODE_ENV === 'development';
|
||||||
|
|
||||||
|
function renderTainacanItemsListComponent() {
|
||||||
|
|
||||||
|
// Mount only if the div exists
|
||||||
|
if (element || document.getElementById('tainacan-items-page')) {
|
||||||
|
|
||||||
|
// Display Icons only once everything is loaded
|
||||||
|
function listen(evnt, elem, func) {
|
||||||
|
if (elem.addEventListener) // W3C DOM
|
||||||
|
elem.addEventListener(evnt,func,false);
|
||||||
|
else if (elem.attachEvent) { // IE DOM
|
||||||
|
var r = elem.attachEvent("on"+evnt, func);
|
||||||
|
return r;
|
||||||
|
} else if (document.head) {
|
||||||
|
var iconHideStyle = document.createElement("style");
|
||||||
|
iconHideStyle.innerText = '.tainacan-icon{ opacity: 1 !important; }';
|
||||||
|
document.head.appendChild(iconHideStyle);
|
||||||
|
} else {
|
||||||
|
var iconHideStyle = document.createElement("style");
|
||||||
|
iconHideStyle.innerText = '.tainacan-icon{ opacity: 1 !important; }';
|
||||||
|
document.getElementsByTagName("head")[0].appendChild(iconHideStyle);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Registers Extra Vue Plugins passed to the window.tainacan_extra_plugins */
|
||||||
|
if (typeof window.tainacan_extra_plugins != "undefined") {
|
||||||
|
for (let [extraVuePluginName, extraVuePluginObject] of Object.entries(window.tainacan_extra_plugins)) {
|
||||||
|
Vue.component(extraVuePluginName, extraVuePluginObject);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// Configure and Register Plugins
|
||||||
|
Vue.use(Buefy, {
|
||||||
|
defaultTooltipAnimated: true
|
||||||
|
});
|
||||||
|
Vue.use(VTooltip);
|
||||||
|
Vue.use(VueMasonry);
|
||||||
|
Vue.use(VueBlurHash);
|
||||||
|
Vue.use(I18NPlugin);
|
||||||
|
Vue.use(UserPrefsPlugin);
|
||||||
|
Vue.use(ThumbnailHelperPlugin);
|
||||||
|
Vue.use(ConsolePlugin, {visual: false});
|
||||||
|
|
||||||
|
/* Registers Extra Vue Components passed to the window.tainacan_extra_components */
|
||||||
|
if (typeof window.tainacan_extra_components != "undefined") {
|
||||||
|
for (let [extraVueComponentName, extraVueComponentObject] of Object.entries(window.tainacan_extra_components)) {
|
||||||
|
Vue.component(extraVueComponentName, extraVueComponentObject);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
Vue.component('tainacan-filter-item', TaincanFiltersList);
|
||||||
|
|
||||||
|
/* Filters */
|
||||||
|
Vue.component('tainacan-filter-numeric', FilterNumeric);
|
||||||
|
Vue.component('tainacan-filter-date', FilterDate);
|
||||||
|
Vue.component('tainacan-filter-selectbox', FilterSelectbox);
|
||||||
|
Vue.component('tainacan-filter-autocomplete', FilterAutocomplete);
|
||||||
|
Vue.component('tainacan-filter-checkbox', FilterCheckbox);
|
||||||
|
Vue.component('tainacan-filter-taginput', FilterTaginput);
|
||||||
|
Vue.component('tainacan-filter-taxonomy-checkbox', FilterTaxonomyCheckbox);
|
||||||
|
Vue.component('tainacan-filter-taxonomy-taginput', FilterTaxonomyTaginput);
|
||||||
|
Vue.component('tainacan-filter-date-interval', FilterDateInterval);
|
||||||
|
Vue.component('tainacan-filter-numeric-interval', FilterNumericInterval);
|
||||||
|
Vue.component('tainacan-filter-numeric-list-interval', FilterNumericListInterval);
|
||||||
|
|
||||||
|
/* Main page component */
|
||||||
|
Vue.component('theme-items-page', ThemeItemsPage);
|
||||||
|
Vue.component('theme-search', ThemeSearch);
|
||||||
|
|
||||||
|
// Oficial view modes
|
||||||
|
Vue.component('view-mode-table', ViewModeTable);
|
||||||
|
Vue.component('view-mode-cards', ViewModeCards);
|
||||||
|
Vue.component('view-mode-records', ViewModeRecords);
|
||||||
|
Vue.component('view-mode-masonry', ViewModeMasonry);
|
||||||
|
Vue.component('view-mode-slideshow', ViewModeSlideshow);
|
||||||
|
Vue.component('view-mode-list', ViewModeList);
|
||||||
|
|
||||||
|
Vue.use(eventBusSearch, { store: store, router: routerTheme});
|
||||||
|
|
||||||
|
const VueItemsList = new Vue({
|
||||||
|
store,
|
||||||
|
router: routerTheme,
|
||||||
|
data: {
|
||||||
|
termId: '',
|
||||||
|
taxonomy: '',
|
||||||
|
collectionId: '',
|
||||||
|
defaultViewMode: '',
|
||||||
|
isForcedViewMode: false,
|
||||||
|
enabledViewModes: {},
|
||||||
|
defaultItemsPerPage: '',
|
||||||
|
hideFilters: false,
|
||||||
|
hideHideFiltersButton: false,
|
||||||
|
hideSearch: false,
|
||||||
|
hideAdvancedSearch: false,
|
||||||
|
hideDisplayedMetadataButton: false,
|
||||||
|
hideSortByButton: false,
|
||||||
|
hideSortingArea: false,
|
||||||
|
hideItemsThumbnail: false,
|
||||||
|
hideItemsPerPageButton: false,
|
||||||
|
hideGoToPageButton: false,
|
||||||
|
hidePaginationArea: false,
|
||||||
|
showFiltersButtonInsideSearchControl: false,
|
||||||
|
startWithFiltersHidden: false,
|
||||||
|
filtersAsModal: false,
|
||||||
|
showInlineViewModeOptions: false,
|
||||||
|
showFullscreenWithViewModes: false
|
||||||
|
},
|
||||||
|
beforeMount () {
|
||||||
|
|
||||||
|
// Loads params if passed previously
|
||||||
|
if (this.$route.hash && this.$route.hash.split('#/?') && this.$route.hash.split('#/?')[1]) {
|
||||||
|
const existingQueries = qs.parse(this.$route.hash.split('#/?')[1]);
|
||||||
|
|
||||||
|
for (let key of Object.keys(existingQueries))
|
||||||
|
this.$route.query[key] = existingQueries[key];
|
||||||
|
}
|
||||||
|
|
||||||
|
// Collection or Term source settings
|
||||||
|
if (this.$el.attributes['collection-id'] != undefined)
|
||||||
|
this.collectionId = this.$el.attributes['collection-id'].value;
|
||||||
|
if (this.$el.attributes['term-id'] != undefined)
|
||||||
|
this.termId = this.$el.attributes['term-id'].value;
|
||||||
|
if (this.$el.attributes['taxonomy'] != undefined)
|
||||||
|
this.taxonomy = this.$el.attributes['taxonomy'].value;
|
||||||
|
|
||||||
|
// View Mode settings
|
||||||
|
if (this.$el.attributes['default-view-mode'] != undefined)
|
||||||
|
this.defaultViewMode = this.$el.attributes['default-view-mode'].value;
|
||||||
|
else
|
||||||
|
this.defaultViewMode = 'cards';
|
||||||
|
|
||||||
|
if (this.$el.attributes['is-forced-view-mode'] != undefined)
|
||||||
|
this.isForcedViewMode = new Boolean(this.$el.attributes['is-forced-view-mode'].value);
|
||||||
|
|
||||||
|
if (this.$el.attributes['enabled-view-modes'] != undefined)
|
||||||
|
this.enabledViewModes = this.$el.attributes['enabled-view-modes'].value.split(',');
|
||||||
|
|
||||||
|
// Options related to hidding elements
|
||||||
|
if (this.$el.attributes['hide-filters'] != undefined)
|
||||||
|
this.hideFilters = this.isParameterTrue('hide-filters');
|
||||||
|
if (this.$el.attributes['hide-hide-filters-button'] != undefined)
|
||||||
|
this.hideHideFiltersButton = this.isParameterTrue('hide-hide-filters-button');
|
||||||
|
if (this.$el.attributes['hide-search'] != undefined)
|
||||||
|
this.hideSearch = this.isParameterTrue('hide-search');
|
||||||
|
if (this.$el.attributes['hide-advanced-search'] != undefined)
|
||||||
|
this.hideAdvancedSearch = this.isParameterTrue('hide-advanced-search');
|
||||||
|
if (this.$el.attributes['hide-displayed-metadata-button'] != undefined)
|
||||||
|
this.hideDisplayedMetadataButton = this.isParameterTrue('hide-displayed-metadata-button');
|
||||||
|
if (this.$el.attributes['hide-sorting-area'] != undefined)
|
||||||
|
this.hideSortingArea = this.isParameterTrue('hide-sorting-area');
|
||||||
|
if (this.$el.attributes['hide-items-thumbnail'] != undefined)
|
||||||
|
this.hideItemsThumbnail = this.isParameterTrue('hide-items-thumbnail');
|
||||||
|
if (this.$el.attributes['hide-sort-by-button'] != undefined)
|
||||||
|
this.hideSortByButton = this.isParameterTrue('hide-sort-by-button');
|
||||||
|
if (this.$el.attributes['hide-exposers-button'] != undefined)
|
||||||
|
this.hideExposersButton = this.isParameterTrue('hide-exposers-button');
|
||||||
|
if (this.$el.attributes['hide-items-per-page-button'] != undefined)
|
||||||
|
this.hideItemsPerPageButton = this.isParameterTrue('hide-items-per-page-button');
|
||||||
|
if (this.$el.attributes['hide-go-to-page-button'] != undefined)
|
||||||
|
this.hideGoToPageButton = this.isParameterTrue('hide-go-to-page-button');
|
||||||
|
if (this.$el.attributes['hide-pagination-area'] != undefined)
|
||||||
|
this.hidePaginationArea = this.isParameterTrue('hide-pagination-area');
|
||||||
|
|
||||||
|
// Other Tweaks
|
||||||
|
if (this.$el.attributes['default-items-per-page'] != undefined)
|
||||||
|
this.defaultItemsPerPage = this.$el.attributes['default-items-per-page'].value;
|
||||||
|
if (this.$el.attributes['show-filters-button-inside-search-control'] != undefined)
|
||||||
|
this.showFiltersButtonInsideSearchControl = this.isParameterTrue('show-filters-button-inside-search-control');
|
||||||
|
if (this.$el.attributes['start-with-filters-hidden'] != undefined)
|
||||||
|
this.startWithFiltersHidden = this.isParameterTrue('start-with-filters-hidden');
|
||||||
|
if (this.$el.attributes['filters-as-modal'] != undefined)
|
||||||
|
this.filtersAsModal = this.isParameterTrue('filters-as-modal');
|
||||||
|
if (this.$el.attributes['show-inline-view-mode-options'] != undefined)
|
||||||
|
this.showInlineViewModeOptions = this.isParameterTrue('show-inline-view-mode-options');
|
||||||
|
if (this.$el.attributes['show-fullscreen-with-view-modes'] != undefined)
|
||||||
|
this.showFullscreenWithViewModes = this.isParameterTrue('show-fullscreen-with-view-modes');
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
isParameterTrue(parameter) {
|
||||||
|
const value = this.$el.attributes[parameter].value;
|
||||||
|
return (value == true || value == 'true' || value == '1' || value == 1) ? true : false;
|
||||||
|
},
|
||||||
|
createSwiperInstance(target, options) {
|
||||||
|
return new Swiper(target, options);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
render: h => h(ThemeSearch)
|
||||||
|
});
|
||||||
|
|
||||||
|
VueItemsList.$mount('#tainacan-items-page');
|
||||||
|
|
||||||
|
listen("load", window, function() {
|
||||||
|
var iconsStyle = document.createElement("style");
|
||||||
|
iconsStyle.setAttribute('type', 'text/css');
|
||||||
|
iconsStyle.innerText = '.tainacan-icon{ opacity: 1 !important; }';
|
||||||
|
document.head.appendChild(iconsStyle);
|
||||||
|
});
|
||||||
|
|
||||||
|
// Initialize Ponyfill for Custom CSS properties
|
||||||
|
cssVars({
|
||||||
|
// Options...
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// This is rendered on the theme side.
|
||||||
|
renderTainacanItemsListComponent();
|
||||||
|
|
||||||
|
// Also if a theme or plugin requested a reset...
|
||||||
|
document.addEventListener("TainacanReloadItemsListComponent", () => {
|
||||||
|
renderTainacanItemsListComponent();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
@ -141,7 +141,5 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"editorScript": "facets-list",
|
"editorScript": "facets-list",
|
||||||
"script": "facets-list-theme",
|
"editorStyle": "facets-list"
|
||||||
"editorStyle": "facets-list",
|
|
||||||
"style": "facets-list"
|
|
||||||
}
|
}
|
||||||
|
|
@ -1,106 +0,0 @@
|
||||||
import Vue from 'vue';
|
|
||||||
import FacetsListTheme from './facets-list-theme.vue';
|
|
||||||
import FacetsListThemeUnit from './facets-list-theme-unit.vue';
|
|
||||||
|
|
||||||
// Vue Dev Tools!
|
|
||||||
Vue.config.devtools = process && process.env && process.env.NODE_ENV === 'development';
|
|
||||||
Vue.component('facets-list-theme-unit', FacetsListThemeUnit);
|
|
||||||
|
|
||||||
// This is rendered on the theme side.
|
|
||||||
document.addEventListener("DOMContentLoaded", () => {
|
|
||||||
|
|
||||||
// Gets all divs with content created by our block;
|
|
||||||
let blocks = document.getElementsByClassName('wp-block-tainacan-facets-list');
|
|
||||||
|
|
||||||
if (blocks) {
|
|
||||||
let blockIds = Object.values(blocks).map((block) => block.id);
|
|
||||||
|
|
||||||
// Creates a new Vue Instance to manage each block isolatelly
|
|
||||||
for (let blockId of blockIds) {
|
|
||||||
|
|
||||||
// Configure Vue logic before passing it to constructor:
|
|
||||||
let vueOptions = {
|
|
||||||
data: {
|
|
||||||
metadatumId: '',
|
|
||||||
metadatumType: '',
|
|
||||||
collectionId: '',
|
|
||||||
collectionSlug: '',
|
|
||||||
parentTermId: null,
|
|
||||||
showImage: true,
|
|
||||||
showItemsCount: true,
|
|
||||||
showSearchBar: false,
|
|
||||||
showLoadMore: false,
|
|
||||||
nameInsideImage: false,
|
|
||||||
linkTermFacetsToTermPage: true,
|
|
||||||
appendChildTerms: false,
|
|
||||||
layout: 'grid',
|
|
||||||
cloudRate: 1,
|
|
||||||
gridMargin: 24,
|
|
||||||
maxFacetsNumber: 12,
|
|
||||||
maxColumnsCount: 5,
|
|
||||||
tainacanApiRoot: '',
|
|
||||||
tainacanBaseUrl: '',
|
|
||||||
tainacanSiteUrl: '',
|
|
||||||
className: ''
|
|
||||||
},
|
|
||||||
render(h){
|
|
||||||
return h(FacetsListTheme, {
|
|
||||||
props: {
|
|
||||||
metadatumId: this.metadatumId,
|
|
||||||
metadatumType: this.metadatumType,
|
|
||||||
collectionId: this.collectionId,
|
|
||||||
collectionSlug: this.collectionSlug,
|
|
||||||
parentTermId: this.parentTermId,
|
|
||||||
showImage: this.showImage,
|
|
||||||
nameInsideImage: this.nameInsideImage,
|
|
||||||
showItemsCount: this.showItemsCount,
|
|
||||||
showSearchBar: this.showSearchBar,
|
|
||||||
showLoadMore: this.showLoadMore,
|
|
||||||
layout: this.layout,
|
|
||||||
cloudRate: this.cloudRate,
|
|
||||||
gridMargin: this.gridMargin,
|
|
||||||
linkTermFacetsToTermPage: this.linkTermFacetsToTermPage,
|
|
||||||
appendChildTerms: this.appendChildTerms,
|
|
||||||
maxFacetsNumber: this.maxFacetsNumber,
|
|
||||||
maxColumnsCount: this.maxColumnsCount,
|
|
||||||
tainacanApiRoot: this.tainacanApiRoot,
|
|
||||||
tainacanBaseUrl: this.tainacanBaseUrl,
|
|
||||||
tainacanSiteUrl: this.tainacanSiteUrl,
|
|
||||||
className: this.className
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
beforeMount () {
|
|
||||||
this.metadatumId = this.$el.attributes['metadatum-id'] != undefined ? this.$el.attributes['metadatum-id'].value : undefined;
|
|
||||||
this.metadatumType = this.$el.attributes['metadatum-type'] != undefined ? this.$el.attributes['metadatum-type'].value : undefined;
|
|
||||||
this.collectionId = this.$el.attributes['collection-id'] != undefined ? this.$el.attributes['collection-id'].value : undefined;
|
|
||||||
this.collectionSlug = this.$el.attributes['collection-slug'] != undefined ? this.$el.attributes['collection-slug'].value : undefined;
|
|
||||||
this.appendChildTerms = this.$el.attributes['append-child-terms'] != undefined ? this.$el.attributes['append-child-terms'].value == 'true' : false;
|
|
||||||
this.parentTermId = this.$el.attributes['parent-term-id'] != undefined ? this.$el.attributes['parent-term-id'].value : undefined;
|
|
||||||
this.showImage = this.$el.attributes['show-image'] != undefined ? this.$el.attributes['show-image'].value == 'true' : true;
|
|
||||||
this.nameInsideImage = this.$el.attributes['name-inside-image'] != undefined ? this.$el.attributes['name-inside-image'].value == 'true' : false;
|
|
||||||
this.showItemsCount = this.$el.attributes['show-items-count'] != undefined ? this.$el.attributes['show-items-count'].value == 'true' : true;
|
|
||||||
this.showSearchBar = this.$el.attributes['show-search-bar'] != undefined ? this.$el.attributes['show-search-bar'].value == 'true' : false;
|
|
||||||
this.showLoadMore = this.$el.attributes['show-load-more'] != undefined ? this.$el.attributes['show-load-more'].value == 'true' : false;
|
|
||||||
this.layout = this.$el.attributes['layout'] != undefined ? this.$el.attributes['layout'].value : undefined;
|
|
||||||
this.cloudRate = this.$el.attributes['cloud-rate'] != undefined ? Number(this.$el.attributes['cloud-rate'].value) : undefined;
|
|
||||||
this.gridMargin = this.$el.attributes['grid-margin'] != undefined ? Number(this.$el.attributes['grid-margin'].value) : undefined;
|
|
||||||
this.linkTermFacetsToTermPage = this.$el.attributes['link-term-facets-to-term-page'] != undefined ? this.$el.attributes['link-term-facets-to-term-page'].value == 'true' : true;
|
|
||||||
this.maxFacetsNumber = this.$el.attributes['max-facets-number'] != undefined ? this.$el.attributes['max-facets-number'].value : undefined;
|
|
||||||
this.maxColumnsCount = this.$el.attributes['max-columns-count'] != undefined ? this.$el.attributes['max-columns-count'].value : 5;
|
|
||||||
this.tainacanApiRoot = this.$el.attributes['tainacan-api-root'] != undefined ? this.$el.attributes['tainacan-api-root'].value : undefined;
|
|
||||||
this.tainacanBaseUrl = this.$el.attributes['tainacan-base-url'] != undefined ? this.$el.attributes['tainacan-base-url'].value : undefined;
|
|
||||||
this.tainacanSiteUrl = this.$el.attributes['tainacan-site-url'] != undefined ? this.$el.attributes['tainacan-site-url'].value : undefined;
|
|
||||||
this.className = this.$el.attributes.class != undefined ? this.$el.attributes.class.value : undefined;
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
__(text, domain) {
|
|
||||||
return wp.i18n.__(text, domain);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
new Vue( Object.assign({ el: '#' + blockId }, vueOptions) );
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
@ -21,6 +21,7 @@ export default function({ attributes, className }) {
|
||||||
appendChildTerms
|
appendChildTerms
|
||||||
} = attributes;
|
} = attributes;
|
||||||
return <div
|
return <div
|
||||||
|
data-module="facets-list"
|
||||||
className={ className }
|
className={ className }
|
||||||
metadatum-id={ metadatumId }
|
metadatum-id={ metadatumId }
|
||||||
metadatum-type={ metadatumType }
|
metadatum-type={ metadatumType }
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,121 @@
|
||||||
|
import Vue from 'vue';
|
||||||
|
import FacetsListTheme from './theme.vue';
|
||||||
|
import FacetsListThemeUnit from './facet-unit.vue';
|
||||||
|
|
||||||
|
export default (element) => {
|
||||||
|
|
||||||
|
// Vue Dev Tools!
|
||||||
|
Vue.config.devtools = process && process.env && process.env.NODE_ENV === 'development';
|
||||||
|
Vue.component('facets-list-theme-unit', FacetsListThemeUnit);
|
||||||
|
|
||||||
|
function renderTainacanFacetsListBlock() {
|
||||||
|
|
||||||
|
// Gets all divs with content created by our block;
|
||||||
|
let blocksElements = element ? [ element ] : document.getElementsByClassName('wp-block-tainacan-facets-list');
|
||||||
|
|
||||||
|
if (blocksElements) {
|
||||||
|
let blocks = Object.values(blocksElements);
|
||||||
|
|
||||||
|
// Checks if this carousel isn't already mounted
|
||||||
|
blocks = blocks.filter((block) => block.classList && !block.classList.contains('has-mounted'));
|
||||||
|
const blockIds = Object.values(blocks).map((block) => block.id);
|
||||||
|
|
||||||
|
// Creates a new Vue Instance to manage each block isolatelly
|
||||||
|
for (let blockId of blockIds) {
|
||||||
|
|
||||||
|
// Configure Vue logic before passing it to constructor:
|
||||||
|
let vueOptions = {
|
||||||
|
data: {
|
||||||
|
metadatumId: '',
|
||||||
|
metadatumType: '',
|
||||||
|
collectionId: '',
|
||||||
|
collectionSlug: '',
|
||||||
|
parentTermId: null,
|
||||||
|
showImage: true,
|
||||||
|
showItemsCount: true,
|
||||||
|
showSearchBar: false,
|
||||||
|
showLoadMore: false,
|
||||||
|
nameInsideImage: false,
|
||||||
|
linkTermFacetsToTermPage: true,
|
||||||
|
appendChildTerms: false,
|
||||||
|
layout: 'grid',
|
||||||
|
cloudRate: 1,
|
||||||
|
gridMargin: 24,
|
||||||
|
maxFacetsNumber: 12,
|
||||||
|
maxColumnsCount: 5,
|
||||||
|
tainacanApiRoot: '',
|
||||||
|
tainacanBaseUrl: '',
|
||||||
|
tainacanSiteUrl: '',
|
||||||
|
className: ''
|
||||||
|
},
|
||||||
|
render(h){
|
||||||
|
return h(FacetsListTheme, {
|
||||||
|
props: {
|
||||||
|
metadatumId: this.metadatumId,
|
||||||
|
metadatumType: this.metadatumType,
|
||||||
|
collectionId: this.collectionId,
|
||||||
|
collectionSlug: this.collectionSlug,
|
||||||
|
parentTermId: this.parentTermId,
|
||||||
|
showImage: this.showImage,
|
||||||
|
nameInsideImage: this.nameInsideImage,
|
||||||
|
showItemsCount: this.showItemsCount,
|
||||||
|
showSearchBar: this.showSearchBar,
|
||||||
|
showLoadMore: this.showLoadMore,
|
||||||
|
layout: this.layout,
|
||||||
|
cloudRate: this.cloudRate,
|
||||||
|
gridMargin: this.gridMargin,
|
||||||
|
linkTermFacetsToTermPage: this.linkTermFacetsToTermPage,
|
||||||
|
appendChildTerms: this.appendChildTerms,
|
||||||
|
maxFacetsNumber: this.maxFacetsNumber,
|
||||||
|
maxColumnsCount: this.maxColumnsCount,
|
||||||
|
tainacanApiRoot: this.tainacanApiRoot,
|
||||||
|
tainacanBaseUrl: this.tainacanBaseUrl,
|
||||||
|
tainacanSiteUrl: this.tainacanSiteUrl,
|
||||||
|
className: this.className
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
beforeMount () {
|
||||||
|
this.metadatumId = this.$el.attributes['metadatum-id'] != undefined ? this.$el.attributes['metadatum-id'].value : undefined;
|
||||||
|
this.metadatumType = this.$el.attributes['metadatum-type'] != undefined ? this.$el.attributes['metadatum-type'].value : undefined;
|
||||||
|
this.collectionId = this.$el.attributes['collection-id'] != undefined ? this.$el.attributes['collection-id'].value : undefined;
|
||||||
|
this.collectionSlug = this.$el.attributes['collection-slug'] != undefined ? this.$el.attributes['collection-slug'].value : undefined;
|
||||||
|
this.appendChildTerms = this.$el.attributes['append-child-terms'] != undefined ? this.$el.attributes['append-child-terms'].value == 'true' : false;
|
||||||
|
this.parentTermId = this.$el.attributes['parent-term-id'] != undefined ? this.$el.attributes['parent-term-id'].value : undefined;
|
||||||
|
this.showImage = this.$el.attributes['show-image'] != undefined ? this.$el.attributes['show-image'].value == 'true' : true;
|
||||||
|
this.nameInsideImage = this.$el.attributes['name-inside-image'] != undefined ? this.$el.attributes['name-inside-image'].value == 'true' : false;
|
||||||
|
this.showItemsCount = this.$el.attributes['show-items-count'] != undefined ? this.$el.attributes['show-items-count'].value == 'true' : true;
|
||||||
|
this.showSearchBar = this.$el.attributes['show-search-bar'] != undefined ? this.$el.attributes['show-search-bar'].value == 'true' : false;
|
||||||
|
this.showLoadMore = this.$el.attributes['show-load-more'] != undefined ? this.$el.attributes['show-load-more'].value == 'true' : false;
|
||||||
|
this.layout = this.$el.attributes['layout'] != undefined ? this.$el.attributes['layout'].value : undefined;
|
||||||
|
this.cloudRate = this.$el.attributes['cloud-rate'] != undefined ? Number(this.$el.attributes['cloud-rate'].value) : undefined;
|
||||||
|
this.gridMargin = this.$el.attributes['grid-margin'] != undefined ? Number(this.$el.attributes['grid-margin'].value) : undefined;
|
||||||
|
this.linkTermFacetsToTermPage = this.$el.attributes['link-term-facets-to-term-page'] != undefined ? this.$el.attributes['link-term-facets-to-term-page'].value == 'true' : true;
|
||||||
|
this.maxFacetsNumber = this.$el.attributes['max-facets-number'] != undefined ? this.$el.attributes['max-facets-number'].value : undefined;
|
||||||
|
this.maxColumnsCount = this.$el.attributes['max-columns-count'] != undefined ? this.$el.attributes['max-columns-count'].value : 5;
|
||||||
|
this.tainacanApiRoot = this.$el.attributes['tainacan-api-root'] != undefined ? this.$el.attributes['tainacan-api-root'].value : undefined;
|
||||||
|
this.tainacanBaseUrl = this.$el.attributes['tainacan-base-url'] != undefined ? this.$el.attributes['tainacan-base-url'].value : undefined;
|
||||||
|
this.tainacanSiteUrl = this.$el.attributes['tainacan-site-url'] != undefined ? this.$el.attributes['tainacan-site-url'].value : undefined;
|
||||||
|
this.className = this.$el.attributes.class != undefined ? this.$el.attributes.class.value : undefined;
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
__(text, domain) {
|
||||||
|
return wp.i18n.__(text, domain);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
new Vue( Object.assign({ el: '#' + blockId }, vueOptions) );
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// This is rendered on the theme side.
|
||||||
|
renderTainacanFacetsListBlock();
|
||||||
|
|
||||||
|
// Also if a theme or plugin requested a reset...
|
||||||
|
document.addEventListener("DOMContentLoaded", () => {
|
||||||
|
renderTainacanFacetsListBlock();
|
||||||
|
});
|
||||||
|
|
||||||
|
}
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<div :class="className">
|
<div :class="className + ' has-mounted'">
|
||||||
<div
|
<div
|
||||||
v-if="showSearchBar"
|
v-if="showSearchBar"
|
||||||
class="facets-search-bar">
|
class="facets-search-bar">
|
||||||
|
|
@ -146,7 +146,5 @@
|
||||||
"multiple": false
|
"multiple": false
|
||||||
},
|
},
|
||||||
"editorScript": "item-submission-form",
|
"editorScript": "item-submission-form",
|
||||||
"script": "tainacan-item-submission",
|
"editorStyle": "item-submission-form"
|
||||||
"editorStyle": "item-submission-form",
|
|
||||||
"style": "item-submission-form"
|
|
||||||
}
|
}
|
||||||
|
|
@ -44,7 +44,8 @@ export default function({ attributes, className }) {
|
||||||
'--tainacan-primary': primaryColor,
|
'--tainacan-primary': primaryColor,
|
||||||
'--tainacan-secondary': secondaryColor
|
'--tainacan-secondary': secondaryColor
|
||||||
}}
|
}}
|
||||||
className={ className }>
|
className={ className }
|
||||||
|
data-module="item-submission-form">
|
||||||
<div
|
<div
|
||||||
id="tainacan-item-submission-form"
|
id="tainacan-item-submission-form"
|
||||||
collection-id={ collectionId }
|
collection-id={ collectionId }
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,211 @@
|
||||||
|
// Main imports
|
||||||
|
import Vue from 'vue';
|
||||||
|
import Buefy from 'buefy';
|
||||||
|
import VTooltip from 'v-tooltip';
|
||||||
|
import cssVars from 'css-vars-ponyfill';
|
||||||
|
import VueTheMask from 'vue-the-mask';
|
||||||
|
|
||||||
|
// Metadata Types
|
||||||
|
import Text from '../../../admin/components/metadata-types/text/Text.vue';
|
||||||
|
import Textarea from '../../../admin/components/metadata-types/textarea/Textarea.vue';
|
||||||
|
import Selectbox from '../../../admin/components/metadata-types/selectbox/Selectbox.vue';
|
||||||
|
import Numeric from '../../../admin/components/metadata-types/numeric/Numeric.vue';
|
||||||
|
import Date from '../../../admin/components/metadata-types/date/Date.vue';
|
||||||
|
import Relationship from '../../../admin/components/metadata-types/relationship/Relationship.vue';
|
||||||
|
import Taxonomy from '../../../admin/components/metadata-types/taxonomy/Taxonomy.vue';
|
||||||
|
import Compound from '../../../admin/components/metadata-types/compound/Compound.vue';
|
||||||
|
import User from '../../../admin/components/metadata-types/user/User.vue';
|
||||||
|
|
||||||
|
// Main components
|
||||||
|
import ItemSubmissionForm from '../../../item-submission/pages/item-submission-form.vue';
|
||||||
|
import ItemSubmission from '../../../item-submission/item-submission.vue';
|
||||||
|
|
||||||
|
// Remaining imports
|
||||||
|
import TainacanFormItem from '../../../admin/components/metadata-types/tainacan-form-item.vue';
|
||||||
|
import HelpButton from '../../../admin/components/other/help-button.vue';
|
||||||
|
import store from '../../../admin/js/store/store';
|
||||||
|
import { I18NPlugin, UserPrefsPlugin, RouterHelperPlugin, ConsolePlugin, StatusHelperPlugin, CommentsStatusHelperPlugin } from '../../../admin/js/admin-utilities';
|
||||||
|
|
||||||
|
export default (element) => {
|
||||||
|
function renderItemSubmissionForm() {
|
||||||
|
|
||||||
|
// Vue Dev Tools!
|
||||||
|
Vue.config.devtools = process && process.env && process.env.NODE_ENV === 'development';
|
||||||
|
|
||||||
|
// Mount only if the div exists
|
||||||
|
if (element || document.getElementById('tainacan-item-submission-form')) {
|
||||||
|
|
||||||
|
|
||||||
|
// Display Icons only once everything is loaded
|
||||||
|
function listen(evnt, elem, func) {
|
||||||
|
if (elem.addEventListener) // W3C DOM
|
||||||
|
elem.addEventListener(evnt,func,false);
|
||||||
|
else if (elem.attachEvent) { // IE DOM
|
||||||
|
var r = elem.attachEvent("on"+evnt, func);
|
||||||
|
return r;
|
||||||
|
} else if (document.head) {
|
||||||
|
var iconHideStyle = document.createElement("style");
|
||||||
|
iconHideStyle.innerText = '.tainacan-icon{ opacity: 1 !important; }';
|
||||||
|
document.head.appendChild(iconHideStyle);
|
||||||
|
} else {
|
||||||
|
var iconHideStyle = document.createElement("style");
|
||||||
|
iconHideStyle.innerText = '.tainacan-icon{ opacity: 1 !important; }';
|
||||||
|
document.getElementsByTagName("head")[0].appendChild(iconHideStyle);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Registers Extra Vue Plugins passed to the window.tainacan_extra_plugins */
|
||||||
|
if (typeof window.tainacan_extra_plugins != "undefined") {
|
||||||
|
for (let [extraVuePluginName, extraVuePluginObject] of Object.entries(window.tainacan_extra_plugins))
|
||||||
|
Vue.use(extraVuePluginObject);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Configure and Register Plugins
|
||||||
|
Vue.use(Buefy, {
|
||||||
|
defaultTooltipAnimated: true
|
||||||
|
});
|
||||||
|
Vue.use(VTooltip);
|
||||||
|
Vue.use(I18NPlugin);
|
||||||
|
Vue.use(UserPrefsPlugin);
|
||||||
|
Vue.use(StatusHelperPlugin);
|
||||||
|
Vue.use(RouterHelperPlugin);
|
||||||
|
Vue.use(ConsolePlugin, {visual: false});
|
||||||
|
Vue.use(VueTheMask);
|
||||||
|
Vue.use(CommentsStatusHelperPlugin);
|
||||||
|
|
||||||
|
/* Registers Extra Vue Components passed to the window.tainacan_extra_components */
|
||||||
|
if (typeof window.tainacan_extra_components != "undefined") {
|
||||||
|
for (let [extraVueComponentName, extraVueComponentObject] of Object.entries(window.tainacan_extra_components)) {
|
||||||
|
Vue.component(extraVueComponentName, extraVueComponentObject);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Metadata */
|
||||||
|
Vue.component('tainacan-text', Text);
|
||||||
|
Vue.component('tainacan-textarea', Textarea);
|
||||||
|
Vue.component('tainacan-selectbox', Selectbox);
|
||||||
|
Vue.component('tainacan-numeric', Numeric);
|
||||||
|
Vue.component('tainacan-date', Date);
|
||||||
|
Vue.component('tainacan-relationship', Relationship);
|
||||||
|
Vue.component('tainacan-taxonomy', Taxonomy);
|
||||||
|
Vue.component('tainacan-compound', Compound);
|
||||||
|
Vue.component('tainacan-user', User);
|
||||||
|
|
||||||
|
/* Main page component */
|
||||||
|
Vue.component('item-submission-form', ItemSubmissionForm);
|
||||||
|
Vue.component('item-submission', ItemSubmission);
|
||||||
|
|
||||||
|
/* Others */
|
||||||
|
Vue.component('tainacan-form-item', TainacanFormItem);
|
||||||
|
Vue.component('help-button', HelpButton);
|
||||||
|
|
||||||
|
const VueItemSubmission = new Vue({
|
||||||
|
store,
|
||||||
|
data: {
|
||||||
|
collectionId: '',
|
||||||
|
hideFileModalButton: false,
|
||||||
|
hideTextModalButton: false,
|
||||||
|
hideLinkModalButton: false,
|
||||||
|
hideThumbnailSection: false,
|
||||||
|
hideAttachmentsSection: false,
|
||||||
|
showAllowCommentsSection: false,
|
||||||
|
hideHelpButtons: false,
|
||||||
|
hideMetadataTypes: false,
|
||||||
|
hideCollapses: false,
|
||||||
|
enabledMetadata: [],
|
||||||
|
sentFormHeading: '',
|
||||||
|
sentFormMessage: '',
|
||||||
|
documentSectionLabel: '',
|
||||||
|
thumbnailSectionLabel: '',
|
||||||
|
attachmentsSectionLabel: '',
|
||||||
|
metadataSectionLabel: '',
|
||||||
|
showItemLinkButton: false,
|
||||||
|
itemLinkButtonLabel: '',
|
||||||
|
helpInfoBellowLabel: false
|
||||||
|
},
|
||||||
|
beforeMount () {
|
||||||
|
// Collection source settings
|
||||||
|
if (this.$el.attributes['collection-id'] != undefined)
|
||||||
|
this.collectionId = this.$el.attributes['collection-id'].value;
|
||||||
|
|
||||||
|
// Elements shown on form
|
||||||
|
if (this.$el.attributes['hide-file-modal-button'] != undefined)
|
||||||
|
this.hideFileModalButton = this.isParameterTrue('hide-file-modal-button');
|
||||||
|
if (this.$el.attributes['hide-text-modal-button'] != undefined)
|
||||||
|
this.hideTextModalButton = this.isParameterTrue('hide-text-modal-button');
|
||||||
|
if (this.$el.attributes['hide-link-modal-button'] != undefined)
|
||||||
|
this.hideLinkModalButton = this.isParameterTrue('hide-link-modal-button');
|
||||||
|
if (this.$el.attributes['hide-thumbnail-section'] != undefined)
|
||||||
|
this.hideThumbnailSection = this.isParameterTrue('hide-thumbnail-section');
|
||||||
|
if (this.$el.attributes['hide-attachments-section'] != undefined)
|
||||||
|
this.hideAttachmentsSection = this.isParameterTrue('hide-attachments-section');
|
||||||
|
if (this.$el.attributes['show-allow-comments-section'] != undefined)
|
||||||
|
this.showAllowCommentsSection = this.isParameterTrue('show-allow-comments-section');
|
||||||
|
if (this.$el.attributes['hide-collapses'] != undefined)
|
||||||
|
this.hideCollapses = this.isParameterTrue('hide-collapses');
|
||||||
|
if (this.$el.attributes['hide-help-buttons'] != undefined)
|
||||||
|
this.hideHelpButtons = this.isParameterTrue('hide-help-buttons');
|
||||||
|
if (this.$el.attributes['hide-metadata-types'] != undefined)
|
||||||
|
this.hideMetadataTypes = this.isParameterTrue('hide-metadata-types');
|
||||||
|
if (this.$el.attributes['help-info-bellow-label'] != undefined)
|
||||||
|
this.helpInfoBellowLabel = this.isParameterTrue('help-info-bellow-label');
|
||||||
|
|
||||||
|
// Form sections labels
|
||||||
|
if (this.$el.attributes['document-section-label'] != undefined)
|
||||||
|
this.documentSectionLabel = this.$el.attributes['document-section-label'].value;
|
||||||
|
if (this.$el.attributes['thumbnail-section-label'] != undefined)
|
||||||
|
this.thumbnailSectionLabel = this.$el.attributes['thumbnail-section-label'].value;
|
||||||
|
if (this.$el.attributes['attachments-section-label'] != undefined)
|
||||||
|
this.attachmentsSectionLabel = this.$el.attributes['attachments-section-label'].value;
|
||||||
|
if (this.$el.attributes['metadata-section-label'] != undefined)
|
||||||
|
this.metadataSectionLabel = this.$el.attributes['metadata-section-label'].value;
|
||||||
|
|
||||||
|
// Form submission feedback messages
|
||||||
|
if (this.$el.attributes['sent-form-heading'] != undefined)
|
||||||
|
this.sentFormHeading = this.$el.attributes['sent-form-heading'].value;
|
||||||
|
if (this.$el.attributes['sent-form-message'] != undefined)
|
||||||
|
this.sentFormMessage = this.$el.attributes['sent-form-message'].value;
|
||||||
|
if (this.$el.attributes['item-link-button-label'] != undefined)
|
||||||
|
this.itemLinkButtonLabel = this.$el.attributes['item-link-button-label'].value;
|
||||||
|
if (this.$el.attributes['show-item-link-button'] != undefined)
|
||||||
|
this.showItemLinkButton = this.isParameterTrue('show-item-link-button');
|
||||||
|
|
||||||
|
// List of metadata
|
||||||
|
if (this.$el.attributes['enabled-metadata'] != undefined && this.$el.attributes['enabled-metadata'].value)
|
||||||
|
this.enabledMetadata = this.$el.attributes['enabled-metadata'].value.split(',');
|
||||||
|
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
isParameterTrue(parameter) {
|
||||||
|
const value = this.$el.attributes[parameter].value;
|
||||||
|
return (value == true || value == 'true' || value == '1' || value == 1) ? true : false;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
render: h => h(ItemSubmission)
|
||||||
|
});
|
||||||
|
|
||||||
|
VueItemSubmission.$mount('#tainacan-item-submission-form');
|
||||||
|
|
||||||
|
listen("load", window, function() {
|
||||||
|
var iconsStyle = document.createElement("style");
|
||||||
|
iconsStyle.setAttribute('type', 'text/css');
|
||||||
|
iconsStyle.innerText = '.tainacan-icon{ opacity: 1 !important; }';
|
||||||
|
document.head.appendChild(iconsStyle);
|
||||||
|
});
|
||||||
|
|
||||||
|
// Initialize Ponyfill for Custom CSS properties
|
||||||
|
cssVars({
|
||||||
|
// Options...
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
// This is rendered on the theme side.
|
||||||
|
renderItemSubmissionForm();
|
||||||
|
|
||||||
|
// Also if a theme or plugin requested a reset...
|
||||||
|
document.addEventListener("TainacanReloadItemSubmissionForm", () => {
|
||||||
|
renderItemSubmissionForm();
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
@ -93,6 +93,5 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"editorScript": "items-list",
|
"editorScript": "items-list",
|
||||||
"editorStyle": "items-list",
|
"editorStyle": "items-list"
|
||||||
"style": "items-list"
|
|
||||||
}
|
}
|
||||||
|
|
@ -1,4 +1,4 @@
|
||||||
export default function({ attributes, className }) {
|
export default function({ attributes, className }) {
|
||||||
const { content } = attributes;
|
const { content } = attributes;
|
||||||
return <div className={className}>{ content }</div>
|
return <div data-module="items-list" className={className}>{ content }</div>
|
||||||
};
|
};
|
||||||
|
|
@ -0,0 +1,3 @@
|
||||||
|
import './style.scss';
|
||||||
|
|
||||||
|
export default () => {}
|
||||||
|
|
@ -98,7 +98,5 @@
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
"editorScript": "search-bar",
|
"editorScript": "search-bar",
|
||||||
"script": "search-bar-theme",
|
"editorStyle": "search-bar"
|
||||||
"editorStyle": "search-bar",
|
|
||||||
"style": "search-bar"
|
|
||||||
}
|
}
|
||||||
|
|
@ -1,4 +1,4 @@
|
||||||
export default function({ attributes, className }) {
|
export default function({ attributes, className }) {
|
||||||
const { content } = attributes;
|
const { content } = attributes;
|
||||||
return <div className={ className }>{ content }</div>
|
return <div data-module="search-bar" className={ className }>{ content }</div>
|
||||||
}
|
}
|
||||||
|
|
@ -1,6 +1,9 @@
|
||||||
document.addEventListener("DOMContentLoaded",() => {
|
import './style.scss';
|
||||||
let form = document.getElementById('tainacan-search-bar-block');
|
|
||||||
|
export default (element) => {
|
||||||
|
let form = (element && element.children && element.children[0] && element.children[0].children && element.children[0].children[0]) ? element.children[0].children[0] : document.getElementById('tainacan-search-bar-block');
|
||||||
if (form) {
|
if (form) {
|
||||||
|
|
||||||
form.addEventListener('submit', ((e) => {
|
form.addEventListener('submit', ((e) => {
|
||||||
e.preventDefault();
|
e.preventDefault();
|
||||||
let input = document.getElementById('tainacan-search-bar-block_input');
|
let input = document.getElementById('tainacan-search-bar-block_input');
|
||||||
|
|
@ -11,4 +14,4 @@ document.addEventListener("DOMContentLoaded",() => {
|
||||||
}
|
}
|
||||||
}));
|
}));
|
||||||
}
|
}
|
||||||
}, false);
|
}
|
||||||
|
|
@ -0,0 +1,65 @@
|
||||||
|
import * as conditioner from 'conditioner-core/conditioner-core.esm';
|
||||||
|
|
||||||
|
// Checks if document is loaded
|
||||||
|
const performWhenDocumentIsLoaded = callback => {
|
||||||
|
if (/comp|inter|loaded/.test(document.readyState))
|
||||||
|
cb();
|
||||||
|
else
|
||||||
|
document.addEventListener('DOMContentLoaded', callback, false);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Adds data-module to blocks inserted previous to Tainacan 0.18.4
|
||||||
|
const addDataModuleToOldBlocks = () => {
|
||||||
|
const tainacanBlocks = [
|
||||||
|
'faceted-search',
|
||||||
|
'item-submission-form',
|
||||||
|
'items-list',
|
||||||
|
'collections-list',
|
||||||
|
'terms-list',
|
||||||
|
'search-bar',
|
||||||
|
'facets-list',
|
||||||
|
'dynamic-items-list',
|
||||||
|
'carousel-items-list',
|
||||||
|
'carousel-terms-list',
|
||||||
|
'carousel-collections-list'
|
||||||
|
];
|
||||||
|
// Looks for Tainacan Blocks based on their classes.
|
||||||
|
tainacanBlocks.forEach((tainacanBlockSlug) => {
|
||||||
|
let existingBlocksOnPage = document.getElementsByClassName(`wp-block-tainacan-${tainacanBlockSlug}`);
|
||||||
|
[...existingBlocksOnPage].forEach((blockElement) => {
|
||||||
|
if ( !blockElement.getAttribute('data-module') )
|
||||||
|
blockElement.setAttribute('data-module', tainacanBlockSlug);
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
// Extra case for the items list, as the theme wrapper does not uses gutenberg classes
|
||||||
|
let existingItemListOnPage = document.getElementById('tainacan-items-page');
|
||||||
|
if ( existingItemListOnPage && !existingItemListOnPage.getAttribute('data-module') )
|
||||||
|
existingItemListOnPage.setAttribute('data-module', 'faceted-search');
|
||||||
|
}
|
||||||
|
|
||||||
|
performWhenDocumentIsLoaded(() => {
|
||||||
|
|
||||||
|
addDataModuleToOldBlocks();
|
||||||
|
|
||||||
|
conditioner.addPlugin({
|
||||||
|
// converts module aliases to paths
|
||||||
|
moduleSetName: name => `./${name}/theme.js`,
|
||||||
|
|
||||||
|
// use default exports as constructor
|
||||||
|
moduleGetConstructor: module => module.default,
|
||||||
|
|
||||||
|
// override the import (this makes webpack bundle all the dynamically included files as well)
|
||||||
|
// https://webpack.js.org/api/module-methods/#import-
|
||||||
|
// - set to "eager" to create a single chunk for all modules
|
||||||
|
// - set to "lazy" to create a separate chunk for each module
|
||||||
|
moduleImport: name => import(
|
||||||
|
/* webpackMode: "lazy" */
|
||||||
|
/* webpackInclude: /theme\.js$/ */
|
||||||
|
/* webpackChunkName: "tainacan-chunks-" */
|
||||||
|
`${name}`)
|
||||||
|
});
|
||||||
|
|
||||||
|
// lets go!
|
||||||
|
conditioner.hydrate(document.documentElement);
|
||||||
|
});
|
||||||
|
|
@ -89,6 +89,5 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"editorScript": "terms-list",
|
"editorScript": "terms-list",
|
||||||
"editorStyle": "terms-list",
|
"editorStyle": "terms-list"
|
||||||
"style": "terms-list"
|
|
||||||
}
|
}
|
||||||
|
|
@ -1,4 +1,4 @@
|
||||||
export default function({ attributes, className }){
|
export default function({ attributes, className }){
|
||||||
const { content } = attributes;
|
const { content } = attributes;
|
||||||
return <div className={className}>{ content }</div>
|
return <div data-module="terms-list" className={className}>{ content }</div>
|
||||||
};
|
};
|
||||||
|
|
@ -0,0 +1,3 @@
|
||||||
|
import './style.scss';
|
||||||
|
|
||||||
|
export default () => {}
|
||||||
|
|
@ -1,200 +0,0 @@
|
||||||
// Main imports
|
|
||||||
import Vue from 'vue';
|
|
||||||
import Buefy from 'buefy';
|
|
||||||
import VTooltip from 'v-tooltip';
|
|
||||||
import cssVars from 'css-vars-ponyfill';
|
|
||||||
import VueTheMask from 'vue-the-mask';
|
|
||||||
|
|
||||||
// Vue Dev Tools!
|
|
||||||
Vue.config.devtools = process && process.env && process.env.NODE_ENV === 'development';
|
|
||||||
|
|
||||||
// Metadata Types
|
|
||||||
import Text from '../../admin/components/metadata-types/text/Text.vue';
|
|
||||||
import Textarea from '../../admin/components/metadata-types/textarea/Textarea.vue';
|
|
||||||
import Selectbox from '../../admin/components/metadata-types/selectbox/Selectbox.vue';
|
|
||||||
import Numeric from '../../admin/components/metadata-types/numeric/Numeric.vue';
|
|
||||||
import Date from '../../admin/components/metadata-types/date/Date.vue';
|
|
||||||
import Relationship from '../../admin/components/metadata-types/relationship/Relationship.vue';
|
|
||||||
import Taxonomy from '../../admin/components/metadata-types/taxonomy/Taxonomy.vue';
|
|
||||||
import Compound from '../../admin/components/metadata-types/compound/Compound.vue';
|
|
||||||
import User from '../../admin/components/metadata-types/user/User.vue';
|
|
||||||
|
|
||||||
// Main components
|
|
||||||
import ItemSubmissionForm from '../pages/item-submission-form.vue';
|
|
||||||
import ItemSubmission from '../item-submission.vue';
|
|
||||||
|
|
||||||
// Remaining imports
|
|
||||||
import TainacanFormItem from '../../admin/components/metadata-types/tainacan-form-item.vue';
|
|
||||||
import HelpButton from '../../admin/components/other/help-button.vue';
|
|
||||||
import store from '../../admin/js/store/store';
|
|
||||||
import { I18NPlugin, UserPrefsPlugin, RouterHelperPlugin, ConsolePlugin, StatusHelperPlugin, CommentsStatusHelperPlugin } from '../../admin/js/admin-utilities';
|
|
||||||
|
|
||||||
document.addEventListener("DOMContentLoaded", () => {
|
|
||||||
|
|
||||||
// Mount only if the div exists
|
|
||||||
if (document.getElementById('tainacan-item-submission-form')) {
|
|
||||||
|
|
||||||
|
|
||||||
// Display Icons only once everything is loaded
|
|
||||||
function listen(evnt, elem, func) {
|
|
||||||
if (elem.addEventListener) // W3C DOM
|
|
||||||
elem.addEventListener(evnt,func,false);
|
|
||||||
else if (elem.attachEvent) { // IE DOM
|
|
||||||
var r = elem.attachEvent("on"+evnt, func);
|
|
||||||
return r;
|
|
||||||
} else if (document.head) {
|
|
||||||
var iconHideStyle = document.createElement("style");
|
|
||||||
iconHideStyle.innerText = '.tainacan-icon{ opacity: 1 !important; }';
|
|
||||||
document.head.appendChild(iconHideStyle);
|
|
||||||
} else {
|
|
||||||
var iconHideStyle = document.createElement("style");
|
|
||||||
iconHideStyle.innerText = '.tainacan-icon{ opacity: 1 !important; }';
|
|
||||||
document.getElementsByTagName("head")[0].appendChild(iconHideStyle);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Registers Extra Vue Plugins passed to the window.tainacan_extra_plugins */
|
|
||||||
if (typeof window.tainacan_extra_plugins != "undefined") {
|
|
||||||
for (let [extraVuePluginName, extraVuePluginObject] of Object.entries(window.tainacan_extra_plugins))
|
|
||||||
Vue.use(extraVuePluginObject);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Configure and Register Plugins
|
|
||||||
Vue.use(Buefy, {
|
|
||||||
defaultTooltipAnimated: true
|
|
||||||
});
|
|
||||||
Vue.use(VTooltip);
|
|
||||||
Vue.use(I18NPlugin);
|
|
||||||
Vue.use(UserPrefsPlugin);
|
|
||||||
Vue.use(StatusHelperPlugin);
|
|
||||||
Vue.use(RouterHelperPlugin);
|
|
||||||
Vue.use(ConsolePlugin, {visual: false});
|
|
||||||
Vue.use(VueTheMask);
|
|
||||||
Vue.use(CommentsStatusHelperPlugin);
|
|
||||||
|
|
||||||
/* Registers Extra Vue Components passed to the window.tainacan_extra_components */
|
|
||||||
if (typeof window.tainacan_extra_components != "undefined") {
|
|
||||||
for (let [extraVueComponentName, extraVueComponentObject] of Object.entries(window.tainacan_extra_components)) {
|
|
||||||
Vue.component(extraVueComponentName, extraVueComponentObject);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Metadata */
|
|
||||||
Vue.component('tainacan-text', Text);
|
|
||||||
Vue.component('tainacan-textarea', Textarea);
|
|
||||||
Vue.component('tainacan-selectbox', Selectbox);
|
|
||||||
Vue.component('tainacan-numeric', Numeric);
|
|
||||||
Vue.component('tainacan-date', Date);
|
|
||||||
Vue.component('tainacan-relationship', Relationship);
|
|
||||||
Vue.component('tainacan-taxonomy', Taxonomy);
|
|
||||||
Vue.component('tainacan-compound', Compound);
|
|
||||||
Vue.component('tainacan-user', User);
|
|
||||||
|
|
||||||
/* Main page component */
|
|
||||||
Vue.component('item-submission-form', ItemSubmissionForm);
|
|
||||||
Vue.component('item-submission', ItemSubmission);
|
|
||||||
|
|
||||||
/* Others */
|
|
||||||
Vue.component('tainacan-form-item', TainacanFormItem);
|
|
||||||
Vue.component('help-button', HelpButton);
|
|
||||||
|
|
||||||
const VueItemSubmission = new Vue({
|
|
||||||
store,
|
|
||||||
data: {
|
|
||||||
collectionId: '',
|
|
||||||
hideFileModalButton: false,
|
|
||||||
hideTextModalButton: false,
|
|
||||||
hideLinkModalButton: false,
|
|
||||||
hideThumbnailSection: false,
|
|
||||||
hideAttachmentsSection: false,
|
|
||||||
showAllowCommentsSection: false,
|
|
||||||
hideHelpButtons: false,
|
|
||||||
hideMetadataTypes: false,
|
|
||||||
hideCollapses: false,
|
|
||||||
enabledMetadata: [],
|
|
||||||
sentFormHeading: '',
|
|
||||||
sentFormMessage: '',
|
|
||||||
documentSectionLabel: '',
|
|
||||||
thumbnailSectionLabel: '',
|
|
||||||
attachmentsSectionLabel: '',
|
|
||||||
metadataSectionLabel: '',
|
|
||||||
showItemLinkButton: false,
|
|
||||||
itemLinkButtonLabel: '',
|
|
||||||
helpInfoBellowLabel: false
|
|
||||||
},
|
|
||||||
beforeMount () {
|
|
||||||
// Collection source settings
|
|
||||||
if (this.$el.attributes['collection-id'] != undefined)
|
|
||||||
this.collectionId = this.$el.attributes['collection-id'].value;
|
|
||||||
|
|
||||||
// Elements shown on form
|
|
||||||
if (this.$el.attributes['hide-file-modal-button'] != undefined)
|
|
||||||
this.hideFileModalButton = this.isParameterTrue('hide-file-modal-button');
|
|
||||||
if (this.$el.attributes['hide-text-modal-button'] != undefined)
|
|
||||||
this.hideTextModalButton = this.isParameterTrue('hide-text-modal-button');
|
|
||||||
if (this.$el.attributes['hide-link-modal-button'] != undefined)
|
|
||||||
this.hideLinkModalButton = this.isParameterTrue('hide-link-modal-button');
|
|
||||||
if (this.$el.attributes['hide-thumbnail-section'] != undefined)
|
|
||||||
this.hideThumbnailSection = this.isParameterTrue('hide-thumbnail-section');
|
|
||||||
if (this.$el.attributes['hide-attachments-section'] != undefined)
|
|
||||||
this.hideAttachmentsSection = this.isParameterTrue('hide-attachments-section');
|
|
||||||
if (this.$el.attributes['show-allow-comments-section'] != undefined)
|
|
||||||
this.showAllowCommentsSection = this.isParameterTrue('show-allow-comments-section');
|
|
||||||
if (this.$el.attributes['hide-collapses'] != undefined)
|
|
||||||
this.hideCollapses = this.isParameterTrue('hide-collapses');
|
|
||||||
if (this.$el.attributes['hide-help-buttons'] != undefined)
|
|
||||||
this.hideHelpButtons = this.isParameterTrue('hide-help-buttons');
|
|
||||||
if (this.$el.attributes['hide-metadata-types'] != undefined)
|
|
||||||
this.hideMetadataTypes = this.isParameterTrue('hide-metadata-types');
|
|
||||||
if (this.$el.attributes['help-info-bellow-label'] != undefined)
|
|
||||||
this.helpInfoBellowLabel = this.isParameterTrue('help-info-bellow-label');
|
|
||||||
|
|
||||||
// Form sections labels
|
|
||||||
if (this.$el.attributes['document-section-label'] != undefined)
|
|
||||||
this.documentSectionLabel = this.$el.attributes['document-section-label'].value;
|
|
||||||
if (this.$el.attributes['thumbnail-section-label'] != undefined)
|
|
||||||
this.thumbnailSectionLabel = this.$el.attributes['thumbnail-section-label'].value;
|
|
||||||
if (this.$el.attributes['attachments-section-label'] != undefined)
|
|
||||||
this.attachmentsSectionLabel = this.$el.attributes['attachments-section-label'].value;
|
|
||||||
if (this.$el.attributes['metadata-section-label'] != undefined)
|
|
||||||
this.metadataSectionLabel = this.$el.attributes['metadata-section-label'].value;
|
|
||||||
|
|
||||||
// Form submission feedback messages
|
|
||||||
if (this.$el.attributes['sent-form-heading'] != undefined)
|
|
||||||
this.sentFormHeading = this.$el.attributes['sent-form-heading'].value;
|
|
||||||
if (this.$el.attributes['sent-form-message'] != undefined)
|
|
||||||
this.sentFormMessage = this.$el.attributes['sent-form-message'].value;
|
|
||||||
if (this.$el.attributes['item-link-button-label'] != undefined)
|
|
||||||
this.itemLinkButtonLabel = this.$el.attributes['item-link-button-label'].value;
|
|
||||||
if (this.$el.attributes['show-item-link-button'] != undefined)
|
|
||||||
this.showItemLinkButton = this.isParameterTrue('show-item-link-button');
|
|
||||||
|
|
||||||
// List of metadata
|
|
||||||
if (this.$el.attributes['enabled-metadata'] != undefined && this.$el.attributes['enabled-metadata'].value)
|
|
||||||
this.enabledMetadata = this.$el.attributes['enabled-metadata'].value.split(',');
|
|
||||||
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
isParameterTrue(parameter) {
|
|
||||||
const value = this.$el.attributes[parameter].value;
|
|
||||||
return (value == true || value == 'true' || value == '1' || value == 1) ? true : false;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
render: h => h(ItemSubmission)
|
|
||||||
});
|
|
||||||
|
|
||||||
VueItemSubmission.$mount('#tainacan-item-submission-form');
|
|
||||||
|
|
||||||
listen("load", window, function() {
|
|
||||||
var iconsStyle = document.createElement("style");
|
|
||||||
iconsStyle.setAttribute('type', 'text/css');
|
|
||||||
iconsStyle.innerText = '.tainacan-icon{ opacity: 1 !important; }';
|
|
||||||
document.head.appendChild(iconsStyle);
|
|
||||||
});
|
|
||||||
|
|
||||||
// Initialize Ponyfill for Custom CSS properties
|
|
||||||
cssVars({
|
|
||||||
// Options...
|
|
||||||
});
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
@ -512,7 +512,17 @@ export default {
|
||||||
return this.getItemSubmissionMetadata();
|
return this.getItemSubmissionMetadata();
|
||||||
},
|
},
|
||||||
metadatumList() {
|
metadatumList() {
|
||||||
return (this.itemSubmissionMetadata && this.itemSubmissionMetadata.length) ? JSON.parse(JSON.stringify(this.getMetadata().map((metadatum) => { return { metadatum: metadatum, item: {}, value: this.itemSubmissionMetadata.find((aMetadatum) => aMetadatum.metadatum_id == metadatum.id).value } } ))) : [];
|
return (this.itemSubmissionMetadata && this.itemSubmissionMetadata.length) ?
|
||||||
|
JSON.parse(JSON.stringify(
|
||||||
|
this.getMetadata().map((metadatum) => {
|
||||||
|
const metadatumValue = this.itemSubmissionMetadata.find((aMetadatum) => aMetadatum.metadatum_id == metadatum.id);
|
||||||
|
return {
|
||||||
|
metadatum: metadatum,
|
||||||
|
item: {},
|
||||||
|
value: metadatumValue && metadatumValue.value ? metadatumValue.value : ''
|
||||||
|
}
|
||||||
|
} )
|
||||||
|
)) : [];
|
||||||
},
|
},
|
||||||
formErrors() {
|
formErrors() {
|
||||||
return eventBusItemMetadata && eventBusItemMetadata.errors && eventBusItemMetadata.errors.length ? eventBusItemMetadata.errors : []
|
return eventBusItemMetadata && eventBusItemMetadata.errors && eventBusItemMetadata.errors.length ? eventBusItemMetadata.errors : []
|
||||||
|
|
|
||||||
|
|
@ -381,7 +381,7 @@ export default {
|
||||||
|
|
||||||
for (let newItem of ((this.goingRight === true || this.goingRight === undefined) ? JSON.parse(JSON.stringify(this.items)) : JSON.parse(JSON.stringify(this.items)).reverse())) {
|
for (let newItem of ((this.goingRight === true || this.goingRight === undefined) ? JSON.parse(JSON.stringify(this.items)) : JSON.parse(JSON.stringify(this.items)).reverse())) {
|
||||||
let existingItemIndex = this.slideItems.findIndex(anItem => anItem.id == newItem.id);
|
let existingItemIndex = this.slideItems.findIndex(anItem => anItem.id == newItem.id);
|
||||||
if (existingItemIndex < 0) {
|
if (existingItemIndex < 0 && this.swiper.virtual) {
|
||||||
if ( this.goingRight === true || this.goingRight === undefined) {
|
if ( this.goingRight === true || this.goingRight === undefined) {
|
||||||
this.swiper.virtual.appendSlide(newItem);
|
this.swiper.virtual.appendSlide(newItem);
|
||||||
//this.slideItems.push(newItem);
|
//this.slideItems.push(newItem);
|
||||||
|
|
@ -423,7 +423,7 @@ export default {
|
||||||
|
|
||||||
// Builds Swiper component
|
// Builds Swiper component
|
||||||
const self = this;
|
const self = this;
|
||||||
this.swiper = new Swiper('.swiper-container', {
|
this.swiper = new Swiper('#tainacan-slide-container', {
|
||||||
mousewheel: true,
|
mousewheel: true,
|
||||||
observer: true,
|
observer: true,
|
||||||
preventInteractionOnTransition: true,
|
preventInteractionOnTransition: true,
|
||||||
|
|
|
||||||
|
|
@ -1,268 +0,0 @@
|
||||||
// Main imports
|
|
||||||
import Vue from 'vue';
|
|
||||||
import Buefy from 'buefy';
|
|
||||||
import VTooltip from 'v-tooltip';
|
|
||||||
import VueMasonry from 'vue-masonry-css';
|
|
||||||
import cssVars from 'css-vars-ponyfill';
|
|
||||||
import qs from 'qs';
|
|
||||||
import VueBlurHash from 'vue-blurhash';
|
|
||||||
|
|
||||||
// Vue Dev Tools!
|
|
||||||
Vue.config.devtools = process && process.env && process.env.NODE_ENV === 'development';
|
|
||||||
|
|
||||||
// Filters
|
|
||||||
import FilterNumeric from '../../admin/components/filter-types/numeric/Numeric.vue';
|
|
||||||
import FilterDate from '../../admin/components/filter-types/date/Date.vue';
|
|
||||||
import FilterSelectbox from '../../admin/components/filter-types/selectbox/Selectbox.vue';
|
|
||||||
import FilterAutocomplete from '../../admin/components/filter-types/autocomplete/Autocomplete.vue';
|
|
||||||
import FilterCheckbox from '../../admin/components/filter-types/checkbox/Checkbox.vue';
|
|
||||||
import FilterTaginput from '../../admin/components/filter-types/taginput/Taginput.vue';
|
|
||||||
import FilterTaxonomyCheckbox from '../../admin/components/filter-types/taxonomy/Checkbox.vue';
|
|
||||||
import FilterTaxonomyTaginput from '../../admin/components/filter-types/taxonomy/Taginput.vue';
|
|
||||||
import FilterDateInterval from '../../admin/components/filter-types/date-interval/DateInterval.vue';
|
|
||||||
import FilterNumericInterval from '../../admin/components/filter-types/numeric-interval/NumericInterval.vue';
|
|
||||||
import FilterNumericListInterval from '../../admin/components/filter-types/numeric-list-interval/NumericListInterval.vue';
|
|
||||||
|
|
||||||
import TaincanFiltersList from '../../admin/components/filter-types/tainacan-filter-item.vue';
|
|
||||||
import ThemeItemsPage from '../pages/theme-items-page.vue';
|
|
||||||
import ThemeSearch from '../theme-search.vue';
|
|
||||||
|
|
||||||
// View Modes
|
|
||||||
import ViewModeTable from '../components/view-mode-table.vue';
|
|
||||||
import ViewModeCards from '../components/view-mode-cards.vue';
|
|
||||||
import ViewModeRecords from '../components/view-mode-records.vue';
|
|
||||||
import ViewModeMasonry from '../components/view-mode-masonry.vue';
|
|
||||||
import ViewModeSlideshow from '../components/view-mode-slideshow.vue';
|
|
||||||
import ViewModeList from '../components/view-mode-list.vue';
|
|
||||||
|
|
||||||
// Remaining imports
|
|
||||||
import store from '../../admin/js/store/store';
|
|
||||||
import routerTheme from './theme-router.js';
|
|
||||||
import eventBusSearch from '../../admin/js/event-bus-search';
|
|
||||||
import {
|
|
||||||
I18NPlugin,
|
|
||||||
UserPrefsPlugin,
|
|
||||||
ConsolePlugin
|
|
||||||
} from '../../admin/js/admin-utilities';
|
|
||||||
import {
|
|
||||||
ThumbnailHelperPlugin
|
|
||||||
} from '../../admin/js/utilities';
|
|
||||||
|
|
||||||
function mountTainacanItemsListComponent() {
|
|
||||||
|
|
||||||
// Mount only if the div exists
|
|
||||||
if (document.getElementById('tainacan-items-page')) {
|
|
||||||
|
|
||||||
// Display Icons only once everything is loaded
|
|
||||||
function listen(evnt, elem, func) {
|
|
||||||
if (elem.addEventListener) // W3C DOM
|
|
||||||
elem.addEventListener(evnt,func,false);
|
|
||||||
else if (elem.attachEvent) { // IE DOM
|
|
||||||
var r = elem.attachEvent("on"+evnt, func);
|
|
||||||
return r;
|
|
||||||
} else if (document.head) {
|
|
||||||
var iconHideStyle = document.createElement("style");
|
|
||||||
iconHideStyle.innerText = '.tainacan-icon{ opacity: 1 !important; }';
|
|
||||||
document.head.appendChild(iconHideStyle);
|
|
||||||
} else {
|
|
||||||
var iconHideStyle = document.createElement("style");
|
|
||||||
iconHideStyle.innerText = '.tainacan-icon{ opacity: 1 !important; }';
|
|
||||||
document.getElementsByTagName("head")[0].appendChild(iconHideStyle);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Registers Extra Vue Plugins passed to the window.tainacan_extra_plugins */
|
|
||||||
if (typeof window.tainacan_extra_plugins != "undefined") {
|
|
||||||
for (let [extraVuePluginName, extraVuePluginObject] of Object.entries(window.tainacan_extra_plugins)) {
|
|
||||||
Vue.component(extraVuePluginName, extraVuePluginObject);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Configure and Register Plugins
|
|
||||||
Vue.use(Buefy, {
|
|
||||||
defaultTooltipAnimated: true
|
|
||||||
});
|
|
||||||
Vue.use(VTooltip);
|
|
||||||
Vue.use(VueMasonry);
|
|
||||||
Vue.use(VueBlurHash);
|
|
||||||
Vue.use(I18NPlugin);
|
|
||||||
Vue.use(UserPrefsPlugin);
|
|
||||||
Vue.use(ThumbnailHelperPlugin);
|
|
||||||
Vue.use(ConsolePlugin, {visual: false});
|
|
||||||
|
|
||||||
/* Registers Extra Vue Components passed to the window.tainacan_extra_components */
|
|
||||||
if (typeof window.tainacan_extra_components != "undefined") {
|
|
||||||
for (let [extraVueComponentName, extraVueComponentObject] of Object.entries(window.tainacan_extra_components)) {
|
|
||||||
Vue.component(extraVueComponentName, extraVueComponentObject);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
Vue.component('tainacan-filter-item', TaincanFiltersList);
|
|
||||||
|
|
||||||
/* Filters */
|
|
||||||
Vue.component('tainacan-filter-numeric', FilterNumeric);
|
|
||||||
Vue.component('tainacan-filter-date', FilterDate);
|
|
||||||
Vue.component('tainacan-filter-selectbox', FilterSelectbox);
|
|
||||||
Vue.component('tainacan-filter-autocomplete', FilterAutocomplete);
|
|
||||||
Vue.component('tainacan-filter-checkbox', FilterCheckbox);
|
|
||||||
Vue.component('tainacan-filter-taginput', FilterTaginput);
|
|
||||||
Vue.component('tainacan-filter-taxonomy-checkbox', FilterTaxonomyCheckbox);
|
|
||||||
Vue.component('tainacan-filter-taxonomy-taginput', FilterTaxonomyTaginput);
|
|
||||||
Vue.component('tainacan-filter-date-interval', FilterDateInterval);
|
|
||||||
Vue.component('tainacan-filter-numeric-interval', FilterNumericInterval);
|
|
||||||
Vue.component('tainacan-filter-numeric-list-interval', FilterNumericListInterval);
|
|
||||||
|
|
||||||
/* Main page component */
|
|
||||||
Vue.component('theme-items-page', ThemeItemsPage);
|
|
||||||
Vue.component('theme-search', ThemeSearch);
|
|
||||||
|
|
||||||
// Oficial view modes
|
|
||||||
Vue.component('view-mode-table', ViewModeTable);
|
|
||||||
Vue.component('view-mode-cards', ViewModeCards);
|
|
||||||
Vue.component('view-mode-records', ViewModeRecords);
|
|
||||||
Vue.component('view-mode-masonry', ViewModeMasonry);
|
|
||||||
Vue.component('view-mode-slideshow', ViewModeSlideshow);
|
|
||||||
Vue.component('view-mode-list', ViewModeList);
|
|
||||||
|
|
||||||
Vue.use(eventBusSearch, { store: store, router: routerTheme});
|
|
||||||
|
|
||||||
const VueItemsList = new Vue({
|
|
||||||
store,
|
|
||||||
router: routerTheme,
|
|
||||||
data: {
|
|
||||||
termId: '',
|
|
||||||
taxonomy: '',
|
|
||||||
collectionId: '',
|
|
||||||
defaultViewMode: '',
|
|
||||||
isForcedViewMode: false,
|
|
||||||
enabledViewModes: {},
|
|
||||||
defaultItemsPerPage: '',
|
|
||||||
hideFilters: false,
|
|
||||||
hideHideFiltersButton: false,
|
|
||||||
hideSearch: false,
|
|
||||||
hideAdvancedSearch: false,
|
|
||||||
hideDisplayedMetadataButton: false,
|
|
||||||
hideSortByButton: false,
|
|
||||||
hideSortingArea: false,
|
|
||||||
hideItemsThumbnail: false,
|
|
||||||
hideItemsPerPageButton: false,
|
|
||||||
hideGoToPageButton: false,
|
|
||||||
hidePaginationArea: false,
|
|
||||||
showFiltersButtonInsideSearchControl: false,
|
|
||||||
startWithFiltersHidden: false,
|
|
||||||
filtersAsModal: false,
|
|
||||||
showInlineViewModeOptions: false,
|
|
||||||
showFullscreenWithViewModes: false
|
|
||||||
},
|
|
||||||
beforeMount () {
|
|
||||||
|
|
||||||
// Loads params if passed previously
|
|
||||||
if (this.$route.hash && this.$route.hash.split('#/?') && this.$route.hash.split('#/?')[1]) {
|
|
||||||
const existingQueries = qs.parse(this.$route.hash.split('#/?')[1]);
|
|
||||||
|
|
||||||
for (let key of Object.keys(existingQueries))
|
|
||||||
this.$route.query[key] = existingQueries[key];
|
|
||||||
}
|
|
||||||
|
|
||||||
// Collection or Term source settings
|
|
||||||
if (this.$el.attributes['collection-id'] != undefined)
|
|
||||||
this.collectionId = this.$el.attributes['collection-id'].value;
|
|
||||||
if (this.$el.attributes['term-id'] != undefined)
|
|
||||||
this.termId = this.$el.attributes['term-id'].value;
|
|
||||||
if (this.$el.attributes['taxonomy'] != undefined)
|
|
||||||
this.taxonomy = this.$el.attributes['taxonomy'].value;
|
|
||||||
|
|
||||||
// View Mode settings
|
|
||||||
if (this.$el.attributes['default-view-mode'] != undefined)
|
|
||||||
this.defaultViewMode = this.$el.attributes['default-view-mode'].value;
|
|
||||||
else
|
|
||||||
this.defaultViewMode = 'cards';
|
|
||||||
|
|
||||||
if (this.$el.attributes['is-forced-view-mode'] != undefined)
|
|
||||||
this.isForcedViewMode = new Boolean(this.$el.attributes['is-forced-view-mode'].value);
|
|
||||||
|
|
||||||
if (this.$el.attributes['enabled-view-modes'] != undefined)
|
|
||||||
this.enabledViewModes = this.$el.attributes['enabled-view-modes'].value.split(',');
|
|
||||||
|
|
||||||
// Options related to hidding elements
|
|
||||||
if (this.$el.attributes['hide-filters'] != undefined)
|
|
||||||
this.hideFilters = this.isParameterTrue('hide-filters');
|
|
||||||
if (this.$el.attributes['hide-hide-filters-button'] != undefined)
|
|
||||||
this.hideHideFiltersButton = this.isParameterTrue('hide-hide-filters-button');
|
|
||||||
if (this.$el.attributes['hide-search'] != undefined)
|
|
||||||
this.hideSearch = this.isParameterTrue('hide-search');
|
|
||||||
if (this.$el.attributes['hide-advanced-search'] != undefined)
|
|
||||||
this.hideAdvancedSearch = this.isParameterTrue('hide-advanced-search');
|
|
||||||
if (this.$el.attributes['hide-displayed-metadata-button'] != undefined)
|
|
||||||
this.hideDisplayedMetadataButton = this.isParameterTrue('hide-displayed-metadata-button');
|
|
||||||
if (this.$el.attributes['hide-sorting-area'] != undefined)
|
|
||||||
this.hideSortingArea = this.isParameterTrue('hide-sorting-area');
|
|
||||||
if (this.$el.attributes['hide-items-thumbnail'] != undefined)
|
|
||||||
this.hideItemsThumbnail = this.isParameterTrue('hide-items-thumbnail');
|
|
||||||
if (this.$el.attributes['hide-sort-by-button'] != undefined)
|
|
||||||
this.hideSortByButton = this.isParameterTrue('hide-sort-by-button');
|
|
||||||
if (this.$el.attributes['hide-exposers-button'] != undefined)
|
|
||||||
this.hideExposersButton = this.isParameterTrue('hide-exposers-button');
|
|
||||||
if (this.$el.attributes['hide-items-per-page-button'] != undefined)
|
|
||||||
this.hideItemsPerPageButton = this.isParameterTrue('hide-items-per-page-button');
|
|
||||||
if (this.$el.attributes['hide-go-to-page-button'] != undefined)
|
|
||||||
this.hideGoToPageButton = this.isParameterTrue('hide-go-to-page-button');
|
|
||||||
if (this.$el.attributes['hide-pagination-area'] != undefined)
|
|
||||||
this.hidePaginationArea = this.isParameterTrue('hide-pagination-area');
|
|
||||||
|
|
||||||
// Other Tweaks
|
|
||||||
if (this.$el.attributes['default-items-per-page'] != undefined)
|
|
||||||
this.defaultItemsPerPage = this.$el.attributes['default-items-per-page'].value;
|
|
||||||
if (this.$el.attributes['show-filters-button-inside-search-control'] != undefined)
|
|
||||||
this.showFiltersButtonInsideSearchControl = this.isParameterTrue('show-filters-button-inside-search-control');
|
|
||||||
if (this.$el.attributes['start-with-filters-hidden'] != undefined)
|
|
||||||
this.startWithFiltersHidden = this.isParameterTrue('start-with-filters-hidden');
|
|
||||||
if (this.$el.attributes['filters-as-modal'] != undefined)
|
|
||||||
this.filtersAsModal = this.isParameterTrue('filters-as-modal');
|
|
||||||
if (this.$el.attributes['show-inline-view-mode-options'] != undefined)
|
|
||||||
this.showInlineViewModeOptions = this.isParameterTrue('show-inline-view-mode-options');
|
|
||||||
if (this.$el.attributes['show-fullscreen-with-view-modes'] != undefined)
|
|
||||||
this.showFullscreenWithViewModes = this.isParameterTrue('show-fullscreen-with-view-modes');
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
isParameterTrue(parameter) {
|
|
||||||
const value = this.$el.attributes[parameter].value;
|
|
||||||
return (value == true || value == 'true' || value == '1' || value == 1) ? true : false;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
render: h => h(ThemeSearch)
|
|
||||||
});
|
|
||||||
|
|
||||||
VueItemsList.$mount('#tainacan-items-page');
|
|
||||||
|
|
||||||
listen("load", window, function() {
|
|
||||||
var iconsStyle = document.createElement("style");
|
|
||||||
iconsStyle.setAttribute('type', 'text/css');
|
|
||||||
iconsStyle.innerText = '.tainacan-icon{ opacity: 1 !important; }';
|
|
||||||
document.head.appendChild(iconsStyle);
|
|
||||||
});
|
|
||||||
|
|
||||||
// Initialize Ponyfill for Custom CSS properties
|
|
||||||
cssVars({
|
|
||||||
// Options...
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// Checks if document is loaded
|
|
||||||
const performWhenDocumentIsLoaded = callback => {
|
|
||||||
if (/comp|inter|loaded/.test(document.readyState))
|
|
||||||
cb();
|
|
||||||
else
|
|
||||||
document.addEventListener('DOMContentLoaded', callback, false);
|
|
||||||
}
|
|
||||||
|
|
||||||
// Mounts when page is loaded
|
|
||||||
performWhenDocumentIsLoaded(() => {
|
|
||||||
mountTainacanItemsListComponent();
|
|
||||||
});
|
|
||||||
|
|
||||||
// Also if a theme or plugin requested a reset...
|
|
||||||
document.addEventListener("TainacanReloadItemsListComponent", () => {
|
|
||||||
mountTainacanItemsListComponent();
|
|
||||||
});
|
|
||||||
|
|
@ -17,7 +17,7 @@ class TAINACAN_HTML_Injection extends TAINACAN_UnitTestCase
|
||||||
private $link = "<a href='www.tainacan.org'>link</a>";
|
private $link = "<a href='www.tainacan.org'>link</a>";
|
||||||
private $js = "<script>alert('XSS')</script>";
|
private $js = "<script>alert('XSS')</script>";
|
||||||
private $css = "my text along with some style <style>a { display: none }</style>";
|
private $css = "my text along with some style <style>a { display: none }</style>";
|
||||||
private $iframe = "<iframe src='www.tainacan.org' title='Taiancan'></iframe>";
|
private $iframe = "<iframe src='www.tainacan.org' title='Tainacan'></iframe>";
|
||||||
private $text_and_link = "";
|
private $text_and_link = "";
|
||||||
private $text_and_iframe = "";
|
private $text_and_iframe = "";
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -5,47 +5,28 @@ const MomentLocalesPlugin = require('moment-locales-webpack-plugin');
|
||||||
module.exports = {
|
module.exports = {
|
||||||
entry: {
|
entry: {
|
||||||
admin: './src/views/admin/js/main.js',
|
admin: './src/views/admin/js/main.js',
|
||||||
media_component: './src/views/media-component/media-component.js',
|
|
||||||
theme_search: './src/views/theme-search/js/theme-main.js',
|
|
||||||
item_submission: './src/views/item-submission/js/item-submission-main.js',
|
|
||||||
roles: './src/views/roles/js/roles-main.js',
|
roles: './src/views/roles/js/roles-main.js',
|
||||||
reports: './src/views/reports/js/reports-main.js',
|
reports: './src/views/reports/js/reports-main.js',
|
||||||
|
media_component: './src/views/media-component/media-component.js',
|
||||||
|
tainacan_blocks_category_icon: './src/views/gutenberg-blocks/js/tainacan-blocks-category-icon.js',
|
||||||
|
tainacan_blocks_common_theme_scripts: './src/views/gutenberg-blocks/tainacan-blocks/tainacan-blocks-common-theme-scripts.js',
|
||||||
|
|
||||||
block_terms_list: './src/views/gutenberg-blocks/tainacan-blocks/terms-list/index.js',
|
block_terms_list: './src/views/gutenberg-blocks/tainacan-blocks/terms-list/index.js',
|
||||||
|
|
||||||
block_items_list: './src/views/gutenberg-blocks/tainacan-blocks/items-list/index.js',
|
block_items_list: './src/views/gutenberg-blocks/tainacan-blocks/items-list/index.js',
|
||||||
|
|
||||||
block_dynamic_items_list: './src/views/gutenberg-blocks/tainacan-blocks/dynamic-items-list/index.js',
|
block_dynamic_items_list: './src/views/gutenberg-blocks/tainacan-blocks/dynamic-items-list/index.js',
|
||||||
block_dynamic_items_list_theme: './src/views/gutenberg-blocks/tainacan-blocks/dynamic-items-list/dynamic-items-list-theme.js',
|
|
||||||
|
|
||||||
block_carousel_items_list: './src/views/gutenberg-blocks/tainacan-blocks/carousel-items-list/index.js',
|
block_carousel_items_list: './src/views/gutenberg-blocks/tainacan-blocks/carousel-items-list/index.js',
|
||||||
block_carousel_items_list_theme: './src/views/gutenberg-blocks/tainacan-blocks/carousel-items-list/carousel-items-list-theme.js',
|
|
||||||
|
|
||||||
block_search_bar: './src/views/gutenberg-blocks/tainacan-blocks/search-bar/index.js',
|
block_search_bar: './src/views/gutenberg-blocks/tainacan-blocks/search-bar/index.js',
|
||||||
block_search_bar_theme: './src/views/gutenberg-blocks/tainacan-blocks/search-bar/search-bar-theme.js',
|
|
||||||
|
|
||||||
block_collections_list: './src/views/gutenberg-blocks/tainacan-blocks/collections-list/index.js',
|
block_collections_list: './src/views/gutenberg-blocks/tainacan-blocks/collections-list/index.js',
|
||||||
|
|
||||||
block_carousel_collections_list: './src/views/gutenberg-blocks/tainacan-blocks/carousel-collections-list/index.js',
|
block_carousel_collections_list: './src/views/gutenberg-blocks/tainacan-blocks/carousel-collections-list/index.js',
|
||||||
block_carousel_collections_list_theme: './src/views/gutenberg-blocks/tainacan-blocks/carousel-collections-list/carousel-collections-list-theme.js',
|
|
||||||
|
|
||||||
block_carousel_related_items: './src/views/gutenberg-blocks/tainacan-blocks/carousel-related-items/index.js',
|
block_carousel_related_items: './src/views/gutenberg-blocks/tainacan-blocks/carousel-related-items/index.js',
|
||||||
|
|
||||||
block_facets_list: './src/views/gutenberg-blocks/tainacan-blocks/facets-list/index.js',
|
block_facets_list: './src/views/gutenberg-blocks/tainacan-blocks/facets-list/index.js',
|
||||||
block_facets_list_theme: './src/views/gutenberg-blocks/tainacan-blocks/facets-list/facets-list-theme.js',
|
|
||||||
|
|
||||||
block_item_submission_form: './src/views/gutenberg-blocks/tainacan-blocks/item-submission-form/index.js',
|
block_item_submission_form: './src/views/gutenberg-blocks/tainacan-blocks/item-submission-form/index.js',
|
||||||
|
|
||||||
block_faceted_search: './src/views/gutenberg-blocks/tainacan-blocks/faceted-search/index.js',
|
block_faceted_search: './src/views/gutenberg-blocks/tainacan-blocks/faceted-search/index.js',
|
||||||
|
block_carousel_terms_list: './src/views/gutenberg-blocks/tainacan-blocks/carousel-terms-list/index.js'
|
||||||
block_carousel_terms_list: './src/views/gutenberg-blocks/tainacan-blocks/carousel-terms-list/index.js',
|
|
||||||
block_carousel_terms_list_theme: './src/views/gutenberg-blocks/tainacan-blocks/carousel-terms-list/carousel-terms-list-theme.js',
|
|
||||||
|
|
||||||
tainacan_blocks_category_icon: './src/views/gutenberg-blocks/js/tainacan-blocks-category-icon.js'
|
|
||||||
},
|
},
|
||||||
output: {
|
output: {
|
||||||
path: path.resolve(__dirname, './src/assets/js/'),
|
path: path.resolve(__dirname, './src/assets/js/'),
|
||||||
publicPath: './src/assets/js/',
|
publicPath: './../../../wp-content/plugins/tainacan/assets/js/',
|
||||||
filename: '[name].js'
|
filename: '[name].js'
|
||||||
},
|
},
|
||||||
module: {
|
module: {
|
||||||
|
|
@ -111,7 +92,6 @@ module.exports = {
|
||||||
},
|
},
|
||||||
plugins: [
|
plugins: [
|
||||||
new webpack.ProvidePlugin({
|
new webpack.ProvidePlugin({
|
||||||
'Swiper': 'Swiper',
|
|
||||||
'PhotoSwipe': 'PhotoSwipe'
|
'PhotoSwipe': 'PhotoSwipe'
|
||||||
}),
|
}),
|
||||||
new MomentLocalesPlugin({
|
new MomentLocalesPlugin({
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue