<commit_before><template lang="pug">
div.panel-group.accordion#callStackAccordion
</template>

<script>
module.exports = {
	props: ['crashReverseStack', 'watchPackageName', 'stopWatchIsInitDone', 'insight', 'type'],
	data() {
		return {
			app: this.$root.app,
			data: []
		}
	},
	watch: {
		'app.packageName'() {
			if( ! this.app.isInitDone ) {
				return
			}
			if( this.watchPackageName !== undefined ) {
				this.fetch()
			}
		},
		'app.distSelection': {
			handler() {
				if( ! this.app.isInitDone ) {
					return
				}
				this.fetch()
			},
			deep: true
		},
		data: 'draw',
		'app.isInitDone'() {
			if( ! this.app.isInitDone ) {
				return
			}
			if( this.stopWatchIsInitDone !== undefined ) {
				return
			}
			this.fetch()
		},
		'app.insight.status'() {
			if( ! this.app.isInitDone ) {
				return
			}
			if( this.insight == undefined ) {
				return
			}
			this.fetch()
		},
		'app.uuid'() {
			if( ! this.app.isInitDone ) {
				return
			}
			this.fetch()
		}
	},
	methods: {
		fetch() {
			let query = this.app.getFilters()
			query.startRange = this.app.distSelection.startRange > 0 ? this.app.distSelection.startRange : query.startRange
			query.endRange = this.app.distSelection.endRange > 0 ? this.app.distSelection.endRange : query.endRange
			query.startUsage = this.app.distSelection.startUsage
			query.endUsage = this.app.distSelection.endUsage
			// uuid
			query.uuid = this.app.uuid.join(',')

			if( this.crashReverseStack !== undefined ) {
				$.ajax({type: 'get', url: `/api/crashReverseStack/${this.app.packageName}/${this.app.crashId}`}).then(res => {
					this.data = []
					this.data = res.map(d => {
						return {
							threadName: d.threadName,
							data: this.preprocess(d.stack[0].children)
						}
					})
				})
			} else if( this.insight !== undefined ) {
				let params = {}
				params.activity = this.app.insight.status.act.map(d => d.key).join(',')
				params.os = this.app.insight.status.os.map(d => d.key).join(',')
				params.device = this.app.insight.status.dev.map(d => d.key).join(',')
				params.location = this.app.insight.status.loc.map(d => d.key).join(',')
				this.$http.get(`/api/reverseStack/${this.app.packageName}/${this.app.insight.type}`, {params}).then(res => {
					this.data = []
					res.body.forEach(d => {
						this.data.push({
							threadName: d.threadName,
							data: this.preprocess(d.stack[0].children)
						})
					})
				})
			} else if( this.type !== undefined ){
				$.ajax({type: 'get', url: `/api/reverseStack/${this.app.packageName}/${this.app.activityName}/${this.type}`, data: query}).then(res => {
					this.data = []
					res.forEach(d => {
						this.data.push({
							threadName: d.threadName,
							data: this.preprocess(d.stack[0].children)
						})
					})
				})
			} else {
				$.ajax({type: 'get', url: `/api/reverseStack/${this.app.packageName}/${this.app.activityName}`, data: query}).then(res => {
					this.data = []
					res.forEach(d => {
						this.data.push({
							threadName: d.threadName,
							data: this.preprocess(d.stack[0].children)
						})
					})
				})
			}
		},
		clear() {
			$(this.$el).find('*').remove()
		},
		draw() {
			this.clear()
			this.data.forEach((d, idx) => {
				$(this.$el).append(`
					<div class='panel panel-default'>
						<div class='panel-heading'>
							<div class='panel-title'>
								<a class='accordion-toggle' href='#thread${idx}' data-toggle='collapse'>${d.threadName}</a>
							</div>
						</div>
						<div class='panel-collapse collapse' id='thread${idx}'>
							<div class='panel-body'>
								<div class='jstree jstree-default jstree${idx}'>
								</div>
							</div>
						</div>
					</div>
				`)
				$(this.$el).find(`.jstree${idx}`).jstree({
					core: {
						themes: {
							variant: 'large'
						},
						data: d.data
					},
					types: {
						default: {
							icon: 'fa fa-window-maximize'
						},
						android: {
							icon: 'fa fa-android'
						},
						db: {
							icon: 'fa fa-database'
						},
						network: {
							icon: 'fa fa-exchange'
						},
						java: {
							icon: 'fa fa-coffee'
						}
					},
					plugins: ['wholerow', 'types']
				})
			})
		},
		preprocess(arr) {
			arr.forEach(a => {
				a.text = `(${a.count}) ${a.stackName}`
				if( a.stackName.indexOf('android') == 0 ) {
					a.type = 'android'
				} else if( a.stackName.indexOf('java') == 0 ) {
					a.type = 'java'
				}
				a.id = ''
				if( a.hasOwnProperty('children') ) {
					this.preprocess(a.children)
				}
			})
			return arr
		}
	},
	mounted() {
	}
}
</script>

<style lang="sass">
</style>
<commit_msg>*add expanded when loaded<commit_after><template lang="pug">
div.panel-group.accordion#callStackAccordion
</template>

<script>
module.exports = {
	props: ['crashReverseStack', 'watchPackageName', 'stopWatchIsInitDone', 'insight', 'type'],
	data() {
		return {
			app: this.$root.app,
			data: []
		}
	},
	watch: {
		'app.packageName'() {
			if( ! this.app.isInitDone ) {
				return
			}
			if( this.watchPackageName !== undefined ) {
				this.fetch()
			}
		},
		'app.distSelection': {
			handler() {
				if( ! this.app.isInitDone ) {
					return
				}
				this.fetch()
			},
			deep: true
		},
		data: 'draw',
		'app.isInitDone'() {
			if( ! this.app.isInitDone ) {
				return
			}
			if( this.stopWatchIsInitDone !== undefined ) {
				return
			}
			this.fetch()
		},
		'app.insight.status'() {
			if( ! this.app.isInitDone ) {
				return
			}
			if( this.insight == undefined ) {
				return
			}
			this.fetch()
		},
		'app.uuid'() {
			if( ! this.app.isInitDone ) {
				return
			}
			this.fetch()
		}
	},
	methods: {
		fetch() {
			let query = this.app.getFilters()
			query.startRange = this.app.distSelection.startRange > 0 ? this.app.distSelection.startRange : query.startRange
			query.endRange = this.app.distSelection.endRange > 0 ? this.app.distSelection.endRange : query.endRange
			query.startUsage = this.app.distSelection.startUsage
			query.endUsage = this.app.distSelection.endUsage
			// uuid
			query.uuid = this.app.uuid.join(',')

			if( this.crashReverseStack !== undefined ) {
				$.ajax({type: 'get', url: `/api/crashReverseStack/${this.app.packageName}/${this.app.crashId}`}).then(res => {
					this.data = []
					this.data = res.map(d => {
						return {
							threadName: d.threadName,
							data: this.preprocess(d.stack[0].children)
						}
					})
				})
			} else if( this.insight !== undefined ) {
				let params = {}
				params.activity = this.app.insight.status.act.map(d => d.key).join(',')
				params.os = this.app.insight.status.os.map(d => d.key).join(',')
				params.device = this.app.insight.status.dev.map(d => d.key).join(',')
				params.location = this.app.insight.status.loc.map(d => d.key).join(',')
				this.$http.get(`/api/reverseStack/${this.app.packageName}/${this.app.insight.type}`, {params}).then(res => {
					this.data = []
					res.body.forEach(d => {
						this.data.push({
							threadName: d.threadName,
							data: this.preprocess(d.stack[0].children)
						})
					})
				})
			} else if( this.type !== undefined ){
				$.ajax({type: 'get', url: `/api/reverseStack/${this.app.packageName}/${this.app.activityName}/${this.type}`, data: query}).then(res => {
					this.data = []
					res.forEach(d => {
						this.data.push({
							threadName: d.threadName,
							data: this.preprocess(d.stack[0].children)
						})
					})
				})
			} else {
				$.ajax({type: 'get', url: `/api/reverseStack/${this.app.packageName}/${this.app.activityName}`, data: query}).then(res => {
					this.data = []
					res.forEach(d => {
						this.data.push({
							threadName: d.threadName,
							data: this.preprocess(d.stack[0].children)
						})
					})
				})
			}
		},
		clear() {
			$(this.$el).find('*').remove()
		},
		draw() {
			this.clear()
			this.data.forEach((d, idx) => {
				$(this.$el).append(`
					<div class='panel panel-default'>
						<div class='panel-heading'>
							<div class='panel-title'>
								<a class='accordion-toggle' href='#thread${idx}' data-toggle='collapse' aria-expanded='true'>${d.threadName}</a>
							</div>
						</div>
						<div class='panel-collapse collapse in' id='thread${idx}' aria-expanded='true'>
							<div class='panel-body'>
								<div class='jstree jstree-default jstree${idx}'>
								</div>
							</div>
						</div>
					</div>
				`)
				$(this.$el).find(`.jstree${idx}`).jstree({
					core: {
						themes: {
							variant: 'large'
						},
						data: d.data
					},
					types: {
						default: {
							icon: 'fa fa-window-maximize'
						},
						android: {
							icon: 'fa fa-android'
						},
						db: {
							icon: 'fa fa-database'
						},
						network: {
							icon: 'fa fa-exchange'
						},
						java: {
							icon: 'fa fa-coffee'
						}
					},
					plugins: ['wholerow', 'types']
				})
			})
		},
		preprocess(arr) {
			arr.forEach(a => {
				a.text = `(${a.count}) ${a.stackName}`
				if( a.stackName.indexOf('android') == 0 ) {
					a.type = 'android'
				} else if( a.stackName.indexOf('java') == 0 ) {
					a.type = 'java'
				}
				a.id = ''
				if( a.hasOwnProperty('children') ) {
					this.preprocess(a.children)
				}
			})
			return arr
		}
	},
	mounted() {
	}
}
</script>

<style lang="sass">
</style>

{'fraction_non_alphanumeric': 0.1886498285001559, 'fraction_numerical': 0.0016630287911859475, 'mean_word_length': 2.0653074227460975, 'pattern_counts': {'":': 0, '<': 43, '<?xml version=': 0, '>': 75, 'https://': 0, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '4645119', 'n_tokens_mistral': 4576, 'n_tokens_neox': 3413, 'n_words': 498}