word-games-theme 0.1.5 → 0.1.6

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: f165e190bc20e200efbec90d5f56c07493a1baac00edbf03c075e498191b55cc
4
- data.tar.gz: ec05f027022f25aa788ddc90f06dff69c0ec363b00dc4eeb57720f27b9a14ee7
3
+ metadata.gz: aa6efd9137cb4ede4376183c90bb676e290fe6b115fd1be63496c07c54fe43ce
4
+ data.tar.gz: c75430ddbc68937aa9e3dd105885ee43def490dc934abc56354b8bc9f58125fb
5
5
  SHA512:
6
- metadata.gz: 020c786415b9f1d0387d0be30ccc3de047c84b1ffed67be2217cf559cbcf6e7b334894eaeecc232aa0af631ca27b45b191d5cdafe0c4dd27fe41a7b30c89ed73
7
- data.tar.gz: 0b6e9bc067f9fde548b3cdd64c5af8215190562fd1a8a9ca88d02f4dd0a08956e1e096d283d01c2000f72ee693bb31d8243bc7e32d041a61b02e6c00d0ef4c84
6
+ metadata.gz: 7009491f4a3066288891b2f5c804710e4915ad6482357ce1bc21c9a41fa05a82f2c9533605b8beb1ca898e238829ef15657047384b7534f92aeaeb7c3c089872
7
+ data.tar.gz: d53215f64cfb8c24c951f63fbd5ff832a70e9fc029d5f77390b3e80271b8f9663b6978e4bec27ab148e6866f9695f16bd3985049b8f363e3fb1d04318e1e4d96
@@ -13,8 +13,8 @@
13
13
  <div class="serachSection2">
14
14
  <div class="position-relative serachBox">
15
15
  <form action="" id='form'>
16
- <input type="text" placeholder="Enter up to 15 letters?" class="txtBox" autocomplete="off" value
17
- name="search" maxlength="15" value required>
16
+ <input type="text" placeholder="Enter up to 15 letters?" class="txtBox" value name="search"
17
+ maxlength="15" value required>
18
18
  <input type="submit" class="serachBtn" id="serach" value>
19
19
  <div class="dictonaryDropdown">
20
20
  <select class="form-select select_dropDown2" name="dictonary"
@@ -26,9 +26,9 @@
26
26
  </select>
27
27
  </div>
28
28
  {%- include filterWords/index.html -%}
29
-
30
- <div class="mt-3 wrapper_dropDown d-flex justify-content-end" style="gap:10px">
29
+ <div class="wrapper_dropDown mt-2 d-flex justify-content-end" style="gap:10px;">
31
30
  <div class="Advancedbtn" style="position: relative;" onclick="myFunction()">
31
+ <span class="filter_count" style="display: inline-block;"></span>
32
32
  <input type="button" value="Advanced Filter" class="filterButton">
33
33
  <div class="angle-arrow"></div>
34
34
  </div>
@@ -36,7 +36,8 @@
36
36
  <select class="form-select sort-select" id="select_dropDown">
37
37
  <option selected="true" hidden id="alpha" value="alpha">Sort by</option>
38
38
  <option id="alpha" value="alpha">A-Z</option>
39
- <option id="points" value="points">Z-A</option>
39
+ <option id="alpha" value="alpha">Z-A</option>
40
+ <option id="alpha" value="alpha">Points</option>
40
41
  </select>
41
42
  </div>
42
43
  </div>
@@ -44,30 +45,37 @@
44
45
  <i class="fas fa-times"></i>
45
46
  <div class="startsWith same">
46
47
  <label for="startsWith">Starts With</label>
47
- <input type="text" id="startsWith" placeholder="Prefix" value="" name="prefix">
48
+ <input type="text" class="filter_val" id="startsWith" placeholder="Prefix" value=""
49
+ name="prefix">
48
50
  </div>
49
51
  <div class="mustInclude same">
50
52
  <label for="mustInclude">Must Include </label>
51
- <input type="text" id="mustInclude" placeholder="Contains" name="contains">
53
+ <input type="text" class="filter_val" id="mustInclude" placeholder="Contains"
54
+ name="contains" value="">
52
55
  </div>
53
56
  <div class="endsWith same">
54
57
  <label for="endsWith">End With</label>
55
- <input type="text" id="endsWith" placeholder="Suffix" name="suffix">
58
+ <input type="text" class="filter_val" id="endsWith" placeholder="Suffix" name="suffix"
59
+ value="">
56
60
  </div>
57
61
  <div class="wordLength same">
58
62
  <label for="wordLength">Word Length </label>
59
- <input type="text" id="wordLength" placeholder="Length" name="length">
63
+ <input type="text" class="filter_val" id="wordLength" placeholder="Length" name="length"
64
+ value="">
60
65
  </div>
61
66
 
62
67
  <div style="margin-top: 1.2rem;">
63
68
  <input type="submit" value="Apply" class="btn-info w-100 text-white"
64
- style="background: #BD67DD">
69
+ style="background: #808080">
65
70
  </div>
66
71
  </div>
72
+
67
73
  </form>
68
74
  </div>
69
75
  </div>
70
76
  </section>
77
+
78
+
71
79
  {% include section/wordGroup.html %}
72
80
  </div>
73
81
 
@@ -14,8 +14,8 @@
14
14
  <div class="serachSection">
15
15
  <div class="position-relative serachBox">
16
16
  <form action="/result" id='form' method="GET">
17
- <input type="text" placeholder="Enter up to 15 letters?" class="txtBox" autocomplete="off" value
18
- name="search" maxlength="15" required>
17
+ <input type="text" placeholder="Enter up to 15 letters?" class="txtBox" value name="search"
18
+ maxlength="15" required>
19
19
  <input type="submit" class="serachBtn" id="serach" value>
20
20
  <div class="dictonaryDropdown">
21
21
  <select class="form-select select_dropDown2" name="dictonary"
@@ -14,8 +14,8 @@
14
14
  <div class="serachSection">
15
15
  <div class="position-relative serachBox">
16
16
  <form action="{{page.url}}/result" id='form' method="GET">
17
- <input type="text" placeholder="Enter up to 15 letters?" class="txtBox" autocomplete="off" value
18
- name="search" maxlength="15" required>
17
+ <input type="text" placeholder="Enter up to 15 letters?" class="txtBox" value name="search"
18
+ maxlength="15" required>
19
19
  <input type="submit" class="serachBtn" id="serach" value>
20
20
  <div class="dictonaryDropdown">
21
21
  <select class="form-select select_dropDown2" name="dictonary"
@@ -34,9 +34,6 @@
34
34
  <div class="angle-arrow2"></div>
35
35
  </div>
36
36
  </div>
37
-
38
-
39
-
40
37
  <div class="fillterWrapper">
41
38
  <div class="startsWith">
42
39
  <label for="startsWith">Starts With</label>
@@ -55,6 +52,11 @@
55
52
  <div class="wordLength">
56
53
  <label for="wordLength">Word Length </label>
57
54
  <input type="text" id="wordLength" placeholder="Length" name="length">
55
+
56
+ </div>
57
+ <div style="margin-top: 1.2rem;">
58
+ <input type="submit" value="Apply" class="btn-info w-100 text-white"
59
+ style="background: #BD67DD">
58
60
  </div>
59
61
  </div>
60
62
  </form>
@@ -66,6 +68,7 @@
66
68
  <!-- // page conditions -->
67
69
 
68
70
 
71
+
69
72
  {% if page.url == "/anagram-word-finder" %}
70
73
 
71
74
  <script src="/assets/js/advancedFilter2.js"></script>
@@ -88,6 +91,7 @@
88
91
 
89
92
  {% else %}
90
93
 
91
- <script src="/assets/js/advancedFilter3.js"></script>
94
+ <script src="/assets/js/advancedFilter.js"></script>
95
+ <script src="/assets/js/advancedFilter2.js"></script>
92
96
 
93
97
  {% endif %}
@@ -19,9 +19,9 @@
19
19
 
20
20
  {% include section/feature.html %}
21
21
 
22
- {% include section/blog.html %}
23
22
  {% include section/news.html %}
24
- {% include section/about.html %}
23
+ {% include section/blog.html %}
24
+
25
25
  {%- include share/socialshare.html -%}
26
26
  {%- include Rating/rating.html -%}
27
27
  {%- include footer/index.html -%}
data/_layouts/page.html CHANGED
@@ -1,14 +1,60 @@
1
1
  <html>
2
2
  {%- include head/index.html -%}
3
3
 
4
+ <style>
5
+ @media(max-width:768px) {
6
+
7
+ /* social icons style */
8
+ .social-icons {
9
+ position: relative !important;
10
+ width: 100% !important;
11
+ height: 0px;
12
+ display: flex;
13
+ top: 0;
14
+ font-size: 15px;
15
+ color: #fff;
16
+ flex-direction: row;
17
+ z-index: 0;
18
+ border-top-left-radius: 8px;
19
+ border-bottom-left-radius: 8px;
20
+ background: transparent !important;
21
+ box-shadow: none !important;
22
+ line-height: 30px;
23
+ }
24
+
25
+ .social-icons a {
26
+ padding: 50px;
27
+ color: #000 !important;
28
+ font-size: 2rem !important;
29
+ }
30
+
31
+ .social-icon {
32
+ margin: 0 !important;
33
+ color: gray;
34
+ }
35
+
36
+ .social-icon:hover {
37
+ color: black;
38
+ }
39
+
40
+ .social-icons a {
41
+ padding: 10px;
42
+ }
43
+ }
44
+ </style>
45
+
4
46
  <body>
5
- {%- include header/index.html -%}
47
+ {%- include header/index.html -%}
48
+
49
+ {%- include section/commonPage.html -%}
50
+
6
51
 
7
- {%- include section/commonPage.html -%}
52
+ {%- include share/socialshare.html -%}
8
53
 
54
+ {%- include footer/index.html -%}
9
55
 
10
- <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
11
- <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.min.js"></script>
56
+ <script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
57
+ <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/js/bootstrap.min.js"></script>
12
58
  </body>
13
59
 
14
60
  </html>
data/assets/css/about.css CHANGED
@@ -31,7 +31,7 @@
31
31
  }
32
32
  @media (max-width: 1125px) {
33
33
  .rowHeight {
34
- margin: 0px -15px 0px -15px;
34
+ margin: 100px -15px 0px -15px;
35
35
  }
36
36
  .about {
37
37
  background: #b641da;
@@ -1,3 +1,20 @@
1
+ .tick {
2
+ background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAL7SURBVEhL7ZZdSBRRFMf/s+PWSrsUFGoUfi1ooWISFUQPvfRhH1hUL5agvogvaQ/hamBRbz0W2VNBQb2IgqJsGL2VVBK11UNpPkhGKmWK6wfu7kznzFxGx5lxZ+tN/MGdOefOzP3PnTn3noN11jySOLvnWamfniqGJGVovqpOQMVnHI9ENd8l7oTDe/zwSGfp7nPkHaPm0/qXWKD2kl7gERS1A+Uf5vVuZ1YXbg9KCAT2kWgjeaeoBbR+Z/gFupFQWhGNDuLCsKp3W3EW1kQ3HYRHfkhegd7pmkEoiVrMzPY7iXvE2YrfXyJEg3pHShTQsw9oDMcXthfuLfNDlq+RxQ/KWl/qFNIYN7WxbLAX9uIMhWu58P4D9TSNVSEcE06fmqM3WSAZ+DwbcCXnEk5sO7QyaNKpVeumGWtw9ZYE4E2bIGvlkrGFRZtyqxHKq8HQ3HfsfVOJmBIXVzUWEItn4OSnGeFrWGcspxXR0ZXolrQAmkgwlFeL4blRtAzdRVxJiKsGPhqzUNgGVmFJzRSWCVmSqZlvb8ipRCi3BtPxGYSG7qD3F+8hNqtHUncIy8DpH5tg0VvBeoTL7iHbl6XN9HqwDjfy6zCy8BPnI1edRXUsv9QqrEo/hGXAA+7fXIwjWw+gbXczmunTNmZX4uvcCFq/teHVVGQ1UR5zTFgGroMrJz0LbbtatMhlxhd/azNNKuoQXNbN4enEIqq2HyYrX+/QmY5H8XzyNYr8QSwqMVz+chsvJgeSiTI9KI88FraB/V7dV3aRjvepWdYyz3znxkz0T310I8qzrMfR9090dwn74Iqhk94pLDwTI/Njbj6vQOqhsbqEY8J+xky4lPZaTzdZqWYmhhfzMBSligqEt3qXGeflxPmUUxunuNQhUU6L0QHhW3DOPO1/gAr/KLzePioEuMzhYPNq15zhf9pJhUADorPv/q0QWA6XPrLEWYaTB2ctu9KHY6IDCbWLSp+k9Zc74eVwseehXAuJt0GJir1xirOUi7111jrAXwKK6K/PgrsYAAAAAElFTkSuQmCC)
3
+ no-repeat;
4
+ background-position: 95% 50%;
5
+ }
6
+ .filter_count {
7
+ width: 20px;
8
+ color: white;
9
+ height: 20px;
10
+ text-align: center;
11
+ background-color: #808080;
12
+ padding-top: 2px;
13
+ border-radius: 50%;
14
+ margin-right: 1px;
15
+ position: relative;
16
+ left: 150px;
17
+ }
1
18
  .Advancedbtn .filterButton {
2
19
  background: #f8f9fa;
3
20
  box-shadow: 0 0 3px #343a4063;
@@ -19,7 +36,7 @@
19
36
  background: #fff;
20
37
  position: absolute;
21
38
  z-index: 999;
22
- top: 155px;
39
+ top: unset;
23
40
  right: 123px;
24
41
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.4);
25
42
  padding: 30px 15px;
@@ -114,16 +131,24 @@ a {
114
131
  .Advancedbtn .filterButton {
115
132
  position: fixed;
116
133
  bottom: 0;
117
- width: 100%;
118
- left: 0;
134
+ width: 50%;
135
+ left: 0px;
136
+ border-radius: 0;
119
137
  }
120
138
  .fillterWrapper {
121
139
  right: auto;
122
140
  position: fixed;
123
141
  left: 0;
124
- top: 215px;
142
+ bottom: 39px;
125
143
  width: 100%;
126
144
  }
145
+ .filter_count {
146
+ z-index: 999;
147
+ display: inline-block;
148
+ position: fixed;
149
+ left: 112px;
150
+ bottom: 8px;
151
+ }
127
152
  }
128
153
 
129
154
  @media (min-width: 576px) {
data/assets/css/home.css CHANGED
@@ -8,16 +8,22 @@
8
8
  background: url(../images/bg_elements.png);
9
9
  background-position: center;
10
10
  background-size: cover;
11
- margin-bottom: 50vh;
11
+ margin-bottom: 20vh;
12
12
  }
13
13
  .serachSection {
14
14
  height: 50px;
15
15
  position: relative;
16
16
  }
17
+ input:-webkit-autofill,
18
+ input:-webkit-autofill:hover,
19
+ input:-webkit-autofill:focus,
20
+ input:-webkit-autofill:active {
21
+ transition: background-color 5000s ease-in-out 0s;
22
+ }
17
23
 
18
24
  .txtBox {
19
25
  height: 60px;
20
- border-radius: 60px;
26
+ border-radius: 8px;
21
27
  border: solid 1px rgba(0, 0, 0, 0.1);
22
28
  background: #fff;
23
29
  padding: 0;
@@ -51,15 +57,18 @@
51
57
  font-weight: 500 !important;
52
58
  }
53
59
  .serachBtn {
54
- background: url(../images/right2.svg) no-repeat;
55
- background-size: cover;
56
- height: 50px;
57
- width: 50px;
60
+ background: url(../images/search.svg) no-repeat center center;
61
+ background-size: 35px 35px;
62
+ height: 59px;
63
+ width: 59px;
58
64
  border: none;
59
65
  position: absolute;
60
- top: 6px;
61
- right: 9px;
66
+ top: 0px;
67
+ right: 0px;
62
68
  outline: none;
69
+ border-top-right-radius: 8px;
70
+ border-bottom-right-radius: 8px;
71
+ background-color: #000;
63
72
  }
64
73
  .advancedFilter .filterButton {
65
74
  background: #f8f9fa;
@@ -109,18 +118,20 @@
109
118
  }
110
119
  .select_dropDown2 {
111
120
  position: absolute;
112
- top: 4px;
121
+ top: 0px;
113
122
  font-size: 15px;
114
123
  width: 156px;
115
124
  overflow: hidden;
116
125
  object-fit: cover;
117
126
  right: 69px;
118
- padding: 16px 0;
127
+ padding: 18px 0;
119
128
  border-radius: 0;
120
129
  border: none;
121
130
  box-shadow: none;
122
131
  background: white;
123
132
  border-left: 1px solid rgba(0, 0, 0, 0.11);
133
+ border-top: 1px solid rgba(0, 0, 0, 0.11);
134
+ border-bottom: 1px solid rgba(0, 0, 0, 0.11);
124
135
  }
125
136
  .select_dropDown2:focus {
126
137
  outline: none;
@@ -143,6 +154,7 @@
143
154
  outline: none;
144
155
  }
145
156
  .active {
157
+ z-index: 999;
146
158
  top: 122px;
147
159
  background: #fff;
148
160
  box-shadow: 0 0 5px rgb(0 0 0 / 40%);
@@ -177,18 +189,28 @@
177
189
  height: 40px !important;
178
190
  }
179
191
  .serachBtn {
180
- height: 30px !important;
181
- width: 30px !important;
192
+ height: 40px !important;
193
+ width: 40px !important;
182
194
  }
183
195
  .advancedFilter .filterButton {
184
196
  top: 60px;
185
197
  }
186
198
  .select_dropDown2 {
187
- padding: 6px 0;
188
- width: 50px;
199
+ padding: 8px 0;
200
+ width: 20%;
201
+ right: 40px;
189
202
  }
190
203
  }
191
204
  @media (max-width: 768px) {
205
+ #select_dropDown {
206
+ bottom: 0;
207
+ position: fixed;
208
+ width: 50%;
209
+ right: 0;
210
+ border-radius: 0;
211
+ padding: 9.5px;
212
+ z-index: 99;
213
+ }
192
214
  .pageHeading h1 {
193
215
  font-size: 2.5rem;
194
216
  }
data/assets/css/news.css CHANGED
@@ -1,5 +1,5 @@
1
1
  .rowHeight2 {
2
- margin-top: 700px;
2
+ margin-top: 300px;
3
3
  }
4
4
  .news {
5
5
  margin-top: -120px;
@@ -44,7 +44,7 @@
44
44
  }
45
45
  @media (max-width: 1125px) {
46
46
  .rowHeight2 {
47
- margin-top: 0px;
47
+ margin-top: 50px;
48
48
  margin-bottom: 120px;
49
49
  }
50
50
  .news {
data/assets/css/style.css CHANGED
@@ -111,7 +111,7 @@ header {
111
111
  right: 5px;
112
112
  margin: -3px 0;
113
113
  cursor: pointer;
114
- z-index: 999;
114
+ /* z-index: 999; */
115
115
  }
116
116
  .post-link {
117
117
  font-size: 1.5rem;
@@ -225,8 +225,8 @@ header {
225
225
  }
226
226
  .angle-arrow {
227
227
  position: fixed;
228
- bottom: 4px;
229
- right: 32px;
228
+ bottom: 5px;
229
+ right: 52%;
230
230
  z-index: 999;
231
231
  top: auto;
232
232
  }
@@ -0,0 +1 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 0 24 24" width="24px" fill="#FFFFFF"><path d="M0 0h24v24H0V0z" fill="none"/><path d="M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z"/></svg>
@@ -76,10 +76,48 @@ function x_with_letters(data) {
76
76
  filterData = data.filter((item) => item.length == 2)
77
77
  }
78
78
 
79
+ if (prefixValue) {
80
+ filterData = filterData.filter((item2) =>
81
+ item2.startsWith(prefixValue.toLowerCase())
82
+ )
83
+ startsWith.classList.add('tick')
84
+ startsWith.value = prefixValue
85
+ }
86
+ if (containsValue) {
87
+ filterData = filterData.filter((item) =>
88
+ item.includes(containsValue.toLowerCase())
89
+ )
90
+ mustInclude.classList.add('tick')
91
+ mustInclude.value = containsValue
92
+ }
93
+ if (suffixValue) {
94
+ filterData = filterData.filter((item) =>
95
+ item.endsWith(suffixValue.toLowerCase())
96
+ )
97
+ endsWith.classList.add('tick')
98
+ endsWith.value = suffixValue
99
+ }
100
+
79
101
  if (filterData.length === 0) {
80
102
  main.innerHTML += ''
81
103
  errorMsg.innerHTML = 'No words Found with this length'
82
104
  } else {
105
+ // sort eventlistener
106
+ theSelect.addEventListener('change', () => {
107
+ sortValue = theSelect[theSelect.selectedIndex].text
108
+ if (sortValue == 'Z-A') {
109
+ sortBool = true
110
+ sortby(sortBool, filterData, itemLength)
111
+ } else {
112
+ sortBool = false
113
+ sortby(sortBool, filterData, itemLength)
114
+ }
115
+ if (sortValue == 'Points') {
116
+ sortBool = true
117
+ sortPointsby(sortBool, filterData, itemLength)
118
+ }
119
+ })
120
+
83
121
  newWordsLength += filterData.length
84
122
  let itemLength = ''
85
123
  const result = filterData.map((item) => {
@@ -124,6 +162,138 @@ function x_with_letters(data) {
124
162
  }
125
163
  }
126
164
 
165
+ //Handling of filter counter in advanced filter
166
+ function addFilterCount() {
167
+ let filter_val = document.getElementsByClassName('filter_val')
168
+ let filter = document.querySelector('.filter_count')
169
+ let filter_count = 0
170
+
171
+ filter_val[0].value = prefixValue
172
+ filter_val[1].value = containsValue
173
+ filter_val[2].value = suffixValue
174
+ filter_val[3].value = lengthValue
175
+
176
+ for (var i = 0; i < 4; i++) {
177
+ if (filter_val[i].value != '') {
178
+ filter_count += 1
179
+ }
180
+ if (filter_count === 0) {
181
+ filter.style.display = 'none'
182
+ } else {
183
+ filter.style.display = 'inline-block'
184
+ }
185
+
186
+ filter.innerHTML = filter_count
187
+ }
188
+ }
189
+ addFilterCount()
190
+
191
+ // sorting by points
192
+ function sortPointsby(sortValue, data, i) {
193
+ if (sortValue) {
194
+ main.innerHTML = ''
195
+ let newArray = []
196
+ data.map((item) => {
197
+ let ScrabbleLetterScore = ScrabbleScore()
198
+ let points = 0
199
+ item = item.toLowerCase()
200
+ for (let i = 0; i < item.length; i++) {
201
+ points += ScrabbleLetterScore[item[i]] || 0 // for unknown characters
202
+ }
203
+ const value = {
204
+ words: item,
205
+ points: points,
206
+ }
207
+ newArray.push(value)
208
+ newArray.sort(function (a, b) {
209
+ return b.points - a.points
210
+ })
211
+ })
212
+ const result = newArray.map((item) => {
213
+ return `<a class="anchor__style" title="Lookup python in Dictionary" target="_blank" href="/word-meaning?search=${item.words}">
214
+ <li>${item.words}
215
+ <span class="points" value="${item.points}" style="position:relative; top:4px; font-size:12px"> ${item.points}</span>
216
+ </li></a>`
217
+ })
218
+
219
+ main.innerHTML += `
220
+ <div class="allGroupWords wordlistContainer" id="alpha_${i}">
221
+ <div class="wordListHeading">
222
+ <h3 class="lead">${i} Letter Words</h3>
223
+ </div>
224
+ <div class="wordList">
225
+ <ul class="ul list-unstyled">
226
+ ${result.join('')}
227
+ </ul>
228
+ </div>
229
+ </div>
230
+ `
231
+ }
232
+ }
233
+
234
+ // sort by aplhabets
235
+ function sortby(sortBool, data, i) {
236
+ if (sortBool) {
237
+ main.innerHTML = ''
238
+ data.reverse()
239
+ const result = data.map((item) => {
240
+ let ScrabbleLetterScore = ScrabbleScore()
241
+ let sum = 0
242
+ item = item.toLowerCase()
243
+ for (let i = 0; i < item.length; i++) {
244
+ sum += ScrabbleLetterScore[item[i]] || 0 // for unknown characters
245
+ }
246
+ return `<a class="anchor__style" title="Lookup python in Dictionary" target="_blank" href="/word-meaning?search=${item}">
247
+ <li>${item}
248
+ <span class="points" value="${sum}" style="position:relative; top:4px; font-size:12px"> ${sum}</span>
249
+ </li></a>`
250
+ })
251
+
252
+ main.innerHTML += `
253
+ <div class="allGroupWords wordlistContainer" id="alpha_${i}">
254
+ <div class="wordListHeading">
255
+ <h3 class="lead">${i} Letter Words</h3>
256
+ </div>
257
+ <div class="wordList">
258
+ <ul class="ul list-unstyled">
259
+ ${result.join('')}
260
+ </ul>
261
+ </div>
262
+ </div>
263
+
264
+ `
265
+ } else {
266
+ main.innerHTML = ''
267
+ data.sort()
268
+ const result = data.map((item) => {
269
+ let ScrabbleLetterScore = ScrabbleScore()
270
+ let sum = 0
271
+ item = item.toLowerCase()
272
+ for (let i = 0; i < item.length; i++) {
273
+ sum += ScrabbleLetterScore[item[i]] || 0 // for unknown characters
274
+ }
275
+ return `<a class="anchor__style" title="Lookup python in Dictionary" target="_blank" href="/word-meaning?search=${item}">
276
+ <li>${item}
277
+ <span class="points" value="${sum}" style="position:relative; top:4px; font-size:12px"> ${sum}</span>
278
+ </li></a>`
279
+ })
280
+
281
+ main.innerHTML += `
282
+ <div class="allGroupWords wordlistContainer" id="alpha_${i}">
283
+ <div class="wordListHeading">
284
+ <h3 class="lead">${i} Letter Words</h3>
285
+ </div>
286
+ <div class="wordList">
287
+ <ul class="ul list-unstyled">
288
+ ${result.join('')}
289
+ </ul>
290
+ </div>
291
+ </div>
292
+
293
+ `
294
+ }
295
+ }
296
+
127
297
  // Implement Active class
128
298
  const addFilter = () => {
129
299
  let tabs = document.getElementsByClassName('tab_link')
@@ -1,5 +1,5 @@
1
- const Advancedbtn = document.querySelector('.Advancedbtn')
2
- Advancedbtn.style.display = 'none'
1
+ const wordLength = document.querySelector('.wordLength')
2
+ wordLength.style.display = 'none'
3
3
 
4
- const sortSelect = document.querySelector('#sort-select')
5
- sortSelect.style.display = 'none'
4
+ // const sortSelect = document.querySelector('#sort-select')
5
+ // sortSelect.style.display = 'none'
@@ -1,2 +1,2 @@
1
- const advancedFilter = document.querySelector('.advancedFilter')
2
- advancedFilter.style.display = ' none'
1
+ // const advancedFilter = document.querySelector('.advancedFilter')
2
+ // advancedFilter.style.display = ' none'
@@ -1,3 +1,7 @@
1
+ /***************
2
+ SCRABBLER_JS
3
+ ***************/
4
+
1
5
  // grab some html elements
2
6
  let form = document.querySelector('#form')
3
7
  let wordCount = document.querySelector('.wordCount')
@@ -13,6 +17,13 @@ let suffixValue = params.get('suffix')
13
17
  let lengthValue = params.get('length')
14
18
  let dictonary = params.get('dictonary')
15
19
 
20
+ // advanced filter element grabs
21
+ let tick
22
+ let startsWith = document.getElementById('startsWith')
23
+ let mustInclude = document.getElementById('mustInclude')
24
+ let endsWith = document.getElementById('endsWith')
25
+ let wordLength = document.getElementById('wordLength')
26
+
16
27
  let ok = true
17
28
 
18
29
  let tab_container = document.querySelector('.tab_container')
@@ -71,6 +82,10 @@ function getWords(data) {
71
82
  sortBool = false
72
83
  sortby(sortBool, data)
73
84
  }
85
+ if (sortValue == 'Points') {
86
+ sortBool = true
87
+ sortPointsby(sortBool, data)
88
+ }
74
89
  })
75
90
 
76
91
  for (let i = serachValue.length; i >= 1; i--) {
@@ -79,20 +94,30 @@ function getWords(data) {
79
94
  newdata = newdata.filter((item2) =>
80
95
  item2.startsWith(prefixValue.toLowerCase())
81
96
  )
97
+ startsWith.classList.add('tick')
98
+ startsWith.value = prefixValue
82
99
  }
100
+
83
101
  if (containsValue) {
84
102
  newdata = newdata.filter((item) =>
85
103
  item.includes(containsValue.toLowerCase())
86
104
  )
105
+ mustInclude.classList.add('tick')
106
+ mustInclude.value = containsValue
87
107
  }
88
108
  if (suffixValue) {
89
109
  newdata = newdata.filter((item) =>
90
110
  item.endsWith(suffixValue.toLowerCase())
91
111
  )
112
+ endsWith.classList.add('tick')
113
+ endsWith.value = suffixValue
92
114
  }
93
115
  if (lengthValue) {
94
116
  newdata = newdata.filter((item) => item.length == lengthValue)
117
+ wordLength.classList.add('tick')
118
+ wordLength.value = lengthValue
95
119
  }
120
+
96
121
  if (newdata.length === 0) {
97
122
  main.innerHTML += ''
98
123
  } else {
@@ -150,6 +175,66 @@ function getWords(data) {
150
175
  }
151
176
  }
152
177
 
178
+ // sorting by points
179
+ function sortPointsby(sortValue, data) {
180
+ main.innerHTML = ''
181
+ if (sortValue) {
182
+ let newWordsLength = 0
183
+ for (let i = serachValue.length; i >= 1; i--) {
184
+ var newdata = data.filter((item) => item.length === i)
185
+
186
+ if (newdata.length === 0) {
187
+ main.innerHTML += ''
188
+ } else {
189
+ newWordsLength += newdata.length
190
+ var newArray = []
191
+ newdata.map((item) => {
192
+ if (item.length === 1) {
193
+ ok = false
194
+ newWordsLength = newWordsLength - 1
195
+ } else {
196
+ let ScrabbleLetterScore = ScrabbleScore()
197
+ let points = 0
198
+ item = item.toLowerCase()
199
+ for (let i = 0; i < item.length; i++) {
200
+ points += ScrabbleLetterScore[item[i]] || 0 // for unknown characters
201
+ }
202
+ const value = {
203
+ words: item,
204
+ points: points,
205
+ }
206
+ newArray.push(value)
207
+ }
208
+ })
209
+
210
+ newArray.sort(function (a, b) {
211
+ return b.points - a.points
212
+ })
213
+
214
+ const result = newArray.map((item) => {
215
+ return `<a class="anchor__style" title="Lookup python in Dictionary" target="_blank" href="/word-meaning?search=${item.words}">
216
+ <li>${item.words}
217
+ <span class="points" value="${item.points}" style="position:relative; top:4px; font-size:12px"> ${item.points}</span>
218
+ </li></a>`
219
+ })
220
+
221
+ main.innerHTML += `
222
+ <div class="allGroupWords wordlistContainer" id="alpha_${i}">
223
+ <div class="wordListHeading">
224
+ <h3 class="lead">${i} Letter Words</h3>
225
+ </div>
226
+ <div class="wordList">
227
+ <ul class="ul list-unstyled">
228
+ ${result.join('')}
229
+ </ul>
230
+ </div>
231
+ </div>
232
+ `
233
+ }
234
+ }
235
+ }
236
+ }
237
+
153
238
  // sort by aplhabets
154
239
  function sortby(sortBool, data) {
155
240
  if (sortBool) {
@@ -239,7 +324,7 @@ function sortby(sortBool, data) {
239
324
  }
240
325
  }
241
326
 
242
- // Scrabble Point Counts
327
+ // Scrabble Point Array
243
328
  const ScrabbleScore = () => {
244
329
  let twl06_sowpods = {
245
330
  a: 1,
@@ -306,7 +391,33 @@ const ScrabbleScore = () => {
306
391
  }
307
392
  }
308
393
 
309
- // Implement Filtering
394
+ //Handling of filter counter in advanced filter
395
+ function addFilterCount() {
396
+ let filter_val = document.getElementsByClassName('filter_val')
397
+ let filter = document.querySelector('.filter_count')
398
+ let filter_count = 0
399
+
400
+ filter_val[0].value = prefixValue
401
+ filter_val[1].value = containsValue
402
+ filter_val[2].value = suffixValue
403
+ filter_val[3].value = lengthValue
404
+
405
+ for (var i = 0; i < 4; i++) {
406
+ if (filter_val[i].value != '') {
407
+ filter_count += 1
408
+ }
409
+ if (filter_count === 0) {
410
+ filter.style.display = 'none'
411
+ } else {
412
+ filter.style.display = 'inline-block'
413
+ }
414
+
415
+ filter.innerHTML = filter_count
416
+ }
417
+ }
418
+ addFilterCount()
419
+
420
+ // Add Filtering
310
421
  let sections = {}
311
422
  function Filtering(id) {
312
423
  let tabs = document.getElementsByClassName('tab_link')
@@ -317,23 +428,49 @@ function Filtering(id) {
317
428
  })
318
429
  main.innerHTML += ``
319
430
  let activeLetter = event.target
320
- // console.log(activeLetter)
321
431
  activeLetter.classList.add('active-tab')
322
432
 
323
433
  var section = document.querySelectorAll('.wordlistContainer')
324
434
  var sort_val = document.querySelector('.sort-select').value
325
- sections = {}
326
435
  Array.prototype.forEach.call(section, function (e) {
327
436
  if (document.body.clientWidth > 991) {
328
437
  sections[e.id] = e.offsetTop - 10
329
438
  } else {
330
439
  sections[e.id] = e.offsetTop - 10
331
- // console.log(sections)
332
440
  }
333
441
  })
442
+
334
443
  document.body.scrollTop = sections[sort_val + '_' + id] + 5
335
444
  }
336
445
 
446
+ // handling of filter on scroll
447
+ window.onscroll = function () {
448
+ var section = document.querySelectorAll('.wordlistContainer')
449
+ let new_sections = {}
450
+ Array.prototype.forEach.call(section, function (e) {
451
+ if (document.body.clientWidth > 991) {
452
+ new_sections[e.id] = e.offsetTop - 10
453
+ } else {
454
+ new_sections[e.id] = e.offsetTop - 10
455
+ }
456
+ })
457
+ var scrollPosition =
458
+ document.body.scrollTop || document.documentElement.scrollTop
459
+ for (i in new_sections) {
460
+ let sort_val = document.querySelector('.sort-select').value
461
+ if (
462
+ i.split('_')[0] == sort_val &&
463
+ new_sections[i] &&
464
+ new_sections[i] <= scrollPosition
465
+ ) {
466
+ document.querySelector('.active-tab').classList.remove('active-tab')
467
+ var active_now = document.querySelector('#Tab_' + i.split('_')[1])
468
+ active_now.classList.add('active-tab')
469
+ }
470
+ }
471
+ }
472
+
473
+ // next && previous functionality
337
474
  let prev = document.getElementById('prev')
338
475
  let next = document.getElementById('next')
339
476
 
@@ -359,7 +496,7 @@ function scroll_visible() {
359
496
  }
360
497
  }
361
498
  }
362
- scroll_visible()
499
+
363
500
  function scroll_Left() {
364
501
  tab_container.scrollLeft += 130
365
502
  }
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: word-games-theme
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.1.5
4
+ version: 0.1.6
5
5
  platform: ruby
6
6
  authors:
7
7
  - manpreet-appscms
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2021-06-25 00:00:00.000000000 Z
11
+ date: 2021-06-29 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: jekyll
@@ -161,6 +161,7 @@ files:
161
161
  - assets/images/right2.svg
162
162
  - assets/images/right3.svg
163
163
  - assets/images/right_obj_01.png
164
+ - assets/images/search.svg
164
165
  - assets/images/word-games-logo.svg
165
166
  - assets/images/yellow_bg.png
166
167
  - assets/js/TopScroll.js