From 5204cfb1dd845b2d8e0e029d28b9b15506bff5eb Mon Sep 17 00:00:00 2001
From: TrishenSuresh <22876425+TrishenSuresh@users.noreply.github.com>
Date: Sat, 10 Apr 2021 17:05:12 +0800
Subject: [PATCH 1/6] Initial display of the users list
---
app.py | 22 +
static/css/custom.css | 43 +
static/js/home.js | 37 +
static/js/jquery.js | 10881 ++++++++++++++++++++++++++++++++++++++++
templates/home.html | 47 +
5 files changed, 11030 insertions(+)
create mode 100644 app.py
create mode 100644 static/css/custom.css
create mode 100644 static/js/home.js
create mode 100644 static/js/jquery.js
create mode 100644 templates/home.html
diff --git a/app.py b/app.py
new file mode 100644
index 0000000..3366203
--- /dev/null
+++ b/app.py
@@ -0,0 +1,22 @@
+from flask import Flask, request, render_template, jsonify, make_response
+import requests
+
+app = Flask(__name__)
+app.debug = True
+
+@app.route('/')
+def hello_world():
+ return render_template('home.html')
+
+@app.route("/get_user", methods=['GET'])
+def get_user():
+ page = request.args.get('page', default = 1, type = int)
+ url = "https://reqres.in/api/users?page={}".format(page)
+ response = requests.get(url)
+ if response.ok:
+ return jsonify(response.text)
+ else:
+ abort(400)
+
+if __name__ == '__main__':
+ app.run()
\ No newline at end of file
diff --git a/static/css/custom.css b/static/css/custom.css
new file mode 100644
index 0000000..f5dec1a
--- /dev/null
+++ b/static/css/custom.css
@@ -0,0 +1,43 @@
+body {
+ background-color: #B3E5FC;
+ border-radius: 10px
+}
+
+.card {
+ width: 400px;
+ border: none;
+ border-radius: 10px;
+ background-color: #fff
+}
+
+.stats {
+ background: #f2f5f8 !important;
+ color: #000 !important
+}
+
+.articles {
+ font-size: 10px;
+ color: #a1aab9
+}
+
+.number1 {
+ font-weight: 500
+}
+
+.followers {
+ font-size: 10px;
+ color: #a1aab9
+}
+
+.number2 {
+ font-weight: 500
+}
+
+.rating {
+ font-size: 10px;
+ color: #a1aab9
+}
+
+.number3 {
+ font-weight: 500
+}
\ No newline at end of file
diff --git a/static/js/home.js b/static/js/home.js
new file mode 100644
index 0000000..456b3fb
--- /dev/null
+++ b/static/js/home.js
@@ -0,0 +1,37 @@
+$( document ).ready(function() {
+ $.ajax({
+ type: "GET",
+ url: "get_user",
+ success: function(response) {
+ var userList = JSON.parse(response)
+ fillUsers(userList);
+ }
+ });
+});
+
+
+function fillUsers(userList) {
+ $(".users").empty();
+
+ var userPage = $(".users");
+ var userTemplateRow = $(".user-row-template").clone();
+
+ $.each(userList.data, function(k,v) {
+
+ var userTemplate = userTemplateRow.find('.user-template').first();
+
+ userTemplate.find('.user-image').attr('src', v.avatar);
+ userTemplate.find('.user-name').text(v.first_name + " " +v.last_name);
+ userTemplate.find('.user-mail').text(v.email);
+ userTemplate.find('.btn-edit').attr('userid', v.id);
+ userTemplate.find('.btn-delete').attr('userid', v.id);
+
+ userTemplate.removeClass('user-template invisible');
+
+ if(userTemplateRow.find('.user-template').length == 0) {
+ userTemplateRow.removeClass("user-row-template invisible");
+ userPage.append(userTemplateRow);
+ userTemplateRow = $(".user-row-template").clone();
+ }
+ });
+}
\ No newline at end of file
diff --git a/static/js/jquery.js b/static/js/jquery.js
new file mode 100644
index 0000000..fc6c299
--- /dev/null
+++ b/static/js/jquery.js
@@ -0,0 +1,10881 @@
+/*!
+ * jQuery JavaScript Library v3.6.0
+ * https://jquery.com/
+ *
+ * Includes Sizzle.js
+ * https://sizzlejs.com/
+ *
+ * Copyright OpenJS Foundation and other contributors
+ * Released under the MIT license
+ * https://jquery.org/license
+ *
+ * Date: 2021-03-02T17:08Z
+ */
+( function( global, factory ) {
+
+ "use strict";
+
+ if ( typeof module === "object" && typeof module.exports === "object" ) {
+
+ // For CommonJS and CommonJS-like environments where a proper `window`
+ // is present, execute the factory and get jQuery.
+ // For environments that do not have a `window` with a `document`
+ // (such as Node.js), expose a factory as module.exports.
+ // This accentuates the need for the creation of a real `window`.
+ // e.g. var jQuery = require("jquery")(window);
+ // See ticket #14549 for more info.
+ module.exports = global.document ?
+ factory( global, true ) :
+ function( w ) {
+ if ( !w.document ) {
+ throw new Error( "jQuery requires a window with a document" );
+ }
+ return factory( w );
+ };
+ } else {
+ factory( global );
+ }
+
+// Pass this if window is not defined yet
+} )( typeof window !== "undefined" ? window : this, function( window, noGlobal ) {
+
+// Edge <= 12 - 13+, Firefox <=18 - 45+, IE 10 - 11, Safari 5.1 - 9+, iOS 6 - 9.1
+// throw exceptions when non-strict code (e.g., ASP.NET 4.5) accesses strict mode
+// arguments.callee.caller (trac-13335). But as of jQuery 3.0 (2016), strict mode should be common
+// enough that all such attempts are guarded in a try block.
+"use strict";
+
+var arr = [];
+
+var getProto = Object.getPrototypeOf;
+
+var slice = arr.slice;
+
+var flat = arr.flat ? function( array ) {
+ return arr.flat.call( array );
+} : function( array ) {
+ return arr.concat.apply( [], array );
+};
+
+
+var push = arr.push;
+
+var indexOf = arr.indexOf;
+
+var class2type = {};
+
+var toString = class2type.toString;
+
+var hasOwn = class2type.hasOwnProperty;
+
+var fnToString = hasOwn.toString;
+
+var ObjectFunctionString = fnToString.call( Object );
+
+var support = {};
+
+var isFunction = function isFunction( obj ) {
+
+ // Support: Chrome <=57, Firefox <=52
+ // In some browsers, typeof returns "function" for HTML
-
-
-
+
+
+
-
-
-
-
-
-
-
-
-
Alex Morrision
Senior Journalist
-
+
+
+
+
+
+
+
+
Alex Morrision
Senior Journalist
+
+
-
-
-
-
-
-
-
-
-
Alex Morrision
Senior Journalist
-
+
+
+
+
+
+
+
Alex Morrision
Senior Journalist
+
+
-
+
+
+
+
+
+
+
+
+
+
+
Are you sure?
+
+
+
+
Do you really want to delete this user? This process cannot be undone.
+
+
+
+
+
-
+
+
+
+
+
+
+
+
Successfully deleted
+
+
+
+
User has been deleted.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
Successfully Updated
+
+
+
+
User has been updated.
+
+
+
+
+
+
+
+