diff --git a/package.json b/package.json index 6458c7b5..0ae6dc08 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "tutorcruncher-socket", - "version": "0.0.14", + "version": "0.0.15", "description": "TutorCruncher socket", "author": "Samuel Colvin ", "private": false, diff --git a/src/components/enquiry.vue b/src/components/enquiry.vue index 54ae612f..49b858c4 100644 --- a/src/components/enquiry.vue +++ b/src/components/enquiry.vue @@ -14,7 +14,7 @@ -
+
{{ $root.get_text('grecaptcha_missing') }}
@@ -61,8 +61,6 @@ export default { data: () => ({ submitted: false, grecaptcha_missing: false, - grecaptcha_container_id: 'grecaptcha_' + Math.random().toString(36).substring(2, 10), - grecaptcha_id: null, }), methods: { submit () { @@ -83,24 +81,15 @@ export default { }, /* istanbul ignore next */ prepare_grecaptcha () { - const grecaptcha_callback = response => this.$set(this.$root.enquiry_data, 'grecaptcha_response', response) - if (this.$root.grecaptcha_key === null) { - grecaptcha_callback('-') + this.$root.grecaptcha_callback('-') return } - const render_grecaptcha = () => { - this.grecaptcha_id = window.grecaptcha.render(this.grecaptcha_container_id, { - sitekey: this.$root.grecaptcha_key, - callback: grecaptcha_callback - }) - } if (window.grecaptcha === undefined) { - window._tcs_grecaptcha_loaded = render_grecaptcha add_script('https://www.google.com/recaptcha/api.js?onload=_tcs_grecaptcha_loaded&render=explicit') } else { - render_grecaptcha() + this.$root.render_grecaptcha() } } }, diff --git a/src/main.js b/src/main.js index e5d4cac4..1935a28b 100644 --- a/src/main.js +++ b/src/main.js @@ -67,6 +67,7 @@ const ConfiguredVueRouter = config => { } ) } + console.debug('setting routes:', routes) return new VueRouter({ mode: config.router_mode, routes: routes @@ -101,6 +102,18 @@ module.exports = function (public_key, config) { config: config, }) + if (!config.console) { + config.console = console + if (!window.localStorage.tcs_enable_debug) { + if (!window.tcs_debug_log) { + window.tcs_debug_log = [] + } + console.debug = function () { + window.tcs_debug_log.push(Array.from(arguments).join()) + } + } + } + let error = null if (!config.mode) { config.mode = 'grid' @@ -132,10 +145,6 @@ module.exports = function (public_key, config) { config.router_mode = 'hash' } - if (!config.console) { - config.console = console - } - if (!config.element) { config.element = '#socket' } @@ -163,7 +172,9 @@ module.exports = function (public_key, config) { const ga_prefixes = init_ga(router, config) - return new Vue({ + console.debug('using config:', config) + + const v = new Vue({ el: config.element, router: router, render: h => h(app), @@ -178,6 +189,7 @@ module.exports = function (public_key, config) { enquiry_form_info: {}, enquiry_data: {}, selected_subject_id: null, + grecaptcha_container_id: 'grecaptcha_' + Math.random().toString(36).substring(2, 10), }, components: { app @@ -190,7 +202,8 @@ module.exports = function (public_key, config) { } }, watch: { - '$route' (to) { + '$route' (to, from) { + console.debug(`route change ${from.path} to ${to.path}`, from, to) if (this.config.mode === 'grid' && to.name === 'index') { this.get_contractor_list() } @@ -208,9 +221,11 @@ module.exports = function (public_key, config) { }, request (url, callback, expected_status, method, data) { const xhr = new window.XMLHttpRequest() - xhr.open(method || 'GET', url) + method = method || 'GET' + xhr.open(method, url) xhr.setRequestHeader('Accept', 'application/json') xhr.onload = () => { + console.debug(`request ${method} ${url} > ${xhr.status}`, data, xhr) try { if (xhr.status !== (expected_status || 200)) { throw Error(`bad response status ${xhr.status} not 200`) @@ -325,12 +340,41 @@ ${xhr.responseText}`) ga_event (category, action, label) { /* istanbul ignore next */ for (let prefix of ga_prefixes) { + console.debug('ga sending event', prefix, category, action, label) window.ga(prefix + 'send', 'event', category, action, label) } }, + grecaptcha_callback (response) { + Vue.set(this.enquiry_data, 'grecaptcha_response', response) + }, + render_grecaptcha () { + const el = document.getElementById(this.grecaptcha_container_id) + if (el && el.childElementCount === 0) { + console.debug('rendering grecaptcha') + window.grecaptcha.render(this.grecaptcha_container_id, { + sitekey: this.grecaptcha_key, + callback: this.grecaptcha_callback + }) + } else { + console.debug('not rendering grecaptcha', el) + } + }, + goto (name, params) { this.$router.push({'name': name, params: params}) } } }) + if (window.socket_view === undefined) { + window.socket_view = [v] + } else { + window.socket_view.push(v) + } + + window._tcs_grecaptcha_loaded = () => { + for (let v of window.socket_view) { + v.render_grecaptcha() + } + } + return v } diff --git a/test/unit/specs/_shared.js b/test/unit/specs/_shared.js index ed5d3812..cf4700eb 100644 --- a/test/unit/specs/_shared.js +++ b/test/unit/specs/_shared.js @@ -100,6 +100,7 @@ function generate_vm (router, vm_data_) { callback() }, ga_event () { this.__record_call('ga_event') }, + grecaptcha_callback (r) { this.__record_call('grecaptcha_callback', r) }, get_selected_subject () { this.__record_call('get_selected_subject') return null