From f3f6f8113c721333ec03c4c75bb53484d104fa50 Mon Sep 17 00:00:00 2001 From: "Balaji (Non Work)" Date: Sun, 9 Oct 2022 11:15:33 +0530 Subject: [PATCH] Added loading indicator --- package-lock.json | 130 +++++--- package.json | 1 + src/App.js | 15 +- src/Components/Portfolio/Portfolio.js | 1 - src/Components/VideoData/data.js | 76 ----- src/Components/newData.js | 440 -------------------------- src/index.css | 8 + yarn.lock | 7 +- 8 files changed, 106 insertions(+), 572 deletions(-) delete mode 100644 src/Components/VideoData/data.js delete mode 100644 src/Components/newData.js diff --git a/package-lock.json b/package-lock.json index 6a7c17f..5423fb3 100644 --- a/package-lock.json +++ b/package-lock.json @@ -16,6 +16,7 @@ "react-dom": "^16.8.6", "react-ga": "^3.3.0", "react-icons": "^3.10.0", + "react-loading": "^2.0.3", "react-modal": "^3.11.2", "react-photo-gallery": "^8.0.0", "react-reveal-text": "^0.1.1", @@ -5405,7 +5406,6 @@ }, "node_modules/fsevents/node_modules/abbrev": { "version": "1.1.1", - "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.1.1.tgz", "inBundle": true, "license": "ISC", "optional": true @@ -5413,6 +5413,7 @@ "node_modules/fsevents/node_modules/ansi-regex": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz", + "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=", "inBundle": true, "license": "MIT", "optional": true, @@ -5422,7 +5423,6 @@ }, "node_modules/fsevents/node_modules/aproba": { "version": "1.2.0", - "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.2.0.tgz", "inBundle": true, "license": "ISC", "optional": true @@ -5440,6 +5440,7 @@ "node_modules/fsevents/node_modules/balanced-match": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz", + "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c=", "inBundle": true, "license": "MIT", "optional": true @@ -5447,6 +5448,7 @@ "node_modules/fsevents/node_modules/brace-expansion": { "version": "1.1.11", "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", + "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==", "inBundle": true, "license": "MIT", "optional": true, @@ -5457,7 +5459,6 @@ }, "node_modules/fsevents/node_modules/chownr": { "version": "1.0.1", - "resolved": "https://registry.npmjs.org/chownr/-/chownr-1.0.1.tgz", "inBundle": true, "license": "ISC", "optional": true @@ -5465,6 +5466,7 @@ "node_modules/fsevents/node_modules/code-point-at": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz", + "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c=", "inBundle": true, "license": "MIT", "optional": true, @@ -5475,13 +5477,13 @@ "node_modules/fsevents/node_modules/concat-map": { "version": "0.0.1", "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", + "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=", "inBundle": true, "license": "MIT", "optional": true }, "node_modules/fsevents/node_modules/console-control-strings": { "version": "1.1.0", - "resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz", "inBundle": true, "license": "ISC", "optional": true @@ -5489,13 +5491,13 @@ "node_modules/fsevents/node_modules/core-util-is": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz", + "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=", "inBundle": true, "license": "MIT", "optional": true }, "node_modules/fsevents/node_modules/debug": { "version": "2.6.9", - "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz", "inBundle": true, "license": "MIT", "optional": true, @@ -5515,14 +5517,12 @@ }, "node_modules/fsevents/node_modules/delegates": { "version": "1.0.0", - "resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz", "inBundle": true, "license": "MIT", "optional": true }, "node_modules/fsevents/node_modules/detect-libc": { "version": "1.0.3", - "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-1.0.3.tgz", "inBundle": true, "license": "Apache-2.0", "optional": true, @@ -5535,7 +5535,6 @@ }, "node_modules/fsevents/node_modules/fs-minipass": { "version": "1.2.5", - "resolved": "https://registry.npmjs.org/fs-minipass/-/fs-minipass-1.2.5.tgz", "inBundle": true, "license": "ISC", "optional": true, @@ -5546,13 +5545,13 @@ "node_modules/fsevents/node_modules/fs.realpath": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz", + "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=", "inBundle": true, "license": "ISC", "optional": true }, "node_modules/fsevents/node_modules/gauge": { "version": "2.7.4", - "resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz", "inBundle": true, "license": "ISC", "optional": true, @@ -5570,6 +5569,7 @@ "node_modules/fsevents/node_modules/glob": { "version": "7.1.2", "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz", + "integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ==", "inBundle": true, "license": "ISC", "optional": true, @@ -5587,7 +5587,6 @@ }, "node_modules/fsevents/node_modules/has-unicode": { "version": "2.0.1", - "resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz", "inBundle": true, "license": "ISC", "optional": true @@ -5606,7 +5605,6 @@ }, "node_modules/fsevents/node_modules/ignore-walk": { "version": "3.0.1", - "resolved": "https://registry.npmjs.org/ignore-walk/-/ignore-walk-3.0.1.tgz", "inBundle": true, "license": "ISC", "optional": true, @@ -5617,6 +5615,7 @@ "node_modules/fsevents/node_modules/inflight": { "version": "1.0.6", "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz", + "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=", "inBundle": true, "license": "ISC", "optional": true, @@ -5628,6 +5627,7 @@ "node_modules/fsevents/node_modules/inherits": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz", + "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=", "inBundle": true, "license": "ISC", "optional": true @@ -5635,6 +5635,7 @@ "node_modules/fsevents/node_modules/ini": { "version": "1.3.5", "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.5.tgz", + "integrity": "sha512-RZY5huIKCMRWDUqZlEi72f/lmXKMvuszcMBduliQ3nnWbx9X/ZBQO7DijMEYS9EhHBb2qacRUMtC7svLwe0lcw==", "inBundle": true, "license": "ISC", "optional": true, @@ -5645,6 +5646,7 @@ "node_modules/fsevents/node_modules/is-fullwidth-code-point": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz", + "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=", "inBundle": true, "license": "MIT", "optional": true, @@ -5658,6 +5660,7 @@ "node_modules/fsevents/node_modules/isarray": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz", + "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=", "inBundle": true, "license": "MIT", "optional": true @@ -5665,6 +5668,7 @@ "node_modules/fsevents/node_modules/minimatch": { "version": "3.0.4", "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz", + "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==", "inBundle": true, "license": "ISC", "optional": true, @@ -5677,7 +5681,6 @@ }, "node_modules/fsevents/node_modules/minimist": { "version": "0.0.8", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz", "inBundle": true, "license": "MIT", "optional": true @@ -5694,7 +5697,6 @@ }, "node_modules/fsevents/node_modules/minizlib": { "version": "1.1.0", - "resolved": "https://registry.npmjs.org/minizlib/-/minizlib-1.1.0.tgz", "inBundle": true, "license": "MIT", "optional": true, @@ -5704,7 +5706,6 @@ }, "node_modules/fsevents/node_modules/mkdirp": { "version": "0.5.1", - "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz", "inBundle": true, "license": "MIT", "optional": true, @@ -5718,6 +5719,7 @@ "node_modules/fsevents/node_modules/ms": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz", + "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=", "inBundle": true, "license": "MIT", "optional": true @@ -5741,7 +5743,6 @@ }, "node_modules/fsevents/node_modules/node-pre-gyp": { "version": "0.10.0", - "resolved": "https://registry.npmjs.org/node-pre-gyp/-/node-pre-gyp-0.10.0.tgz", "inBundle": true, "license": "BSD-3-Clause", "optional": true, @@ -5763,7 +5764,6 @@ }, "node_modules/fsevents/node_modules/nopt": { "version": "4.0.1", - "resolved": "https://registry.npmjs.org/nopt/-/nopt-4.0.1.tgz", "inBundle": true, "license": "ISC", "optional": true, @@ -5777,14 +5777,12 @@ }, "node_modules/fsevents/node_modules/npm-bundled": { "version": "1.0.3", - "resolved": "https://registry.npmjs.org/npm-bundled/-/npm-bundled-1.0.3.tgz", "inBundle": true, "license": "ISC", "optional": true }, "node_modules/fsevents/node_modules/npm-packlist": { "version": "1.1.10", - "resolved": "https://registry.npmjs.org/npm-packlist/-/npm-packlist-1.1.10.tgz", "inBundle": true, "license": "ISC", "optional": true, @@ -5795,7 +5793,6 @@ }, "node_modules/fsevents/node_modules/npmlog": { "version": "4.1.2", - "resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.2.tgz", "inBundle": true, "license": "ISC", "optional": true, @@ -5809,6 +5806,7 @@ "node_modules/fsevents/node_modules/number-is-nan": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz", + "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=", "inBundle": true, "license": "MIT", "optional": true, @@ -5819,6 +5817,7 @@ "node_modules/fsevents/node_modules/object-assign": { "version": "4.1.1", "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", + "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=", "inBundle": true, "license": "MIT", "optional": true, @@ -5829,6 +5828,7 @@ "node_modules/fsevents/node_modules/once": { "version": "1.4.0", "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz", + "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=", "inBundle": true, "license": "ISC", "optional": true, @@ -5839,6 +5839,7 @@ "node_modules/fsevents/node_modules/os-homedir": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz", + "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M=", "inBundle": true, "license": "MIT", "optional": true, @@ -5848,7 +5849,6 @@ }, "node_modules/fsevents/node_modules/os-tmpdir": { "version": "1.0.2", - "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz", "inBundle": true, "license": "MIT", "optional": true, @@ -5858,7 +5858,6 @@ }, "node_modules/fsevents/node_modules/osenv": { "version": "0.1.5", - "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.5.tgz", "inBundle": true, "license": "ISC", "optional": true, @@ -5870,6 +5869,7 @@ "node_modules/fsevents/node_modules/path-is-absolute": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz", + "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=", "inBundle": true, "license": "MIT", "optional": true, @@ -5880,6 +5880,7 @@ "node_modules/fsevents/node_modules/process-nextick-args": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.0.tgz", + "integrity": "sha512-MtEC1TqN0EU5nephaJ4rAtThHtC86dNN9qCuEhtshvpVBkAW5ZO7BASN9REnF9eoXGcRub+pFuKEpOHE+HbEMw==", "inBundle": true, "license": "MIT", "optional": true @@ -5907,7 +5908,6 @@ }, "node_modules/fsevents/node_modules/readable-stream": { "version": "2.3.6", - "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz", "inBundle": true, "license": "MIT", "optional": true, @@ -5924,6 +5924,7 @@ "node_modules/fsevents/node_modules/rimraf": { "version": "2.6.2", "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.6.2.tgz", + "integrity": "sha512-lreewLK/BlghmxtfH36YYVg1i8IAce4TI7oao75I1g245+6BctqTVQiBP3YUJ9C6DQOXJmkYR9X9fCLtCOJc5w==", "inBundle": true, "license": "ISC", "optional": true, @@ -5942,13 +5943,14 @@ }, "node_modules/fsevents/node_modules/safer-buffer": { "version": "2.1.2", + "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz", + "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==", "inBundle": true, "license": "MIT", "optional": true }, "node_modules/fsevents/node_modules/sax": { "version": "1.2.4", - "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz", "inBundle": true, "license": "ISC", "optional": true @@ -5956,6 +5958,7 @@ "node_modules/fsevents/node_modules/semver": { "version": "5.5.0", "resolved": "https://registry.npmjs.org/semver/-/semver-5.5.0.tgz", + "integrity": "sha512-4SJ3dm0WAwWy/NVeioZh5AntkdJoWKxHxcmyP622fOkgHa4z3R0TdBJICINyaSDE6uNwVc8gZr+ZinwZAH4xIA==", "inBundle": true, "license": "ISC", "optional": true, @@ -5965,7 +5968,6 @@ }, "node_modules/fsevents/node_modules/set-blocking": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz", "inBundle": true, "license": "ISC", "optional": true @@ -5973,6 +5975,7 @@ "node_modules/fsevents/node_modules/signal-exit": { "version": "3.0.2", "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.2.tgz", + "integrity": "sha1-tf3AjxKH6hF4Yo5BXiUTK3NkbG0=", "inBundle": true, "license": "ISC", "optional": true @@ -5980,6 +5983,7 @@ "node_modules/fsevents/node_modules/string_decoder": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz", + "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==", "inBundle": true, "license": "MIT", "optional": true, @@ -5990,6 +5994,7 @@ "node_modules/fsevents/node_modules/string-width": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz", + "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=", "inBundle": true, "license": "MIT", "optional": true, @@ -6005,6 +6010,7 @@ "node_modules/fsevents/node_modules/strip-ansi": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz", + "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=", "inBundle": true, "license": "MIT", "optional": true, @@ -6018,6 +6024,7 @@ "node_modules/fsevents/node_modules/strip-json-comments": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-2.0.1.tgz", + "integrity": "sha1-PFMZQukIwml8DsNEhYwobHygpgo=", "inBundle": true, "license": "MIT", "optional": true, @@ -6046,6 +6053,7 @@ "node_modules/fsevents/node_modules/util-deprecate": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz", + "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=", "inBundle": true, "license": "MIT", "optional": true @@ -6062,13 +6070,13 @@ "node_modules/fsevents/node_modules/wrappy": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz", + "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=", "inBundle": true, "license": "ISC", "optional": true }, "node_modules/fsevents/node_modules/yallist": { "version": "3.0.2", - "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.0.2.tgz", "inBundle": true, "license": "ISC", "optional": true @@ -11916,6 +11924,15 @@ "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz", "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==" }, + "node_modules/react-loading": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/react-loading/-/react-loading-2.0.3.tgz", + "integrity": "sha512-Vdqy79zq+bpeWJqC+xjltUjuGApyoItPgL0vgVfcJHhqwU7bAMKzysfGW/ADu6i0z0JiOCRJjo+IkFNkRNbA3A==", + "peerDependencies": { + "prop-types": "^15.6.0", + "react": ">=0.14.0" + } + }, "node_modules/react-modal": { "version": "3.11.2", "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.11.2.tgz", @@ -20656,19 +20673,18 @@ "dependencies": { "abbrev": { "version": "1.1.1", - "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-1.1.1.tgz", "bundled": true, "optional": true }, "ansi-regex": { "version": "2.1.1", "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-2.1.1.tgz", + "integrity": "sha1-w7M6te42DYbg5ijwRorn7yfWVN8=", "bundled": true, "optional": true }, "aproba": { "version": "1.2.0", - "resolved": "https://registry.npmjs.org/aproba/-/aproba-1.2.0.tgz", "bundled": true, "optional": true }, @@ -20684,12 +20700,14 @@ "balanced-match": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-1.0.0.tgz", + "integrity": "sha1-ibTRmasr7kneFk6gK4nORi1xt2c=", "bundled": true, "optional": true }, "brace-expansion": { "version": "1.1.11", "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz", + "integrity": "sha512-iCuPHDFgrHX7H2vEI/5xpz07zSHB00TpugqhmYtVmMO6518mCuRMoOYFldEBl0g187ufozdaHgWKcYFb61qGiA==", "bundled": true, "optional": true, "requires": { @@ -20699,37 +20717,37 @@ }, "chownr": { "version": "1.0.1", - "resolved": "https://registry.npmjs.org/chownr/-/chownr-1.0.1.tgz", "bundled": true, "optional": true }, "code-point-at": { "version": "1.1.0", "resolved": "https://registry.npmjs.org/code-point-at/-/code-point-at-1.1.0.tgz", + "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c=", "bundled": true, "optional": true }, "concat-map": { "version": "0.0.1", "resolved": "https://registry.npmjs.org/concat-map/-/concat-map-0.0.1.tgz", + "integrity": "sha1-2Klr13/Wjfd5OnMDajug1UBdR3s=", "bundled": true, "optional": true }, "console-control-strings": { "version": "1.1.0", - "resolved": "https://registry.npmjs.org/console-control-strings/-/console-control-strings-1.1.0.tgz", "bundled": true, "optional": true }, "core-util-is": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/core-util-is/-/core-util-is-1.0.2.tgz", + "integrity": "sha1-tf1UIgqivFq1eqtxQMlAdUUDwac=", "bundled": true, "optional": true }, "debug": { "version": "2.6.9", - "resolved": "https://registry.npmjs.org/debug/-/debug-2.6.9.tgz", "bundled": true, "optional": true, "requires": { @@ -20743,19 +20761,16 @@ }, "delegates": { "version": "1.0.0", - "resolved": "https://registry.npmjs.org/delegates/-/delegates-1.0.0.tgz", "bundled": true, "optional": true }, "detect-libc": { "version": "1.0.3", - "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-1.0.3.tgz", "bundled": true, "optional": true }, "fs-minipass": { "version": "1.2.5", - "resolved": "https://registry.npmjs.org/fs-minipass/-/fs-minipass-1.2.5.tgz", "bundled": true, "optional": true, "requires": { @@ -20765,12 +20780,12 @@ "fs.realpath": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/fs.realpath/-/fs.realpath-1.0.0.tgz", + "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=", "bundled": true, "optional": true }, "gauge": { "version": "2.7.4", - "resolved": "https://registry.npmjs.org/gauge/-/gauge-2.7.4.tgz", "bundled": true, "optional": true, "requires": { @@ -20787,6 +20802,7 @@ "glob": { "version": "7.1.2", "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.2.tgz", + "integrity": "sha512-MJTUg1kjuLeQCJ+ccE4Vpa6kKVXkPYJ2mOCQyUuKLcLQsdrMCpBPUi8qVE6+YuaJkozeA9NusTAw3hLr8Xe5EQ==", "bundled": true, "optional": true, "requires": { @@ -20800,7 +20816,6 @@ }, "has-unicode": { "version": "2.0.1", - "resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz", "bundled": true, "optional": true }, @@ -20814,7 +20829,6 @@ }, "ignore-walk": { "version": "3.0.1", - "resolved": "https://registry.npmjs.org/ignore-walk/-/ignore-walk-3.0.1.tgz", "bundled": true, "optional": true, "requires": { @@ -20824,6 +20838,7 @@ "inflight": { "version": "1.0.6", "resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz", + "integrity": "sha1-Sb1jMdfQLQwJvJEKEHW6gWW1bfk=", "bundled": true, "optional": true, "requires": { @@ -20834,18 +20849,21 @@ "inherits": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.3.tgz", + "integrity": "sha1-Yzwsg+PaQqUC9SRmAiSA9CCCYd4=", "bundled": true, "optional": true }, "ini": { "version": "1.3.5", "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.5.tgz", + "integrity": "sha512-RZY5huIKCMRWDUqZlEi72f/lmXKMvuszcMBduliQ3nnWbx9X/ZBQO7DijMEYS9EhHBb2qacRUMtC7svLwe0lcw==", "bundled": true, "optional": true }, "is-fullwidth-code-point": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-1.0.0.tgz", + "integrity": "sha1-754xOG8DGn8NZDr4L95QxFfvAMs=", "bundled": true, "optional": true, "requires": { @@ -20855,12 +20873,14 @@ "isarray": { "version": "1.0.0", "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz", + "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=", "bundled": true, "optional": true }, "minimatch": { "version": "3.0.4", "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-3.0.4.tgz", + "integrity": "sha512-yJHVQEhyqPLUTgt9B83PXu6W3rx4MvvHvSUvToogpwoGDOUQ+yDrR0HRot+yOCdCO7u4hX3pWft6kWBBcqh0UA==", "bundled": true, "optional": true, "requires": { @@ -20869,7 +20889,6 @@ }, "minimist": { "version": "0.0.8", - "resolved": "https://registry.npmjs.org/minimist/-/minimist-0.0.8.tgz", "bundled": true, "optional": true }, @@ -20884,7 +20903,6 @@ }, "minizlib": { "version": "1.1.0", - "resolved": "https://registry.npmjs.org/minizlib/-/minizlib-1.1.0.tgz", "bundled": true, "optional": true, "requires": { @@ -20893,7 +20911,6 @@ }, "mkdirp": { "version": "0.5.1", - "resolved": "https://registry.npmjs.org/mkdirp/-/mkdirp-0.5.1.tgz", "bundled": true, "optional": true, "requires": { @@ -20903,6 +20920,7 @@ "ms": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/ms/-/ms-2.0.0.tgz", + "integrity": "sha1-VgiurfwAvmwpAd9fmGF4jeDVl8g=", "bundled": true, "optional": true }, @@ -20918,7 +20936,6 @@ }, "node-pre-gyp": { "version": "0.10.0", - "resolved": "https://registry.npmjs.org/node-pre-gyp/-/node-pre-gyp-0.10.0.tgz", "bundled": true, "optional": true, "requires": { @@ -20936,7 +20953,6 @@ }, "nopt": { "version": "4.0.1", - "resolved": "https://registry.npmjs.org/nopt/-/nopt-4.0.1.tgz", "bundled": true, "optional": true, "requires": { @@ -20946,13 +20962,11 @@ }, "npm-bundled": { "version": "1.0.3", - "resolved": "https://registry.npmjs.org/npm-bundled/-/npm-bundled-1.0.3.tgz", "bundled": true, "optional": true }, "npm-packlist": { "version": "1.1.10", - "resolved": "https://registry.npmjs.org/npm-packlist/-/npm-packlist-1.1.10.tgz", "bundled": true, "optional": true, "requires": { @@ -20962,7 +20976,6 @@ }, "npmlog": { "version": "4.1.2", - "resolved": "https://registry.npmjs.org/npmlog/-/npmlog-4.1.2.tgz", "bundled": true, "optional": true, "requires": { @@ -20975,18 +20988,21 @@ "number-is-nan": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz", + "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=", "bundled": true, "optional": true }, "object-assign": { "version": "4.1.1", "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz", + "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=", "bundled": true, "optional": true }, "once": { "version": "1.4.0", "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz", + "integrity": "sha1-WDsap3WWHUsROsF9nFC6753Xa9E=", "bundled": true, "optional": true, "requires": { @@ -20996,18 +21012,17 @@ "os-homedir": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/os-homedir/-/os-homedir-1.0.2.tgz", + "integrity": "sha1-/7xJiDNuDoM94MFox+8VISGqf7M=", "bundled": true, "optional": true }, "os-tmpdir": { "version": "1.0.2", - "resolved": "https://registry.npmjs.org/os-tmpdir/-/os-tmpdir-1.0.2.tgz", "bundled": true, "optional": true }, "osenv": { "version": "0.1.5", - "resolved": "https://registry.npmjs.org/osenv/-/osenv-0.1.5.tgz", "bundled": true, "optional": true, "requires": { @@ -21018,12 +21033,14 @@ "path-is-absolute": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/path-is-absolute/-/path-is-absolute-1.0.1.tgz", + "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18=", "bundled": true, "optional": true }, "process-nextick-args": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-2.0.0.tgz", + "integrity": "sha512-MtEC1TqN0EU5nephaJ4rAtThHtC86dNN9qCuEhtshvpVBkAW5ZO7BASN9REnF9eoXGcRub+pFuKEpOHE+HbEMw==", "bundled": true, "optional": true }, @@ -21047,7 +21064,6 @@ }, "readable-stream": { "version": "2.3.6", - "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz", "bundled": true, "optional": true, "requires": { @@ -21063,6 +21079,7 @@ "rimraf": { "version": "2.6.2", "resolved": "https://registry.npmjs.org/rimraf/-/rimraf-2.6.2.tgz", + "integrity": "sha512-lreewLK/BlghmxtfH36YYVg1i8IAce4TI7oao75I1g245+6BctqTVQiBP3YUJ9C6DQOXJmkYR9X9fCLtCOJc5w==", "bundled": true, "optional": true, "requires": { @@ -21076,36 +21093,39 @@ }, "safer-buffer": { "version": "2.1.2", + "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz", + "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==", "bundled": true, "optional": true }, "sax": { "version": "1.2.4", - "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz", "bundled": true, "optional": true }, "semver": { "version": "5.5.0", "resolved": "https://registry.npmjs.org/semver/-/semver-5.5.0.tgz", + "integrity": "sha512-4SJ3dm0WAwWy/NVeioZh5AntkdJoWKxHxcmyP622fOkgHa4z3R0TdBJICINyaSDE6uNwVc8gZr+ZinwZAH4xIA==", "bundled": true, "optional": true }, "set-blocking": { "version": "2.0.0", - "resolved": "https://registry.npmjs.org/set-blocking/-/set-blocking-2.0.0.tgz", "bundled": true, "optional": true }, "signal-exit": { "version": "3.0.2", "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.2.tgz", + "integrity": "sha1-tf3AjxKH6hF4Yo5BXiUTK3NkbG0=", "bundled": true, "optional": true }, "string_decoder": { "version": "1.1.1", "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.1.1.tgz", + "integrity": "sha512-n/ShnvDi6FHbbVfviro+WojiFzv+s8MPMHBczVePfUpDJLwoLT0ht1l4YwBCbi8pJAveEEdnkHyPyTP/mzRfwg==", "bundled": true, "optional": true, "requires": { @@ -21115,6 +21135,7 @@ "string-width": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/string-width/-/string-width-1.0.2.tgz", + "integrity": "sha1-EYvfW4zcUaKn5w0hHgfisLmxB9M=", "bundled": true, "optional": true, "requires": { @@ -21126,6 +21147,7 @@ "strip-ansi": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz", + "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=", "bundled": true, "optional": true, "requires": { @@ -21135,6 +21157,7 @@ "strip-json-comments": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-2.0.1.tgz", + "integrity": "sha1-PFMZQukIwml8DsNEhYwobHygpgo=", "bundled": true, "optional": true }, @@ -21155,6 +21178,7 @@ "util-deprecate": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/util-deprecate/-/util-deprecate-1.0.2.tgz", + "integrity": "sha1-RQ1Nyfpw3nMnYvvS1KKJgUGaDM8=", "bundled": true, "optional": true }, @@ -21169,12 +21193,12 @@ "wrappy": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz", + "integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=", "bundled": true, "optional": true }, "yallist": { "version": "3.0.2", - "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.0.2.tgz", "bundled": true, "optional": true } @@ -26036,6 +26060,12 @@ "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz", "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA==" }, + "react-loading": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/react-loading/-/react-loading-2.0.3.tgz", + "integrity": "sha512-Vdqy79zq+bpeWJqC+xjltUjuGApyoItPgL0vgVfcJHhqwU7bAMKzysfGW/ADu6i0z0JiOCRJjo+IkFNkRNbA3A==", + "requires": {} + }, "react-modal": { "version": "3.11.2", "resolved": "https://registry.npmjs.org/react-modal/-/react-modal-3.11.2.tgz", diff --git a/package.json b/package.json index ad62dcc..ebae04f 100644 --- a/package.json +++ b/package.json @@ -11,6 +11,7 @@ "react-dom": "^16.8.6", "react-ga": "^3.3.0", "react-icons": "^3.10.0", + "react-loading": "^2.0.3", "react-modal": "^3.11.2", "react-photo-gallery": "^8.0.0", "react-reveal-text": "^0.1.1", diff --git a/src/App.js b/src/App.js index 45f8ac9..7f5bbed 100644 --- a/src/App.js +++ b/src/App.js @@ -6,7 +6,6 @@ import MyJourney from './Components/MyJourney'; import { configureAnchors } from 'react-scrollable-anchor'; import { library } from '@fortawesome/fontawesome-svg-core' import { faIgloo, faChevronRight, faChevronLeft } from '@fortawesome/free-solid-svg-icons'; -import newData from './Components/newData'; import ScrollableAnchor from 'react-scrollable-anchor'; import Gallery from "react-photo-gallery"; import photos from './Components/photos'; @@ -14,6 +13,7 @@ import spot from './Components/spot'; import { Tab, Tabs, TabList, TabPanel } from 'react-tabs'; import 'react-tabs/style/react-tabs.css'; import Footer from './Components/Footer'; +import ReactLoading from 'react-loading'; library.add(faIgloo) library.add(faChevronRight) @@ -28,10 +28,16 @@ class App extends Component { super(props); this.state = { selectedFilm: {}, - photo: '' + photo: '', + data: null } } + componentDidMount() { + fetch(`https://assets.yuvanselva.in/sitedata.json`) + .then(resp => resp.json()) + .then(resp => setTimeout(() => this.setState({ data: resp }), 10000)) + } selectFilm = film => { const { selectedFilm } = this.state; if (film && (film.name !== selectedFilm.name)) { @@ -42,7 +48,7 @@ class App extends Component { render() { - const { selectedFilm } = this.state; + const { selectedFilm, data } = this.state; return (
@@ -51,7 +57,8 @@ class App extends Component {
PORTFOLIO
- {Object.keys(newData).map(year => Number(year)).sort().reverse().map(year => String(year)).map((year, index) => )} + {data ? Object.keys(data).map(year => Number(year)).sort().reverse().map(year => String(year)).map((year, index) => ) :
+
}
diff --git a/src/Components/Portfolio/Portfolio.js b/src/Components/Portfolio/Portfolio.js index 41ceb2d..ea079f4 100644 --- a/src/Components/Portfolio/Portfolio.js +++ b/src/Components/Portfolio/Portfolio.js @@ -1,6 +1,5 @@ import React, { Component } from 'react'; import Card from '../Card/Card'; -// import films from '../VideoData/data'; import _map from 'lodash/map'; import ScrollableAnchor from 'react-scrollable-anchor' import Description from '../Description/Description.js'; diff --git a/src/Components/VideoData/data.js b/src/Components/VideoData/data.js deleted file mode 100644 index 599a4b7..0000000 --- a/src/Components/VideoData/data.js +++ /dev/null @@ -1,76 +0,0 @@ -const shortFilms = [{ - id:1, - videoId: 'Asvdcp_bHKQ', - title: '2003', - thumbnail:'0' -}, -{ - id:2, - videoId: '7qrJanaA-5Q', - title: 'VALAI', - thumbnail:'0' -}, -{ - id:3, - videoId: 'qcYAlntDJt8', - title: 'BADHIL NEE', - thumbnail:'0' -}, -{ - id:4, - videoId: 'vw-nFqfVYsA', - title:'ADUTHU', - thumbnail:'0' - -}, -{ - id:5, - videoId: 'iVyNINCyrQs', - title:'7 SHOTS', - thumbnail:'0' -}, -{ - id:6, - videoId: 'h6tvOXGrlFM', - title:'DUB THERI STEP', - thumbnail:'0' -}, -{ - id:7, - videoId: 'WAD2wYLl1vQ', - title:'THE SUBWAY', - thumbnail:'0' -}, -{ - id:8, - videoId: 'BZVXAthmBBc', - title:'ADIYE AZHAGE', - thumbnail:'0' -}, -{ - id:9, - videoId: 'zWf2P0CJRNE', - title:'CONSCIENCE', - thumbnail:'0' - -}, -{ - id:10, - videoId: 'e2zlA4JHa_8', - title: 'AILESA', - thumbnail:'0' -}, -{ - id:10, - videoId: '_GZa6HJI37Y', - title: 'ADI PENNE', - thumbnail:'0' -}, -{ - id:11, - videoId: 'YaoAFvYOMSY', - title: 'UNAKENA NAAN', - thumbnail:'0' -}] - -export default shortFilms; \ No newline at end of file diff --git a/src/Components/newData.js b/src/Components/newData.js deleted file mode 100644 index 0b00cce..0000000 --- a/src/Components/newData.js +++ /dev/null @@ -1,440 +0,0 @@ -const filmData = { - 2014: [{ - name: '2003', - videoId: 'Asvdcp_bHKQ', - sampleVideo: '2003.mp4', - thumbnail: '0', - trailer: 'wQySBIVzKdY', - year: '2014', - type: 'SHORT FILM', - genre: 'ACTION | COMEDY', - duration: '13:31', - summary: 'Two best friends of opposite poles, one is very soft and the other is brave and daring. They both face an unexpected conflict and rest storyline shows how they face it in a cinematic way.', - //personalNote: 'This is my First ever project in which I learned Cinematography, Editing, DI, Poster Designing and even Title Animation. This project got very popular among the students and faculties of our college since everyone praised that this doesn’t seem like our first project.', - trivia: 'Not only for me, it is the first project for everyone in the whole project, both on and off screen.', - crew: { - Director: 'Ashik Siddhu', - Music: "Copyrighted original background score of ‘Raajapaatai’", - Feat: ["Nittin", "Gokul", "Deepan Chakravarthy", "Vishnu", "Bala Karthik", "Kirosh", "Rajalu", "Arunraj"] - }, - equipment: { - Camera: 'Canon 50D', - Lens: 'Canon 18-55mm f/4', - Lights: 'Natural Source', - } - }], - 2016: [{ - name: 'VALAI', - videoId: '7qrJanaA-5Q', - thumbnail: '0', - trailer: 'zvDYKzGrlK0', - sampleVideo: 'Valai.mp4', - year: '2016', - type: 'SHORT FILM', - genre: 'LOVE | ACTION | SUSPENSE | THRILLER', - duration: '38:37', - summary: 'Two couples and a small time gangster who is a mutual friend to them, all faces a conflct which are interconnected with each other. An unknown cyber criminal in the name of ‘Robert’ who threatens non-loyal couples by secretly capturing their private moments come into these five peoples and adds more trouble to the already existing conflict.', - //personalNote: 'After the success of our first project ‘2003’ the same team decided to make another project together. But this time we decided to make a complete package so we wanted almost all the elements and make into a mini feature film look-a-like. The shoot took place only around 10-15 days but with lots of gaps in-between each day of shoot, it literally took us almost 1.5 years to complete the entire process from scratch till screening.', - trivia: 'Used 5D mark III for the very first time which was a dream camera to all the viscom students during 2016s.', - crew: { - Director: 'Ashik Siddhu', - Music: "A.K. Priyan", - Feat: ["Nittin", "Bala Karthik", "Gokul", "Jency", "Deepa"], Lyrics: ["Abilash Evin | Poet Vicks"] - }, - equipment: { - Camera: 'Canon 5D mark III', - Lens: 'Canon 24-105mm f/4 | Canon 50mm f1.8', - Lights: '1000w SunGun', - } - }, { - name: 'BADHIL NEE', - videoId: 'qcYAlntDJt8', - thumbnail: '0', - trailer: 'L6EPsJol1h8', - sampleVideo: 'Badhil Nee.mp4', - year: '2016', type: 'SHORT FILM', - genre: 'DRAMA', - duration: '10:07', - summary: 'A small play about a father’s love towards his son followed by the son’s future son.', - //personalNote: 'It’s my first project which I did out of my college. It’s one of my personal favourite and close to heart since it was the my first project which was praised by people apart from general audience and also because of the concept.', - trivia: 'The Shoot took place from early morning till night followed by Editing and DI on the same night and completed before next day early morning, so approximately 24hours. The film also got multiple awards from various film festivals in various categories including 4 awards for Cinematography and 2 for Editing.', - crew: { - Director: 'Gautham Shankar', - Music: "Asif Hussain", - Feat: ["Sheshadri", "Yuvraj", "Gautham Shankar", "Rubina Khan"], - Lyrics: ["Gautham Shankar"] - }, - equipment: { - Camera: 'Canon 5D mark III', - Lens: 'Canon 24-105mm f/4', - Lights: 'SunGun', - } - }, { - name: 'ADUTHU', - videoId: 'vw-nFqfVYsA', - thumbnail: '0', - trailer: 'VX5BwnlpLBI', - sampleVideo: 'Aduthu.mp4', - year: '2016', type: 'SHORT FILM', - genre: 'SUSPENSE | THRILLER', - duration: '20:13', - summary: 'A small play about a lonely writer who faces a very unusual game played by an unknown antagonist.', - //personalNote: 'This was actually the first script narrated to me by Gautham Shankar but due to some changes we shot ‘Badhil Nee’. I was excited working through out the project since it’s my first project to have an experienced and professional Art director.', - trivia: 'The first project in which I used basic professional lights.', - crew: { - Director: 'Gautham Shankar', - Music: "Shri Sastha", - Feat: ["Sathish Bala", "Tamim"], - "Art Director": "C.S. Kamal Hasan", - "Audiography": "Vignesh Baskaran", - "VFX | Title Animation": "Anantha Krishnan" - }, - equipment: { - Camera: 'Canon 5D mark III', - Lens: 'Canon 24-105mm f/4 | Tokino 11-20mm f/2.8', - Lights: '575w LED Spot Warm', - } - }, { - name: 'PSYX - DUB THERI STEP', - videoId: 'h6tvOXGrlFM', - thumbnail: '0', - trailer: '', - sampleVideo: 'PsyX - Dub Theri Step.mp4 ', - year: '2016', type: 'DANCE COVER', - genre: 'DANCE', - duration: '1:58', - summary: 'A fan made dance cover of the song ‘Dub Theri Step’ from the Tamil feature film ‘Theri’.', - //personalNote: 'Ashwin who was my college mate wanted me to work for his friend’s dance cover and I jumped into the project immediately since I haven’t made any dance videos.', - trivia: 'The whole project was shot handheld with a single lens and natural light source.', - crew: { - Director: 'Ashwin PM', - "Original Music": "G.V. Prakash Kumar", - Feat: ["Santhosh", "JR"] - }, - equipment: { - Camera: 'Canon 7D mark II', - Lens: 'Canon 24-105mm f/4', - Lights: 'Natural Source', - } - }, { - name: '7 SHOTS', - videoId: 'iVyNINCyrQs', - thumbnail: '0', - trailer: '', - sampleVideo: '7 Shots.mp4', - year: '2016', type: 'SHORT FILM', - genre: 'PSYCHO | DRAMA', - duration: '01:00', - summary: 'A psychologically affected AIDS patient is counting his days and what he did for survival is totally psychopathic.', - //personalNote: 'After working on ‘Badhil Nee’ and ‘Aduthu’ Director Gautham Shankar came back with a totally challenging concept of making a One Minute short film. Whatever the plot maybe, the Director always has something technically challenging which I quest for the most so I never turn down his offer.', - trivia: 'Most of the audience took this as a teaser and asked for the original release date.', - crew: { - Director: 'Gautham Shankar', - "Original Music": "Asif Hussain", - Feat: ["Yuv Raj"], - "Sound Designing": "Vignesh Baskaran", - Lyrics: "Gautham Shankar" - }, - equipment: { - Camera: 'Canon 5D mark III', - Lens: 'Canon 24-105mm f/4', - Lights: 'Sungun', - } - }], - 2017: [{ - name: 'THE SUBWAY', - videoId: 'WAD2wYLl1vQ', - thumbnail: '1', - trailer: '', - sampleVideo: 'The Subway.mp4', - year: '2017', type: 'SHORT FILM', - genre: 'SUSPENSE | THRILLER', - duration: '16:31', - summary: 'An IT working girl misses her cab and she needs to make her way back home during late night, all alone.', - //personalNote: 'It seemed very interested when a physics professor from a very reputed college in Chennai wanted to direct a short film with me handling the visuals. Not only for this reason, I was also waiting to make a project completely shot at night as it was a nightmare for me a long time since I haven’t tried one. Taking to one more step further I shot the whole short film with available street light sources.', - trivia: '95% of the film is shot only under available street light source around 8 hours on 2 nights undergoing several admonishment from the night patrol. We almost got arrested on the second day. The film got released hardly after 1.5 years of completion.', - crew: { - Director: 'Vijay Ayyanar', - "Original Music": "A.K. Priyan", - Feat: ["Karima Ameer", "Manikandan Venugopal", "Anand Raj", "Ezhumalai", "Sarav", "Real Raja", "Sudhakar", "Thangam"], - "Sound Designing": "Vignesh Baskaran" - }, - equipment: { - Camera: 'Canon 5D mark III', - Lens: 'Canon 24-105mm f/4 | Tokino 11-18mm f/2.8 | Sony Carl Zeis 85mm f/1.8', - Lights: 'Natural Source', - } - }, { - name: 'ADIYE AZHAGE', - videoId: 'BZVXAthmBBc', - thumbnail: '0', - trailer: 'O4c0hDfdlBA', - sampleVideo: 'Adiye Azhage.mp4', - year: '2017', type: 'MUSIC VIDEO', - genre: 'LOVE | BREAK UP', - duration: '06:39', - summary: 'Two love stories, One is about to mingle together and the other is about to break apart.', - //personalNote: 'I got a call from Samir Ahmed FL when I was in my native, he introduced himself as a person with more than 50k followers in Facebook and he wanted me to handle the visuals for a song in which he would feature. I blindly accepted this offer immediately for three reasons, I haven’t done any music videos so far and was hardly waiting for, I have done around 6 projects and nothing reached more than 6k views on YouTube and since He said he got 50k followers I wish it would be my first project to reach atleast 25k and finally this is going to be my first project in Coimbatore so I expected after this project I would also be getting projects from Coimbatore.', - trivia: 'Day 1 of shoot was a loss of around 20k since we were shooting in a no-trespassing area and our equipments got seized by the Vigilance department, so we ought to reshoot again. It was my first Music Video and first project worked on my brand new Mac Pro.', - crew: { - Director: 'Samir Ahmed FL', - "Original Music": "Stanley Xavier", - Feat: ["Samir Ahmed FL", "Preetha", "Giri Prasad", "Kaviya Soundararajan"], - Lyrics: "Shakthi Sivamani" - }, - equipment: { - Camera: 'Sony a7 s II | DJI Osmo | DJI Phantom 4', - Lens: 'Samyang Lens Kit', - Lights: '4kv Dino | CFL 4 bank | LED | Multi 20', - } - }, { - name: 'CONSCIENCE SINGLE SHOT', - videoId: 'zWf2P0CJRNE', - thumbnail: '0', - trailer: '', - sampleVideo: 'Conscience Single Shot.mp4', - year: '2017', type: 'SHORT FILM', - genre: 'ADULT', - duration: '09:29', - summary: 'A single take scene from the unreleased Independent film which shows the important characters in the film talking casual adult things in their day to day life.', - //personalNote: 'The Director was actually an IT employee who met me during the screening of the Tele film ‘VALAI’ who already directed a short film named ‘HUSTLE’. The first impression about him was his bold content which is something I was wanted to try apart from scripts under my comfort zone.', - trivia: 'We completed 3 days of shoot with a cast including this single take. After a monitor cut the Director was not satisfied with the performance and changed the complete cast except for one. We took this same shot one more time but this time with more single take duration than the previous one.', - crew: { - Director: 'Pradeep Rajan', - "Original Music": "A.K. Priyan", - Feat: ["Aravind Shankar", "Bala Karthik", "Manikandan", "Vikraman", "Aditya"], - Lyrics: "Shakthi Sivamani" - }, - equipment: { - Camera: 'DJI OSMO', - Lens: 'Inbuilt', - Lights: 'Natural Source', - } - }], - 2018: [{ - name: 'AILESA', - videoId: 'e2zlA4JHa_8', - thumbnail: '0', - trailer: 'Y7oxrQxEI24', - sampleVideo: 'Ailesa.mp4', - year: '2018', type: 'MUSIC VIDEO', - genre: 'LOVE | FOLK', - duration: '05:29', - summary: 'A jovial guy and his daydream about a girl who is a popular youtube celebrity. He makes his own storyline for his dream love and ends with a conclusion of his wish.', - //personalNote: 'Shakthi Sivamani who already gave an youtube hit called ‘NERAM’ know each other in ‘Adiye Azhage’ in which he handled the lyrics. I was already waiting for ‘Ailesa’ for which he released a sneak peek. But then he contacted me for the very first time, just a week before the shoot which was already planned, telling me that the team who handled the visuals of ’NERAM’ was unavailable to work for ‘AILESA’ and wanted me to handle the visuals. Fortunately I had no plans on that upcoming week and immediately accepted. I travelled to Coimbatore the very next day and had a very positive meet up, came back Chennai and again went back there two days prior the shoot date, completed all the pre-production works and yes, ‘Ailesa’ was shot.', - trivia: 'It was my first ever project handled in RED. Since we had a very tight schedule in completing the pre-production work, I learned how to handle RED in YouTube just during our travel to the shooting spot.', - crew: { - Director: 'Shakthi Sivamani', - "Original Music": "Shakthi Sivamani", - Feat: ["Balaji Radhakrishnan", "Harija"], - Lyrics: "Shakthi Sivamani" - }, - equipment: { - Camera: 'RED Scarlet', - Lens: 'CP 2', - Lights: '1kv HMI | 4 bank', - } - }, { - name: 'BEJAARU', - videoId: 'gXrEavtIFA0', - thumbnail: '0', - trailer: '5Jp0muW65bQ', - sampleVideo: 'Bejaaru.mp4', - year: '2018', type: 'MUSIC VIDEO', - genre: 'FOLK | LOVE | MASS', - duration: '07:12', - summary: 'A ‘Weightu Guy’ in a area sings and dances about himself and his friends. He too falls in love with a girl next door and romances with her in his dream.', - //personalNote: 'After a year decided to work again with Samir Ahmed FL but this time with a simple twist. Since I came to know the project has two music directors and the song itself has two genres on its own, I decided that it should also have two Cinematographers so that visuals look in two different kind. So I roped in my close Cinematographer buddy ‘Giftson’ on board.', - trivia: 'Giftson was actually approached first by Samir Ahmed FL for ‘Adiye Azhage’, But unfortunately he was unavailable at that time, only then the offer came to me. So I thought I should make him work with Samir Ahmed FL for sure.', - crew: { - Director: 'Samir Ahmed FL', - "Original Music": "EbyNavis", - Feat: ["Samir Ahmed FL", "Preethi"], - Lyrics: "Nandha | Sulthan | Gramathu Pasanga" - }, - equipment: { - Camera: 'RED Epic', - Lens: 'CP 2', - Lights: 'Multi 20 | 4 bank', - } - }, { - name: 'YUVAN MASHUP 2K18', - videoId: '1CViJDo_YGk', - thumbnail: '0', - trailer: '', - sampleVideo: 'Yuvan Mashup 2K18.mp4', - year: '2018', type: 'TRIBUTE VIDEO', - genre: 'MASHUP', - duration: '07:38', - summary: 'A Tribute Mashup Cover to the Little Maestro ‘Yuvan Shankar Raja’', - //personalNote: 'Stanley Xavier and myself know each other from ‘Adiye Azhage’. Initially I was called to handle the visuals for ‘AR Mashup’ but unfortunately I couldn’t make it due to some reasons. But for ‘Yuvan Mashup 2K18’ I made sure not to miss it since it was a Tribute for one of my most favourite Music Composer.', - trivia: 'The whole production work (from making the set till the last shot) was done 52hours non-stop without break by the entire crew.', - crew: { - Director: 'Stanley Xavier', - "Original Music": "Single by Two", - Feat: ["Stanley Xavier", "Sathya Narayanan"], - }, - equipment: { - Camera: 'Sony a7 3', - Lens: 'CP 2', - Lights: '2.5 HMI | 4 bank | 4kv Dino | LED', - } - }], - 2019: [{ - name: 'NEEDHI', - videoId: 'pCV2SKSWjP4', - thumbnail: '0', - trailer: '9o7fQWUYb3U', - sampleVideo: 'Needhi.mp4', - year: '2019', type: 'MUSIC VIDEO', - genre: 'FAMILY DRAMA', - duration: '09:27', - summary: 'A Tale of a Girl child evolving into a Women along with her Father and Brother.', - //personalNote: 'After ‘Ailesa’ Harija wanted me to tie up with her once again but this time with some sensitive content. This lead me to the collaboration with a new team lead by Charukesh, the Director and the Male lead of ‘Needhi’. I really loved working with this cool positive team and had a nice time with their family too !', - trivia: 'The actual shoot was already over but unfortunately due to some data errors few rushes got corrupted, so we needed to reshoot another day. Since we had more time during the re-shoot we also shot the Promo of ‘Needhi’.', - crew: { - Director: 'Charukesh', - Music: "Shyam Sasikumar", - Feat: ["Harija", "Charukesh", "Ashok Kumar", "Prasanth"], - Lyrics: "Sharan Kumar" - }, - equipment: { - Camera: 'Red Dragon', - Lens: 'CP 2 | CP 3 | HR Zoom', - Lights: '2.5 HMI | 4 bank | 4kv Dino | Baby', - } - }], - 2020: [{ - name: 'UYIRE', - videoId: 'oDpdiNQQL94', - thumbnail: '0', - trailer: '', - sampleVideo: 'Uyire.mp4', - year: '2020', type: 'MUSIC VIDEO', - genre: 'ROMANCE', - duration: '05:59', - summary: 'A livin couples ends up their relationship and a day comes where the girl attends the marriage ceremony for his partner with another woman, what will happen if this situation happens ?', - //personalNote: '', - trivia: 'My first project shot on ARRI.', - crew: { - Director: 'SanthoshKumar Kuppusamy', - Music: "KM Rayan", - Singer:"Vishaal Ganesh | Vishwa Ganesh", - Feat: ["Balaji Murugadoss", "Bommu Lakshmi"], - Lyrics: "Ku Karthik" - }, - equipment: { - Camera: 'ARRI Alexa XTplus', - Lens: 'SIGMA Prime Lens kit | Alura Zoom', - Lights: '4kv PAR | 1.2kv PAR | 6kv Dino | 2kv Junior | S60 Skypanel', - } - }, { - name: 'MAYA', - videoId: 'f9kp3reFjoo', - thumbnail: '0', - trailer: 'eTAoxtI2C2Y', - sampleVideo: 'Maya.mp4', - year: '2020', type: 'MUSIC VIDEO', - genre: 'MELODRAMA', - duration: '05:30', - summary: 'How much will it pain if you loose the one you loved the most in your whole life ?', - ////personalNote: '', - trivia: 'All the locations in this Music Video were actually from Chennai which most of the people haven’t witnessed. It was my first International collaboration.', - crew: { - Director: 'Ashwin PM', - Music: "SATTHIA", - Feat: ["Satthia", "Lavanya"], - Lyrics: "Raghadeepan" - }, - equipment: { - Camera: 'Red Dragon', - Lens: 'CP 3 Lens kit | HR Zoom', - Lights: 'S60 Skypanel | S30 Skypanel | Digitek DRL 18', - } - }, - { - name: 'SINGLE 3', - videoId: 'qs0-cg-_ntE', - thumbnail: '0', - trailer: 'GmTfx6UAnbc', - sampleVideo: 'single_3.mp4', - year: '2020', type: 'MUSIC VIDEO', - genre: 'SAD LOVE', - duration: '06:25', - summary: 'The emotional travel of a middle class boy who lost his relationship with his girl and the reason behind that was just money.', - ////personalNote: '', - trivia: 'This is officially my final Music Video collabration with Samir Ahmed FL, since we are planning for more bigger things.', - crew: { - Director: 'Samir Ahmed FL', - "Aerial Cinematography": "Anandh Abin", - Music: "Vicky", - Vocals: ["Dhinesh Nagarajan", "Santhosh"], - Feat: ["Samir Ahmed FL", "Janani Ashok Kumar"], - Lyrics: "Grammathu Pasanga (Santhosh)", - - } - }, - { - name: 'EN UYIR THOZHA', - videoId: 'dpAgdN3jH3w', - thumbnail: '0', - trailer: 'S_o04qHBWtQ', - sampleVideo: 'en_uyir_thozha.mp4', - year: '2020', type: 'MUSIC VIDEO', - genre: 'MOTIVATION', - duration: '03:33', - summary: 'A motivational anthem for all the youngsters out there through an inspiring icon.', - ////personalNote: '', - trivia: 'This is the first ever Video appearance for Captain Vijayakanth’s Son, Vijaya Prabhakaran.', - crew: { - Director: "Jeffrey Jonathan", - "Aerial Cinematography": "J. Leo Nardo Davinci", - Music: "Jeffrey Jonathan", - Vocals: "Vijaya Prabhakaran", - Feat: ["Vijaya Prabhakaran"], - Lyrics: "Puratchi Nambi" - } - }], - 2022: [ - { - name: 'HELLO KEKUDHA', - videoId: '_BFp2UAMtYQ', - thumbnail: '0', - trailer: 'BBcw4QfB3NQ', - sampleVideo: 'HelloKekudha.mp4', - year: '2022', type: 'MUSIC VIDEO', - genre: 'JAZZ EDM FUSION', - duration: '05:08', - summary: "The Emotion of a Man who never wanted to loose his Woman, expressed through his Song.", - //personalNote: '', - trivia: 'Except some erasal shots, no other VFX works has been in this Music Video. All these visual elements are achieved using practical elements, without the usage of CGI.', - crew: { - Director: 'Ashwin PM', - Music: "Robert Sargunam", - Singer:"Teejay Arunasalam & Robert Sargunam", - Feat: ["Teejay Arunasalam", "Anukreety Vas", "Robert Sargunam"], - Lyrics: "Vignesh Ramakrishna" - }, - },{ - name: 'KARUPAZHAGI', - videoId: 'thHcg-DLSfA', - thumbnail: '0', - trailer: 'e_ZFCXev6PQ', - sampleVideo: 'Karupazhagi.mp4', - year: '2022', type: 'MUSIC VIDEO', - genre: 'FOLK DANCE', - duration: '06:30', - summary: "Karupazhagi takes you into the journey of a heart warming love story between two Dusky beauties and the song takes it's pride for South Indian Colour through it's lyrics.", - //personalNote: '', - trivia: 'After 2 years of Lockdown between countries it was once again my second Singapore collaboration. The outdoor portions of the song was entirely shot with available natural light source.', - crew: { - Director: 'Adithya Tangirala', - Music: "Satthia", - Singer:"Satthia | Rakshita Suresh", - Feat: ["Satthia Nallaiah", "Teja Venkatesh"], - Lyrics: "Raghadeepan | Oviya Oommapathy" - }, - }] -} - -export default filmData; \ No newline at end of file diff --git a/src/index.css b/src/index.css index c8ad9f5..39b2205 100644 --- a/src/index.css +++ b/src/index.css @@ -200,4 +200,12 @@ video { font-size: 15px; font-weight: bold; } +} + +.spinner { + width: 100%; + display:flex; + flex-direction: row; + justify-content: center; + align-items: center; } \ No newline at end of file diff --git a/yarn.lock b/yarn.lock index 4add308..e3bdb3a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -7396,6 +7396,11 @@ "resolved" "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz" "version" "3.0.4" +"react-loading@^2.0.3": + "integrity" "sha512-Vdqy79zq+bpeWJqC+xjltUjuGApyoItPgL0vgVfcJHhqwU7bAMKzysfGW/ADu6i0z0JiOCRJjo+IkFNkRNbA3A==" + "resolved" "https://registry.npmjs.org/react-loading/-/react-loading-2.0.3.tgz" + "version" "2.0.3" + "react-modal@^3.11.2": "integrity" "sha512-o8gvvCOFaG1T7W6JUvsYjRjMVToLZgLIsi5kdhFIQCtHxDkA47LznX62j+l6YQkpXDbvQegsDyxe/+JJsFQN7w==" "resolved" "https://registry.npmjs.org/react-modal/-/react-modal-3.11.2.tgz" @@ -7492,7 +7497,7 @@ "clsx" "^1.1.0" "prop-types" "^15.5.0" -"react@*", "react@^0.14.0 || ^15.0.0 || ^16", "react@^15.3.0 || ^16.0.0", "react@^15.6.2 || ^16.0 || ^17", "react@^16.0.0", "react@^16.3.0", "react@^16.8.0", "react@^16.8.6", "react@15.x.x || 16.x.x", "react@16.x": +"react@*", "react@^0.14.0 || ^15.0.0 || ^16", "react@^15.3.0 || ^16.0.0", "react@^15.6.2 || ^16.0 || ^17", "react@^16.0.0", "react@^16.3.0", "react@^16.8.0", "react@^16.8.6", "react@>=0.14.0", "react@15.x.x || 16.x.x", "react@16.x": "integrity" "sha512-M5Y8yITaLmU0ynd0r1Yvfq98Rmll6q8AxaEe88c8e7LxO8fZ2cNgmFt0aGAS9wzf1Ao32NKXtCl+/tVVtkxq6g==" "resolved" "https://registry.npmjs.org/react/-/react-16.11.0.tgz" "version" "16.11.0"