Page Menu
Home
c4science
Search
Configure Global Search
Log In
Files
F79509325
costcalc_stats.jsx
No One
Temporary
Actions
Download File
Edit File
Delete File
View Transforms
Subscribe
Mute Notifications
Award Token
Subscribers
None
File Metadata
Details
File Info
Storage
Attached
Created
Mon, Aug 26, 20:17
Size
8 KB
Mime Type
text/x-c++
Expires
Wed, Aug 28, 20:17 (2 d)
Engine
blob
Format
Raw Data
Handle
20196367
Attached To
rCOSTCALC Cost Calculator Source code
costcalc_stats.jsx
View Options
'use strict'
let _paq = window._paq || []
const Stats = {
Enable: false,
Engine: '',
StatsInitMatomo: function (PIWIK_URL, IDSITE) {
// accurately measure the time spent on the last pageview of a visit
_paq.push(['enableHeartBeatTimer'])
_paq.push(['setPagePerformanceTiming', 0])
_paq.push(['setDocumentTitle', 'MainPage'])
// require user consent before processing data
_paq.push(['requireConsent'])
_paq.push(['trackPageView'])
_paq.push(['enableLinkTracking'])
const u = 'https://' + PIWIK_URL + '/'
_paq.push(['setTrackerUrl', u + 'piwik.php'])
_paq.push(['setSiteId', IDSITE])
const d = document
const g = d.createElement('script')
const s = d.getElementsByTagName('script')[0]
g.type = 'text/javascript'
g.async = true
g.defer = true
g.src = u + 'piwik.js'
s.parentNode.insertBefore(g, s)
},
InitStat: function () {
const engine = MainData.StatsEngine
const enable = MainData.UseStats
if (enable) {
this.Enable = true
this.Engine = engine
switch (engine) {
case 'matomo':
this.StatsInitMatomo(MainData.StatsURL, MainData.StatsID)
break
}
}
},
RecordEvent: function (action, name, value) {
if (this.Enable) {
switch (this.Engine) {
case 'matomo':
_paq.push(['trackEvent', action, name, value])
break
}
}
},
ConsentOn: function () {
console.log('Statistics Enabled')
if (this.Enable) {
switch (this.Engine) {
case 'matomo':
_paq.push(['rememberConsentGiven'])
break
}
}
},
ConsentOff: function () {
console.log('Statistics Disabled')
if (this.Enable) {
switch (this.Engine) {
case 'matomo':
_paq.push(['forgetConsentGiven'])
break
}
}
}
}
class PopupStats extends React.Component {
constructor (props) {
super(props)
console.log('PopupStats instance constructed')
}
render () {
return (
<div
className="modal fade"
id="PopupStats"
tabIndex="-1"
role="dialog"
aria-labelledby="PopupStatsValidation"
aria-hidden="true"
>
<div
className="modal-dialog modal-dialog-centered modal-dialog-scrollable"
role="document"
>
<div className="modal-content">
<div className="modal-header bg-light">
<h5 className="modal-title " id="PopupStatsValidationTitle">
<img src="./icon/stats.png" width="50px" />
We need you to improve this tool
</h5>
</div>
<div className="modal-body">
<p>
{' '}
In order to improve this tool we have implemented a statistical
engine that give us information about how you use this cost
calculator tool.
</p>
<p>
Only <span className="font-weight-bold">Anonymous</span>{' '}
information are recorded.
</p>
<p> If you want to know more :</p>
{this.knowmore()}
</div>
<div className="modal-footer bg-light">
<p className="font-weight-bold">
Accepting or Refusing this recording will have not impact on the
usage of the tools
</p>
<button
type="button"
className="btn btn-danger"
data-dismiss="modal"
onClick={Stats.ConsentOff.bind(Stats)}
>
I Refuse
</button>
<button
type="button"
className="btn btn-success"
data-dismiss="modal"
onClick={Stats.ConsentOn.bind(Stats)}
>
I Accept
</button>
</div>
</div>
</div>
</div>
)
}
knowmore () {
return (
<div className="accordion" id="Statskm">
<div className="card">
<div className="card-header" id="headingOne">
<h2 className="mb-0">
<button
className="btn btn-link collapsed"
type="button"
data-toggle="collapse"
data-target="#collapseOne"
aria-expanded="false"
aria-controls="collapseOne"
>
Which kind of data are you recording ?
</button>
</h2>
</div>
<div
id="collapseOne"
className="collapse"
aria-labelledby="headingOne"
data-parent="#Statskm"
>
<div className="card-body">
We are recording the generic usage of the tools such as :
<ul>
<li>Number of visits</li>
<li>Time spend within the tool</li>
<li>Categories used</li>
<li>What kind of tools is used (Example : export)</li>
</ul>
What we are <span className="font-weight-bold"> never</span>{' '}
recording :
<ul>
<li>Your IP address</li>
<li>The costs and options you enter</li>
<li>Manual inputs</li>
</ul>
</div>
</div>
</div>
<div className="card">
<div className="card-header" id="headingTwo">
<h2 className="mb-0">
<button
className="btn btn-link collapsed"
type="button"
data-toggle="collapse"
data-target="#collapseTwo"
aria-expanded="false"
aria-controls="collapseTwo"
>
Who collects the data ?
</button>
</h2>
</div>
<div
id="collapseTwo"
className="collapse"
aria-labelledby="headingTwo"
data-parent="#Statskm"
>
<div className="card-body">{this.KmTools()}</div>
</div>
</div>
<div className="card">
<div className="card-header" id="headingThree">
<h2 className="mb-0">
<button
className="btn btn-link collapsed"
type="button"
data-toggle="collapse"
data-target="#collapseThree"
aria-expanded="false"
aria-controls="collapseThree"
>
Why are you collecting statistics ?
</button>
</h2>
</div>
<div
id="collapseThree"
className="collapse"
aria-labelledby="headingThree"
data-parent="#Statskm"
>
<div className="card-body">
We are developing this tool and would like to know how you use it,
in particular which options and categories you are using most in
order to improve and update the tools for your needs.
</div>
</div>
</div>
<div className="card">
<div className="card-header" id="headingFour">
<h2 className="mb-0">
<button
className="btn btn-link collapsed"
type="button"
data-toggle="collapse"
data-target="#collapseFour"
aria-expanded="false"
aria-controls="collapseFour"
>
Who should I contact for my information ?
</button>
</h2>
</div>
<div
id="collapseFour"
className="collapse"
aria-labelledby="headingFour"
data-parent="#Statskm"
>
<div className="card-body">
You can contact us <a href={MainData.StatsContact}>Here</a>
</div>
</div>
</div>
</div>
)
}
KmTools () {
switch (Stats.Engine) {
case 'matomo':
return (
<div>
<p>
We are using a self-hosted version of{' '}
<a href="https://matomo.org/">Matomo</a>
</p>
<p>
The data are only stored on our servers at {MainData.StatsURL}
</p>
<p className="font-weight-bold">
The data are only for research purpose and will not be shared my
any 3rd party.
</p>
</div>
)
}
}
}
Stats.InitStat()
Event Timeline
Log In to Comment