content_by_geo.html 7.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200
  1. <!DOCTYPE html>
  2. <!--
  3. * Copyright (c) 2021, 2024, 5 Mode and other contributors
  4. * Released under the MIT license
  5. *
  6. * This file is part of SqueeJS.
  7. *
  8. * Permission is hereby granted, free of charge, to any person obtaining a copy of this software
  9. * and associated documentation files (the "Software"), to deal in the Software
  10. * without restriction, including without limitation the rights to use, copy, modify, merge, publish,
  11. * distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the
  12. * Software is furnished to do so, subject to the following conditions:
  13. *
  14. * The above copyright notice and this permission notice shall be included in all copies or
  15. * substantial portions of the Software.
  16. *
  17. * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED,
  18. * INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A
  19. * PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
  20. * COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN
  21. * AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
  22. * WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
  23. *
  24. * content4geo.html
  25. *
  26. * SqueeJS Doc and examples for the Geo Location functionalities.
  27. *
  28. * @author Daniele Bonini <my25mb@aol.com>
  29. * @copyrights (c) 2016, 2024, 5 Mode
  30. * @license https://opensource.org/licenses/MIT
  31. * -->
  32. <html>
  33. <head>
  34. <title>GeoLocation: doc and examples.</title>
  35. <meta charset="UTF-8">
  36. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  37. <link rel="shortcut icon" href="favicon.ico" />
  38. <meta name="description" content="Welcome to Squeejs! Let everyone squeez its javascript code."/>
  39. <meta name="author" content="5 Mode"/>
  40. <meta name="robots" content="index,follow"/>
  41. <meta name="keywords" content="Squeejs,javascript,framework,squeejs.com,MIT,license,5 Mode"/>
  42. <script src="/js/jquery-3.6.0.min.js" type="text/javascript"></script>
  43. <script src="/js/common.js" type="text/javascript"></script>
  44. <script src="/js/squeejs.js?r=3445566" type="text/javascript"></script>
  45. <link href="/css/style.css?v=1631827555" type="text/css" rel="stylesheet">
  46. <link href="/css/squeejs.css?v=1631827556" type="text/css" rel="stylesheet">
  47. </head>
  48. <body style="border:0px solid lightgray; padding:20px; margin-right:20px;">
  49. <a href="/"><img src="/res/logo.png" style="width:300px;background:#FFFFFF;border:1px solid gray;"></a><br>
  50. <br><br><br>
  51. <h2>GEOLOCATION</h2>
  52. Here the Javascript code available to be inserted in your web page to implement <i>geolocation</i> functionlities.<br>
  53. <br>
  54. Please check the <b>context</b> of implementation for each of the functions.<br>
  55. <br>
  56. <b>ATTENTION</b>: these functionalities use a <b>3rd party service with a traffic cap, reached limits you can face unexpected responses</b>.
  57. <br><br>
  58. <div id="content" style="height:730px;">
  59. <br><br>
  60. <h2>Code:</h2>
  61. <pre>
  62. /**
  63. * SQJS.hideElByGeoLocation
  64. *
  65. * Hide the given web page Element for the specified geolocation
  66. *
  67. * Context:
  68. * - Call it in the body of your webpage
  69. *
  70. * @param {string} id, the id of the element to hide
  71. * @param {string} geoloc, the geolocation (country name) to hide the el for
  72. * @returns {void}
  73. *
  74. * This function is part of SqueeJS.
  75. */
  76. <b>function SQJS.hideElByGeoLocation(id, geoloc){};</b>
  77. /**
  78. * SQJS.showElByGeoLocation
  79. *
  80. * Show the given web page Element for the specified geolocation
  81. *
  82. * Context:
  83. * - Call it in the body of your webpage
  84. *
  85. * @param {string} id, the id of the element to show
  86. * @param {string} geoloc, the geolocation (country name) to show the el for
  87. * @returns {void}
  88. *
  89. * This function is part of SqueeJS.
  90. */
  91. <b>function SQJS.showElByGeoLocation(id, geoloc){};</b>
  92. </pre>
  93. <br><br>
  94. <h2>Usage example:</h2>
  95. <pre style="background:lightyellow;width:100%;white-space: pre-wrap;">
  96. &lt;div id="div4italy" style="width:350px;background:blue;color:white;display:none;">div 4 Italy&lt;br&gt;&lt;/div&gt;
  97. &lt;div id="div4spain" style="width:350px;background:yellow;color:black;display:none;">div 4 Spain&lt;br&gt;&lt;/div&gt;
  98. &lt;div id="div4france" style="width:350px;background:cyan;color:black;display:none;">div 4 France&lt;br&gt;&lt;/div&gt;
  99. &lt;div id="div4germany" style="width:350px;background:black;color:white;display:none;">div 4 Germany&lt;br&gt;&lt;/div&gt;
  100. &lt;div id="div4usa" style="width:350px;background:gray;color:black;display:none;">div 4 Usa&lt;br&gt;&lt;/div&gt;&lt;br&gt;
  101. &lt;script&gt;
  102. SQJS.showElByGeoLocation("div4italy","italy");
  103. SQJS.showElByGeoLocation("div4spain","spain");
  104. SQJS.showElByGeoLocation("div4france","france");
  105. SQJS.showElByGeoLocation("div4germany","germany");
  106. SQJS.showElByGeoLocation("div4usa","united states");
  107. &lt;/script&gt;
  108. </pre>
  109. <br><br>
  110. <h2>How it looks like:</h2>
  111. <div id="div4italy" style="width:350px;background:blue;color:white;display:none;">div 4 Italy<br></div>
  112. <div id="div4spain" style="width:350px;background:yellow;color:black;display:none;">div 4 Spain<br></div>
  113. <div id="div4france" style="width:350px;background:cyan;color:black;display:none;">div 4 France<br></div>
  114. <div id="div4germany" style="width:350px;background:black;color:white;display:none;">div 4 Germany<br></div>
  115. <div id="div4usa" style="width:350px;background:gray;color:black;display:none;">div 4 Usa<br></div><br>
  116. <script>
  117. SQJS.showElByGeoLocation("div4italy","italy");
  118. SQJS.showElByGeoLocation("div4spain","spain");
  119. SQJS.showElByGeoLocation("div4france","france");
  120. SQJS.showElByGeoLocation("div4germany","germany");
  121. SQJS.showElByGeoLocation("div4usa","united states");
  122. </script>
  123. <div style="clear:both; margin:auto;">
  124. <br><br>
  125. </div>
  126. <div class="footer" style="float:right">
  127. <div id="footerCont">&nbsp;</div>
  128. <div id="footer"><span style="background:#FFFFFF;color:black;opacity:1.0;margin-right:10px;">&nbsp;&nbsp;<a href="dd.html">Disclaimer</a>&nbsp;&nbsp;A <a href="http://5mode.com">5 Mode</a> project and <a href="http://demo.5mode.com">WYSIWYG</a> system. MIT License.</span></div>
  129. </div>
  130. </div>
  131. <script>
  132. function setFooterPos() {
  133. if (document.getElementById("footerCont")) {
  134. tollerance = 12;
  135. footerContHeight = 35;
  136. footerHeight = 32;
  137. document.getElementById("footerCont").style.top = parseInt( getDocHeight2() - footerContHeight - tollerance ) + "px";
  138. document.getElementById("footer").style.top = parseInt( getDocHeight2() - footerHeight - tollerance) + "px";
  139. }
  140. }
  141. setFooterPos();
  142. window.addEventListener("load", function() {
  143. setTimeout("setFooterPos()", 1500);
  144. }, true);
  145. </script>
  146. <!-- Yandex.Metrika counter -->
  147. <script type="text/javascript" >
  148. (function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)};
  149. m[i].l=1*new Date();k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)})
  150. (window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym");
  151. ym(90317440, "init", {
  152. clickmap:true,
  153. trackLinks:true,
  154. accurateTrackBounce:true
  155. });
  156. </script>
  157. <noscript><div><img src="https://mc.yandex.ru/watch/90317440" style="position:absolute; left:-9999px;" alt="" /></div></noscript>
  158. <!-- /Yandex.Metrika counter -->
  159. </body>
  160. </html>