Announcement

Collapse
No announcement yet.

JavaScript Filename Array Maker

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • JavaScript Filename Array Maker

    During coding JavaScript applications, we usually have to work with many JavaScript arrays; and sometimes declare/initiate them is the time-consuming tasks.

    For this reason, I would like to present... detail at JavaScriptBank.com - 2.000+ free JavaScript codes


    How to setup

    Step 1: Use CSS code below for styling the script
    CSS
    Code:
    <style type="text/css">
    #display {
      position: relative;
      left: 10px;
      width: 450px;
      border: 1px solid black;
      padding: 10px;
    }
    </style>
    Step 2: Use JavaScript code below to setup the script
    JavaScript
    Code:
    <script type="text/javascript">
    // Created by: Mr. J | http://www.huntingground.net/
    // This script downloaded from www.JavaScriptBank.com
    
    function init(){
      array_name=document.f1.t1.value //name of array
      val2=document.f1.t3a.value
      ext=document.f1.t4.value
      for(r=0;r<document.f1.r1.length;r++){ // check which r1 radio is selected
        if(document.f1.r1[r].checked==true){
          option=document.f1.r1[r].value // selected radio value
        }
      }
    
      if(option==0){
        document.getElementById("display").innerHTML=array_name+" = new Array(" // opening array type 1
      } else {
        document.getElementById("display").innerHTML=array_name+" = new Array()<br>" // opening array type 2 & 3
      }
    
      if(document.f1.r2[0].checked==true){ // if indexed values
        make_array1()
      }
    
      if(document.f1.r2[1].checked==true){ // if non index values
        make_array2()
      }
    }
    
    function make_array1(){
      array_length=document.f1.t2.value-1 // length of array
      index_values=document.f1.t3.value // index value
    
      if(array_length==""||array_length==0){ // make sure a viable number is used
        document.getElementById("display").innerHTML="Please Enter a Number"
        document.f1.b2.disabled=true
        return
      } else {
        if(!ns){document.f1.cpy.disabled=false}
      }
    
      for(num=0;num<array_length;num++){
        j=num
        if(num<10){num="00"+num}
        if(num>9&&num<100){num="0"+num}
        if(document.f1.t4.value.length>0){
          i=num+val2+ext}
          else{i=num+val2}
    
      if(option==0){ // insert inner indexes for type 1
        document.getElementById("display").innerHTML+="\""+index_values+i+"\", "
      } else {
        if(option==1){ // insert inner indexes for type 2
          document.getElementById("display").innerHTML+=array_name+"["+j+"]="
          document.getElementById("display").innerHTML+="\""+index_values+i+"\"<br>"
        } else { // insert inner indexes for type 3
          document.getElementById("display").innerHTML+=array_name+"["+array_name+".length]=\""+index_values+i+"\"<br>"
        }
      }
    }
    
    if(num<10){num="00"+num}
    if(num>9&&num<100){num="0"+num}
    if(num>100){num=num}
    
    if(document.f1.t4.value.length>0){
      i= num+val2+ext}
      else{i=num+val2}
    
      if(option==0){ // insert last indexes for type 1
        document.getElementById("display").innerHTML+="\""+index_values+i+"\")"
      } else {
        if(option==1){ // insert last indexes for type 2
          document.getElementById("display").innerHTML+=array_name+"["+(j+1)+"]="
          document.getElementById("display").innerHTML+="\""+index_values+i+"\"<br>"
        } else { // insert last indexes for type 3
          document.getElementById("display").innerHTML+=array_name+"["+array_name+".length]=\""+index_values+i+"\"<br>"
        }
      }
    }
    
    index_value=new Array()
    count= 0
    last=0
    
    function make_array2(){
      if(!ns){document.f1.cpy.disabled=false}
      for(r=0;r<document.f1.r1.length;r++){ // check which r1 radio is selected
        if(document.f1.r1[r].checked==true){
          chkrad=r
        }
      }
      if(chkrad!=last){ // prevent additional index when only changing array style
        count--
      }
    
      if(document.f1.t4.value.length>0){
        index_value[count]=document.f1.t3.value+ext}
      else {
        index_value[count]=document.f1.t3.value
      }
    
      for(i=0;i<count;i++){
        if(option==0){
          document.getElementById("display").innerHTML+="\""+index_value[i]+"\", "
        } else {
          if(option==2){
            document.getElementById("display").innerHTML+=array_name+"["+array_name+".length]=\""+index_value[i]+"\"<br>"
          } else {
            document.getElementById("display").innerHTML+=array_name+"["+i+"]=\""+index_value[i]+"\"<br>"
          }
        }
      }
    
      if(option==0){
        document.getElementById("display").innerHTML+="\""+index_value[i]+"\")"
      } else {
        if(option==2){
          document.getElementById("display").innerHTML+=array_name+"["+array_name+".length]=\""+index_value[i]+"\"<br>"
        } else {
          document.getElementById("display").innerHTML+=array_name+"["+i+"]=\""+index_value[i]+"\"<br>"
        }
      }
      count++
      document.f1.t3.select()
      last=chkrad
    }
    
    function oreset(){
      count=0
      document.f1.t3.value=""
      document.getElementById("display").innerHTML=""
      document.f1.t3.select()
    }
    
    function chk(){
      if(document.f1.r2[0].checked==true){
        document.f1.t2.disabled=false
        document.getElementById("sp").disabled=false
        document.f1.t2.style.backgroundColor="#FFFFFF"
        document.f1.b1.disabled=false
        document.f1.b2.disabled=true
        document.f1.b3.disabled=true
        document.f1.t3a.disabled=false
        document.f1.t3a.style.backgroundColor="#FFFFFF"
      } else {
        document.f1.t2.disabled=true
        document.getElementById("sp").disabled=true
        document.f1.t2.style.backgroundColor="#c0c0c0"
        document.f1.b1.disabled=true
        document.f1.b2.disabled=false
        document.f1.b3.disabled=false
        document.f1.t3.select()
        document.f1.t3a.disabled=true
        document.f1.t3a.style.backgroundColor="#c0c0c0"
      }
    }
    
    function Copy(id){
      if(ns){
        alert("Sorry, Netscape does not recongise this function")
        document.f1.cpy.disabled=true
        return
      }
      copyit=id
      textRange = document.body.createTextRange();
      textRange.moveToElementText(copyit);
      textRange.execCommand("Copy");
      alert("Copying Complete.\n\nPlease Paste into your SCRIPT")
    }
    
    ns=document.getElementById&&!document.all
    
    function getKey(e) {
      pressed_key=(!ns)?event.keyCode:e.which
      if( pressed_key==13){
        init()
      }
    }
    document.onkeypress = getKey;
    </script>
    Step 3: Place HTML below in your BODY section
    HTML
    Code:
    <!--
    /*
         This script downloaded from www.JavaScriptBank.com
         Come to view and download over 2000+ free javascript at www.JavaScriptBank.com
    */
    -->
    <form name="f1">
    
    <table border="0">
      <tr>
        <td>Array Name:</td>
        <td colspan="6">
          <input type="text" name="t1" value="myArray">
        </td>
      </tr><tr>
        <td>
    
          <span id="sp">Indexed Array Length:</span>
        </td>
        <td colspan="6">
          <input type="text" name="t2" value="5" size="3" maxlength="3">
        </td>
      </tr><tr>
        <td>Index Value:</td>
        <td colspan="6">
    
          <input type="text" name="t3" value="image" size="10">
          <input type="text" name="t3a" value="_tn" size="10"> Ext
          <input type="text" name="t4" value=".jpg" size="4" maxlength="4">
        </td>
      </tr><tr>
        <td>Index Style:</td>
        <td align="right">1
          <input type="radio" name="r1" value="0" checked onclick="init()">
        </td>
    
        <td> </td>
        <td align="right">2
          <input type="radio" name="r1" value="1" onclick="init()">
        </td>
        <td> </td>
        <td align="right">3
          <input type="radio" name="r1" value="2" onclick="init()">
        </td>
        <td width="80"> </td>
    
      </tr><tr>
        <td>Add Numerical Values:</td>
        <td align="right">Yes
          <input type="radio" name="r2" value="0" checked onclick="chk()">
        </td>
        <td align="center"> </td>
        <td align="right">No
          <input type="radio" name="r2" value="1" onclick="chk()">
        </td>
    
        <td> </td>
        <td colspan="2"> </td>
      </tr><tr align="center">
        <td>
          <input type="button" name="b1" value="Numerical Enter" onclick="init()">
        </td>
        <td colspan="6">
          <input type="button" name="cpy" value="Copy Array" onclick="Copy(display)" disabled>
    
          <input type="button" name="b2" value="Manual Enter" onclick="init()" disabled>
          <input type="button" name="b3" value="Restart" onclick="oreset()" disabled>
        </td>
      </tr>
    </table>
    
    </form>
    
    <div id="display"></div>





Working...
X