Addition of a local mount volume with NFS and integration of files in…

… frontend

.gitignore

@@ -3,3 +3,5 @@
 
 # MacOS
 .DS_Store
+
+/data/data

Makefile

@@ -37,8 +37,9 @@ list_vtctld:
 	kubectl get pods --selector="planetscale.com/component=vtctld" -o custom-columns=":metadata.name"
 
 start_minikube:
-	minikube start --driver=hyperkit --kubernetes-version=v1.19.2 --cpus=10 --memory=11000 --disk-size=80g --extra-config=kubelet.authentication-token-webhook=true --extra-config=kubelet.authorization-mode=Webhook --extra-config=scheduler.address=0.0.0.0 --extra-config=controller-manager.address=0.0.0.0
+	minikube start --driver=hyperkit --mount --mount-string ./data:/mount_data --kubernetes-version=v1.19.2 --cpus=10 --memory=11000 --disk-size=80g --extra-config=kubelet.authentication-token-webhook=true --extra-config=kubelet.authorization-mode=Webhook --extra-config=scheduler.address=0.0.0.0 --extra-config=controller-manager.address=0.0.0.0
 	minikube addons disable metrics-server
+	echo "$(shell pwd)/data -alldirs -mapall="$(shell id -u)":"$(shell id -g)" $(shell minikube ip)" | sudo tee -a /etc/exports && sudo nfsd restart
 
 start_minikube_dashboard:
 	minikube dashboard

database/config/init/init_increment_seq.sql

@@ -1,3 +1,10 @@
+DROP TABLE IF EXISTS users_seq;
+DROP TABLE IF EXISTS user_read_seq;
+DROP TABLE IF EXISTS article_seq;
+DROP TABLE IF EXISTS be_read_seq;
+DROP TABLE IF EXISTS popularity_seq;
+DROP TABLE IF EXISTS read_stats_seq;
+
 CREATE TABLE users_seq(id INT, next_id BIGINT, cache BIGINT, PRIMARY KEY(id)) comment 'vitess_sequence';
 INSERT INTO users_seq(id, next_id, cache) VALUES(0, 1, 100);
 

frontend/models/articles.go

@@ -1,5 +1,12 @@
 package models
 
+import (
+	"fmt"
+	"io/ioutil"
+	"os"
+	"strings"
+)
+
 type Article struct {
 	ID          int64  `json:"id"`
 	Timestamp   int64  `json:"timestamp"`
@@ -14,3 +21,31 @@ type Article struct {
 	Image       string `json:"image"`
 	Video       string `json:"video"`
 }
+
+func (art *Article) GetAssetsInfo() ([]string, []string) {
+	staticPath := os.Getenv("STATIC_PATH")
+	imgs := strings.Split(art.Image, ",")
+	vids := strings.Split(art.Video, ",")
+
+	if art.Video == "" {
+		vids = []string{}
+	}
+	if art.Image == "" {
+		imgs = []string{}
+	}
+	for i := 0; i < len(imgs); i++ {
+		imgs[i] = fmt.Sprintf("%s/articles/article%d/%s", staticPath, art.ID, imgs[i])
+	}
+	for i := 0; i < len(vids); i++ {
+		vids[i] = fmt.Sprintf("%s/articles/article%d/%s", staticPath, art.ID, vids[i])
+	}
+	return imgs, vids
+}
+
+func (art *Article) GetText() (string, error) {
+	fc, err := ioutil.ReadFile(fmt.Sprintf("%s/articles/article%d/%s", os.Getenv("DATA_ASSETS_PATH"), art.ID, art.Text))
+	if err != nil {
+		return "", err
+	}
+	return string(fc), nil
+}

frontend/routes/articles.go

@@ -3,6 +3,7 @@ package routes
 import (
 	"log"
 	"net/http"
+	"os"
 	"strconv"
 
 	"github.com/frouioui/tagenal/frontend/client"
@@ -19,6 +20,12 @@ func articlesCategoryHandler(c echo.Context) error {
 	if err != nil {
 		return c.String(http.StatusOK, err.Error())
 	}
+	for i, ar := range ars {
+		imgs, _ := ar.GetAssetsInfo()
+		if len(imgs) > 0 {
+			ars[i].Image = imgs[0]
+		}
+	}
 	return c.Render(http.StatusOK, "articles_category.htm", map[string]interface{}{
 		"page":     "articles_category",
 		"category": category,
@@ -39,6 +46,12 @@ func articlesRegionHandler(c echo.Context) error {
 	if err != nil {
 		return c.String(http.StatusOK, err.Error())
 	}
+	for i, ar := range ars {
+		imgs, _ := ar.GetAssetsInfo()
+		if len(imgs) > 0 {
+			ars[i].Image = imgs[0]
+		}
+	}
 	return c.Render(http.StatusOK, "articles_region.htm", map[string]interface{}{
 		"page":     "articles_region",
 		"region":   region,
@@ -58,9 +71,22 @@ func articleIDHandler(c echo.Context) error {
 		log.Println(err.Error())
 		return c.String(http.StatusOK, err.Error())
 	}
+
+	txts, err := art.GetText()
+	if err != nil {
+		log.Println(err.Error())
+		return c.String(http.StatusOK, err.Error())
+	}
+
+	imgs, vids := art.GetAssetsInfo()
+
 	return c.Render(http.StatusOK, "article.htm", map[string]interface{}{
-		"page":    "article_id",
-		"id":      ID,
-		"article": art,
+		"page":        "article_id",
+		"assets_path": os.Getenv("DATA_ASSETS_PATH"),
+		"id":          ID,
+		"article":     art,
+		"text":        txts,
+		"imgs":        imgs,
+		"vids":        vids,
 	})
 }

frontend/templates/articles/article.htm

@@ -18,9 +18,36 @@ <h2>
                 <h2>
                     Text
                 </h2>
-                <p>
-                    {{.article.Text}}
-                </p>
+                <div class="text-wrap">
+                    <p class="text-justify">
+                        {{.text}}
+                    </p>
+                </div>
+                <h2>
+                    Media
+                </h2>
+                <h3>
+                    Photos
+                </h3>
+                <div class="row">
+                    {{range $img := .imgs}}
+                        <div class="col-md-4">
+                            <img src="{{$img}}" alt="image-{{$img}}" class="img-thumbnail img-fluid">
+                        </div>
+                    {{end}}
+                </div>
+                <h3>
+                    Videos
+                </h3>
+                <div class="row">
+                    {{range $vid := .vids}}
+                        <div class="col-md-4">
+                            <div class="embed-responsive embed-responsive-16by9">
+                                <iframe class="embed-responsive-item" src="{{$vid}}" allowfullscreen></iframe>
+                            </div>
+                        </div>
+                    {{end}}
+                </div>
             </div>
             <div class="col-md-4">
                 {{template "sidebararticle" .article}}

frontend/templates/articles/article_list.htm

@@ -1,6 +1,6 @@
 {{define "article_list"}}
 <div class="card mb-4">
-    <img class="card-img-top" src="http://placehold.it/750x300" alt="Card image cap">
+    <img class="card-img-top mx-auto d-block" src="{{.Image}}" alt="Card image cap" style="max-height: 120px; max-width: 120px;">
     <div class="card-body">
         <h2 class="card-title">{{.Title}}</h2>
         <p class="card-text">{{.Abstract}}</p>

kubernetes/frontend/frontend.yaml

@@ -33,6 +33,18 @@ spec:
           env:
             - name: JAEGER_SERVICE_NAME
               value: "frontend"
+            - name: DATA_ASSETS_PATH
+              value: "/assets/data"
+            - name: STATIC_PATH
+              value: "/static/data"
+          volumeMounts:
+            - name: assets
+              mountPath: /assets/data
+      volumes:
+      - name: assets
+        hostPath:
+          path: /mount_data/data
+          type: DirectoryOrCreate
 ---
 apiVersion: v1
 kind: Service

scripts/gen/README.md

@@ -10,6 +10,7 @@ To generate the data you must have all the required python packages:
 - pillow
 
 Here are the command lines to download the required packages:
+
 ```shell
 python3 -m pip install Pillow
 python3 -m pip install numpy

scripts/gen/SQL/genTable_sql_relationalDB10G.py

@@ -1,5 +1,5 @@
 import json
-from random import random
+from random import random,randrange
 import numpy as np
 from PIL import Image
 from shutil import copyfile
@@ -73,7 +73,7 @@ def gen_an_article (i):
     if not os.path.exists(path):
         os.makedirs(path) 
     num = int(random()*1000)
-    text = ['Tsinghua']*num
+    text = ['tsinghua ']*num
     f = open(path+"/text_a"+str(i)+'.txt','w+',encoding="utf8")
     f.write("".join(text))
     f.close()
@@ -82,24 +82,24 @@ def gen_an_article (i):
     image_num = int(random()*5)+1
     image_str = ""
     for j in range(image_num):
+        a = np.random.randint(0,255,(360,480,3))
+        # img = Image.fromarray(a.astype('uint8')).convert('RGB')
         image_str+= 'image_a'+str(i)+'_'+str(j)+'.jpg,'
+        # img.save(path + '/image_a' + str(i) + '_' + str(j) + '.jpg')
+        copyfile('../images/' + str(randrange(1,12)) + '.jpg', path + '/image_a' + str(i) + '_' + str(j) + '.jpg')
+
     article["image"] = image_str
-    # num_image = int(random()*5)+1
-    # for j in range(num_image):
-    #     a = np.random.randint(0,255,(360,480,3))
-    #     img = Image.fromarray(a.astype('uint8')).convert('RGB')
-    #     img.save(path+'/image_a'+str(i)+'_'+str(j)+'.jpg')
 
     # create video
-    # if random() < 0.05:
-    #     # #has one video
-    #     # article["video"] = "video_a"+str(i)+'_video.flv'
-    #     # if random()<0.5:
-    #     #     copyfile('../video/video1.flv',path+"/video_a"+str(i)+'_video.flv')
-    #     # else:
-    #     #     copyfile('../video/video2.flv',path+"/video_a"+str(i)+'_video.flv')
-    # else:
-    article["video"] = ""
+    if random() < 0.05:
+        #has one video
+        article["video"] = "video_a"+str(i)+'_video.flv'
+        if random()<0.5:
+            copyfile('../video/video1.flv',path+"/video_a"+str(i)+'_video.flv')
+        else:
+            copyfile('../video/video2.flv',path+"/video_a"+str(i)+'_video.flv')
+    else:
+        article["video"] = ""
 
     aid_lang[article["aid"]] = article["language"]
     return "(" +  \