hasjob PWA #425

vidya-ram · 2018-03-07T11:29:25Z

Introduced Webpack to build & bundle hasjob's css & js
Used Workbox Webpack plugin to generate service worker that takes care of caching & offline support
Add Manifest.json to enable "Add to homescreen" feature.
Add the new Hasjob logo

…ts and tablelayoutscripts blocks to sheet.html & tablelayout.html

shreyas-satish · 2018-03-07T11:47:58Z

hasjob/templates/layout.html.jinja2

+    if ('serviceWorker' in navigator) {
+      navigator.serviceWorker.register('/service-worker.js')
+      .then(function(registration) {
+        console.log('Service Worker registration successful with scope: ',


Perhaps better to raise an exception with Sentry?

iambibhas · 2018-03-07T18:10:41Z

I really wish we didn't include built static files in the repo. Can we move the building part to the server? just include the main static files in repo and then when deploying, run build command.

jace · 2018-03-13T09:06:55Z

hasjob/__init__.py

-    ext_requires=['baseframe-bs3',
-        ('jquery.autosize', 'jquery.sparkline', 'jquery.liblink', 'jquery.wnumb', 'jquery.nouislider'),
+baseframe.init_app(app, requires=['baseframe-bs3',
+        'jquery.autosize', 'jquery.sparkline', 'jquery.liblink', 'jquery.wnumb', 'jquery.nouislider',


We stopped using sparkline a while ago. Safe to remove now.

jace · 2018-03-13T09:08:49Z

hasjob/static/js/styles-app.js

@@ -0,0 +1 @@
+import '../sass/app.sass';


If this needs compilation, it should be in the assets folder, not static.

Everything in static is published to the world and can be directly accessed from a URL.

jace · 2018-03-13T09:11:02Z

hasjob/static/sass/_header.sass

@@ -1,6 +1,6 @@
 body
  font-family: $font-default
-  background: #e8e7e6 image-url("canvas.jpg")
+  background: #e8e7e6 url("~/static/img/canvas.jpg")


We should move SASS files into assets as well, which means this path will need to be updated (image files stay in static).

jace · 2018-03-13T09:13:12Z

hasjob/templates/admin_dashboard.html.jinja2

@@ -12,7 +12,7 @@
  </div>
 {% endblock %}

-{% block footerscripts %}
+{% block tablelayoutscripts %}


This should be tablayout, not tablelayout. Please amend in the source template as well.

jace · 2018-03-13T09:15:53Z

hasjob/templates/layout.html.jinja2

@@ -229,5 +240,20 @@

 {% block layoutscripts %}
  {%- if header_campaign %}{{ campaign_script() }}{% endif %}
+  <script src='{{ asset_path('manifest') | safe }}' type="text/javascript"></script>
+  <script src='{{ asset_path('vendor') | safe }}' type="text/javascript"></script>
+  <script src='{{ asset_path('app') | safe }}' type="text/javascript"></script>


Not safe to use the | safe filter. If asset_path is confirming the strings are escaped, let it return Markup strings.

jace · 2018-03-13T09:17:33Z

hasjob/templates/stats.html.jinja2

@@ -21,7 +21,7 @@
      </div>
    </div>
 {% endblock %}
-{% block footerscripts %}
+{% block sheetscripts %}


These templates should continue to use footerscripts. Only overwrite sheetscripts or tablayoutscripts in layout templates.

In stats.html.jinja
{% block sheetscripts %}
{% block footerscripts %}
.....
{% endblock %}
{% endblock %}
Would this be fine, @jace ?

Using just {% block footerscripts %} should work.

In sheet.html.jinja2, I have added
{% block layoutscripts %}
{{ super() }}
{% endblock %}
And used just {% block footerscripts %} in templates that extend sheet.html.jinja2

jace · 2018-03-13T09:18:04Z

hasjob/templates/tablayout.html.jinja2

  <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/d3/3.5.17/d3.min.js"></script>
  <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/c3/0.4.14/c3.min.js"></script>
-  {% block footerscripts %}{% endblock %}
-{% endblock %}
+  {% block tablelayoutscripts %}


{% block tablayoutscripts %}

jace · 2018-03-13T09:18:40Z

hasjob/views/index.py

+
+@app.route('/workbox-sw.prod.v2.1.2.js', methods=['GET'])
+def workbox():
+    return app.send_static_file('workbox-sw.prod.v2.1.2.js')


What is v2.1.2?

workbox-webpack-plugin generates the service worker that import's Workbox's service worker library
https://developers.google.com/web/tools/workbox/get-started/webpack#register

So v2.1.2 is a static path that won't change? Or it's linked to the webpack version? If latter, we should avoid a dependency on having to change this line every time webpack changes.

2. Add new logo. 3. Add offline page to be served by service worker during network error.

jace · 2018-04-15T20:01:40Z

hasjob/templates/sheet.html.jinja2

@@ -22,6 +22,5 @@
 {% endblock %}

 {% block layoutscripts %}
-  {%- if header_campaign %}{{ campaign_script() }}{% endif %}
-  {% block footerscripts %}{% endblock %}
+  {{ super() }}
 {% endblock %}


We don't need to define a block if it only contains super().

jace · 2018-04-15T20:02:33Z

hasjob/views/index.py

@@ -819,3 +819,18 @@ def logoimage(domain, hashid):
 @app.route('/search')
 def search():
    return redirect(url_for('index', **request.args))
+
+
+@app.route('/offline')


Can we be careful about adding new top-level routes? This merits a discussion. See #145.

Changed it to /api/1/template/offline

jace · 2018-04-15T20:03:48Z

I have just these two comments, @vidya-ram.

vidya-ram added 5 commits February 28, 2018 18:32

Add service worker, manifest.json for hasjob PWA.

a735def

Merge branch 'master' into service-worker

2c267be

Add node_modules folder in gitignore.

7d6d587

Update settings-sample to include ASSET_MANIFEST_PATH. Add sheetscrip…

08c5303

…ts and tablelayoutscripts blocks to sheet.html & tablelayout.html

Change to requires for baseframe assets.

834cf29

vidya-ram requested review from jace, iambibhas and shreyas-satish March 7, 2018 11:29

shreyas-satish reviewed Mar 7, 2018

View reviewed changes

jace requested changes Mar 13, 2018

View reviewed changes

vidya-ram added 10 commits March 13, 2018 22:36

Merge branch 'master' into service-worker

f5d48e8

Move assets that require buildings to assets folder.

90fb6de

Remove node_modules folder.

7274f5f

Add node_modules to gitignore.

59626a2

remove unnecessary file.

5ef5cfd

Add updated logo. Add the build css, js & service-worker.js

17ed927

Merge branch 'master' into service-worker

fe2c332

Start service worker only after window.load event.

679fd49

1. Merge branch 'master' into service-worker

270d480

2. Add new logo. 3. Add offline page to be served by service worker during network error.

Update runtime cache routes in workbox.

b74b6b9

jace reviewed Apr 15, 2018

View reviewed changes

jace mentioned this pull request Apr 15, 2018

Moving anon user tracking from image element to form submit #433

Open

vidya-ram added 5 commits April 16, 2018 11:59

Change offline route. Change offline stickie to use 40x stickie css.

ee41032

Sync with master.

7f101a8

Fix offline template.

77fa655

Fix style on offline page. Add links to dashboard & campaign on navbar.

7202b31

Merge branch 'master' into service-worker

ed6217a

vidya-ram merged commit 8a2f70e into master Apr 17, 2018

vidya-ram deleted the service-worker branch April 17, 2018 09:07

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

hasjob PWA #425

hasjob PWA #425

vidya-ram commented Mar 7, 2018 •

edited

Loading

shreyas-satish Mar 7, 2018

iambibhas commented Mar 7, 2018

jace Mar 13, 2018

vidya-ram Mar 14, 2018

jace Mar 13, 2018

jace Mar 13, 2018

vidya-ram Mar 14, 2018

jace Mar 13, 2018

vidya-ram Mar 14, 2018

jace Mar 13, 2018

vidya-ram Mar 14, 2018

jace Mar 13, 2018

vidya-ram Mar 14, 2018

jace Mar 13, 2018

vidya-ram Mar 14, 2018

jace Mar 14, 2018

vidya-ram Mar 15, 2018

jace Mar 13, 2018

vidya-ram Mar 14, 2018

jace Mar 13, 2018

vidya-ram Mar 14, 2018

jace Mar 14, 2018

vidya-ram Mar 14, 2018

jace Apr 15, 2018

vidya-ram Apr 16, 2018

jace Apr 15, 2018

vidya-ram Apr 16, 2018

jace commented Apr 15, 2018

hasjob PWA #425

hasjob PWA #425

Conversation

vidya-ram commented Mar 7, 2018 • edited Loading

Choose a reason for hiding this comment

iambibhas commented Mar 7, 2018

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

jace commented Apr 15, 2018

vidya-ram commented Mar 7, 2018 •

edited

Loading