powered-by-wq / try.wq.io

Try WQ: the kitchen sink demo for the citizen science infrastructure provided by wq (https://wq.io). Try WQ leverages the ERAV data model to provide an offline-capable web-based "form-builder", supporting arbitrary user-defined data collection campaigns.
https://try.wq.io/
MIT License
6 stars 4 forks source link

Site does not show up at all in Firefox #18

Closed pombredanne closed 8 years ago

pombredanne commented 8 years ago

Using FF 48.0, on Ubuntu, your site just does not show up at all (and non of the wq.io sites). It works in Chrome though

sheppard commented 8 years ago

Thanks for reporting this. It sounds like a JavaScript error - is there anything in your browser console?

pombredanne commented 8 years ago

A view source gives:

<!DOCTYPE html>
<html manifest="trywq.appcache">
  <head>
    <title>Try WQ</title>
    <meta name="apple-mobile-web-app-capable" content="yes">
    <link rel="apple-touch-icon" href="images/icon-180.png" sizes="180x180">
    <link rel="manifest" href="manifest.json">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=yes" />
    <link rel="stylesheet" href="/css/trywq.css?v=0.1.2-1">
    <script>
        var require = {"paths": {"trywq": "trywq.js?v=0.1.2-1"}};
    </script>
    <script src="/js/lib/require.js" data-main="/js/trywq"></script>
  </head>
  <body>
    <div data-role="page" class="ui-page" data-wq-sync-refresh="true">
      <div data-role="header">
        <h1>Try WQ</h1>
      </div>
      <div role="main" class="ui-content">
        <p>
          Welcome to <b>Try WQ</b>, the kitchen sink demo for the
          <a href="https://wq.io/">wq Framework</a>!
        </p>
        <p>
          To experiment with wq, first create a campaign and then start
          sharing observations.  You can also contribute data to existing
          campaigns.
        </p>
        <ul data-role="listview" data-inset="true">
          <li data-icon="camera"><a href="/campaigns">Share Observation</a></li>
          <li data-icon="edit"><a href="/campaigns/new">Create Campaign</a></li>
          <li data-icon="check">
            <a href="/reports">
              View My Observations
            </a>
          </li>
          <li data-icon="bullets"><a href="/events">View All Observations</a></li>
          <li data-icon="lock"><a href="/login">Account</a></li>
        </ul>
      </div>
      <div id="index-map" class="map list-map"></div>
      <p class="footer">
        Try WQ v0.1.2-1
        &bull;
        <a href="https://github.com/powered-by-wq/try.wq.io">Source Code</a>
        <br>
        Powered by <a href="https://wq.io/">wq</a>
      </p>
    </div>
  </body>
</html>

The console shows this:

SecurityError: The operation is insecure.                                                                            trywq.js:27162
<anonymous> trywq.js:27162
<anonymous>trywq.js:27152

Use of getPreventDefault() is deprecated.  Use defaultPrevented instead                               .try.wq.io

NB: I disabled add blockers of course.

pombredanne commented 8 years ago

I have the same issue with wq.io btw view-source:

<!DOCTYPE html>
<html>
  <head>
    <title>wq: an open source framework for citizen science, VGI, and crowdsourcing</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge" /> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=yes" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <link rel="apple-touch-icon" href="/images/57/wq.png" />
    <link rel="apple-touch-icon" sizes="72x72" href="/images/72/wq.png" />
    <link rel="apple-touch-icon" sizes="114x114" href="/images/114/wq.png" />
    <link rel="apple-touch-icon" sizes="144x144" href="/images/144/wq.png" />
    <link rel="stylesheet" href="/css/wqsite.css" />
    <script src="/js/lib/require.js" data-main="/js/wqsite"></script>
    <link href='//fonts.googleapis.com/css?family=Titillium+Web:400,600' rel='stylesheet' type='text/css'>
    <meta name="twitter:card" content="photo" />
    <meta name="twitter:site" content="@wq_framework" />
    <meta name="twitter:title" content="wq framework for citizen science, VGI, and crowdsourcing" />
    <meta name="twitter:creator" content="@sasheppard" />
    <meta name="twitter:image:src" content="https://wq.io/media/images/wq-stack.png">
  </head>
  <body>
    <div data-role="page" class="ui-page" data-url="/" id="index-page">
      <div data-role="header">
        <h3>wq: an open source framework <span style="display:none">for citizen science, VGI, and crowdsourcing</span></h3>
      </div>
      <div data-role="header" data-theme="b">
        <div data-role="navbar">
          <ul>
            <li><a href="/about">
              <span class="long">About</span>
              <span class="short">About</span>
            </a></li>    
            <li><a href="/projects/">
              <span class="long">Projects</span>
              <span class="short">Demos</span>
            </a></li>    
            <li><a href="/docs/">
              <span class="long">Documentation</span>
              <span class="short">Docs</span>
            </a></li>    
            <li><a href="/research/">
              <span class="long">Research</span>
              <span class="short">Pubs</span>
            </a></li>    
            <li><a href="/community">
              <span class="long">Community</span>
              <span class="short">Cmty</span>
            </a></li>    
          </ul>
        </div>
      </div>
      <div data-role="content">
        <img src="/images/512/wq.png" alt="wq" class="logo">
        <div class="github">
          <a href="https://github.com/wq/">wq on GitHub</a><br>
          <iframe src="//ghbtns.com/github-btn.html?user=wq&repo=wq&type=fork&count=true"
            allowtransparency="true" frameborder="0" scrolling="0" width="85" height="20"></iframe>
          <iframe src="//ghbtns.com/github-btn.html?user=wq&repo=wq&type=watch&count=true"
            allowtransparency="true" frameborder="0" scrolling="0" width="85" height="20"></iframe>
        </div>
        <p>
          <strong>wq</strong> is a modular, open source framework for building custom
          offline-capable mobile-friendly web apps for
          <strong>citizen science</strong>,
          <strong>crowdsourcing</strong>, and
          <strong>volunteered geographic information</strong>.
        </p>

        <p>
          wq has a <a href="/license">permissive license</a> and extends a number of existing 
          open source web frameworks, including 
          <strong>Django</strong>, 
          <strong>jQuery Mobile</strong>,
          and <strong>RequireJS</strong>.
        </p>

        <p class="ui-content ui-corners-all highlight-box">
           <b>wq 1.0 beta</b> was released on September 7th, 2016!<br>
           <a href="/1.0/docs/setup">Install</a> &bull; <a href="https://github.com/wq/wq/releases">View Release Notes</a>
        </p>

        <ul data-role="listview" data-theme="c" data-divider-theme="a"
            data-inset="true" style="clear:both">
          <li data-role="list-divider">Submodules</li>
          <li><a href="/wq.app">
             <img src="/images/80/wq.app.png">
             <h3>wq.app</h3>
             <p>A JavaScript+Python library for building robust offline-capable HTML5 data entry apps.
<br>
Based on <strong>RequireJS</strong>, <strong>jQuery Mobile</strong>, <strong>Leaflet</strong>, <strong>d3</strong>, and <strong>Mustache</strong>.     </p>
             <span class="ui-li-count">1.0.0b1</span>
          </a></li>
          <li><a href="/wq.db">
             <img src="/images/80/wq.db.png">
             <h3>wq.db</h3>
             <p>Django database models and REST framework to support design patterns common to data collection systems.
<br>
Based on <strong>Django</strong> and the <strong>Django Rest Framework.</strong></p>
             <span class="ui-li-count">1.0.0b2</span>
          </a></li>
          <li><a href="/wq.io">
             <img src="/images/80/wq.io.png">
             <h3>wq.io</h3>
             <p>Python interoperability library for consuming and generating data resources in various formats.</p>
             <span class="ui-li-count">1.0.0b1</span>
          </a></li>
          <li><a href="/vera">
             <img src="/images/80/vera.png">
             <h3>vera</h3>
             <p>Vera is the reference implementation of the <b>ERAV</b> data model.<br>ERAV extends EAV with support for multiple versions of an entity with different provenance.</p>
             <span class="ui-li-count">1.0.0b1</span>
          </a></li>
        </ul>
        <p class='copyright'>&copy; 2013-2016 by S. Andrew Sheppard</p>
      </div>
    </div>
  </body>
</html>

Console:

SecurityError: The operation is insecure.                                                      wqsite.js:299

<anonymous> wqsite.js:299
<anonymous> wqsite.js:299
sheppard commented 8 years ago

Ok, I think I've figured out the issue. This looks like an error accessing IndexedDB when cookies are disabled. It's already been fixed in localForage but I hadn't updated to the latest version for a while. Both sites should be working now - thanks again for bringing this to my attention!