Change the input tag field

Have a good idea? Let us know
User avatar
DoomTay
Posts: 341
Joined: Wed Dec 29, 2010 11:51 am

Re: Change the input tag field

Post by DoomTay »

I'd suggest using a comma as a separator, if bubbles fail.
Merun
Posts: 2897
Joined: Sat Mar 17, 2007 9:44 am
Location: NoWheRe

Re: Change the input tag field

Post by Merun »

Unearthing this topic!!! Yes, I hit my head against the wall behind me in my bed, and that's why I have been working on this feature ( it has been 3 years since I wanted to do it... ). No I didn't add it directly to E-shuushuu, but here is a little preview ;) It's still a work in progress, but prepare your Greasemonkey!
Screenshot 2014-08-09 00.15.48.png
Screenshot 2014-08-09 00.15.48.png (177.47 KiB) Viewed 39019 times
Merun @ Twitter
User avatar
RockRabbit
Posts: 2310
Joined: Mon Feb 01, 2010 8:21 am
Location: Daten City
Contact:

Re: Change the input tag field

Post by RockRabbit »

Image
  • Your lips, you lies, your lust;; Like the devil's in your hands
User avatar
Aizawa
Posts: 1392
Joined: Thu Dec 29, 2011 8:42 pm

Re: Change the input tag field

Post by Aizawa »

This is fantastic. I am so ready for this.
Image
Kiss and tell, isn't it far from here to hell?
Merun
Posts: 2897
Joined: Sat Mar 17, 2007 9:44 am
Location: NoWheRe

Re: Change the input tag field

Post by Merun »

Here is a first version. It will work on the upload page. Note that you will need to uninstall the script if a tag is added as searches are cached indefinitely ~~. Also, performance are too slow for me, but it should be adequate for those slightly slower than me, that is, by half a second. Tested on Chrome with Tampermonkey

To use it, just copy the whole block code into a new Greasemonkey script :

Code: Select all

// ==UserScript==
// @name       Selectize for E-shuushuu
// @namespace  https://twitter.com/Meruni
// @version    0.1.0
// @description  enter something useful
// @match      http://e-shuushuu.net/upload/
// @require       http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js
// @require  http://cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.min.js
// @require  http://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.9.0/js/standalone/selectize.min.js
// @resource selectizeCSS http://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.9.0/css/selectize.default.css
// @copyright  2014 Merun
// @grant           GM_addStyle
// @grant           GM_getResourceText
// @grant         GM_getValue
// @grant         GM_setValue
// @grant         GM_deleteValue
// @grant         GM_xmlhttpRequest 
// ==/UserScript==




var css = GM_getResourceText('selectizeCSS');
GM_addStyle(css);


function replace(name, id) {

  var tagList = JSON.parse(GM_getValue(name + "Tags")||"[]");
    var searches = JSON.parse(GM_getValue(name + "Searches")||"{}") ;

  function store(key, value) {
    GM_setValue(key, JSON.stringify(value));
  }

  function localFind(input) {
    return _.filter(tagList, function(value) {
      return value.indexOf(input) === 1;
    });
  }

  function formatTag(value) {
    return {
      value: value,
      label: value.replace(/"/g, '')
    };
  }

  var standardAttr = {
    size: 40,
    autocomplete: 'off',
    type: 'text'
  };



  var tags = $("<input>").attr(standardAttr).addClass('text').attr('name', name);
  $('#' + name).replaceWith(tags);
  tags.selectize({
    valueField: 'value',
    labelField: 'label',
    searchField: 'label',
    dropdownParent: 'body',
    options: [],
    create: false,

    load: function(query, callback) {
      if (!query.length) return callback();

      var local = localFind(query);


        if(local.length){
		  callback(local.map(formatTag));
        }
        if(searches[query]!==undefined){
            return;
        }
      $.get("/httpreq.php", {
          mode: "tag_search",
          tags: query,
          type: id
        },

        function(res) {
		  searches[query] = '';
          store(name+"Searches", searches);
          var result = res.split('\n');
          tagList = _.union(result, tagList);
          store(name+"Tags", tagList);
          var formated = result.map(formatTag);
          callback(formated);
        }
      );
    }
  });


}

replace('tags', 1);
replace('source', 2);
replace('artist', 3);
replace('char', 4);
Merun @ Twitter
User avatar
RockRabbit
Posts: 2310
Joined: Mon Feb 01, 2010 8:21 am
Location: Daten City
Contact:

Re: Change the input tag field

Post by RockRabbit »

Looks really good!
But i think maybe the artist field should remain the old way? Ne ones are added all the time, imagine how often one would need to uninstall the script to have artists always up to date D;
  • Your lips, you lies, your lust;; Like the devil's in your hands
Merun
Posts: 2897
Joined: Sat Mar 17, 2007 9:44 am
Location: NoWheRe

Re: Change the input tag field

Post by Merun »

I know, so I'm still thinking about a solution.
Merun @ Twitter
User avatar
RockRabbit
Posts: 2310
Joined: Mon Feb 01, 2010 8:21 am
Location: Daten City
Contact:

Re: Change the input tag field

Post by RockRabbit »

oh, noticed something else;
sometimes the response time is too long and the tags just don't appear.
so i tired adding the tag the good old way, by just writing them completely, but that doesn't work.
is there a way to make it possible again? (disclaimer: i have no idea how coding and whatnot works)
  • Your lips, you lies, your lust;; Like the devil's in your hands
Merun
Posts: 2897
Joined: Sat Mar 17, 2007 9:44 am
Location: NoWheRe

Re: Change the input tag field

Post by Merun »

I can activate manual adding and in fact, I have already tried with it. I could add it if I manage to plug the auto completion at the same time, on the tab key for instance. And it's ok not to know how coding work, it's the coder's work to understand people ( and smack them if needed xD)
Merun @ Twitter
Post Reply