// 16PF

(function () {
  'use strict'

  // 获取url
  var js = '16pf'
  var $script = $('script[src*="/lb/chart/' + js + '.js"]').last()
  var src = $script.attr('src')

  // 获取参数
  var w = src.match(/[?&]w=([^&]+)/)
  var h = src.match(/[?&]h=([^&]+)/)
  var v = src.match(/[?&]v=([^&]+)/)

  // 处理参数
  if (w === null || w.length < 1) { w = '100%' } else { w = w[1] + 'px' }
  if (h === null || h.length < 1) { h = 400 } else { h = h[1] }
  if (v === null || v.length < 1) { v = '' } else { v = v[1] }

  // 创建容器
  var rnd = Math.random().toString().substring(2, 8)
  var div = '<div id="chart-' + rnd + '" class="chart" style="width:' + w + ';height:' + h + 'px;overflow-x:auto;overflow-y:hidden;margin:0 auto;"></div>'
  $script.after(div).remove()

  // 处理得分
  var json = v.replace(/\|/g, ',').split(',').slice(0, 16)
  $.each(json, function (i, v) {
    if (v.indexOf('.') === 0) { v = '0' + v }
    if (v.indexOf('-.') === 0) { v = '-0' + v.substring(1) }
  })

  var low = '沉默孤独|迟钝、学识浅薄|情绪激动|谦逊顺从|严肃审慎|权宜敷衍|畏怯退缩|理智、着重实际|信赖随和|现实、合乎成规|坦白直率、天真|安详沉着、有自信心|保守、附庸传统|依赖、随群附众|矛盾冲突、不明大体|心平气和'.split('|')
  var high = '乐群外向|聪慧、富有才识|情绪稳定|好强固执|轻松兴奋|有恒负责|冒险敢为|敏感、感情用事|怀疑刚愎|幻想、狂放不羁|精明能干、世故|忧虑抑郁、烦恼多端|自由、批评激进|自立、当机立断|知己知彼、自律谨严|紧张困扰'.split('|')

  var lowJson = ''
  var highJson = ''
  $.each(low, function (i, v) {
    if (i > 0) { lowJson += ',' }
    lowJson += '{"type":"text","style":{"text":"' + v + '","x":175,"y":' + ((h - 60 - 10) / 16 * i + 80) + ',"textAlign":"right"}}'
  })
  var width = $('#chart-' + rnd).width() - 110
  $.each(high, function (i, v) {
    if (i > 0) { highJson += ',' }
    highJson += '{"type":"text","style":{"text":"' + v + '","x":' + width + ',"y":' + ((h - 60 - 10) / 16 * i + 80) + '}}'
  })

  // 配置
  var option = {
    grid: { left: 180, right: 115, bottom: 10 },
    title: { show: false },
    tooltip: { trigger: 'axis' },
    toolbox: {
      feature: {
        dataView: {},
        magicType: { type: ['bar'] },
        restore: {},
        saveAsImage: {}
      }
    },
    xAxis: {
      type: 'value',
      position: 'top',
      min: 1,
      max: 10,
      splitNumber: 10
    },
    yAxis: {
      type: 'category',
      offset: 120,
      splitLine: { show: true },
      inverse: true,
      data: ['乐群(A)', '聪慧(B)', '稳定(C)', '恃强(E)', '兴奋(F)', '有恒(G)', '敢为(H)', '敏感(I)', '怀疑(L)', '幻想(M)', '世故(N)', '忧虑(O)', '实验(Q1)', '独立(Q2)', '自律(Q3)', '紧张(Q4)']
    },
    series: {
      name: '标准分',
      type: 'line',
      step: 'middle',
      smooth: false,
      markLine: {
        silent: true,
        label: {
          show: true,
          position: 'start',
          formatter: '{b}'
        },
        data: [{ name: '中', xAxis: 5.5, lineStyle: { color: '#b6a2de', opacity: 0.7 } }]
      },
      label: { show: true, position: 'right' },
      data: json
    },
    graphic: JSON.parse('[' + lowJson + ',' + highJson + ']')
  }

  // 绘制图表
  $.ajax('/Scripts/echarts/theme/macarons.js', {
    dataType: 'script',
    cache: true,
    complete: function () {
      // console.log(JSON.stringify(option, null, 2));
      $('#chart-' + rnd).data({ option: option, theme: 'macarons' })
      echarts.init(document.getElementById('chart-' + rnd), 'macarons').setOption(option)
    }
  })
})()