{"version":3,"sources":["webpack:///./src/components/mathematics/Math10thGrade/distance/Lesson.vue?97c3","webpack:///./src/components/mathematics/Math10thGrade/distance/Lesson.vue","webpack:///./src/components/mathematics/Math10thGrade/distance/Boxes.js","webpack:///src/components/mathematics/Math10thGrade/distance/Lesson.vue","webpack:///./src/components/mathematics/Math10thGrade/distance/Lesson.vue?80b3","webpack:///./src/components/mathematics/Math10thGrade/distance/Lesson.vue?1195"],"names":["attrs","staticClass","_c","_vm","_self","staticRenderFns","Boxes","box1","JXG","Options","board","minimizeReflow","point","showInfoBox","highlight","image","text","fixed","curve","cssDefaultStyle","brd1","JSXGraph","initBoard","boundingbox","keepaspectratio","axis","ticks","grid","showCopyright","showNavigation","pan","enabled","zoom","makeResponsive","options","layer","placeTitle","placeLogo","i","j","analytics","placeUndo","setAttribute","visible","setLabel","label","alignX","offset","CssStyle","fontSize","on","this","erase","placeRedo","shuffle","placeShuffle","shuffle2","placeErase","pts1","create","name","size","canvasHeight","fillColor","strokeColor","strokeWidth","snapToGrid","shadow","placeLabel","pts2","pts3","X","Y","placeLine","Horz","placeTapeHori","fillOpacity","point1","point2","color","horzDash","placeDash","vertDash","Vert","placeTapeVert","xAxis","placeHTMLText","Value","toFixed","yAxis","anchorX","ang","placeAngle","eggOne","placeImage","textOne","eggTwo","textTwo","eggThree","pyText","cal","dal","val","placeText","Math","pow","moveTo","round","random","created","_created","_asyncToGenerator","regeneratorRuntime","mark","_callee","title","newTopics","newshowhome","newMath","newLeftArrow","newModule","_this","wrap","_context","prev","next","$store","dispatch","commit","img","action","goto","stop","apply","arguments","mounted","MathJax","Hub","Queue","metaInfo","titleTemplate","meta","content","component"],"mappings":"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","file":"js/chunk-d834e8fc.b452b81a.js","sourcesContent":["export * from \"-!../../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--8-oneOf-1-0!../../../../../node_modules/css-loader/index.js??ref--8-oneOf-1-1!../../../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../../../node_modules/postcss-loader/src/index.js??ref--8-oneOf-1-2!../../../../../node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!../../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Lesson.vue?vue&type=style&index=0&id=ee3a1d36&prod&lang=scss&\"","var render = function render(){var _vm=this,_c=_vm._self._c;return _c('div',[_c('h3',[_vm._v(\" Distance between Two Points \")]),_vm._m(0),_c('body',[_vm._v(\"\\n    $$AB = \\\\sqrt{(X_B - X_A)^2) + (Y_B-Y_A)^2}$$\\n    This expression is known as distance formula.\\n  \")]),_c('p'),_c('h3',[_vm._v(\" MagicGraph | Distance Formula Explained \")]),_c('br'),_c('h5',[_vm._v(\"Getting Started\")]),_vm._m(1),_c('h5',[_vm._v(\" Icons on the MagicGraph \")]),_vm._m(2),_c('br'),_c('p'),_c('v-responsive',[_c('v-layout',{attrs:{\"justify-center\":\"\"}},[_c('div',{staticClass:\"edliy-box-about\",attrs:{\"id\":\"jxgbox1\"}})])],1)],1)\n}\nvar staticRenderFns = [function (){var _vm=this,_c=_vm._self._c;return _c('p',{staticClass:\"big my-3\"},[_vm._v(\"\\n    In this section, we will find the formula for the distance between any two points on the coordinate plane.\\n    \"),_c('br'),_vm._v(\"      Consider two points \\\\(A\\\\) and \\\\(B\\\\) on the coordinate plane.\\n    Point \\\\(A\\\\) has coordinates: \\\\((X_A, Y_A)\\\\), while point \\\\(B\\\\) has\\n    coordinates: \\\\((X_B, Y_B)\\\\).\\n    \"),_c('br'),_vm._v(\"\\n    Then, the distance between these two points is given as —\\n  \")])\n},function (){var _vm=this,_c=_vm._self._c;return _c('p',{staticClass:\"big my-3\"},[_vm._v(\"\\n    In this MagicGraph, you will learn, in a step by step manner, how to find the distance between any two points on coordinate plane.\\n    \"),_c('br'),_vm._v(\"\\n    Simply use \"),_c('i',{staticClass:\"redoer ma-1\"}),_vm._v(\" and \"),_c('i',{staticClass:\"undoer ma-1\"}),_vm._v(\" icons to go through the steps\\n    required to find the distance between points A and B.\\n  \")])\n},function (){var _vm=this,_c=_vm._self._c;return _c('p',{staticClass:\"big my-3\"},[_vm._v(\"\\n    You can tap on \"),_c('i',{staticClass:\"shuffler ma-1\"}),_vm._v(\" icon  to shuffle events.\\n    You can tap on the \"),_c('i',{staticClass:\"eraser ma-1\"}),_vm._v(\" icon to erase and start over.\\n    Tap on the \"),_c('i',{staticClass:\"redoer ma-1\"}),_vm._v(\" icon to go to the next step.\\n    To go to the previous step, tap on the \"),_c('i',{staticClass:\"undoer ma-1\"}),_vm._v(\" icon.\\n  \")])\n}]\n\nexport { render, staticRenderFns }","// Import the edliy_utils\r\nimport {\r\n    makeResponsive,\r\n    placeTitle,\r\n    placeImage,\r\n    placeInput,\r\n    placeSlider,\r\n    hoverMe,\r\n    placeRec,\r\n    hiddenPt,\r\n    fixedPt,\r\n    clearInputFields,\r\n    dragMe,\r\n    placeArrow,\r\n    placeGravity,\r\n    placeMiddleText,\r\n    placeLine,\r\n    placePoint,\r\n    placeGlider,\r\n    placeRuler,\r\n    placeLeftText,\r\n    placeRightText,\r\n    placeSliderSwitch,\r\n    placeCircle,\r\n    placeLogo,\r\n    placeShuffle,\r\n    placeTest,\r\n    placeUndo,\r\n    placeRedo,\r\n    placeBoldText,\r\n    placeBoldLeftText,\r\n    placeErase,\r\n    placeLabel,\r\n    placeDash,\r\n    placeTapeHori,\r\n    placeTapeVert,\r\n    placeText,\r\n    placeHTMLText,\r\n    placeAngle\r\n} from '../../../../common/edliy_utils-geometric';\r\nconst Boxes = {\r\n  box1: function () {\r\n\tJXG.Options.board.minimizeReflow = 'none';\r\n  JXG.Options.point.showInfoBox=false;\r\n  JXG.Options.point.highlight=false;\r\n  JXG.Options.image.highlight=false;\r\n  JXG.Options.text.highlight=false;\r\n  JXG.Options.text.fixed=true;\r\n  JXG.Options.curve.highlight=false;\r\n  JXG.Options.text.cssDefaultStyle='fontFamily:Oswald;'\r\n  var brd1 = JXG.JSXGraph.initBoard('jxgbox1',{boundingbox: [-10, 12, 10, -8],\r\n    keepaspectratio: true, axis:true, ticks:true, grid:true, showCopyright:false, showNavigation:false, pan:{enabled:false}, zoom:{enabled:false}});\r\n  //brd1.suspendUpdate();\r\n  makeResponsive(brd1);\r\n  brd1.options.layer['text'] =30;\r\n  brd1.options.layer['image'] =30;\r\n  brd1.options.layer['point'] =20;\r\n  brd1.options.layer['line'] =15;\r\n//\tbrd1.create('text', [6, 11.5, 'Fraction'],{highlight:false, display:'internal', anchorX:'middle', anchorY:'middle', CssStyle:'fontFamily:Oswald;fontWeight:bold',fontSize:function(){return Math.round(32*brd1.canvasWidth/800.)}, fixed:true});\r\n  placeTitle(brd1, 'Distance Formula', 'Find distance between points A and B');\r\n  placeLogo(brd1);\r\n  var i=0; var j=0;\r\n  ////////////////////////////////////////////////////////////////////////////////\r\n      var analytics = placeUndo(brd1);\r\n      analytics.setAttribute({visible:()=>i>0})\r\n      analytics.setLabel('Tap to Go to Previous Step');\r\n      analytics.label.setAttribute({visible:false, alignX:'middle', offset:[0, -15], CssStyle:'fontFamily:Oswald', fontSize:12});\r\n      analytics.on('over', function () {this.label.setAttribute({visible:true});});\r\n      analytics.on('out', function () {this.label.setAttribute({visible:false});});\r\n      ////////////////////////////////////////////////////\r\n      var erase = placeRedo(brd1);\r\n      erase.setLabel('Tap to Go to Next Step')\r\n      erase.setAttribute({visible:()=>i<3})\r\n      erase.label.setAttribute({visible:false, alignX:'middle', offset:[0, -15], CssStyle:'fontFamily:Oswald', fontSize:12});\r\n      erase.on('over', function () {this.label.setAttribute({visible:true});});\r\n      erase.on('out', function () {this.label.setAttribute({visible:false});});\r\n  /////////////////////////////////////////////////////////////////////////////\r\n      var shuffle = placeShuffle(brd1);\r\n      shuffle.setAttribute({visible:()=>i==0})\r\n      shuffle.setLabel('Tap to Shuffle Events');\r\n      shuffle.label.setAttribute({visible:false, alignX:'middle', offset:[0, -15], CssStyle:'fontFamily:Oswald', fontSize:12});\r\n      shuffle.on('over', function () {this.label.setAttribute({visible:true});});\r\n      shuffle.on('out', function () {this.label.setAttribute({visible:false});});\r\n///////////////////////////////////////////////////////////////////////////////////\r\n      var shuffle2 = placeErase(brd1);\r\n      shuffle2.setAttribute({visible:()=>i==3})\r\n      shuffle2.setLabel('Tap to Start Over');\r\n      shuffle2.label.setAttribute({visible:false, alignX:'middle', offset:[0, -15], CssStyle:'fontFamily:Oswald', fontSize:12});\r\n      shuffle2.on('over', function () {this.label.setAttribute({visible:true});});\r\n      shuffle2.on('out', function () {this.label.setAttribute({visible:false});});\r\n////////////////////////////////////////////\r\nvar pts1 = brd1.create('point', [2., 2.], {name:'', highlight:false, size:function(){return 4*brd1.canvasHeight/800}, fillColor:'orange', strokeColor:'black', strokeWidth:1, visible:true, snapToGrid:true, shadow:true});\r\nplaceLabel(brd1, pts1, 'A', 0, 15);\r\n///////////////////////////////////////////////////////////////////////\r\nvar pts2 = brd1.create('point', [-3., -4.], {name:'', highlight:false, size:function(){return 4*brd1.canvasHeight/800}, fillColor:'orange', strokeColor:'black', strokeWidth:1, visible:true, snapToGrid:true, shadow:true});\r\nplaceLabel(brd1, pts2, 'B', -15, -15);\r\n//////////////////////////////////////////////////////\r\nvar pts3 = brd1.create('point', [()=>pts1.X(), ()=>pts2.Y()], {name:'', highlight:false, size:function(){return 4*brd1.canvasHeight/800}, fillColor:'orange', strokeColor:'black', strokeWidth:1, visible:true, snapToGrid:true, shadow:true});\r\nplaceLabel(brd1, pts3, 'C', 15, -15);\r\npts3.setAttribute({visible:()=>i>=1})\r\n//////////////////////////////////////////////////////////\r\nplaceLine(brd1, [()=>pts2.X(), ()=>pts2.Y()], [()=>pts1.X(), ()=>pts1.Y()], 3,'black');\r\nvar Horz =placeTapeHori(brd1, [()=>pts2.X(), ()=>pts2.Y()], [()=>pts1.X(), ()=>pts2.Y()], 'x2 - x1');\r\nHorz.setAttribute({visible:()=>i>=2, highlight:true, fillOpacity:0.4,\r\n  point1:{visible:false},point2:{visible:false}, strokeWidth:3, strokeColor:'red', label:{visible:()=>i>=5, color:'red'}});\r\n/////\r\nvar horzDash =placeDash(brd1, [-12, ()=>pts2.Y()], [12, ()=>pts2.Y()], 2,'black');\r\nhorzDash.setAttribute({visible:()=>i>=1});\r\nvar vertDash = placeDash(brd1, [()=>pts1.X(), -12], [()=>pts1.X(), 12], 2,'black');\r\nvertDash.setAttribute({visible:()=>i>=1});\r\n////////////////////////////////////////\r\nvar Vert =placeTapeVert(brd1, [()=>pts1.X(), ()=>pts1.Y()], [()=>pts1.X(), ()=>pts2.Y()], 'Y2 - Y1');\r\nVert.setAttribute({visible:()=>i>=2, highlight:true, fillOpacity:0.4,\r\n  point1:{visible:false},point2:{visible:false}, strokeWidth:3, strokeColor:'blue', label:{visible:()=>i>=5, color:'blue'}});\r\n/////////////////////////////////////////////////////////////\r\nvar xAxis =placeHTMLText(brd1, ()=>(pts1.X()+pts2.X())/2, ()=>pts2.Y()-0.5, 18, ()=>'X_B-X_A = '+(Horz.Value()).toFixed(2));\r\nxAxis.setAttribute({color:'red', visible:()=>i>=2});\r\n\r\nvar yAxis =placeHTMLText(brd1, ()=>pts1.X()+0.25, ()=>(pts1.Y()+pts2.Y())/2, 18, ()=>'Y_B-Y_A = '+(Vert.Value()).toFixed(2));\r\nyAxis.setAttribute({anchorX:'left', color:'blue', visible:()=>i>=2});\r\n\r\nvar ang = placeAngle(brd1, [()=>pts2.X(), ()=>pts2.Y()], [()=>pts1.X(), ()=>pts2.Y()], [()=>pts1.X(), ()=>pts1.Y()],\r\n 1, 'green');\r\nang.setAttribute({label:{visible:false},visible:()=>i>=2});\r\n//ang.setLabel({})\r\n///////////////////////////////TAP OPERATIONS ////////////////////////////////\r\nvar eggOne = placeImage(brd1, '/assets/eggOne.svg',-8.75, 8.25, 0.5, 0);\r\neggOne.setAttribute({visible:()=>i>=1});\r\n\r\nvar textOne =placeHTMLText(brd1, -8, 8.5, 18, 'Construct right-angled triangle ACB');\r\ntextOne.setAttribute({anchorX:'left', CssStyle: 'fontFamily:Oswald;fontWeight:bold', visible:()=>i>=1})\r\n\r\nvar eggTwo = placeImage(brd1, '/assets/eggTwo.svg',-8.75, 6.75, 0.5, 0);\r\neggTwo.setAttribute({visible:()=>i>=2});\r\n\r\nvar textTwo =placeHTMLText(brd1, -8, 7., 18, 'Measure base and height of the triangle');\r\ntextTwo.setAttribute({anchorX:'left', CssStyle: 'fontFamily:Oswald;fontWeight:bold', visible:()=>i>=2})\r\n\r\n\r\nvar eggThree = placeImage(brd1, '/assets/eggThree.svg',-8.75, 5.25, 0.5, 0);\r\neggThree.setAttribute({visible:()=>i>=3});\r\n\r\nvar pyText =placeHTMLText(brd1, -8, 5.5, 18, 'Apply Pythagoras Theorem');\r\npyText.setAttribute({anchorX:'left', CssStyle: 'fontFamily:Oswald;fontWeight:bold', visible:()=>i>=3})\r\n\r\nvar cal =placeHTMLText(brd1, -8, 4.5, 18,'AB^2 = BC^2 + CA^2 = (X_B -X_A)^2 + (Y_B-Y_A)^2');\r\ncal.setAttribute({visible:()=>i>=3, anchorX:'left', CssStyle: 'fontFamily:Oswald;fontWeight:regular'});\r\n///////////////////////////////////////\r\nvar dal =placeHTMLText(brd1, -8, 3.5, 18,'AB = [(X_B -X_A)^2 + (Y_B-Y_A)^2]^1^/^2');\r\ndal.setAttribute({visible:()=>i>=3, anchorX:'left',CssStyle:'fontFamily:Oswald;fontWeight:regular'});\r\n////////////////////////////////////////////////////////\r\nvar val = placeText(brd1, -8, 2.5, 18,()=>'AB ='+(Math.pow(Horz.Value()*Horz.Value()+Vert.Value()*Vert.Value(), 0.5)).toFixed(2));\r\nval.setAttribute({visible:()=>i>=3, anchorX:'left',CssStyle: 'fontFamily:Oswald;fontWeight:regular'});\r\n/////////////////////////////////////\r\nanalytics.on('down', function(){\r\n  if(i>0)\r\n  {\r\n  i-=1;\r\n  }\r\n  else\r\n  {\r\n    i=0;\r\n  }\r\n});\r\n/////////////////////////////////////OPERATION 2 /////////////////////////////////\r\nerase.on('down', function(){\r\n  if(i<3)\r\n  {\r\n  i+=1;\r\n  }\r\n  else\r\n  {\r\n    i=3;\r\n  }\r\n})\r\n///////////////////////////////////////////OPERATION 3 //////////////////////////////////////\r\nshuffle.on('down', function(){\r\n  i=0;\r\n  pts1.moveTo([2+Math.round(3*Math.random()),2+Math.round(3*Math.random())]);\r\n  pts2.moveTo([-5+Math.round(3*Math.random()),-4+Math.round(3*Math.random())]);\r\n  if(j<4)\r\n  {\r\n  j+=1;\r\n  }\r\n  else\r\n  {\r\n  j=0;\r\n  }\r\n})\r\nshuffle2.on('down', function(){\r\n  i=0;\r\n})\r\n////////////////////////////////////////////END OF OPERATIONS///////////////////////////////\r\n    },\r\n\r\n\r\n}\r\nexport default Boxes;\r\n","<template>\r\n  <div>\r\n    <h3> Distance between Two Points </h3>\r\n    <p class=\"big my-3\">\r\n      In this section, we will find the formula for the distance between any two points on the coordinate plane.\r\n      <br>      Consider two points \\(A\\) and \\(B\\) on the coordinate plane.\r\n      Point \\(A\\) has coordinates: \\((X_A, Y_A)\\), while point \\(B\\) has\r\n      coordinates: \\((X_B, Y_B)\\).\r\n      <br>\r\n      Then, the distance between these two points is given as &mdash;\n    </p><body>\r\n      $$AB = \\sqrt{(X_B - X_A)^2) + (Y_B-Y_A)^2}$$\r\n      This expression is known as distance formula.\r\n    </body>\r\n    </p>\r\n    <h3> MagicGraph | Distance Formula Explained </h3>\r\n    <br>\r\n    <h5>Getting Started</h5>\r\n    <p class=\"big my-3\">\r\n      In this MagicGraph, you will learn, in a step by step manner, how to find the distance between any two points on coordinate plane.\r\n      <br>\r\n      Simply use <i class=\"redoer ma-1\" /> and <i class=\"undoer ma-1\" /> icons to go through the steps\r\n      required to find the distance between points A and B.\r\n    </p>\r\n    <h5> Icons on the MagicGraph </h5>\r\n    <p class=\"big my-3\">\r\n      You can tap on <i class=\"shuffler ma-1\" /> icon  to shuffle events.\r\n      You can tap on the <i class=\"eraser ma-1\" /> icon to erase and start over.\r\n      Tap on the <i class=\"redoer ma-1\" /> icon to go to the next step.\r\n      To go to the previous step, tap on the <i class=\"undoer ma-1\" /> icon.\r\n    </p>\r\n    <br>\r\n    </p>\r\n    <v-responsive>\r\n      <v-layout justify-center>\r\n        <div id=\"jxgbox1\" class=\"edliy-box-about\" />\r\n      </v-layout>\r\n    </v-responsive>\r\n  </div>\r\n</template>\r\n<script>\r\nimport Boxes from './Boxes.js'\r\nexport default {\r\n  name: 'DistanceFormula',\r\n  async created () {\r\n    await this.$store.dispatch('navigation/getData');\r\n    this.$store.commit('navigation/resetState');\r\n    let title = 'Distance Formula';\r\n    this.$store.commit('navigation/changeTitle', title);\r\n    this.$store.commit('navigation/changeMenu', title);\r\n    let newTopics = [\r\n      {title: 'Square Formula', img:'/assets/number-1.svg', action: () => this.goto('ia')},\r\n      {title: 'MagicGraph',img:'/assets/touch.svg', action: () => this.goto('playgraph')},\r\n    ];\r\n    this.$store.commit('navigation/replaceTopics', newTopics);\r\n    let newshowhome = false;\r\n    this.$store.commit('navigation/toggleshowhome', newshowhome);\r\n    let newMath =true;\r\n    this.$store.commit('navigation/replaceMath', newMath);\r\n    let newLeftArrow =true;\r\n    this.$store.commit('navigation/replaceLeftArrow', newLeftArrow);\r\n    let newModule=true;\r\n    this.$store.commit('navigation/replaceModule', newModule);\r\n  },\r\n  mounted () {\r\n    MathJax.Hub.Queue([\"Typeset\", MathJax.Hub]);\r\n    Boxes.box1();\r\n  },\r\n  metaInfo() {\r\n  return{ title: 'Distance Formula',\r\n          titleTemplate: '%s - Learn interactively',\r\n          meta: [ {name: 'viewport', content: 'width=device-width, initial-scale=1'},\r\n                  {name: 'description', content: 'Learn interactively about square formula'}\r\n                ]\r\n        }\r\n   },\r\n}\r\n</script>\r\n<style lang=\"scss\">\r\n@import 'src/styles/edliy-box.scss';\r\n@import 'src/styles/subtopic-menu.scss';\r\n@import 'src/styles/edliy-box-about.scss';\r\n</style>\r\n","import mod from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Lesson.vue?vue&type=script&lang=js&\"; export default mod; export * from \"-!../../../../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../../../../node_modules/thread-loader/dist/cjs.js!../../../../../node_modules/babel-loader/lib/index.js!../../../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./Lesson.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./Lesson.vue?vue&type=template&id=ee3a1d36&\"\nimport script from \"./Lesson.vue?vue&type=script&lang=js&\"\nexport * from \"./Lesson.vue?vue&type=script&lang=js&\"\nimport style0 from \"./Lesson.vue?vue&type=style&index=0&id=ee3a1d36&prod&lang=scss&\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}